@charset "utf-8";
/*======================
shop-page-list
店舗一覧ページ
======================*/
#page-mv .inner1200 .ttl .jpn-ttl{ display: flex; align-items: center;}
#page-mv .inner1200 .ttl .jpn-ttl .shoptti-span{ font-size: 30px;}
#page-mv .inner1200 .ttl .jpn-ttl .shoptti-span::after{ content: "：";}
.shop-access-mv#page-mv::after{ display: none;}
@media screen and (max-width: 850px) {
.shop-post#page-mv .inner1200 .ttl.shopName .shop-ttl{ flex-direction: column;}
.shop-access-mv#page-mv .inner1200 .ttl.shopName .shop-ttl{ flex-direction: column;}
}
@media screen and (max-width: 750px) {
.shop-post#page-mv::after{ display: none;}
}
@media screen and (max-width: 700px) {
#page-mv .inner1200 .ttl{ flex-direction: column;}
#page-mv .inner1200 .ttl .jpn-ttl{ flex-direction: column; align-items: flex-start; line-height: 1.1em; margin-bottom: 6px;}
#page-mv .inner1200 .ttl .jpn-ttl .shoptti-span{ font-size: 14px; line-height: 1.1em; padding-left: 2px; font-weight: 300 !important; color: #777;}
#page-mv .inner1200 .ttl .jpn-ttl .shoptti-span::after{ display: none;}
/**/
.shop-access-mv#page-mv .inner1200 .ttl.shopName .shop-ttl{ font-size: 30px;}
.shop-access-mv#page-mv .inner1200 .ttl.shopName .shop-ttl span{ font-size: 14px; font-weight: 500;}
.shop-access-mv#page-mv .inner1200 .ttl.shopName .jpn-ttl{ font-size: 12px;}
}
@media screen and (max-width: 600px) {
#page-mv{ padding: 30px 0;}
#page-mv .inner1200 .ttl .jpn-ttl{ font-size: 6.4vw;}
/*店舗詳細*/
.shop-post#page-mv{ padding:15px 0 0;}
.shop-post#page-mv .inner1200 .ttl.shopName .shop-ttl{ flex-direction: column; font-size: 34px;}
.shop-post#page-mv .inner1200 .ttl.shopName .shop-ttl span{ font-size: 14px; font-weight: 500 !important;}
.shop-post#page-mv .inner1200 .ttl.shopName .jpn-ttl{ font-size: 12px;}
/**/
.shop-access-mv#page-mv{ padding:15px 0 0;}
.shop-access-mv#page-mv .inner1200 .ttl.shopName .shop-ttl{ font-size: 24px;}
.shop-access-mv#page-mv .inner1200 .ttl.shopName .jpn-ttl{ letter-spacing: 1px;}


}

