@charset "utf-8";
body{
font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック","Lucida Grande",Arial,Helvetica,"Helvetica Neue",sans-serif
}
p{text-align: left;margin-bottom:0.3em}
@media only screen and (min-width:1040px){.cell p,.cells p{font-size:110%}}
@media only screen and (max-width:600px){.cell p,cells p{font-size:110%;padding-bottom:0.3em}}
#top,#menu-1,#menu-2,#menu-3,#menu-4,#menu-5{font-size:16px;line-height:1.6em;pointer-events:auto}
.left{text-align:left}
div.right,p.right{text-align:right !important}

.f-right{float:right !important}
.w100{width:100%}
.w80{width:80%}
.w70{width:70%}
.w60{width:60%}
.w50{width:50%}
.w40{width:40%}

.f85{font-size:85%}
.f70{font-size:70%}

.long{letter-spacing:-0.05em}

.m_bot0{margin-bottom:0 !important}
.m_top0{margin-top:0 !important}
.p_bot0{padding-bottom:0 !important}
.p_top0{padding-top:0 !important}


.pc2{display:block}
.smp2{display:none}
@media only screen and (max-width:600px){
.pc2{display:none}
.smp2{display:block}
.width-4of10{width:100%}
.width-6of10{width:100%}
}


.black{color:black !important}
.glay{color:#333 !important}
.gb{background:#ddd;padding:0.6em 1em}
.gb2{background:#aaa;color:white;padding:0.6em 1em}
.fixed{
position: fixed;
top: 0;
z-index: 10000;
border-bottom:1px solid #ccc;
max-width:100%;
margin:0 auto !important;
padding:0 0 0 !important;
background:white;
width:100%;
}
.topfix{
position: relative;
z-index: 9999;
}
.site-center{float:none !important}
.m_top6{margin-top:5.8em}
.fixed2{margin:3em}
.off{}
.active{
color:#cb3054 !important;
border-bottom:3px solid #cb3054 !important;
background:white;
}


/*----------------------------------------*/


#sub_ttl {
padding: 0.3em 0.5em 0.2em;
margin: 0 0 0.3em;
text-align: left;
font-size:130%;
font-weight:bold;
line-height:1.4em;
   color:white;
   background-color:#999;
}
#point{font-weight:600;font-size:120%;padding:0.6em 0}
#point2{font-weight:600;font-size:120%;padding:0.3em 0}
@media only screen and (max-width: 940px){
#sub_ttl{font-size:130%}
}
@media only screen and (max-width: 600px){
#sub_ttl{font-size:130%}
}


#sub_ttlb {
   padding: 0.5em 0.4em 0.4em;
padding: 0.5em 0 0.4em;
margin: 0 0 0.3em;
text-align: center;
font-size:180%;
font-weight:bold;
background-color:#60a7c6;
line-height:1.4em;
color:white;
}
@media only screen and (max-width: 600px){
#sub_ttlb{font-size:130%}
}

#marker {
background: url(/sumikae/sell/images/marker.gif) -10px repeat-x;
}

#sub_ttl2{
padding: 0.3em 0.4em 0.25em;
margin: 0 0 1em;
text-align: left;
font-size:140%;
font-weight:bold;
background-color:#60a7c6;
line-height:1.4em;
color:white;
}
.sub3 {
background-color:#fff100;
margin: 0.2em 0.4em 1em 1.6em;
}
#sub_ttl3{
height:2.7em;
width:100% !important;
display:table-cell;
vertical-align:middle;
padding: 0.3em 0.4em 0.25em 1.6em;
text-align: left;
font-size:115%;
font-weight:bold;
background-color:#fff100;
line-height:1.2em;
color:black;
text-indent:-1.25em;
}


#sub_ttl3 img{
vertical-align:-20%;
height:2.2em;margin:
-0.5em 0.25em -0.5em -1.2em
}

.sub3_box{
text-align:left;
margin: 0.2em 0.4em 1em 1em;
}
h3#ttl4{
font-size:130%;
font-weight:bold;
padding:0 0 0.4em;
border-bottom: 2px dotted #316c8c;
}


.sub3_box p{padding:0.3em;text-align:left;}

@media only screen and (max-width: 600px){
#sub_ttl2{font-size:110%}
h3#ttl4{font-size:105%;}
.sub3_box p{padding:0.6em 0}
}



#sec_ttl{font-size:220%;line-height:1.2em;font-weight:bold;color:#316c8c;text-align:left;margin:0.3em 0}
#sec_ttl p{font-size:60%;padding:0 0 0.3em;font-weight:bold;color:black;text-align:left;}

@media only screen and (max-width: 767px){
#sec_ttl{font-size:180%;}

}

@media only screen and (max-width: 600px){
#sec_ttl{font-size:160%;}
#sec_ttl p{font-size:66%}
}




.top_point{
background:#f7ebdb;
padding:1.4em 0.4em 1.0em;
}




.sec_box{
border:1px solid #a8765d;
padding:0.6em 0 !important;
font-size:140%;
text-align:left;
}

.sec_box b {
top: 50%;
min-width: 7em;
vertical-align: 5%;
padding: 0.4em 1.8em;
background: #a8765d;
color: white;
font-size: 110% !important;
margin: -0.25em 0.3em;
float: none;
-moz-border-radius: 0.2em;
-webkit-border-radius: 0.2em;
-khtml-border-radius: 0.2em;
border-radius: 0.2em;
font-weight: 600;
}

.sub_info{
max-width:640px;margin:0.8em auto;line-height:1.5em;font-size:150%;
}

small{font-size:80%;vertical-align:0.3em;}
.caption,.caption2,.cap{text-align:left;color:#666}
.caption,.cap p{padding-left:2em;text-indent:-1.8em}
.caption2{padding-left:1.6em;text-indent:-1.4em}



/*************基本のスタイル**************/
/***** area/css/style.css *****/

#container,#imageDataContainer{
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,"\FF2D\FF33\20\FF30\30B4\30B7\30C3\30AF","Helvetica",sans-serif !important;
}
.site-header-fixture{width:100%;border-top:1px solid #ccc}
#crumb {
padding: 4px 0 4px 17px;
background-color: #124488;
color: white;
font-size: 12px;
line-height: 1.4em;
}
#crumb a{color: white;}
#crumb a:hover{text-decoration:underline !important}
/*--------------------------------*/
img {
backface-visibility: hidden !important;
}
.fit{margin-right:0 !important;margin-left:0 !important;}
.bot{margin-bottom:0 !important;}
.tot{margin-top:0 !important;}
.cell8{margin:8px}
.cell{margin:6px 10px}
.cells{margin:20px}
@media only screen and (max-width: 1100px){.cells{margin:16px}}
@media only screen and (max-width: 1000px){.cells{margin:12px}}
@media only screen and (max-width: 900px){.cells{margin:10px}}
@media only screen and (max-width: 600px){.cells{margin:8px}}
/*--------------------------------*/
#index_txt{padding:1.5em 1.5em 1.2em;font-size:120%;text-align:left}/*#index_txt{padding:1em 1em 0.7em;font-size:120%;text-align:left}*/

.p_top05{padding-top:0.5em !important}
.p_top06{padding-top:0.6em !important}
.p_top1{padding-top:1em !important}
.p_top2{padding-top:2em !important}
.p_top3{padding-top:3em !important}
.p_top4{padding-top:4em !important}
.p_top5{padding-top:5em !important}

.p_bot05{padding-bottom:0.5em !important}
.p_bot06{padding-bottom:0.6em !important}
.p_bot1{padding-bottom:1em !important}
.p_bot2{padding-bottom:2em !important}
.p_bot3{padding-bottom:3em !important}
.p_bot4{padding-bottom:4em !important}
.p_bot5{padding-bottom:5em !important}

