@charset "UTF-8";


.sales_office{
    /*padding-top: 195px;
    padding-bottom: 114px;*/
	position:relative;
    padding-bottom: 80px;
}
.sales_office .NameNewIcon{ width:45px; height:auto;}
.sales_office .namePanoramaIcon{ width:36px; height:auto;}
.sales_office .iconTit{ color:#fff; padding:5px; font-size:12px; background:#444; font-weight:normal;}

.sales_office .buildContArea .buildContTxt dd .buildIcoArea{
	margin-bottom: 10px;
}
.sales_office .buildContArea .buildContTxt dd .buildIcoArea span{
	display: inline-block;
	color: #FFF;
	font-size: 11px;
	padding: 3px 6px 2px;
	border-radius: 10px;
	margin-right: .5em;
	margin-bottom: .5em;
}

.sales_office .detailInner{ width:950px; margin:0 auto;}
.sales_office .titmainArea{
	 background-image:url(../img/sales_office_list/bgmain.jpg);
}
.sales_office .titmainArea h1 img,
.sales_office .titmainArea h2 img {width: 205px;}


.sales_office .contactBanner{ position: fixed;
    top: 40%;
    right: 0;
    margin-top: -91px;
    z-index: 10;}
.sales_office .contactBanner img{ width:64px; height:auto;}

.sales_office .pagetitArea{ text-align:center; padding-top:50px;}
.sales_office .pagetitArea h2{ font-size:32px; margin-bottom:20px; padding-top:30px;}
.sales_office .readText{ margin-bottom:40px;}
.sales_office .sabTitle{ font-size:16px; font-weight:bold;}
.sales_office .sabTitle:after {
    content: "";
    width: 32px;
    height: 2px;
    background: #f16b33;
    display: block;
    margin: 0 auto;
    margin-top: 15px;
}
.sales_office .mapCon{ width:540px; height:450px; background:url(../img/sales_office_list/bg_map.png) left top no-repeat; display:inline-block; vertical-align:middle; font-size:16px; position:relative; background-size:540px 450px; }


.sales_office .mapIconLinks{ background:#4f4c4c; font-size:16px; color:#fff; width:135px; display:inline-block; vertical-align:middle;}
.sales_office .mapIconLinks a:hover{ opacity:0.7; text-decoration:none;}
.sales_office .mapIconLinks.nolink:hover{ opacity:1}

.sales_office .mapIconLinks.nolink{ background:#d7d6d6;  padding:12px 0;}
.sales_office .mapIconLinks.long{ width:155px;}
.sales_office .mapIconLinks .smText{ font-size:13px;}
.sales_office .mapIconLinks a{ color:#fff; display:block;  padding:12px 0;}
.sales_office .mapiconArrow:before{	
	content:"";
	display: inline-block;
	width: 5px;
	height: 6px;
	border-top: 4px solid transparent;
	border-right: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 5px solid #fff;
	display:inline-block; vertical-align:middle;
	margin-right:10px;
    margin-top: -3px;
}
	
.sales_office .hokkaidoLink{ position:absolute; right: -17px; top: 1px;}
.sales_office .tohokuLink{ position:absolute; right: 22px; top: 172px;}
.sales_office .kantoLink{ position:absolute; right: 22px; top: 242px;}
.sales_office .chubu2Link{ position:absolute; left: 100px; top: 20px;}
.sales_office .chubuLink{ position:absolute; right: 38px; top: 315px;}
.sales_office .kinkiLink{ position:absolute; left: 40px; top: 102px;}
.sales_office .chugokuLink{ position:absolute; left: 12px; top: 204px;}
.sales_office .shikokuLink{ position:absolute; left: 172px; top: 346px;}
.sales_office .kyushuLink{ position:absolute; left: 152px; top: 402px;}
	
.sales_office .mapImageCon{
    background:#e8edee;
    border:1px solid #ddd;padding: 30px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sales_office .areaListCon{ text-align:left; background:#fff; width:313px;}

.sales_office .areaListCon h3 .recentTit {
    background-color: #4f4c4c;
    padding: 12px 0;
    display: inline-block;
    width: 170px;
    padding-left: 15px;
    color: #fff;
	height:39px;
}

.sales_office .areaListCon h3 {
    height: 39px;
    overflow: hidden;
    margin-bottom: 10px;
    font-size: 16px;
}

.sales_office .areaListCon h3 .recentTitBg {
    background: url(../img/sales_office/bg_black.png) right top no-repeat;
    display: inline-block;
    background-size: 18px 39px;
    width: 18px;
    height: 39px;
	vertical-align:top;}
	
.sales_office .areaListCon{ display:inline-block; vertical-align:middle}
.sales_office .areaListNav{ padding:20px 10px;}
.sales_office .areaListNav dl{ font-size:0;}
.sales_office .areaListNav dt{ display:inline-block; width:16%; font-size:14px; vertical-align:top; color: #333; font-weight: normal;}
.sales_office .areaListNav dd{ display:inline-block; width:84%; font-size:14px; padding-left:30px; box-sizing:border-box; vertical-align:top;}
.sales_office .areaListNav dd a{ text-decoration:underline; color: #333}
.sales_office .areaListNav dd a:hover{ text-decoration:none;}

.sales_office .areaListNav dd span{ color:#aaa;}
.sales_office .areaListNav dd ul{ font-size:0;}
.sales_office .areaListNav dd li{ display:inline-block; padding:0 5px; border-right:1px solid #ddd; margin-bottom:10px; font-size:14px; }
.sales_office .areaListNav dd li:last-of-type{
    border-right: none;
}

.sales_office .bannerArea{ margin-top:40px;}
.sales_office .bannercon.left{ float:left;}
.sales_office .bannercon.right{ float:right;}
.sales_office .bannercon h4{ font-size:16px; text-align:center; font-weight: bold;}

.sales_office .bannercon{ border:1px solid #ddd; width:460px; box-sizing:border-box; padding:20px;}
.sales_office .bannercon h4:after {
    content: "";
    width: 32px;
    height: 2px;
    background: #f16b33;
    display: block;
    margin: 0 auto;
    margin-top: 15px;
}
.sales_office .bannerConImg{ padding-top:15px;}
.sales_office .bannerConImg img{ width:100%; height:auto;}
.sales_office .bannerConTetx{ font-size:14px; line-height:1.6;margin-top: 10px; margin-bottom:20px;}
.sales_office .bannerConBtn{ text-align:center;}
.sales_office .bannerConBtn img{ width:100%; max-width:375px; height:auto;}



@media only screen and (max-width: 1014px){
/*.pnavArea .detailInner{padding: 25px 32px 0;}
*/
    .sales_office .mapImageCon{
        padding: 0;
        justify-content: center;
    }
    .sales_office .mapCon{
        margin: 30px 0;
    }
    .sales_office .detailInner {
        width: 100%;
        margin: 0 auto;
    }
    .sales_office .areaListCon{ display:block; width:100%;}
    .sales_office .bannercon{ width:47.5%;}

}

@media only screen and (max-width: 700px){
.sales_office .pnav{ margin-top:20px;} 	 

.sales_office .contactBanner{ display:none;}
.sales_office .detailInner{ width:100%;  box-sizing:border-box;}
.sales_office .mapCon{ display:none;}
.sales_office .areaListNav{ padding:0;}
.sales_office .areaListCon{ width:100%; box-sizing:border-box;}
.sales_office .areaListNav dt{ width:100%; padding: 10px 18px;
    border-bottom: #b4b4b4 1px solid; box-sizing:border-box; position:relative;}
.sales_office .areaListNav dt:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    display: block;
    width: 18px;
    height: 18px;
    margin-top: -9px;
    background-image: url(../img/common/sp-map-accordion-btn.png);
    -webkit-background-size: 18px;
    -o-background-size: 18px;
    background-size: 18px;
}

.sales_office .areaListNav dt.opened:after {
    background-image: url(../img/common/sp-map-accordion-btn-opened.png);}
	
.sales_office .areaListNav dd{ width:100%; padding-left:0;}
.sales_office .areaListNav dd li{ display:block; border-right:none;     display: block;
    width: 100%;
    height: 100%;
    background-color: #FFF;
    padding: 9px;
    border-left: #b4b4b4 9px solid;
    border-bottom: #b4b4b4 1px solid;
    text-align: left;
    margin: 0;
    position: relative;
}

.sales_office .bannercon{ float:none; width:100%;}
.sales_office .mapCon{ width:100%;}
.sales_office .pnavArea{ width:100%; box-sizing:border-box; overflow:hidden;}

.sales_office .areaListNav dt + dd{ display:none;}
.sales_office .areaListNav dt.opened + dd{ display:block;}
.bannercon.left{ margin-bottom:40px;}
}

 