/*----------------------
店舗一覧
------------------------*/
#shop-page-list{ padding: 40px 0 100px; }
#shop-page-list .inner1200 { width: calc(100% - 20px); justify-content: flex-start;}
#shop-page-list .inner1200 .row{ width: 100%; display: flex; justify-content: flex-start; align-items: center; margin-bottom: 10px;}
#shop-page-list .inner1200 .row h2{ display: flex; align-items: center; justify-content: flex-start; margin-right: 14px; letter-spacing: 1px; position: relative; padding-bottom: 5px; margin:0 10px 0 30px; white-space: nowrap;}
#shop-page-list .inner1200 .row h2 br{ display: none;}
#shop-page-list .inner1200 .row h2::after{ width: 100%; height: 3px; content: ""; background: #000; border-radius: 10px; position: absolute; bottom: 0; left: -2px;}
@media screen and (max-width: 900px) {
#shop-page-list .inner1200 .row h2{ margin:0 15px;}
}
@media screen and (max-width: 600px) {
#shop-page-list .inner1200 .row{ margin-bottom: 30px;}

#shop-page-list .inner1200 .row h2 { margin: 0 20px 0 0; padding: 5px;}
#shop-page-list .inner1200 .row h2 br{ display: block;}
#shop-page-list .inner1200 .row p{ line-height: 1.4em; color: #666; font-size: 12px;}
}
/*--　店舗リスト　----------*/
#shop-page-list .inner1200 .item{ width: 100%; display: flex; flex-direction: row-reverse; align-items: stretch; padding-right: 10px; border-bottom: solid 1px #ccc; transition: 0.3s; z-index: 1; background: #f3f3f3;}
@media screen and (min-width: 800px) {
#shop-page-list .inner1200 .item:hover{ box-shadow: 0 6px 14px rgba(0,0,0,.2); border-bottom: solid 1px #f3f3f3; border-radius: 14px; z-index: 10;}
#shop-page-list .inner1200 .item:has(+ .item:hover) { border-bottom: solid 1px #f3f3f3;}
}
#shop-page-list .inner1200 .item .map{ width: 250px; display: flex; align-items: stretch; padding: 50px 0;}
#shop-page-list .inner1200 .item .map div{ display: block; border: solid 2px #111; border-left: none; border-radius: 0 6px 6px 0; overflow: hidden;}
#shop-page-list .inner1200 .item .map div iframe{ width: 100%; height: 100%;}
#shop-page-list .inner1200 .item a.textArea{ flex: 1; display: flex; align-items: stretch; flex-direction: row-reverse; padding: 50px 0;}
#shop-page-list .inner1200 .item a.textArea .image{ width: 250px; flex-shrink: 0; display: flex; justify-content: center; align-items: center; overflow: hidden; background: #000; border: solid 2px #111; border-right: none; border-radius: 6px 0 0 6px; overflow: hidden;}
#shop-page-list .inner1200 .item a.textArea .image img{ width: 100%; max-width:none; height: 100%; object-fit:cover; opacity: 0.9;}
/**/
#shop-page-list .inner1200 .item a.textArea .text{ flex: 1; width: 100%; display: flex; flex-direction: column; padding: 20px 40px 20px 20px;}
#shop-page-list .inner1200 .item a.textArea .text .shopttl{ width: 100%; display: flex; align-items: baseline; justify-content: flex-start; margin-bottom: 30px; padding-left: 5px;}
#shop-page-list .inner1200 .item a.textArea .text .shopttl h3{ font-size: 34px; font-weight: 300;}
#shop-page-list .inner1200 .item a.textArea .text .shopttl h4{ font-size: 14px; color: #555; margin-left: 30px; letter-spacing: 1px;}
/**/
#shop-page-list .inner1200 .item a.textArea .text p.txt{ display: flex; align-items: flex-start; justify-content: flex-start; padding-left: 5px; margin: 2px 0;}
#shop-page-list .inner1200 .item a.textArea .text p.txt .t1{ font-size: 14px; min-width: 80px; padding-right: 15px; position: relative;}
#shop-page-list .inner1200 .item a.textArea .text p.txt .t1::after{ content: ":"; position: absolute; right: 5px; top: 0;}
/**/
#shop-page-list .inner1200 .item a.textArea .text ul{ align-self: flex-start; display: flex; flex-direction: column; padding:5px 10px; margin-top: 15px; background: #fff; border-radius: 10px;}
#shop-page-list .inner1200 .item a.textArea .text ul li{ font-size: 13px; letter-spacing: 0; display: flex; justify-content: flex-start; align-items: flex-start; padding: 1px 0;}
#shop-page-list .inner1200 .item a.textArea .text ul li span{ font-size: 13px; min-width: 70px; padding-right: 5px; position: relative;}
/**/
#shop-page-list .inner1200 .item a.textArea .text p.btn{ display: flex; align-items: flex-start; justify-content: flex-start; margin: 20px 0 0 3px;}
#shop-page-list .inner1200 .item a.textArea .text p.btn span{ border:solid 1px #ccc; border-radius: 4px; padding: 2px 10px; font-size: 11px; letter-spacing: 0; color: #999; transition: 0.4s;}
#shop-page-list .inner1200 .item a.textArea:hover .text p.btn span{ background: var(--color1); border: solid 1px var(--color1); color: #fff;}

