@charset "UTF-8";

/*====================================================================================================
/sph/css/site.css
サイト全体共通のcss

====================================================================================================*/

html,
body{height:100%;}
body{font-family:'新ゴR', 'Droid Sans','HiraKakuProN-W3', Arial, Helvetica, sans-serif;font-size:100%;line-height:normal;}
input{padding:1px;}
#wrap {margin:0;padding:0;background-color:#FFF;}

/*==================================================
#header
==========*/
#header_wrap{width:100%;height:64px;}
#header{border-top:4px solid #003092/*--------------color--------------*/;padding:10px 0 0;position:relative;}
#header #logo{line-height:1px;text-align:left;height:40px;margin:0 0 0 10px;}
#header #logo img{height:40px;}
#header ul{position:absolute;text-align:right;top:9px;right:10px;}
#header li{line-height:1px;width:40px;text-align:center;margin:0 0 0 8px;float:right;}
#header li a{text-decoration:none;color:#FFF;display:block;height:40px;position:relative;background:#003092/*--------------color--------------*/ url(/sph/images/hd_btn_back.png) 0 0 no-repeat;
background-size:40px 40px;}
#header li a img{height:20px;padding:4px 0 0;}
#header li a span{display:block;}
#header li a span img{padding:2px 0 0;height:11px;}

/*ヘッダー固定パターン01【bh1】-通常デザイン
<div id="wrap" class="bh1">
<!--#include virtual="/sph/compo/header.html" -->
-----------------------------------------*/
.bh1 #header_wrap{position:fixed;top:0;left:0;background:rgba(255,255,255,1);z-index:200 !important;}
.bh1 #contents_{margin:64px 0 0;position:relative;z-index:100 !important;}

/*ヘッダー固定パターン02【bh2】-2段デザイン
<div id="wrap" class="bh2">
<!--#include virtual="/sph/compo/header2.html" -->
-----------------------------------------*/
.bh2 #header_wrap{height:auto;}
.bh2 #header{height:48px;width:100%;position:fixed;top:0;left:0;padding:0;background:#003092/*--------------color--------------*/;border-top:none;z-index:200;box-shadow:0 1px 0 #999;}
.bh2 #header ul{top:4px;right:4px;}
.bh2 #header li{margin:0 0 0 4px;}
.bh2 #header li a{background:#FFF;box-shadow:0 -1px 0 #999 inset;
-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
/*.bh2 #header li a#navi_btn1{-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px;}*/
.bh2 #header .home{position:absolute;top:4px;left:10px;display:none;}
.bh2 #header .home img{height:40px;}
.bh2 #header_wrap #header2{text-align:center;padding:58px 0 10px;}
.bh2 #header_wrap #header2 h1,
.bh2 #header_wrap #header2 #logo{text-align:center;margin:0 10px;line-height:1px;}
.bh2 #header_wrap #header2 h1 img,
.bh2 #header_wrap #header2 #logo img{height:30px;}
.bh2 #contents_{position:relative;z-index:100;}

