@charset "UTF-8";

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

/css/base.css

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

/*-------------------------
__base_style
-------------------------*/
@media screen and (min-width: 768px) {
/*html{overflow-y:scroll;}*/
#wrap{min-width:980px;}
.pc_none{display:none!important;}
}
body{text-align:center;}
#wrap{}
#content{}
@media (min-width: 751px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}
/*-------------------------
__header_style
-------------------------*/
#header{width:100%;position:fixed;top:0;left:0;z-index:1100;height:105px;transition:background 0.4s;}
#header.change{background:rgba(255,255,255,0.8);}
#header .header_inner{width:100%;margin:0 auto;position:relative;min-width:980px;}
#header .logo{top:20px;left:20px;position:absolute;}
#header .logo a{display:inline-block;vertical-align:top;}
#header .logo a img{width:auto;height:auto;max-height:60px;}
#header .tel{top:25px;left:245px;position:absolute;}
#header .tel a img{width:auto;height:auto;max-height:60px;}
#navi{padding:35px 0 0;margin:0 5px;text-align:right;}
#navi ul{font-size:0;}
#navi li{display:inline-block;margin:0 0 0 20px;}
#navi li a{text-decoration:none;}
#navi li:not(.inq){font-size:16px;line-height:50px;}
#navi li:not(.inq) a{color:#000;transition:0.3s;}
#navi li.inq{}
#navi li.inq a{font-size:20px;line-height:50px;color:#FFF;padding:0 40px;display:inline-block;background:#ee1c25/*アクセントカラー*/;border-radius:5px;box-shadow:0 1px 6px 1px rgba(0,0,0,0.4);transition:0.3s;}

#navi2{text-align:right;padding:25px 0 0;margin:0;}
#navi2 .tel_btn,
#navi2 .mail_btn,
#navi2 .insta_btn{display:inline-block;width:45px;height:45px;vertical-align:middle;margin:0 10px 0 0;}
@media (min-width: 768px) {
#navi2 .tel_btn.tel_sp{display:none;}
}
@media (max-width: 767px) {
#navi2 .tel_btn.tel_pc{display:none;}
}

#navi2 .mail_btn a{display:block;padding:12px;border-radius:5px;background-color:#034da2;}