@media screen and (max-width: 1000px) {
#shop-page-list .inner1200 .item a.textArea .text{ padding: 25px 15px;}
#shop-page-list .inner1200 .item a.textArea .text p.txt{ flex-direction: column; padding: 4px 0; line-height: 1.2em;}
#shop-page-list .inner1200 .item a.textArea .text p.txt .t1{ font-size: 12px; line-height: 1em; font-weight: bold;}
#shop-page-list .inner1200 .item a.textArea .text p.txt .t1::after{ display: none;}
#shop-page-list .inner1200 .item a.textArea .text ul li{ flex-direction: column; padding: 4px 0;}
#shop-page-list .inner1200 .item a.textArea .text ul li span{ font-size: 11px; line-height: 1.0em; font-weight: bold;}
#shop-page-list .inner1200 .item .map, 
#shop-page-list .inner1200 .item a.textArea .image{ width: 180px;}
}
@media screen and (max-width: 800px) {
#shop-page-list{ padding: 40px 3% 100px; }
#shop-page-list .inner1200 .item{ flex-direction: column-reverse; background: #fff; border: solid 1px #aaa; box-shadow: 0 4px 12px rgba(0,0,0,.1); border-radius: 10px; padding: 0; margin: 25px 0; transform: 0;}
#shop-page-list .inner1200 .item .map{ width: 100%; height: 200px; padding:0;}
#shop-page-list .inner1200 .item .map div{ width: 100%; border: none; border-top: solid 1px #aaa; border-radius:0 0 10px 10px;}
/**/
#shop-page-list .inner1200 .item a.textArea{ width: 100%; flex: auto; padding: 0 0 20px;}
#shop-page-list .inner1200 .item a.textArea .image{ width: 30%; border: solid 1px #ccc; border-right: none; border-top: none; border-radius: 0 10px 0 40px;}
/**/
#shop-page-list .inner1200 .item a.textArea .text{ width: 65%; padding: 15px 15px 0;}
#shop-page-list .inner1200 .item a.textArea .text .shopttl{ flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 0; margin-bottom: 25px;}
#shop-page-list .inner1200 .item a.textArea .text .shopttl h3{ font-size: 34px; font-weight: 300;}
#shop-page-list .inner1200 .item a.textArea .text .shopttl h4{ margin-left: 0; padding-left: 5px; line-height: 1em;}
/**/
#shop-page-list .inner1200 .item a.textArea .text ul li{ flex-direction: column; padding: 4px 0;}
#shop-page-list .inner1200 .item a.textArea .text ul li span{ font-size: 11px; line-height: 1.0em; font-weight: bold;}
#shop-page-list .inner1200 .item a.textArea .text ul{ background: #eee; border-radius: 2px;}
#shop-page-list .inner1200 .item a.textArea .text ul li{ font-size: 12px; flex-direction: row; justify-content: flex-start; align-items: center; padding: 1px 0;}
#shop-page-list .inner1200 .item a.textArea .text ul li span{ font-size: 12px; min-width: 50px; padding-right: 0; }
/**/
#shop-page-list .inner1200 .item a.textArea .text p.btn{ display: flex; align-items: flex-start; justify-content: flex-start; margin: 20px 0 0 3px;}
#shop-page-list .inner1200 .item a.textArea .text p.btn span{ width: 200px; height: 30px; display: flex; align-items: center; justify-content: center; font-size: 13px; color: #fff; border-radius: 2px; background: var(--color1); border: solid 1px var(--color1); color: #fff;}
}
@media screen and (max-width: 600px) {
#shop-page-list .inner1200 .item a.textArea .text .shopttl h3{ font-size: 7.4vw;}
#shop-page-list .inner1200 .item a.textArea .text .shopttl h4{ color: #777; font-size: 12px;}
#shop-page-list .inner1200 .item a.textArea .text p.txt{ font-size: 12px;}
#shop-page-list .inner1200 .item a.textArea .text p.txt .t1{ font-size: 11px;}
#shop-page-list .inner1200 .item a.textArea .text ul li{ flex-direction: column; align-items: flex-start; font-size: 12px; line-height: 1.1em; padding: 6px 0; color: #555;}
#shop-page-list .inner1200 .item a.textArea .text ul li span{ font-size: 11px;}
}