/*==================================================
コンテンツ部分
==========*/
#contents_ .asp_topic_path{overflow:hidden;}
#contents_ .asp_topic_path:after{content:"";display:block;background:-moz-linear-gradient(top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));background:-webkit-linear-gradient(top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));background:linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));height:5px;width:100%;position:absolute;left:0;top:0;z-index:3;}
#contents_ .asp_topic_path ol{text-align:left;background-color:#003092/*--------------color--------------*/;margin:0;padding:0;list-style:none;-webkit-overflow-scrolling:touch;overflow:auto;white-space:nowrap;}
#contents_ .asp_topic_path ol li{font-size:11px;line-height:28px;color:#FFF;display:inline-block;vertical-align:top;height:28px;}
#contents_ .asp_topic_path ol li a{color:#FFF;display:block;padding:0 22px 0 8px;text-decoration:none;background-color:rgba(255, 255, 255, 0.2);position:relative;overflow:hidden;}
#contents_ .asp_topic_path ol li a:after {content:"";display:block;width:28px;height:28px;border-top:solid 1px rgba(255, 255, 255, 0.6);border-right:solid 1px rgba(255, 255, 255, 0.6);-webkit-transform:rotate(45deg);transform:rotate(45deg);position:absolute;right:7px;top:0;}
#contents_ .asp_topic_path ol li:last-child{padding:0 15px 0 10px;position:relative;z-index:1;}
#contents_ .asp_topic_path ol li:last-child:before{content:"";vertical-align:top;display:block;width:0;height:0;border-top:solid 14px #003092/*--------------color--------------*/;border-right:solid 14px #003092/*--------------color--------------*/;border-bottom:solid 14px #003092/*--------------color--------------*/;border-left:solid 14px transparent;position:absolute;left:-14px;top:0;z-index:-1;}
#contents_ .asp_page_title_box{text-align:left;margin-bottom:15px;padding:13px 10px;border-bottom:1px solid #DDD;}
#contents_ .asp_page_title_box .asp_page_title{font-size:18px;line-height: 1.3;font-weight:700;vertical-align: baseline;display:inline-block;margin:0 4px 0 0;}
#contents_ .guide{font-size:16px;font-family:HiraKakuProN-W6;color:#FFF;text-align:center;white-space:nowrap;height:30px;margin:0 0 5px;padding:10px 3px 0 65px;background-color:#b0bccd;overflow:hidden;position:relative;border-top-color:#cdd5df;border-bottom-color:#2d3642;border-style:solid;border-width:1px 0;background-image: -webkit-gradient(linear, left top, left bottom, from(#b0bccd), to(#6d84a2));text-overflow:ellipsis;text-shadow: rgba(0, 0, 0, 0.6) 0 -1px 0;}
#contents_ .guide .title{font-size:16px;line-height:25px;display:inline;vertical-align: middle;}
#contents_ .guide span{float:left;background:url(/lib/images/asp_sp/common_images/back_btn.png) left center no-repeat;height:28px;width:50px;padding-left:5px;padding-top:2px;position:absolute;left:5px;top:6px;}
#contents_ .guide span a {font-size: 80%;text-decoration: none;color: #FFF;text-shadow: rgba(0, 0, 0, 0.6) 0 -1px 0;}
/*トップページ用背景画像*/
.toppage #contents_{background:url(/sph/images/main_back.jpg) center 0 no-repeat;background-size:contain;border:none;}
.toppage #contents_ .c_title{font-size:11px;line-height:25px;height:25px;text-align:left;padding:0 0 0 5px;text-shadow:2px 2px 3px #CCC;
/*For Old*/background:#DDD;/*For Old WebKit*/background:-webkit-linear-gradient(#F1F1F1 0%,#DDD 100%);/*For Modern Browser*/background:linear-gradient(#F1F1F1 0%,#DDD 100%);}