#navi2 .tel_btn a,
#navi2 .tel_btn span{display:block;padding:8px;border-radius:5px;background-color:#289E73;}
#navi2 .insta_btn a{}
#navi2 .tel_btn a img,
#navi2 .tel_btn span img,
#navi2 .mail_btn a img,
#navi2 .insta_btn a img{width:100%;height:auto;vertical-align:top;}
#navi2 .btn{display:inline-block;width:55px;height:45px;vertical-align:middle;position:relative; cursor: pointer;}
#navi2 .btn span,
#navi2 .btn::before,
#navi2 .btn::after{display:inline-block;width:35px;height:4px;position:absolute;right:10px;background:#034da2;/*border-radius:2px;box-shadow:0 0 2px rgba(0,0,0,0.3);*/}
#navi2 .btn::before,
#navi2 .btn::after{content:"";}
#navi2 .btn span{top:50%;transform:translate(0,-50%);}
#navi2 .btn::before{top:7px;transform:translate(0,0);}
#navi2 .btn::after{bottom:7px;transform:translate(0,0);}
#navi2 .btn.open span{display:none;}
#navi2 .btn.open::before{top:20px;transform:rotate(45deg);}
#navi2 .btn.open::after{top:20px;transform:rotate(-45deg);}
#navi2 .navi_box{background:#FFF;font-size:0;line-height:0;}
#navi2 li{display:block;margin:0;padding:0;text-align:center;}
#navi2 li:nth-child(even){background-color:#EEE;}
#navi2 li a{font-size:13px;line-height:1.5;letter-spacing:0.1em;text-decoration:none;padding:5px 0;margin:0;width:100%;display:block;color:#000;}
#navi2 li.tell a{position:relative;}
#navi2 li.tell a::before{content:"";display:inline-block;background:url("/images/tell@2x.png")no-repeat;background-size:cover;width:20px;height:20px;margin-top:-4px;margin-right:5px;vertical-align:middle;}
#navi2 li.inq{padding:5px 0 0;}
#navi2 li.inq a{font-size:14px;line-height:1.5;padding:11px 0 9px 0;margin:0;width:100%;display:block;border-radius:0;box-shadow:none;}
#navi2 .mail_insta{display:flex;justify-content:center;box-sizing:border-box;padding:10px;margin:0 10px;border-top:1px solid #eee;gap:10px;}
#navi2 .mail_insta a,
#navi2 .mail_insta .tell_mark{margin:0;display:block;width:35px;}
#navi2 .mail_insta a img,
#navi2 .mail_insta .tell_mark img{width:100%;height:auto;}
#navi2 .mail_insta .tel_dm_box{position:relative;}
#navi2 .mail_insta .tel_dm_box .telfukidashi{opacity:0;visibility:hidden;position:absolute;bottom:-140px;left:54%;transform:translateX(-50%);width:155px;}
#navi2 .mail_insta .tel_dm_box .telfukidashi.is-open{opacity:1;visibility:visible;display:block;}
#navi2 .mail_insta .tel_dm_box .telfukidashi a{display:block;width:100%;margin:0;}
#navi2 .mail_insta .tel_dm_box .telfukidashi a:nth-of-type(2){margin-top:-5px;}
#navi2 .mail_insta .tel_dm_box .telfukidashi a img{width:100%;height:auto;}
/*
開閉など動作用（with JQuery）
*/
#navi2 .navi_box{height:0;opacity:0;transition:0.5s;}
#navi2 li{display:none;transition:1s;}
#navi2 .btn.open + .navi_box{ width:230px;height:auto;margin:35px 0 0 auto;/*border-top:2px solid #AAA;*/box-shadow: 0 2px 5px rgba(0,0,0,0.3);
-webkit-animation:switch_open 0.5s ease-in-out;-moz-animation:switch_open 0.5s ease-in-out;animation:switch_open 0.5s ease-in-out;
-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;animation-fill-mode:forwards;}
#navi2 .btn.open + .navi_box ul li{display:block;
-webkit-animation:switch_open 0.5s linear;-moz-animation:switch_open 0.5s linear;animation:switch_open 0.5s linear;
-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;animation-fill-mode:forwards;}
@-webkit-keyframes switch_open{
from{opacity:0;height:0;}
to{opacity:1;height:auto;}
}
@-moz-keyframes switch_open{
from{opacity:0;height:0;}
to{opacity:1;height:auto;}
}
@keyframes switch_open{
from{opacity:0;height:0;transform:translateY(-5px);}
to{opacity:1;height:auto;transform:translateY(0);}
}