/*======================
shop-page
店舗ページ
======================*/
#shop-page { }
#shop-page #shop-main-info{ display: flex; flex-direction: row; justify-content: space-between; padding: 20px;}
#shop-page #shop-main-info .left{ width: 55%; display: block;}
#shop-page #shop-main-info .left .image{}
#shop-page #shop-main-info .left .image img{ border-radius: 20px;}
#shop-page #shop-main-info .right { width: 42%; display: flex; flex-direction: column;}
#shop-page #shop-main-info .right .wrap{}
/**/
#shop-page #shop-main-info .right .wrap table{ width: 100%; table-layout: auto;}
#shop-page #shop-main-info .right .wrap table *{ text-align: left; align-items: flex-start;}
#shop-page #shop-main-info .right .wrap table tbody, 
#shop-page #shop-main-info .right .wrap table tbody tr{ width: 100%; border-bottom: solid 1px #ddd;}
#shop-page #shop-main-info .right .wrap table tbody th{ white-space: nowrap; padding-right: 15px;}
#shop-page #shop-main-info .right .wrap table tbody th b{ font-weight: 500;}
#shop-page #shop-main-info .right .wrap table tbody td{ padding: 15px;}
/**/
#shop-page #shop-main-info .right .wrap table a.tellink{ pointer-events: none; font-size: 18px;}
#shop-page #shop-main-info .right .wrap table a.maplink{ color: var(--link-color); text-decoration: underline;}
#shop-page #shop-main-info .right .wrap table a.maplink:hover{ text-decoration: none;}
#shop-page #shop-main-info .right .wrap table a.access-link{ padding: 4px; border: solid 1px #777; border-radius: 4px; margin-top: 10px; font-size: 12px;}
#shop-page #shop-main-info .right .wrap table a.access-link:hover{ background: var(--color2);}

@media screen and (max-width: 900px) {
#shop-page #shop-main-info .left{ width: 45%;}
#shop-page #shop-main-info .right { width: 52%;}
}
@media screen and (max-width: 750px) {
#shop-page #shop-main-info{ flex-direction: column; padding: 0px;}
#shop-page #shop-main-info .left{ width: 100%;}
#shop-page #shop-main-info .left .image img{ border-radius: 0;}
#shop-page #shop-main-info .right { width: 100%; padding: 0 3%;}
}
@media screen and (max-width: 600px) {
#shop-page #shop-main-info .right .wrap table tbody th b{ font-size: 13px;}
#shop-page #shop-main-info .right .wrap table tbody td{ padding:14px 10px;}
#shop-page #shop-main-info .right .wrap table tbody td .wrap{ line-height: 1.2em;}
#shop-page #shop-main-info .right .wrap table a.tellink{ pointer-events: all; text-decoration: underline; color: var(--price);}
#shop-page #shop-main-info .right .wrap table .f-mini{ font-size: 12px; padding-bottom: 2px; letter-spacing: 0;}
#shop-page #shop-main-info .right .wrap table a.access-link, 
#shop-page #shop-main-info .right .wrap table a.access-link:hover{ display: flex; align-items: center; height: 30px; padding: 0 10px; background: var(--color1); color: #fff; border: none;}
}



/*-------shop-links--------*/
#shop-links { padding: 30px 20px 50px;}
#shop-links .inner1200{ flex-direction: row; justify-content:center; align-items: stretch;}
#shop-links .inner1200 .item{ width: 33%; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 20px; border-right: solid 1px #ddd;}
#shop-links .inner1200 .item:first-child{ border-left: solid 1px #ddd;}
#shop-links .inner1200 .item h2{font-size: 16px; margin-bottom: 5px;}
#shop-links .inner1200 .item h3{ font-size: 13px; margin-bottom: 10px; padding-bottom: 10px;}
#shop-links .inner1200 .item p{ font-size: 13px;}