/*==================================================
フッター
<!--#include virtual="/sph/compo/footer.html" -->
==========*/
#footer{background:url(/sph/images/ft_back01.png) 0 0 repeat;margin:20px 0 0;}
#footer .menu{background:#DDD;padding:1px 1px 0 0;text-align:left;}
#footer .menu li{width:50%;padding:0 0 1px;vertical-align:top;display:inline-block;}
#footer .menu li a{font-size:12px;line-height:35px;text-decoration:none;color:#000;height:35px;display:block;margin:0 0 0 1px;padding:0 0 0 8px;
/*For Old WebKit*/background:url(/sph/images/ft_ar01.png) right center no-repeat,-webkit-linear-gradient(#FFF 0%,#FFF 50%,#F0F0F0 100%);/*For Modern Browser*/background:url(/sph/images/ft_ar01.png) right center no-repeat,linear-gradient(#FFF 0%,#FFF 50%,#F0F0F0 100%);background-size:25px 25px,auto;}
#footer .media{width:280px;margin:20px auto 0 auto;border:1px solid #888;}
#footer .media li{font-size:10px;line-height:28px;vertical-align:top;display:inline-block;width:50%;}
#footer .media li span{color:#FFF;background:#003092/*--------------color--------------*/ url(/sph/images/ft_ch01.png) 10px center no-repeat;}
#footer .media li a{text-decoration:none;color:#000;background:#FFF url(/sph/images/ft_ch02.png) 10px center no-repeat;}
#footer .media li span,
#footer .media li a{display:block;padding:0 0 0 15px;background-size:15px 15px;}
#footer .sns{padding:20px 0 0;}
#footer .sns li{vertical-align:top;display:inline-block;width:95px;padding:0 0 5px;}
#footer .sns li a{display:block;height:30px;width:90px;margin:0 auto;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
#footer .sns li a img{height:100%;}
#footer .sns .b1 a{background:#FF9300;}/*blog*/
#footer .sns .b2 a{background:#00C9FF;}/*twitter*/
#footer .sns .b3 a{background:#375399;}/*facebook*/
#footer .sns .b4 a{background:#FC4111;}/*youtube*/
#footer .sns .b5 a{background:#000;}/*google+*/
#footer .sns .b6 a{background:#00C826;}/*line*/
#footer .menu2{padding:20px 0 0;}
#footer .menu2 li{font-size:10px;line-height:20px;vertical-align:top;display:inline-block;}
#footer .menu2 li:first-child::after{content:"｜";margin:0 5px;}
#footer .menu2 li a{color:#000;text-decoration:none;}
#footer .tell_inq{margin:20px 0 0;padding:15px 0;background:#003092/*--------------color--------------*/;}
#footer .tell_inq .tel_main{text-decoration:inherit;display:block;width:280px;margin:0 auto;padding:15px 0;text-align:center;border:1px solid #DDD;
/*For Old*/background:#FFF;
/*For Old WebKit*/background:-webkit-linear-gradient(#FFF 0%,#FFF 50%,#DDD 100%);
/*For Modern Browser*/background:linear-gradient(#FFF 0%,#FFF 50%,#DDD 100%);
/*css3*/-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
/*css3*/box-shadow:0 0 2px #444;}
#footer .tell_inq .tel_main p{font-size:17px;line-height:25px;color:#003092/*--------------color--------------*/;font-weight:700;padding:5px 5px 0 40px;text-align:left;vertical-align:top;display:inline-block;background:url(/sph/images/tell_inq_ar1.png) 0 center no-repeat;background-size:40px 40px;}

/*フッター番号表示パターン（参考値-都度調整して下さい）
<!--#include virtual="/sph/compo/footer2.html" -->
#footer .tell_inq .tel_main p{font-size:20px;}
-----------------------------------------*/
#footer .tell_inq .tel_main p span{font-size:14px;}

#footer .tell_inq .tel_cap{font-size:12px;line-height:20px;color:#FFF;padding:10px 0 0;}
#footer .tell_inq .tel_cap + .tel_cap{padding:0;}
#footer .cr{font-size:10px;line-height:30px;border-top:1px solid #FFF;}
#footer .retop{padding:15px 0 0;}
#footer .retop a{font-size:10px;line-height:15px;color:#000;text-decoration:none;padding:20px 0 0;display:block;
/*For Old WebKit*/background:url(/sph/images/ft_retop.png) center 0 no-repeat,-webkit-linear-gradient(#FFF 0%,#FFF 50%,#F0F0F0 100%);/*For Modern Browser*/background:url(/sph/images/ft_retop.png) center 0 no-repeat,linear-gradient(#FFF 0%,#FFF 50%,#F0F0F0 100%);background-size:35px 20px,auto;}

/*==================================================
ドロワーメニュー
==========*/
#slide_in_wrap{position:fixed;z-index:100000;width:100%;height:100%;top:0;left:0;overflow-x:hidden;display:none;}
#slide_in_body{}
#slide_in_body_inner{height:100%;position:relative;background:rgba(0, 0, 0, 0.5);text-align:right;}
#slide_in_body_inner .close{position:fixed;z-index:150;right:210px;top:10px;width:40px;height:40px;text-align:center;}
#slide_in_body_inner .close a{display:block;background:url(/sph/images/snavi_btn01.png) 0 0 no-repeat;background-size:40px 40px;height:40px;}
#slide_in_body_inner .close a img{width:20px;padding:10px 0 0;}
#slide_in_content{position:relative;z-index:100;width:200px;margin:0 0 0 auto;background:#FFF;text-align:left;}
#slide_in_content .sl_contents{}
#slide_in_content .sl_contents dt{font-size:10px;line-height:15px;color:#FFF;padding:5px 5px 5px 10px;background:#003092/*--------------color--------------*/ url(/sph/images/snavi_tback.png) 0 0 repeat;}
#slide_in_content .sl_contents dd{font-size:15px;line-height:30px;border-bottom:1px solid #DDD;}
#slide_in_content .sl_contents dd a{text-decoration:none;color:#000;display:block;padding:10px;background:url(/sph/images/snavi_ar01.png) 97% center no-repeat;background-size:15px 20px;}
#slide_in_content .close2{font-size:11px;line-height:40px;color:#FFF;background:#888;}
#slide_in_content .close2 a{color:#FFF;text-decoration:none;display:block;padding:0 0 0 10px;background:url(/sph/images/snavi_btn02.png) 96% center no-repeat;background-size:20px 20px;}

/*==================================================
.to_pagetop
ex.  <div class="to_pagetop"><a href="">Page Top</a></div>
==========*/
.to_pagetop{top:0;right:0;position:relative;height:24px;padding:2px 0 0;}
.to_pagetop a{font-size:12px;line-height:150%;background-color:#FFF;border:1px solid #999;display:block;color:#999;text-decoration:none;margin-right:1px;margin-bottom:1px;position:absolute;top:0;right:0;padding:2px;}

/*==============================================================================================================
変更箇所
==============================================================================================================*/
/*物件一覧の会員物件用*/
#list .box_member {
line-height:0;
}
#list .box_member img {
width:100%;
}