/*ヘッダー電話番号吹き出し表示*/
@media (min-width: 768px) {
#navi2{ position: absolute; top: 0; right:20px;}
/*nav{ display: flex;}*/
.tel_pc{ position: relative;}
.tel_pc:hover{ cursor: pointer;}
.balloon{display:none;position: absolute; top: 80px; right: 0; width: 350px; height: 30px;}
.balloon > span{ position: relative; display: block; padding: 10px; box-sizing: border-box; color: #000; font-size: 15px; line-height:1.3; font-weight: 700; background: #fff; text-align: center; -webkit-filter:drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.3)); border-radius: 40px;}
.balloon > span::before { content: ""; display: block; position: absolute; top: -18px; right: 187px; border-style: solid; border-width: 0 10px 20px 10px; border-color: transparent transparent #fff transparent;}
.balloon > span > span:nth-of-type(1){display:block;font-size:20px;margin:0 0 6px;}
.balloon > span > span:nth-of-type(2){font-weight:700;color:#F00;}
#navi2 .btn.open + .navi_box{ position: absolute; top: 70px; right: 0;}
}

/*-------------------------
.ms_box
検討リスト
-------------------------*/
#header + .ms_box{font-size:0;line-height:0;width:100%;position:fixed;top:-5px;right:80px;z-index:1500;left:auto!important;}
#header + .ms_box .ms_box_inner{width:940px;padding:0 5px;margin:0 auto;text-align:right;}
#header + .ms_box .ms_box_inner p{vertical-align:top;display:inline-block;}
#header + .ms_box .ms_box_inner p a{font-size:14px;line-height:20px;text-decoration:none;color:#FFF;display:block;height:20px;background:#034da2;padding:12px 10px 8px 40px;margin:0 0 0 10px;border-radius:5px;position:relative; transform:translateY(40px);transition:0.3s;}
#header + .ms_box p a.pc{}
#header + .ms_box p a.sph{display:none;}
#header + .ms_box p a::before{content:"";display:inline-block;vertical-align:top;width:20px;height:20px;position:absolute;top:10px;left:15px;transition:0.3s;}
#header + .ms_box p.stock a::before{background:url(/images/ms_icon1.png) 0 0 no-repeat;background-size:20px 20px;}
#header + .ms_box p.history a::before{background:url(/images/ms_icon2.png) 0 0 no-repeat;background-size:20px 20px;}


/*-------------------------
__footer_style
-------------------------*/
#footer{}
#footer .inner1{background:#034da2/*メインカラー*/;height:70px;box-sizing:border-box;padding:13px 0;position:relative;}
#footer .menu{font-size:0;text-align:left;max-width:1200px;margin:0 auto;box-sizing:border-box;padding-right:60px;}
#footer .menu ul{vertical-align:top;display:inline-block;}
#footer .menu li{font-size:14px;line-height:1.5;display:inline-block;vertical-align:top;margin:0 10px;}
#footer .menu li a{text-decoration:none;color:#FFF;transition:0.3s;}

#footer .re_top{max-width:1200px;margin:0 auto;text-align:right;font-size:0;position:absolute;top:0;right:0;left:0;}
#footer .re_top a{color:#FFF;text-decoration:none;display:inline-block;text-align:center;width:50px;height:70px;background:rgba(255,255,255,0.5);z-index:10;transition:0.3s;position:absolute;top:0;right:0;}
#footer .re_top a::after{content:"上へ";font-size:11px;line-height:25px;display:block;width:100%;text-align:center;position:absolute;bottom:0;opacity:0;transition:0.3s;}
#footer .re_top a img{position:absolute;margin:auto;top:0;bottom:0;left:0;right:0;transition:0.3s;}
#footer .inner2{max-width:1200px;margin:0 auto;position:relative;}
#footer .logo{padding:15px 0 20px 0;margin:0 0 0 10px;text-align:left;}
#footer .logo a{text-decoration:none;}
#footer .logo a span{font-size:11px;line-height:15px;color:#000;display:block;}
#footer .logo a img{width:auto;height:auto;max-height:30px;}
#footer .cr{font-size:14px;line-height:20px;position:absolute;top:15px;right:10px;}
#footer .cr span{}

/*-------------------------
コンテンツパターン
ASP
.content_inner
静的
.content_main
-------------------------*/
#content .content_inner,
#content .content_main{width:950px;margin:0 auto;padding:110px 5px 50px 5px;}
/*
.topic_path
パンくずリンク
*/
#content .topic_path{clear:both;text-align:left;}
#content .topic_path ul{padding:15px 0 0;margin:0 300px 0 0;}
#content .topic_path ul.bottom{margin:-10px 0 0;}
#content .topic_path li:first-child::before{content:"";margin:0;}
#content .topic_path li::before{color:#000;content:">";margin:0 5px;}
#content .topic_path li{font-size:14px;line-height:20px;color:#000;display:inline-block;}
#content .topic_path li a{font-size:14px;line-height:20px;color:#000;transition:0.3s;}
/*
.asp_pageTitle
コンテンツタイトル
*/
/*#asp_content .asp_pageTitle,*/
#content .asp_pageTitle,
#content .pageTitle{
font-size:26px;line-height:40px;height:40px;font-weight:400;text-align:left;padding:7px 0 3px 10px;border-left:5px solid #034da2/*メインカラー*/;background:#EEE;}
#content .asp_pageTitle{margin:20px 0 20px;}
#content .pageTitle{margin:20px 0 0;}