#shop-links .inner1200 .item a{ width: 100%; height: 40px; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; margin: 5px 0; border: solid 1px #aaa; border-radius: 4px; padding: 0 10px 0 35px; background: #fff; align-items: center; position: relative;}
#shop-links .inner1200 .item a span{ display: block; line-height: 1.2em;}
#shop-links .inner1200 .item a img{ width: 22px; height: auto; position: absolute; left: 4px; top: 50%; margin-top: -11px;}

#shop-links .inner1200 .item.buy a:hover{ border: solid 1px var(--color1); color: var(--color1); box-shadow: 0 0 0 2px var(--color1);}
#shop-links .inner1200 .item.buy a:hover span{ color: var(--color1);}
#shop-links .inner1200 .item.sell a:hover{ border: solid 1px var(--sell_color); color:var(--sell_color); box-shadow: 0 0 0 2px var(--sell_color);}
#shop-links .inner1200 .item a.acsess-link{ height: 30px;}
#shop-links .inner1200 .item a.acsess-link:hover{ background: var(--color2);}
#shop-links .inner1200 .item .iframe{ width: 100%; height: 150px; display: block; overflow: hidden; margin-bottom: 5px;}
#shop-links .inner1200 .item .iframe iframe{ width: 100%; height: 100%;}
@media screen and (max-width: 900px) {
#shop-links .inner1200 .item{ padding: 20px 10px;}
#shop-links .inner1200 .item p, 
#shop-links .inner1200 .item ul{ width: 100%;}
#shop-links .inner1200 .item a{ width: 100%; height: 44px; margin: 8px 0;}
#shop-links .inner1200 .item a img{}
#shop-links .inner1200 .item a span{ font-size: 12px; letter-spacing: 0;}
}
@media screen and (max-width: 750px) {
#shop-links .inner1200 .item.access-item{ display: none;}
#shop-links .inner1200{ justify-content: space-between;}
#shop-links .inner1200 .item{ width: 49%; border: solid 1px #ccc; border-radius: 10px; background: #fff; box-shadow: 0 4px 10px rgba(0,0,0,.1); padding:15px 10px;}
#shop-links .inner1200 .item h2{ display: flex; align-items: center; justify-content: center; height: 30px; color: #fff; padding: 0 10px; border-radius: 40px;}
#shop-links .inner1200 .item h3{ font-size: 12px; margin-bottom: 0px; padding-bottom: 0px;}
#shop-links .inner1200 .item.buy h2{ background: var(--color1);}
#shop-links .inner1200 .item.sell h2{ background: var(--sell_color);}
}
@media screen and (max-width: 600px) {
#shop-links{ padding: 20px 2%;}
#shop-links .inner1200 .item h2{ width: 100%; font-size: 3.0vw;}
#shop-links .inner1200 .item a{ height: 60px; margin: 8px 0; font-size: 3.4vw; font-weight: bold;}
#shop-links .inner1200 .item.buy a{ flex-direction: column; align-items: flex-start; justify-content: center;}
#shop-links .inner1200 .item a span{ font-size: 11px; color: #777;}
#shop-links .inner1200 .item a span::after{content: "を見る"; font-size: 11px; color: #777;}
}