.m_top05{margin-top:0.5em !important}
.m_top06{margin-top:0.6em !important}
.m_top1{margin-top:1em !important}
.m_top2{margin-top:2em !important}
.m_top3{margin-top:3em !important}
.m_top4{margin-top:4em !important}
.m_top5{margin-top:5em !important}

.m_bot05{margin-bottom:0.5em !important}
.m_bot06{margin-bottom:0.6em !important}
.m_bot1{margin-bottom:1em !important}
.m_bot2{margin-bottom:2em !important}
.m_bot3{margin-bottom:3em !important}
.m_bot4{margin-bottom:4em !important}
.m_bot5{margin-bottom:5em !important}

.txt_green{color:#b2b900;}
.txt_white{color:#fff;}
.txt_gray{color:#aaa;}
.txt_red{color:#9d293c}

.bg_white{background:white !important}
.bg_gray{background:#666;color:white}

.txt_150{font-size:150%}
.txt_140{font-size:140%}
.txt_130{font-size:130%}
.txt_120{font-size:120%}
.txt_110{font-size:110%}

.txt_c{text-align:center}

h1.ttl{font-size:2em !important;padding:0.7em 0.3em}
h2.ttl{font-size:1.5em !important;padding:0.7em 0.3em}
h3.ttl{font-size:1.15em !important;padding:0.7em 0.3em}

a h2{-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-khtml-border-radius: 6px;
border-radius: 6px;}

h1.ttl_ex{margin-top:0.6em;height:auto;font-weight:200;padding:20px 20px;background:#0083b9;color:white;text-align:left;}
h1.ttl_ex {font-size:2vmin !important;}
h1.ttl_ex span{font-size:35% !important}


.txt_center{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;height:1em;text-align:center;}
.pic_center{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;}

p#lead {
padding:0 1em 0.3em;
max-width: 940px;
margin: 0 auto;
text-align: left;
font-size:150%;
}
ul#lead{
padding:0;
max-width: 940px;
margin: 0 auto;
text-align: left;
font-size:150%;
font-weight:bold;
}
ul#lead li{
text-align:center;
margin:0.6em 0;
list-style-type: none;
}

.bg_gray_anim{background-color:#eee;
  background: linear-gradient(45deg, #ece0e3, #e0e2ec, #ebece0);
  background-size: 600% 600%;
  animation: AnimationName 9s ease infinite;
}

@keyframes AnimationName { 
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
/*--------------------------------*/
#top_bg{line-height:0;
background:#f2f2f2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fcfcfc), to(#eaeaea));
background-image: linear-gradient(to bottom, #fcfcfc 0%, #eaeaea 100%);
background-repeat: repeat-x;
background-position: left top;
box-sizing:border-box;
padding:0 !important;
border-bottom: 1px solid #eee;
height:auto;}
/*--------------------menu-top----------------------*/
#category00 div.nav li#c00,
#category01 div.nav li#c01,
#category012 div.nav li#c012,
#category02 div.nav li#c02,
#category03 div.nav li#c03,
#category04 div.nav li#c04,
#category05 div.nav li#c05,
div.nav li#c00:hover,
div.nav li#c01:hover,
div.nav li#c012:hover,
div.nav li#c02:hover,
div.nav li#c03:hover,
div.nav li#c04:hover,
div.nav li#c05:hover{position:relative;padding-bottom:0px !important;}
#category00 div.nav li#c00:after,
#category01 div.nav li#c01:after,
#category012 div.nav li#c012:after,
#category02 div.nav li#c02:after,
#category03 div.nav li#c03:after,
#category04 div.nav li#c04:after,
#category05 div.nav li#c05:after,
div.nav li#c00:hover:after,
div.nav li#c01:hover:after,
div.nav li#c012:hover:after,
div.nav li#c02:hover:after,
div.nav li#c03:hover:after,
div.nav li#c04:hover:after,
div.nav li#c05:hover:after{
  content: "";
  position: absolute;
  right: 45%;
  bottom: 0px;
  left: 45%;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #cb3054 transparent transparent transparent;
  border-width: 6px 6px 0 6px;
}
.category00 div.nav li#c00,
.category01 div.nav li#c01,
.category01 div.nav li#c012,
.category02 div.nav li#c02,
.category03 div.nav li#c03,
.category04 div.nav li#c04,
.category05 div.nav li#c05,
div.nav li#c00:hover,div.nav li#c01:hover,
div.nav li#c012:hover,div.nav li#c02:hover,
div.nav li#c03:hover,div.nav li#c04:hover,
div.nav li#c05:hover{position:relative;padding-bottom:0px !important;}
.category00 div.nav li#c00:after,
.category01 div.nav li#c01:after,
.category012 div.nav li#c012:after,
.category02 div.nav li#c02:after,
.category03 div.nav li#c03:after,
.category04 div.nav li#c04:after,
.category05 div.nav li#c05:after,
div.nav li#c00:hover:after,
div.nav li#c01:hover:after,
div.nav li#c012:hover:after,
div.nav li#c02:hover:after,
div.nav li#c03:hover:after,
div.nav li#c04:hover:after,
div.nav li#c05:hover:after{
  content: "";
  position: absolute;
  right: 45%;
  bottom: 0px;
  left: 45%;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #cb3054 transparent transparent transparent;
  border-width: 6px 6px 0 6px;
}

.bg-corpgreen{background:#b2b900}
h2.bg-corpgreen{color:white}
.bg-corpred{background:#cb3054}
h2.bg-corpred{color:white}
li h2.bg-corpgreen,li h2.bg-corpred{font-weight:bold;width:120px;letter-spacing:0.05em;}
@media only screen and (max-width:800px){li h2.bg-corpgreen,li h2.bg-corpred{font-weight:bold;width:100px;}}

.arrow_bottom{
  position: relative;
  padding-bottom:0px !important;
}
.arrow_bottom:after{
  content: "";
  position: absolute;
  right: 0;
  bottom: 0px;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #cb3054 transparent transparent transparent;
  border-width: 6px 6px 0 6px;
}


.site-header .nav a.right,.site-footer .nav a.right{padding:3px 5px 0 !important}
.nav li h1{margin-right:6px}
.nav li h2{padding:0.85em 6px 0.6em 0px;margin-left:6px;font-weight:600}/*padding:0.85em 6px 0.6em 0px;*//*.nav li h2{margin-left:12px}*/
.nav li#c012 h2{letter-spacing:0.1em;line-height:1.0em;padding:0.5em 6px 0.06em 0px;margin-left:6px;font-weight:600}
.nav li#c012 h2 span{letter-spacing:-0.05em;font-size:90%;font-weight:600}
.nav li.right h2{margin-left:0;margin-right:0}
.footer_map {background: #585858 !important;color:#ddd;font-size:90%}
.footer_map a{color:#ddd}
.footer_map a:hover,ul.footer_menu a:hover li{color:white;text-decoration:underline}
.footer_map .nav li.right h2{color:white}
.footer_map .nav li.right a:hover h2,.footer_map .nav li.right a:hover{text-decoration:none !important}
.footer_map dt,.footer_map dd{margin:0;padding:0}
.footer_map dt{font-size:130%;font-weight:bold;padding-bottom:0.3em}
.footer_map dd{padding-top:0;font-size:115%;padding-left:6px;line-height:0.3em\9}
@media only screen and (max-width:1024px){.footer_map dd{font-size:95%;text-indent:0;letter-spacing:-0.05em}}

.footer_map dd span{padding-top:10px;font-size:80%;margin-left:-6px;line-height:1.4em}
.footer_map hr{margin:0.4em 3em 0.4em 0;border:1px solid #727272 !important;border-bottom:none !important;margin:1em 3em 0em 0\9;}
#lh1{line-height:1em;text-indent:6px}
ul.footer_menu{padding:1em 0;margin:0;display:block;float:left;list-style: none;width:100%;/*background:#aaa*/}
ul.footer_menu li{font-size:115%;padding:0.3em 0;margin:0 1.5em 0 0 !important;float:left;}

@media only screen and (max-width:767px){.footer_map dd{line-height:1.8em}}


/*----------------top_left top_right--------------*/


#top_left .col,#top_right .col{padding:4px;box-sizing:border-box}
#top_left{width: 33.3333333%;box-sizing:border-box;padding-right:5px}
#top_right{width: 66.6666666%;box-sizing:border-box;padding-left:15px}
#top_left p,#top_right p{text-align:center}
#top_left a:hover img,#top_right a:hover img{filter:alpha(opacity=90);opacity:0.9;}
@media only screen and (max-width:1024px){
#top_left{display:none}
#top_right{width:100%;padding:0}
#top_right .col{padding:8px}
#top_right .width-1of4{width:25% !important}
}
.footer_left,.footer_right{width:100%}
@media only screen and (max-width:767px){
#top_right .width-1of4{width:50% !important}

}
@media only screen and (max-width:600px){

}

/*--------------------bx slider----------------------*/
#slider_box{background:#e5e5e5;padding-top:16px;box-sizing:border-box;}
ul.slider1{margin:0 !important}
ul.slider1 li img{margin-bottom:0 !important}
.bx-wrapper .bx-pager.bx-default-pager a{background:#aaa !important}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus{background:#333 !important}
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto{bottom:-20px}
.bx-wrapper .bx-pager{padding-top:0 !important}
.bx-viewport{max-height:139px}
ul.slider1 li img{max-width:208px}
.bx-wrapper{-moz-box-shadow:none !important;box-shadow:none !important;border:5px solid #e5e5e5 !important;background:#e5e5e5 !important;border-bottom:none !important}
.slider1 a:hover img{filter:alpha(opacity=80);opacity:0.8;}
@media only screen and (max-width:767px){
.bx-wrapper{border:none !important}
#slider_box{max-width:100%}
.bx-wrapper{max-width:100%}
}

/*--------------------bnr_box----------------------*/
#bnr_box a:hover img{filter:alpha(opacity=90);opacity:0.9;}
#bnr_box img{margin:0}
/*-------------------release-----------------------*/
#release_box{padding:1.5em 0 1em;text-align:center;box-sizing:border-box}
#release_box h3{padding:0 !important}
#release_inner{box-sizing:border-box;margin:0 auto;
width:100%;
background:#fff;
padding:8px;
font-size: 100% !important;
}
#release_inner td{padding:4px 0;
border-bottom:1px solid #ccc;
line-height:1.35em;
}
#release_inner p.date {
width: 94px;
padding: 0 !important;
font-weight: bold;
max-height: 10px;
color:#444;
}
#release_inner a{text-decoration:none;font-weight:normal;}
/*------------------------------------------*/
.masthead{
max-height:480px;
}



.site-center img{float:none !important;}
#visual {display:block;
list-style: none;
padding: 0;
margin:0 auto !important;
}
#visual li img,#visual{float:none !important;width:100%;}



#visual_s {display:none;
 /*   visibility: inline;*/
list-style: none;
padding: 0;
margin:0 auto !important;

}
#visual_s li img,#visual_s{float:none !important;width:100%;}


.flex-v {
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center;
 align-items: center;
}
.flex-h {
 display: -webkit-flex;
 display: flex;
 -webkit-justify-content: center;
 justify-content: center;
}


#blue_box{border:3px solid #a8765d/*3193b7*/;background:#fff}
h2#ttl_box{text-align:center !important;padding:2.4em 0.3em 2.3em;font-size:160%;line-height:1.3em;text-shadow:0 0 4px white;font-size:230%\9;}
h2.blue-ttl{font-weight:600;margin:0 !important;text-align:center !important;font-size:4vmin !important;color:#695a81/*3193b7*/;line-height:1.3em}
h2.blue-ttl b{top:50%;min-width:7em;vertical-align:5%;
padding:0.25em 0.4em;background:#cc0000;color:white;
font-size:80% !important;margin:-0.25em 0.3em;float:none;
-moz-border-radius: 0.2em;
-webkit-border-radius:0.2em;
-khtml-border-radius: 0.2em;
border-radius: 0.2em;
font-weight:600;text-align:center !important;
}
h2.blue-ttl2{font-weight:600;margin:0 !important;text-align:center !important;font-size:3.5vmin !important;color:#333/*3193b7*/;line-height:1.3em}
p.blue-ttl{color:#3193b7;font-weight:bold;letter-spacing:0.07em}

.green-t,.green-t h2{color:#4d9d21 !important}
.orange-t{color:#cd5c00 !important}


.arrowbox{
  position: relative;
  background: #eee;
  padding-top:60px;
}
.arrowbox:before{
  content: "";
  position: absolute;
  right: 0;
  top: 0px;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
border-style: solid;
border-width: 30px 30px 0 30px;
border-color: white transparent transparent transparent;
}
.arrowbox:after{
  content: "";
  position: absolute;
  right: 0;
  bottom: -30px;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #eee transparent transparent transparent;
  border-width: 30px 30px 0 30px;
}

#flow{width:45%;margin:20px 0}
#inquiry_box{float:none;margin:20px 20%;box-sizing:border-box}
#bt_inquiry{padding:10px;border:1px solid #aaa;margin:16px 0}
a,a:hover{text-decoration:none;}
.arr{
background: url('../images/arrow_r.png') no-repeat;
position: relative;
float:right;right:10px;top:50%;
margin-top: 6px;
width: 24px;
height: 24px;
}
.blue{color:#15628e}
#marker {font-weight:bold;background: url(../images/marker.gif) -10px repeat-x;}
#pic2 b{font-size:120%}
#blank{width:97%}
#before{width:100%}

background-color:rgba(255,255,255,0.4);}

#visual_s{display:none}
/*------------------------pagetop--------------------------*/
#pageTop {position:fixed;bottom: 32px;right: 16px;z-index:999;}
#pageTop a {
display: block;
z-index: 999;
padding: 0;
border-radius: 30px;
width: 34px;
height: 34px;
background-color: #888;
color: #fff;
font-weight: bold;
text-decoration: none;
text-align: center;
opacity: 0.90;
}

#pageTop a:hover {
text-decoration: none;
opacity: 0.7;
}
#pageTop span{font-size:40px;margin-top:6px !important}

#to_top2{
margin:0 auto;
width:50px;
height:50px;
background-image: url(/top_n2/to_top2.gif);
}
a:hover #to_top,a:active #to_top,a:hover #to_top2,a:active #to_top2{
background-position: 0px -50px;
}
/*---------------------footer-----------------------*/
.site-footer {
background-color: #fff;
margin-top: 0;
}
#footer-area div.cell{margin:10px 0 0}
#bottom_box{
background:#ADADAD;
width:100%;
margin:0 auto;
}
#to_top{
margin:0 auto;
width:50px;
height:50px;
background-image: url(/top_n2/to_top.gif);
}
#middle_box{
background:#fff;
width:100%;
margin:0 auto;
}
#to_top2{
margin:0 auto;
width:50px;
height:50px;
background-image: url(/top_n2/to_top2.gif);
}
a:hover #to_top,a:active #to_top,a:hover #to_top2,a:active #to_top2{
background-position: 0px -50px;
}
#copyright {
margin: 0 auto;
background/***/: #fff url(/common_n/images/footer/copyright2.png) no-repeat;
}
#sns td{padding:0 !important}
#sns td img{margin:0}
/*----------------jitsurei-----------------*/
#new {padding-top:6px;padding-left:6px;
position: absolute;
vertical-align: middle;
z-index: 200;
}
#new img{width:40px}

