@charset "UTF-8";
/* CSS Document */

body{}

/* メインビジュアル */
#visual{position:relative; width:100%;}
#mv-slide{max-width:1500px; margin:0 auto;}
#mv-slide:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:#000;z-index:-5;}

/*
#mv-slide ul{overflow:hidden;position:relative;width:100%;min-width:980px;max-width:1500px;padding-top:38%;margin:0 auto;}
#mv-slide ul li{position:absolute;top:0;width:100%;}
*/
.slide-image{width:100%;height:auto;}
.slide-image.sp{display:none;}

/* アンカーメニュー */
.area-btn{position:absolute;left:50%;bottom:0;width:100%;max-width:980px;margin:0 0 1% -490px;z-index:4;}
.area-btn:after{content:'';display:block;clear:both;}
.area-btn li{float:left;width:17%;max-width:160px;margin-right:0.36%}
.area-btn li:last-of-type{margin-right:0;}
.area-btn a{display:block;width:100%;transition:opacity 0.3s ease 0s;}
.area-btn a:hover{opacity:0.8;}
.area-btn img{width:100%;height:auto;}
.area-btn img.sp{display:none;}

.area-btn li.subtext{position:absolute;left:50%;bottom:4px;width:100%;max-width:980px;margin:0 0 8% -490px;float:none;}
.area-btn li.subtext img{display:block;width:53.3%;max-width:522px;height:auto;margin:0 auto;}
.area-btn li.subtext img.sp{display:none;}


/* 店舗一覧 */
.container{max-width:980px;margin:80px auto 0;}
.container h2{color:#010101;padding:0 0 0 14px;border-left:solid 4px #010101;margin-bottom:30px;}

#area0{height: 200px;}

.card{width: 100%;background-color:#262626;margin-top:11px;}
.card h3{ padding: 10px 0 10px; color:#FFF;font-size:22px;vertical-align:middle;margin:0;background:url(../../ridinggearproshop/images/bg.jpg) no-repeat;background-size:100% 100%;}
.card h3 a{padding:6px 15px; color: #FFF; outline: none; display: block; border-left:#CA0000 6px solid; transition:border-width 0.3s ease 0s;}
.card h3 a:hover{border-width:32px;}

.card p.image{margin:30px;}

.card-content{margin:30px 0 30px 0;padding:0;}
.card-content .detail li{position:relative;font-size:14px;color:#FFF;margin:0 30px 0 0;padding-bottom:10px;line-height:20px;}
.card-content .detail li.item1{padding-left:3em;}
.card-content .detail li.item2{padding-left:0em;}
.card-content .detail li.item3{padding-left:4em;}
.card-content .detail li.item4{padding-left:5em;}
.card-content .detail li span{position:absolute;left:0;}
.card-content .detail li.item2 span{position:static;}

.card-content p.shoplink{margin:28px 0 0 0;}
.card-content p.shoplink a{display:inline-block;box-shadow:5px 6px 10px -3px #070002;background:#000;}
.card-content p.shoplink a img{display:block;transition:opacity 0.3s ease 0s;}
.card-content p.shoplink a:hover img{opacity:0.8;}

.togle-switch{display:block;padding:30px;position:absolute;top:-2%;right:0px;cursor:pointer;}
.togle{width:40px;border:1px solid #FFF;position:absolute;top:52%;right:16px}
.togle2{border:1px solid #FFF;position:absolute;height:40px;right:36px;bottom:12%;transition:0.3s;}
.card-active .togle2{transform:rotate(-90deg);-wibkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transition:transform 0.3s ease 0s;}

.flex{display:flex;display:-webkit-flex;display:-ms-flexbox;}


#area6{margin-bottom:100px;}

/* ページ下 */
ul.under{width:100%;max-width:980px;margin:100px auto 18px;}
ul.under li{display:inline-block;font-size:12px;line-height:40px;letter-spacing:0.2em;padding-left:46px;}
ul.under li:first-child{background: url(../../shop/images/icon-mybike.png) no-repeat left center;}
ul.under li:last-child{background: url(../../shop/images/icon-form.png) no-repeat left center;}


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

/* メインビジュアル */
#visual{max-height:none;}
#fade-slide ul{padding-top:100%;min-width:0;}
.slide-image.pc{display:none;}
.slide-image.sp{display:block;}

/* アンカーメニュー */
.area-btn{left:auto;width:auto;margin:0 2% 5%;}
.area-btn li{width:32%;max-width:235px;margin-top:1.5%;margin-right:0;}
.area-btn li.area-c{margin:1.5% 2% 0;}
.area-btn a:hover{opacity:1;}
.area-btn img.pc{display:none;}
.area-btn img.sp{display:block;}

.area-btn li.subtext{left:auto;margin:0 0 26.5% 0;}
.area-btn li.subtext img{width:94.9%;max-width:698px;}
.area-btn li.subtext img.pc{display:none;}
.area-btn li.subtext img.sp{display:block;}


/* 店舗一覧 */
.container{width:96%;margin:7.6% auto 0;padding:0 2%;}
.container h2{padding:0 0 0 14px;margin:50px auto 25px;}

.card{margin-top:10px;}
.card h3{font-size:16px;padding:18px 0;text-align:center;}
.card p{font-size:14px;padding:0;}
.card p.image{width:170px;margin:28px auto;padding:0;}

.card-content{width:90%;margin:30px auto;padding-bottom:15px;}
.card-content .detail li{font-size:14px;margin:0 30px 0 0;padding-bottom:10px;line-height:20px;}
.card-content .detail li.item1,
.card-content .detail li.item2,
.card-content .detail li.item3,
.card-content .detail li.item4{padding-left:5em;}
.card-content .detail li.item1 span{left:2em;}
.card-content .detail li.item2 span{position:absolute;left:2em;}
.card-content .detail li.item2 span.inli1,
.card-content .detail li.item2 span.inli2{position:static;display:block;}
.card-content .detail li.item2 span.inli1{padding-bottom:10px;}
.card-content .detail li.item2 span.inli2 span{left:2.1em;}
.card-content .detail li.item3 span{left:1em;}

.card-content p.shoplink{margin:30px auto 0;text-align:center;}
.card-content p.shoplink a{display:inline-block;}
.card-content p.shoplink a img{}
.card-content p.shoplink a:hover img{opacity:1;}

.togle-switch{width:100%;height:100%;padding:0;top:auto;bottom:0;}
.togle{width:30px;top:47%;right:10px}
.togle2{height:30px;right:26px;bottom:28%;}

.flex{display:block;}

#area6{margin-bottom:50px;}

/* ページ下 */
ul.under{display:none;}


}