/*--- 特徴 ---------*/
#shop-main-topic .shop-features{ width: calc(100% - 20px); display: flex; flex-direction: column; align-items: flex-start; margin: 40px 0; padding: 30px; border-radius: 20px; background: #fff; border: solid 1px #555;}
#shop-main-topic .shop-features h3{ display: flex; align-items: center; font-size: 14px; margin-bottom: 5px; background: var(--color1); color: #fff; padding: 6px 20px; border-radius: 4px; font-weight: 400;}
#shop-main-topic .shop-features h3 span{ color: #fff;}
#shop-main-topic .shop-features dl{ width: 100%; display: flex; flex-direction: row; align-items: flex-start; border-bottom: solid 1px #ddd; padding: 10px 0 0;}
#shop-main-topic .shop-features dl:last-child{ border-bottom: none;}
#shop-main-topic .shop-features dl dt{ width: 160px; font-size: 14px; font-weight: 600;}
#shop-main-topic .shop-features dl dd{ width: calc(100% - 160px); display: flex; flex-direction: row; flex-wrap: wrap;}
#shop-main-topic .shop-features dl dd .txt{ width: 32%; display: flex; align-items: center; justify-content: flex-start; padding: 2px 10px 2px 2px; margin: 0 1% 10px 0; border: solid 1px #aaa; font-size: 13px; letter-spacing: 0; border-radius: 60px; line-height: 1.2em;}
#shop-main-topic .shop-features dl dd .txt .ifon{ width: 30px; height: 30px; flex-shrink: 1; display: block; border-radius: 100%; margin:0 2px;}
/**/
#shop-main-topic .shop-features dl dd .txt .ifon.kids{ background: url(../img/icon/100/kids.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.parking{ background: url(../img/icon/100/parking.png) 50% 50%; background-size: cover;}

#shop-main-topic .shop-features dl dd .txt .ifon.ekitika{ background: url(../img/icon/100/ekitika.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.sougei{ background: url(../img/icon/100/sougei.png) 50% 50%; background-size: cover;}

#shop-main-topic .shop-features dl dd .txt .ifon.satei{ background: url(../img/icon/100/satei.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.year10{ background: url(../img/icon/100/10year.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.loan{ background: url(../img/icon/100/loan.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.reform{ background: url(../img/icon/100/reform.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.kaitori{ background: url(../img/icon/100/kaitori.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.inspection{ background: url(../img/icon/100/inspection.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.tax{ background: url(../img/icon/100/tax.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.hoken{ background: url(../img/icon/100/hoken.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.foot{ background: url(../img/icon/100/foot.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.jisseki{ background: url(../img/icon/100/jisseki.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.kuwashii{ background: url(../img/icon/100/kuwashii.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.hikkoshi{ background: url(../img/icon/100/hikkoshi.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.teikei{ background: url(../img/icon/100/teikei.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.after{ background: url(../img/icon/100/after.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.year10{ background: url(../img/icon/100/10year.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.year10{ background: url(../img/icon/100/10year.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.year10{ background: url(../img/icon/100/10year.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.year10{ background: url(../img/icon/100/10year.png) 50% 50%; background-size: cover;}
#shop-main-topic .shop-features dl dd .txt .ifon.year10{ background: url(../img/icon/100/10year.png) 50% 50%; background-size: cover;}
/**/
#shop-main-topic .shop-features .txt-wrap{ width: 100%; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 40px 0 20px;}
#shop-main-topic .shop-features .txt-wrap h4{ font-size: 16px; font-weight: 600;}
#shop-main-topic .shop-features .txt-wrap h5{ font-size: 12px; font-weight: 400; margin: 5px 0 15px;}
#shop-main-topic .shop-features .txt-wrap p{ font-size: 14px; color: #444;}
#shop-main-topic .shop-features .txt-wrap p .shop-form{ display: inline-block; padding: 4px 20px; background: #fff; border: solid 1px #aaa; font-size: 12px; border-radius: 4px; margin-top: 10px;}
#shop-main-topic .shop-features .txt-wrap p .shop-form:hover{ background: var(--color1); color: #fff; border: solid 1px var(--color1);}

/*アクセス*/
#shop-main-topic .shop-features .iframe{ width: 100%; height: 200px; display: block; border: solid 1px #555; margin: 1px; border-radius: 10px;}
#shop-main-topic .shop-features .iframe iframe{ width: 100%; height: 100%; display: block; border-radius: 10px; overflow: hidden;}