#form_panel{padding:10px;text-align:left !important}
#form_panel ul{list-style-type:none;padding:0;margin:0}
#form_panel ul li{float:left;margin:0 0 0 0;width:12.5%}
table input{width:24px}
#tblJitsurei{width:100%}

#info{
box-sizing:border-box;
text-align:left;
width:100%;
padding:0.4em;
font-size:95%;
}
#info p{
font-size:110%;

}
#info h4{font-weight:bold;margin-bottom:0.3em}
#info b,#info b small{font-size:100%;color: brown;font-weight:normal}



#tblJitsurei .width-1of4{height:360px}
#tenjijo{box-sizing:border-box}
.tenjijo2{box-sizing:border-box;height:300px;overflow: hidden;background:white;border-top:1px solid #999;border-right:1px solid #999;}
.tenjijo1{box-sizing:border-box;height:180px;overflow: hidden;background:#fd8bab;border-top:1px solid #999;border-right:1px solid #999;}/*#83a7ca*/
.tenjijo2,.tenjijo1{position:relative;/*display:-moz-box;display:-webkit-box;display:-o-box;display:-ms-box;box-align:center;*/}
#inner_area{position:absolute;background:white;width:100%;height:100%;}
#inner_area h3{font-weight:bold;font-size:150%;color:#333;line-height:1em;margin-right:0.5em;}
#inner_area h2{font-weight:bold;font-size:180% !important;color:#000;line-height:1em}
.tenjijo1 #inner_area:hover{filter: alpha(opacity=80);opacity: 0.80;}

.height2{height:500px;overflow: hidden;background:#000}
.height1{height:250px;overflow: hidden;background:#000}
.kurasite_pink2,.kurasite_pink1{background:#eba6b3 !important;}
.eco_safety2,.eco_safety1{background:#a6dc97 !important;}
.kurasite_pink2,.eco_safety2{overflow: hidden;height:400px !important;}.kurasite_pink1,.eco_safety1{overflow: hidden;height:200px !important;}
.kurasite_white{height:200px !important;background:white !important;}
.height5{margin:0 5px;height:200px;overflow: hidden;background:#fff}
.height2 #p_info{font-size:180%;width:50%; top: 35%;}
.height1 #p_info{font-size:120%;width:25%;padding-top: 80px}
.height5 #p_info{font-size:100%;padding: 10px}

.height5 .inner{overflow: hidden;}
#p_info{
position: absolute;
vertical-align:middle;
text-shadow: 1px 1px 3px #000, 0px 0px 2px #fff;
/*display:inline-table;
/*   top: 0px;
right: 0px;
bottom: 0px;
left: 0px;*/
z-index:100;
color:white;
text-align:center;
font-weight:bold\9;
behavior: url('/common_n/css/ie-css3.htc');
}
#p_info span{font-size:150%;font-weight:bold}
#p_info p{font-size:84%;text-align:center;padding:2px;margin:10px 20px 5px;line-height:1.3em;background-color: rgba(0,0,0,0.1);}
a:hover #p_info p{background-color: rgba(0,0,0,0.6);}
#bsc,#bsc2{background-repeat:no-repeat;background-size:cover;background-position:center}
/*#bsc:after{
position: absolute;
content: "";
display: block;
width: 100%;
height: 100%;
}*/
#bsc{box-sizing:border-box;
   -webkit-background-size: cover;
-moz-background-size: cover;
-ms-background-size: cover;
background-size: cover;
-webkit-transition: all .6s ease-out;
-moz-transition: all .6s ease-out;
-ms-transition: all .6s ease-out;
transition: all .6s ease-out;
}
a:hover #bsc,#bsc:hover,#bsc:hover :after,
a:active #bsc,#bsc:active,a:active #bsc :after{
opacity: 0.85;
opacity: .8;
-moz-transform: scale(1.03);
-webkit-transform: scale(1.03);
-ms-transform: scale(1.03);
transform: scale(1.03);
}

#bsc a:hover p{
transform: scale(1.0);
}
.inner {width:100% !important;height:100% !important;
z-index: 10;
position: relative;
color:white;
box-sizing:border-box;
}

.inner2 {width:100% !important;height:50% !important;
z-index: 10;
position: relative;
color:white;
box-sizing:border-box;
}




/*--------------------------------------*/
#p-box{background-repeat:no-repeat;background-size:cover;background-position:center}

#white-box{background-color:rgba(255,255,255,0.8);}

#white-box{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccfffffff,endColorstr=#ccfffffff); 
background: rgba(255,255,255,0.8);}
#box-inner{padding:2em 1.5em;text-align:left;line-height:1.4em}
#box-inner h2{padding:0.3em 0}
#box-inner p{padding-top:6px;font-size:85%}

#ua{width:45%}
#p-box{height:300px}
#blue-box {margin:20px;background:#3193b7;color:white;padding:12px 26px;line-height:1.6em;box-sizing:border-box}
#interview,#interview2{font-size:15px;padding:10px 20px}
#interview figure{padding:0 0 6px}
#interview h2,#interview2 h2{font-size:150%;font-weight:bold;color:#333;line-height:1.2em}
#interview h3{font-size:120%;font-weight:bold;padding:20px 0;line-height:1.4em}
#interview2 h3{font-size:120%;font-weight:bold;padding:10px 0;line-height:1.4em}
#interview2 h3,#interview2 p{text-align:left !important}
#interview p{font-size:85%;line-height:1.3em;padding:10px 0 0;word-wrap:normal;word-break:normal;-webkit-text-size-adjust: 100%;}
#interview2 p{line-height:1.6em;padding:10px 0 0;}
.h2_ttl{font-size:160%}
#eco_safety{width:20%;margin:0 auto}
.house-box{padding:29em 12em 5em;text-align:center}
.house_top{border:1px solid #aaa;color:#333;padding:0.6em 0.1em;line-height:1.3em}
/*---------------smp nav----------------*/
nav{border-top:1px solid #b2b900;/*height:40px !important*/}
nav ul{width:100%;margin:0;padding:0;background:#eee;height:40px}
#navi{
background:#999;
}
#navi img{height:36px}

nav ul {
list-style: none;
}

#headerNaviMenu{

}
ul#headerNav_1of2 li {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: table;
width: 50%;
height: 36px;
float: right;
outline:none;
}
ul#headerNav_1of3 li {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: table;
width: 33.333333%;
height: 36px;
float: right;
outline:none;
}
ul#headerNav_1of2 li a, ul#headerNav_1of3 li a {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: table-cell;
width: 100%;
height: 100%;
font-size: 12px;
text-decoration: none;
color: white;
vertical-align: middle;
font-weight: bold;
text-align: center;
height:20px;
}
a#headerNav00 {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: #eee;
-moz-background-size: 11px 11px;
-webkit-background-size: 11px 11px;
color: #444 !important;
text-align:left !important;
}
a#headerNav01 {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: #abb315;
-moz-background-size: 11px 11px;
-webkit-background-size: 11px 11px;
border-left: 1px solid white;
}
a#headerNav02 {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: #9d394c;
-moz-background-size: 11px 11px;
-webkit-background-size: 11px 11px;
border-left: 1px solid white;
}
ul#headerNav_1of2 li.headerNaviMenu .headerNav00R, ul#headerNav_1of3 li.headerNaviMenu .headerNav00R {
display: table-cell;
vertical-align: top;
padding-top: 10px;
font-weight:bold;
}
ul#headerNav_1of2 li.headerNaviMenu .headerNav00R .gico_update, ul#headerNav_1of3 li.headerNaviMenu .headerNav00R .gico_update {
width: 40px;
}
ul#headerNav_1of2 li.headerNaviMenu #headerNav00 div, ul#headerNav_1of3 li.headerNaviMenu #headerNav00 div {
/*display: inline;*/
}
ul#headerNav_1of2 li a img, ul#headerNav_1of3 li a img {
vertical-align: middle;
}
.headerNav00L img{
height:40px;
margin-bottom:0;
}