@media screen and (max-width:900px) {
#shop-main-topic .shop-features{ width: 96%; margin: 0 2% 50px; padding: 10px 2%;}
#shop-main-topic .shop-features dl{ flex-direction: column; border-bottom: none; padding: 10px 0;}
#shop-main-topic .shop-features dl dt{ width: 100%; font-size: 14px; margin-bottom: 6px;}
#shop-main-topic .shop-features dl dd{ width: 100%;}
#shop-main-topic .shop-features dl dd .txt{ width: 32%; padding: 4px 10px; margin: 0 1% 10px 0; border: solid 1px #777;}
#shop-main-topic .shop-features .txt-wrap{ background: #fff; padding: 30px 0; margin-top: 30px; position: relative; z-index: 10;}
#shop-main-topic .shop-features .txt-wrap::before {width: 80%; height: 30px; content: ""; background: #fff; box-shadow: 0 -6px 14px rgba(0,0,0,1); position: absolute; left: 10%; bottom: calc(100% - 30px); border-radius: 100%; z-index: -10; opacity: 0.15;}
#shop-main-topic .shop-features .txt-wrap::after{ width: 100%; height: 100%; content: ""; background: #fff; position: absolute; left: 0; top: 0; z-index: -1;}
#shop-main-topic .shop-features .txt-wrap h4{ font-size: 16px; font-weight: 600;}
}
@media screen and (max-width:700px) {
#shop-main-topic .shop-features h3{ width: 100%; justify-content: center; border-radius: 20px;}
#shop-main-topic .shop-features dl{ flex-direction: row; position: relative;}
#shop-main-topic .shop-features dl dt{ width: 110px; font-size: 12px; letter-spacing: 0; margin: 10px 0 20px; position: sticky; top: 20px; left: 0;}
#shop-main-topic .shop-features dl dd{ width: auto; flex: 1; flex-direction: column; align-items: flex-start; justify-content: flex-start;}
#shop-main-topic .shop-features dl dd .txt{ width: 100%; padding:5px 0; margin:0; border:none; border-radius: 0; font-weight: 500; border-bottom: solid 1px #ddd; font-size: 14px;}
#shop-main-topic .shop-features dl dd .txt:last-child{ border-bottom: none;}
#shop-main-topic .shop-features dl dd .txt .ifon{ width: 40px; height: 40px; min-width: 40px; margin:0 10px 0 0;}
/**/
#shop-main-topic .shop-features .txt-wrap{ padding: 40px 3% 20px;}
#shop-main-topic .shop-features .txt-wrap p{ font-size: 12px; line-height: 1.4em;}
#shop-main-topic .shop-features .txt-wrap p .shop-form{ width: 80%; height: 40px; display: flex; align-items: center; justify-content: center; margin: 30px 10% 10px; padding: 0; background: var(--color1); border:none; font-size: 12px; border-radius: 6px; color: #fff; font-weight: 500;}
}

/*======================
shop-page
アクセスページ
======================*/
#shop-access-page { padding: 0 2%;}
#shop-access-page .inner1200{ border: solid 1px #555; border-radius: 20px; margin-bottom: 50px; overflow: hidden; background: #fff;}
#shop-access-page .inner1200 .iframe-wrap{ width: 100%; height: 500px; display: block; border-bottom: solid 1px #fff;}
#shop-access-page .inner1200 .iframe-wrap iframe{ width: 100%; height: 100%;}
/**/
#shop-access-page .inner1200 .traffic-wrap{ width: 100%; display: flex; align-items: stretch; justify-content: space-between; padding: 20px;}
#shop-access-page .inner1200 .traffic-wrap .line{ width: 1px; display: block; background: #ccc;}
/**/
#shop-access-page .inner1200 .traffic-wrap .box{ width: 49%; padding: 20px 10px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center;}
#shop-access-page .inner1200 .traffic-wrap .box h2{ display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
#shop-access-page .inner1200 .traffic-wrap .box h2 img{ width: 30px; height: auto;}
#shop-access-page .inner1200 .traffic-wrap .box h2 span{ font-size: 22px;}
#shop-access-page .inner1200 .traffic-wrap .box .point{ display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 50px; margin: 20px 0; padding: 5px 20px; border: solid 1px #aaa; border-radius: 25px; text-align: center;}
#shop-access-page .inner1200 .traffic-wrap .box .point a{ color: var(--color1);}
#shop-access-page .inner1200 .traffic-wrap .box .roots{ display: flex; flex-direction: column;}
#shop-access-page .inner1200 .traffic-wrap .box .roots b{ padding-left: 0.8em;}
#shop-access-page .inner1200 .traffic-wrap .box .roots span{ padding: 4px 4px 4px 1em; position: relative; line-height: 1.2em;}
#shop-access-page .inner1200 .traffic-wrap .box .roots span::before{ content: "・"; margin-left: -1em;}
#shop-access-page .inner1200 .traffic-wrap .box .roots p{ display: block; margin: 4px 0;}
#shop-access-page .inner1200 .traffic-wrap .box .roots p a{ padding: 4px 4px 4px 1em; position: relative; line-height: 1.2em; color: var(--link-color); text-decoration: underline; }
#shop-access-page .inner1200 .traffic-wrap .box .roots p a:hover{ text-decoration: none; color: #111;}
#shop-access-page .inner1200 .traffic-wrap .box .roots p a::before{ content: "・"; margin-left: -1em;}

@media screen and (max-width:1000px) {
#shop-access-page .inner1200 .traffic-wrap{ height: 400px; flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 0;}
#shop-access-page .inner1200 .traffic-wrap .line{ display: none;}
/**/
#shop-access-page .inner1200 .traffic-wrap .box{ width: 100%; padding: 20px 10px; align-items: flex-start;}
#shop-access-page .inner1200 .traffic-wrap .box.car{ border-bottom: solid 1px #aaa;}
#shop-access-page .inner1200 .traffic-wrap .box h2{ flex-direction: row; }
#shop-access-page .inner1200 .traffic-wrap .box h2 span{ font-size: 18px; margin-left: 5px;}
#shop-access-page .inner1200 .traffic-wrap .box .point{ height: auto; border-radius: 0; padding: 0 20px 0 40px; margin: 0 0 10px; border: none; text-align: left;}
#shop-access-page .inner1200 .traffic-wrap .box .point a{ text-decoration: none; padding:4px 10px; border: solid 1px var(--color1); border-radius: 2px; margin-top: 10px; border-radius: 4px;}
#shop-access-page .inner1200 .traffic-wrap .box .roots{ display: flex; flex-direction: column; padding: 10px 20px 10px 40px;}
#shop-access-page .inner1200 .traffic-wrap .box .roots b{ padding-left: 0.8em;}
#shop-access-page .inner1200 .traffic-wrap .box .roots span{ padding: 4px 4px 4px 1em; position: relative; line-height: 1.2em;}
#shop-access-page .inner1200 .traffic-wrap .box .roots span::before{ content: "・"; margin-left: -1em;}
}
@media screen and (max-width:600px) {
#shop-access-page .inner1200 .traffic-wrap{ min-height: 300px; height: auto;}
}


/**/
#nearest-station{ padding: 0 2%; margin: 50px 0;}
#nearest-station .inner1200{ border: solid 1px #555; border-radius: 20px; margin-bottom: 50px; overflow: hidden; background: #fff; padding: 30px 10%;}
#nearest-station .inner1200 .wrap{}
#nearest-station .inner1200 .wrap h3{}
#nearest-station .inner1200 .wrap h4{}
#nearest-station .inner1200 .wrap .item{ width: 100%; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; margin: 20px 0;}
#nearest-station .inner1200 .wrap .item .image{ width: 260px; flex-shrink: 0; display: block; margin-right: 20px;}
#nearest-station .inner1200 .wrap .item p{ font-size: 20px;}