/*----------------------smp sitemenu-----------------*/
.sitemenu-responsive ul{padding:0.2em 0}
.sitemenu-responsive ul li{font-size:130%;padding:0.2em 0 0.2em 0.2em}
.sitemenu-responsive ul a{text-align:left !important}
.site-header .nav a{color:#ddd}
.sitemenu-responsive .left{background:#4e4e4e !important}
/*----------------------smp head---------------------*/
.smp_head{width:100%;
border-top:1px solid #B3B3B3 /*{c-bar-border}*/;
border-bottom:1px solid #B3B3B3 /*{c-bar-border}*/;
background: #e9eaeb /*{c-bar-background-color}*/;
color: #3E3E3E /*{c-bar-color}*/;
font-weight: bold;
text-shadow: 0 /*{c-bar-shadow-x}*/ 1px /*{c-bar-shadow-y}*/ 1px /*{c-bar-shadow-radius}*/ #fff /*{c-bar-shadow-color}*/;
background-image: linear-gradient(#f0f0f0 /*{c-bar-background-start}*/, #e9eaeb /*{c-bar-background-end}*/);
z-index:300;
}
.smp_head h2{
min-height: 1.1em;
text-align: center;
padding-right:2.5em;
}
.smp_head h2 span{font-size:80%;font-weight:bold}

.ui-title{
color: #3E3E3E /*{c-bar-color}*/;
font-weight: bold;
text-shadow: 0 /*{c-bar-shadow-x}*/ 1px /*{c-bar-shadow-y}*/ 1px /*{c-bar-shadow-radius}*/ #fff /*{c-bar-shadow-color}*/;
height: 26px;
padding: 8px 0px 0px 0px;
margin: 0px;
font-size: 16px;
}
a .ui-btn{font-weight: bold !important;color:#3e3e3e}
.ui-btn {
border:1px solid #aaa;
float:left;
display: block;
text-align: center;
cursor: pointer;
position: relative;
margin: .5em 5px;
padding: 0.3em 0.2em 0.2em;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
background-image: linear-gradient(#fdfdfd /*{c-bup-background-start}*/, #eee /*{c-bup-background-end}*/);
}
.ui-btn-text{
padding-left:3px;
font-weight: bold;
text-shadow: 0 /*{c-bup-shadow-x}*/ 1px /*{c-bup-shadow-y}*/ 1px /*{c-bup-shadow-radius}*/ #f6f6f6 /*{c-bup-shadow-color}*/;
}
.ui-icon{float:left;
top: 50%;
margin-top: 0px;
width:18px;
height:18px;
background: #666 /*{global-icon-color}*/;
background: rgba(0,0,0,.4) /*{global-icon-disc}*/;
background-image: url(/smp/common/css/images/icons-18-white.png) /*{global-icon-set}*/;
background-repeat: no-repeat;
background-position: -144px 50%;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
border-radius: 9px;
}
nav, .smp_head,.smp,a .smp,.smp img/*,.smp span*/{display:none !important}
.lightboxOverlay{
/*background:#666;*/
filter:alpha(opacity=80) !important;
opacity:0.8;
}
.lb-data .lb-caption {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5em;
}
.lb-data {
color: white;
}
.lb-data .lb-number{
color:white;
}
.lb-details p {
background: url('../images/bg_p.png') no-repeat;
}
.lb-details a p,.lb-details a:hover p {text-decoration:underline !important}
/*-----------page contents--------------*/
#top_copy{font-size:115%;line-height:1.5em !important;font-weight:bold;padding:0.5em 0 0.5em;/**/word-wrap: break-word !important;box-sizing:border-box}
/*******オリジナルfont-size:125%*******/

#top_copy p{text-align:center !important}
/*#top_copy {
font-size: 105%;
line-height: 1.5em !important;
font-weight: bold;
padding: 0.5em 0 0.5em;
word-wrap: break-word !important;
box-sizing: border-box;
}*/

/*---------------------responsive-----------------------*/
.site-center{width:100%}
.p_top1{padding-top:1em !important}
.p_top2{padding-top:2em !important}
.p_top3{padding-top:3em !important}
.p_top4{padding-top:4em !important}
.p_top5{padding-top:5em !important}

#p_info{
text-align:center;
}
.arrow-r{
vertical-align:middle;
text-shadow: 1px 1px 2px #ccc, 0px 0px 0px #fff;
z-index:100;
position: relative;
float: right;
text-align:right;
top: 50%;
margin-top: -0.5em !important;
margin-right: 0.3em;
line-height:1em;
}
.arrow-l{
vertical-align:middle;
text-shadow: 1px 1px 2px #ccc, 0px 0px 0px #fff;
z-index:100;
position: relative;
float: left;
text-align:left;
top: 50%;
margin-top: -0.5em !important;
margin-left: 0.3em !important;
line-height:1em;
}

#bt_more {display:inline-block;
padding: 0.2em 0.2em 0.15em 0.6em;
border: 1px solid #aaa;
margin: 1em 0;
width:auto;
font-size:90%;
line-height:1.6em;
}
/*-----------------------新卒採用-----------------------*/

.sitemenu-responsive .nav li{letter-spacing:0 !important}

.fixed {
position: fixed;
top: 0;
width: 100%;
z-index: 10000;
border-bottom: 1px solid #ccc;
background:white;
}

#top_bg{border-bottom:1px solid #d7d7d7;}
#top_menu{box-sizing:border-box;background:#aaa;border:1px solid #aaa;
-moz-border-radius:0.5em;
-webkit-border-radius:0.5em;
border-radius:0.5em;
margin:12px;
}
#top_menu div a{padding:0;margin:0;line-height:0}
.tile{
transform: translate(0,0); 
-webkit-transform: translate(0,0);
transition:0.8s;
padding:0 !important;
margin:0 !important;
line-height:0;
box-sizing:border-box;
border:1px solid #aaa;
}
/*hoverした時に表れる*/
.tile .overlay{
width:100%;
position:absolute;
overflow: hidden;
top:0;
bottom:0;
}
.tile img{
position:relative;
cursor: pointer;
display: block;
margin:0 auto;
transition: max-height 0.4s;
}
/*.tile h2{
text-align: center;
font-size: 20px;
color:#fff;
position:relative;
}*/
.tile-view .overlay{
opacity:0;
background-color: #0063b7;
transition: all 0.3s ease-in-out;
}
.tile-view:hover .overlay{
opacity:0.3;
}

.tile {
overflow: hidden;
}

.center_body{width:100%}




@media (max-width:767px)
{
.tile{width:50%}
.center_body{width:100%;margin:0 15px}
}

/*------------------*/


/**************************************************************/



@media (min-width:1281px){
.site-center{width:85%;max-width:1280px;min-width:1100px}
}
@media (max-width:1280px){
.site-center{width:95%;max-width:1100px}
h1.ttl_ex{font-size:180%}

}
@media (max-width:1200px){
.site-center{width:95%;max-width:1100px}
.width-1of6{width:20%}
#info{font-size:90%}
#form_panel ul li{width:16.6%}


.house-box{padding:26em 10em 4em;text-align:center}
.kurasite_pink2,.eco_safety2{height:360px !important;}.kurasite_pink1,.eco_safety1{height:180px !important;}
.kurasite_white{height:180px !important;}
}
@media print, screen and (max-width:1024px){
.site-center{width:95%;max-width:980px}/*20180112*/
#info{font-size:90%}
#tblJitsurei .width-1of4{width:33.3%;height:320px}
.kurasite_pink2,.eco_safety2{height:330px !important;}.kurasite_pink1,.eco_safety1{height:160px !important;}
.kurasite_white{height:170px !important;}

.height2{height:400px;}
.height1{height:200px;}
.height5{margin:0 5px;height:200px}
#index_txt{font-size:110%}
.cell{margin:2px 6px !important}

#blue-box{padding:10px 20px}
#interview,#interview2{padding:10px}
ul.footer_menu li{font-size:100%}

}
@media only screen and (max-width:979px){
ul.footer_menu li{font-size:100%}
#top_copy{padding:0.5em 6px 0.5em;font-size:100%}

p#lead {padding: 0 6px 0.2em !important}
.width-1of6{width:25%}
#form_panel ul li{width:20%}
#tblJitsurei .width-1of4{width:50%;height:320px}
#inner_area h2{font-weight:bold;font-size:160% !important;}
.height2 #p_info{font-size:160%;width:50%; top: 25%;}
.height1 #p_info{font-size:110%;width:25%;padding-top: 60px}
.height2{height:360px;}
.height1{height:180px;}
.height5{margin:0 5px;height:180px;}
#index_txt{font-size:100%}
.cell{margin:5px !important}
.arr{margin-top:4px}
#ua{width:65%}
#p-box{height:220px}
#interview2 p{font-size:90%;line-height:1.5em;padding:10px 0 0;}
.h2_ttl{font-size:130%}
}
@media only screen and (max-width: 767px){
body{max-width:100%;word-wrap: break-word;}
.site-center{width:100%}
.highlights{margin:0 !important}
.sitemenu,.pc,#crumb{display:none !important}
nav, .smp_head,.smp,a .smp,.smp img{display:block !important}
.width-1of4{width:50% !important}
.width-1of6{width:33.33%}
.height2 #p_info{font-size:160%;width:50%; top: 25%;}
.height1 #p_info{font-size:130%;width:50%;padding-top: 80px}
.height2{height:400px;}
.height1{height:200px;}
.height5{margin:0 5px;height:200px;}
.kurasite_pink2,.eco_safety2{height:380px !important}.kurasite_pink1,.eco_safety1{height:190px !important}
.kurasite_pink2,.eco_safety2,.kurasite_white{width:100% !important;}
.kurasite_white{height:auto !important;max-height:250px;/*overflow:auto;*/min-height:130px;}
#index_txt{padding:1em 0 0.7em}
.lb-details p {
background: url('/smp/house/exdesign/images/bg_p.png') no-repeat;
}

.lb-data .lb-caption {
  font-size: 12px;
  font-weight: bold;
  line-height: 1.5em;
}

h1.ttl_ex{margin-top:0;font-size:15px !important}
.arrowbox{padding-top:30px}
.arrowbox:before{border-width:20px 20px 0 20px;}
.arrowbox:after{bottom: -20px;border-width:20px 20px 0 20px;}
h2.blue-ttl{font-weight:600;margin:0 !important;text-align:center !important;font-size:6vmin !important;line-height:1.3em;}
h2.blue-ttl p{font-weight:600;text-align:center !important;font-size:14px !important;line-height:1em}
h2.blue-ttl2{font-weight:600;margin:0 !important;text-align:center !important;font-size:5.2vmin !important;line-height:1.3em;}
#bt_inquiry{font-size:140%}
.arr{margin-top:2px}
.width-1of3 .cell{margin:6px;}
#blank{display:none;width:0}
#before{width:60%}
#footer-navigation{display:none}
#interview h2,#interview2 h2{font-size:125%}
#interview2 h3{font-size:100%}
#eco_safety{width:60%;margin:0 auto}
.house_top{border:1px solid #aaa;color:#333;padding:0.6em 0.1em;line-height:1.3em}

.ui-btn-inner {
padding: .2em;
display: block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
position: relative;
zoom: 1;
}
.ui-btn {
display: block;
text-align: center;
cursor: pointer;
position: relative;
margin: .5em;
padding: 0.3em;
}
.ui-btn-text {
position: relative;
z-index: 1;
font-weight: bold;
}
.button span{margin:0 !important}
.button img{box-sizing: border-box;width:100%;margin:0 !important}
.ui-btn-corner-all {
-moz-border-radius: 1em /*{global-radii-buttons}*/;
-webkit-border-radius: 1em /*{global-radii-buttons}*/;
border-radius: 1em /*{global-radii-buttons}*/;
}
.ui-shadow {
box-shadow: none;
}




}
@media only screen and (max-width: 767px){
.tenjijo1{height:140px;}
.site-footer .width-1of2{width:50%;box-sizing:border-box}
.width-1of2{width:100%}
.width-1of3{width:50%}
}

@media only screen and (max-width: 600px){

#top_copy{font-size: 100%;}

.site-footer{font-size:130%}
.site-footer .width-1of5{width:100%;box-sizing:border-box}
.site-footer .width-2of5{width:100%;box-sizing:border-box}
.site-footer .width-1of2{width:50%;box-sizing:border-box}
.width-1of6{width:33.33%}
.footer_left,.footer_right{width:50% !important}
.footer_left{float:left !important}
.footer_right{float:right !important}
#release_inner p.date {
width: 72px;}
#form_panel ul li{font-size:95%;width:33.3%}
#info{font-size:115%}
.height5{margin:0 5px;height:240px;}
.width-1of2,.width-1of3{width:100%}
#tblJitsurei .width-1of4{height:380px;width:100% !important}
#tenjijo{}
.tenjijo2{height:140px;border-top:1px solid #999;}
.tenjijo1{height:100px;}
#inner_area h3{font-weight:bold;font-size:120% !important;}
#inner_area h2{font-weight:bold;font-size:160% !important;}
.kurasite_pink2,.eco_safety2{height:320px !important;}.kurasite_pink1,.eco_safety1{height:160px !important;}
.height2{height:250px;overflow: hidden;background:#000}
.height1{height:150px;overflow: hidden;background:#000}
.height2 #p_info{font-size:160%;width:100%; top: 15%;}
.height1 #p_info{font-size:120%;width:50%;padding-top: 30px}
#p_info p{margin:5px 10px 0;background-color: rgba(0,0,0,0.3);}

nav, .smp_head,.smp,a .smp,.smp img,/*.smp span*/{display:block !important}
.site-body {font-size:14px}
#visual{display:none}
#visual_s{display:block}
h2.blue-ttl{font-weight:600;margin:0 !important;text-align:center !important;font-size:5.8vmin !important;line-height:1.5em !important;}
h2.blue-ttl2{font-weight:600;margin:0 !important;text-align:center !important;font-size:4.9vmin !important;line-height:1.3em;}
h2.blue-ttl p{font-weight:600;text-align:center !important;font-size:14px !important;line-height:1.3em}
#p-box{height:210px}
#blue-box{padding:10px}




#w-ttl{width:100%}

.house-box{padding:12em 2em 2em;text-align:center}

}
#sns{float:right;margin:40px 0 0 0;width:300px}


@media only screen and (max-width: 375px){


.kurasite_pink2,.eco_safety2{height:200px !important;}.kurasite_pink1,.eco_safety1{height:120px !important;}
.kurasite_white{height:140px !important;}
}

.width-1of5 img{width:100%}




.topics{width:33.3333%;box-sizing:border-box;}
.topics dl{padding:4px}.topics dt{font-weight:bold}
.topics p{background:#bca859;color:white;font-weight:bold;font-size:120%;padding:2px 4px}
@media only screen and (max-width: 900px){.topics{width:50%}}
@media only screen and (max-width: 600px){.topics{width:100%}}

.topics_inner{padding:4px;border:1px solid #bca859;background:white}
.topics_inner span{font-size:90%;line-height:1.3em}
.topics_inner dt sup{font-size:60%;}



.brand{width:50%;box-sizing:border-box;}
.brand_inner dl{padding:0}.brand dt{font-weight:bold}
.brand_inner p,.brand_inner2 p{color:#333;font-weight:bold;padding:6px 4px 4px}
.brand_inner p{text-align:center;font-size:120%;
background: #f2f2f2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e3dad0));
background-image: linear-gradient(to bottom, #fff 0%, #e3dad0 100%);
background-repeat: repeat-x;
background-position: left top;
height: auto;
}
.brand_inner2 table{margin:0}
.brand_inner2 table td{font-size:100%;line-height:1.5em}
.brand_inner2 p{font-size:110%;margin-bottom:16px}
.brand_inner p b,.brand_inner2 p b{font-weight:bold}
.brand_inner2 table tr{height:240px}
@media only screen and (max-width: 940px){.brand_inner{font-size:13px}}
@media only screen and (max-width: 900px){.brand{width:50%}}
@media only screen and (max-width: 798px){.brand_inner{font-size:12px}}
@media only screen and (max-width: 768px){.brand{width:100%}.brand_inner{font-size:100%}}
@media only screen and (max-width: 600px){.brand{width:100%}.brand_inner,.brand_inner2{letter-spacing:-0.05em;font-size:90%}.brand_inner2 table tr{height:180px}}

.brand_inner img{margin:0}
.brand_inner,.brand_inner2{text-align:center;padding:4px 0;border:1px solid #ccc;background:white}
.brand_inner span{font-size:90%;line-height:1.3em}
.brand_inner dt sup{font-size:60%;}

/*************************************/

#bukken{width:25%;border:1px solid white;box-sizing:border-box;}
@media print, screen and (max-width:1023px){#bukken{width:50%;border:1px solid white;box-sizing:border-box;}}
@media only screen and (max-width:600px){#bukken{width:100%}}
a #bukken div{color:#333}
#bukken div{margin:0;padding:0;color:#333}
#bukken div span{font-size:80%}
#bukken img{padding:0 2px;max-width:100%;box-sizing:border-box;margin:0}
#bukken p{margin:0 0 4px;text-align:center;font-size:120%;background:#333;color:white}
#bukken:hover img{opacity:0.8}


.bukken_pic div{overflow: hidden}


a .bukken_inner{color:#333}
.bukken_inner{font-size:100%;text-align:center !important;padding:0;border:1px solid #ccc;background:white;}
.bukken_inner img{margin:0}
.bukken_inner h4{font-weight:bold;text-align:center;font-size:120%;padding:6px 0;
background: #e9e2da;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#e3dad0));
background-image: linear-gradient(to bottom, #fff 0%, #e3dad0 100%);
background-repeat: repeat-x;
background-position: left top;
height: auto;
}
.bukken_inner h4#long{font-size:105%;padding:7px 0 8px;letter-spacing:-0.05em}
@media only screen and (max-width:767px){.bukken_inner h4#long{font-size:100%;padding:7px 0 8px;letter-spacing:-0.08em}}
@media only screen and (max-width:600px){.bukken_inner h4#long{font-size:105%;padding:7px 0 7px;letter-spacing:0}}


a:active{transition:all 0s}
a:hover .bukken_inner h4,a:active .bukken_inner h4{
background: #e4cd98;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#d5af54));
background-image: linear-gradient(to bottom, #fff 0%, #d5af54 100%);
background-repeat: repeat-x;
background-position: left top;
}

.bukken_inner h4 b{font-weight:bold}

.bukken_inner p{text-align:center !important;display:table;width:100%;height:2.6em;padding:4px 2px 0;color:#cb7f00;font-weight:bold;font-size:105%;margin:0}
.bukken_inner p b{display:table-cell;vertical-align:middle;line-height:1.2em}
.bukken_inner dl{margin-top:0;text-align:center !important;display:table;width:100%;height:5.4em;padding-bottom:4px}
.bukken_inner dd{display:table-cell;vertical-align:middle;height:5.4em;}
#renewal{box-sizing: border-box;padding:6px 10px}
#rebox{
font-size:100%;
box-sizing: border-box;
text-align:left;
float:left;
width:100%;
height:auto;
border:1px solid #ccc;
padding:0;
}
#rebox a:hover{
text-decoration:none !important;
}
#rebox #pic{
width:43%;
margin:0 !important;
padding:0;
vertical-align:middle;
}
#rebox:hover #pic{opacity:0.8}
#label{
width:53%;
height:90px;
float:right;
background:#fff;
padding:5px;
line-height:1.3em;
}


#label p{
float:left;
white-space: nowrap;
line-height:1.3em !important;
width:100%;
}
#label p#stn:after,#label p#stn:before {
  clear: both;
  content: '';
  display: block;
}
p#stn{background:#b62447;margin:4px 4px 4px 0 !important;
padding:2px 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;
border-radius: 4px;
width:auto;
min-width:20px;
font-weight:bold;color:white;
}


#rebox h4{color:#333;font-weight:bold;text-align:center;font-size:120%;padding:6px 0;
background: #d9c99d;
background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc));
background-image: linear-gradient(to bottom, #eee 0%, #ccc 100%);
background-repeat: repeat-x;
background-position: left top;
height: auto;
}
a:hover #rebox h4,a:active #rebox h4,#rebox:hover h4{
background: #e4cd98;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e8d8ab), to(#c5a756));
background-image: linear-gradient(to bottom, #e8d8ab 0%, #c5a756 100%);
background-repeat: repeat-x;
background-position: left top;
}
#rebox h4#long{font-size:105%;padding:7px 0 7px;letter-spacing:-0.05em}
@media only screen and (max-width:767px){#rebox h4#long{font-size:100%;padding:7px 0 7px;letter-spacing:-0.08em}}
@media only screen and (max-width:600px){#rebox h4#long{font-size:105%;padding:7px 0 7px;letter-spacing:0}}
@media only screen and (max-width:1200px){.bukken_inner,#rebox{font-size:100%;line-height:1.4em}}
@media only screen and (max-width:1024px){.bukken_inner,#rebox{font-size:95%;line-height:1.4em}#renewal{box-sizing: border-box;padding:6px 5px}}
@media only screen and (max-width:900px){.bukken_inner{font-size:90%;line-height:1.4em}#rebox{font-size:90%;line-height:1.3em}}
@media only screen and (max-width:767px){#rebox{font-size:85%;line-height:1.2em}}
@media only screen and (max-width:600px){.bukken_inner,#rebox{font-size:100%;line-height:1.4em}}
.bukken_pic {
position: relative;
width: 100%;
padding:0;
}
.bukken_pic:before {
content:"";
display: block;
padding-top: 55.92105263157895%; /* 幅を高さの55.92105263157895%に固定 */
}
.bukken_pic div {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}

#icon{position:absolute; z-index:100;list-style: none;padding:2px;margin:2px 4px 0}

#icon li{
padding:2px 4px;
margin:4px 4px 0 0 !important;
color:white;
font-size: 14px;
font-weight:bold;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;
border-radius: 4px;
width:auto;
min-width:20px;
float:left;
white-space: nowrap;
line-height:1.3em !important;
}

li#reno{background:#c16e7d}
li#red{background:crimson}
li#orange{background:#d5610d}
li#yellow{background:#d7a200}
li#newgreen{background:#8fa100}
li#corpgreen{background:#b2b900}
li#green{background:seagreen}
li#aqua{background:#2d78b7}
li#blue{background:#5e75a4}
li#gray{background:#999}


.bukken_inner i{position:absolute; z-index:200;text-align:right !important;right:10px;bottom:10px;font-size: 200%;color:#bbb;text-shadow: 1px 1px 2px #ccc, 0px 0px 0px #fff;}
a:hover .bukken_inner i,.bukken_inner i:hover{color:#b2b900;text-shadow:none}



#division{text-align:center;box-sizing:border-box;background:#e9e2da;padding:24px 12px 30px;font-size:105%;line-height:1.6em;}
@media (max-width: 630px){#division{padding:20px 4px;margin:0 5px}}

#division ul{
position:absolute;
bottom:0;right:10px;
}
#division ul li{float:right;}
#division h2.button2,#bt_map h2.button2{
padding:8px 12px;
background:#f2f2f2;
color:#333;
/*float:right;*/
margin-right:0.5em;
font-size:80%;
border:1px solid #888 !important;

}
.site-center h2.house_top {text-align:center;}
@media only screen and (min-width: 1100px){
}
@media only screen and (min-width: 980px){
#division h2.button2{max-width:280px;}
}
@media only screen and (min-width: 1200px){
}
@media only screen and (min-width: 1500px){
}
@media only screen and (max-width: 979px){
#division h2.button2{padding:6px 6px;}
}
@media only screen and (max-width: 767px){
#division h2{font-size:80%}
}
@media only screen and (max-width: 600px){
li h2.bg-corpgreen, li h2.bg-corpred{width:100px}
#division h2.button2{float:none;font-size:16px !important;text-align:center;border:1px solid #aaa;width:95%;margin:1em auto 5px}
}


/**************************************/




@media (max-width: 979px){.site-header .nav a, .site-footer .nav a {padding: 4px 2px 4px 3px !important;}}

body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body{max-width:100%}




.arr {
background: url('../images/arrow_r.png') no-repeat;
position: relative;
float: right;
right: 10px;
top: 50%;
margin-top: 2px;
width: 24px;
height: 24px;
}
.w1of3{width:33.3333%}
.w1of4{width:25%}
.w1of5{width:20%}
.w1of6{width:16.6666%}
@media only screen and  (max-width: 979px){
.w1of3{width:50%}
.w1of4{width:25%}
.w1of5{width:25%}
.w1of6{width:2%}
}
@media only screen and (max-width:767px){
#top_menu{border:1px solid #aaa !important}
.arr{margin-top: 0px;}
.w1of3{width:50%}
.w1of4{width:33.3333%}
.w1of5{width:25%}
.w1of6{width:25%}
}
@media only screen and (max-width:600px){
.w1of3{width:100%}
.w1of4{width:50%}
.w1of5{width:33.3333%}
.w1of6{width:25%}
}


/*------------------------*/
#top_menu{
min-height:180px \9;
}
.tile img{
width:100% \9;
opacity:1\9;
-ms-filter:"alpha(opacity=1)" \9;
}
.tile img:hover{
opacity:0.3 \9;
}
.tile-view .overlay{
display: none \9;
}



/**************** IoT *****************/
small{color:#333}

h1.main_ttl{margin-bottom:0.3em;background:#feeaef;color:#1d8282;font-weight:600;font-size:3.0vw !important;padding:0.45em 0.3em}
@media only screen and (max-width: 600px){
h1.main_ttl{font-size:5.6vw !important}
}

@media only screen and (min-width: 768px){
h2.blue-ttl{font-size:3.5vmin !important}
}

.blue-ttl{color:#333;font-size:80%}
.site-body{background:white !important;}
body{background:white !important;margin:0;max-width:100% !important;width:100% !important}

.topimg{
padding: 0 !important;
margin:0 !important;
}
.bg_color_anim{
margin:0 !important;
position: absolute;
width:100%;
height:100%;

background: linear-gradient(45deg, rgba(227, 117, 145, 0.5), rgba(95,210,228,.5));
background-size: 600% 600%;
animation: Animkey 9s ease infinite;
}
.bg_color_anim:before{}
h1.top_ttl{
padding:0;
position: absolute;
  bottom: 0;
  width:100%;
  margin:0 auto;
text-align:center !important;
font-size:8vmin;
font-weight:bold;
color:white;
text-shadow: rgba(0,0,0,0.2) 3px 3px 6px;
line-height:1.2em;
}
h1 figure{position:absolute}
h1 figure img{width:100% !important;margin:0 auto;float:none}
h1.top_ttl p{text-align:center !important;font-weight:bold;}
.top_lead{
line-height:1.6em;
font-size:2.1vmin;
font-weight:bold;
color: black;
}

@media only screen and (min-width:1400px){
.top_lead{font-size:2.5vmin;}
}
nobr {}

/*
h1.top_ttl {
animation: fadeIn 3s ease 0s 1 normal;
-webkit-animation: fadeIn 3s ease 0s 1 normal;
}
*/
.pic_fade{
animation: fadeIn 3s ease-in 0s 1 normal;
-webkit-animation: fadeIn 3s ease-in 0s 1 normal;

}

@keyframes fadeIn { /*「fadeIn」と名前をそろえる*/
0% {opacity: 0} /*アニメーション開始時は完全に透過*/
100% {opacity: 1} /*アニメーション終了時は透過しない*/
}

/*旧 Safari 用のベンダー処理*/
@-webkit-keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}

.cell img{
  transition: opacity 1.6s;
  -moz-transition: opacity 1.6s;
  -webkit-transition: opacity 1.6s;
  -o-transition: opacity 1.6s;
}


@media only screen and (max-width:600px){
.cell img{
  transition: opacity 1.0s;
  -moz-transition: opacity 1.0s;
  -webkit-transition: opacity 1.0s;
  -o-transition: opacity 1.0s;
}
.smp_small{margin :0.6em 1.2em 0.2em !important}
p#lead{margin:1em 0 !important}
}





#kakomi{
text-align:left;
font-size:125%;
line-height:1.4em
}
#kakomi p{
margin-top:0.6em;
font-weight:bold;font-size:110%;
padding:0.2em 0;
}

@media only screen and (max-width: 1000px){
.top_lead{font-size:20px}
}

@media only screen and (max-width: 767px){
.top_lead{font-size:18px}
}
@media only screen and (max-width: 600px){
h1.top_ttl{font-size:6vmin;}
.top_lead{font-size:4.4vw;}
}

@media only screen and (max-width: 767px){.sitemenu-responsive{display:block !important}}

@media only print {
html{background:white}
body{
width: 1100px;
transform: scale(1.0);
-moz-transform: scale(1.0);
-webkit-transform: scale(1.0);
transform-origin: 0 0;
background:white;
zoom: 80%;}
.footer_map,#pageTop,#sns,#bottom_box,#footer-navigation{display:none !important}
.site-center{width:100% !important}
.highlights{margin:0 !important}
.bg_color_anim{max-height:400px;padding:0;}
#visual{/*height:400px !important;*/}
p.top_ttl{color:#333 !important;}
.cell img{opacity:1 !important;}
.cell {margin:12px !important}
}



/*---------------------shisan----------------------------*/



h2#category-title-visual {
width: 100%;
height: 60px;
font-size: 0px;
background: url(/shisan/common/images/category_title.gif) no-repeat -22px 0;
}
#contact {
position: relative;
left: 0;
top: 17px;
float: right;
width: 206px;
text-align: right;
}
#contact table{
border-collapse: collapse
}
#contact table td{padding:0 !important}
#contact table img{margin:0 !important}

.example,.example p{line-height:1.6em !important}
.example p b{font-size:110%}
@media only screen and (min-width: 1401px){
.top_lead{font-size:20px}
.example,.example p{font-size:16px;}
}
@media only screen and (max-width: 1400px){
.example,.example p{font-size:1.15vw;line-height:1.55em !important}
}
@media only screen and (max-width: 1300px){
.example,.example p{font-size:15px;line-height:1.55em !important}
}
@media only screen and (max-width: 1200px){
.example,.example p{font-size:1.27vw;line-height:1.5em !important}
}
@media only screen and (max-width: 1100px){
.example,.example p{font-size:1.36vw;line-height:1.5em !important}
}
@media only screen and (max-width: 1000px){
.example,.example p{font-size:14px;line-height:1.45em !important}
}
@media only screen and (max-width: 900px){
.example,.example p{font-size:14px;line-height:1.45em !important}
}
@media only screen and (max-width: 767px){
.width-6of10,.width-4of10{width:100%}
.example,.example p{font-size:15px;}
}