@charset 'UTF-8';

.sec-01 .shop-area .shop-body{ zoom: 1; }

.sec-01 .shop-area .shop-body:before ,.sec-01 .shop-area .shop-body:after{content: '';  display: table; }

.sec-01 .shop-area .shop-body:after{ clear: both; }

/* slick slide
---------------------------------------- */
.slide-area{ width: 960px; margin: 0 auto; }

button{ margin: 0; padding: 0; background: none; outline: none; border: none; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.slide-dots{ text-align: center; }

.slide-dots li{ display: inline-block; margin: 0 15px; }

.slide-dots li button{position: relative; text-indent: -9999px;  cursor: pointer; }

.slide-dots li button:before{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 15px; height: 15px; background: transparent; border: #231815 1px solid; border-radius: 50%; }

.slide-dots li.slick-active button:before{ background: #003d8a; }

@media screen and (max-width: 640px){ .slide-area{ width: 93.75vw; margin: 3.125vw; }
.slide-dots{ margin-top: 1.5625vw; }
.slide-dots li{ margin: 0 3.125vw; }
.slide-dots li button:before{ width: 3.75vw; height: 3.75vw; } }

/* sec-01
---------------------------------------- */
.sec-01{ width: 960px; margin: 80px auto 0 auto; }

.sec-01 .shop-area{ margin-top: 30px; }

.sec-01 .shop-area:nth-child(1){ margin-top: 0; }

.sec-01 .shop-area .shop-head{ padding: .3em .8em; color: #fff; font-weight: bold; font-size: 24px; background: #c00814; background: -webkit-gradient(linear, left top, right top, from(#c00814), to(#e94527)); background: linear-gradient(to right, #c00814 0%, #e94527 100%); border-radius: 10px 10px 0 0; }

.sec-01 .shop-area .shop-body{ padding: 8px 12px; background: #231815; border-radius: 0 0 10px 10px; }

.sec-01 .shop-area .pho{overflow: hidden; position: relative;  float: left; width: 330px; height: 250px; }

.sec-01 .shop-area .pho> img{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.sec-01 .shop-area .detail-area{ float: right; width: 600px; height: 250px; }

.sec-01 .shop-area .detail-area th ,.sec-01 .shop-area .detail-area td{min-height: 70px;  padding: 0 5px; font-size: 16px; font-size: 1.6rem; vertical-align: middle; text-align: center; border: #231815 1px solid; }

.sec-01 .shop-area .detail-area th{ width: 80px; background: #dcdddd; }

.sec-01 .shop-area .detail-area th.paddingL{ padding: 1.5em 0; }

.sec-01 .shop-area .detail-area th.paddingS{ padding: 1em 0; }

.sec-01 .shop-area .detail-area td{ width: 214px; font-size: 14px; font-size: 1.4rem; background: #fff; }

.sec-01 .shop-area .detail-area td.w260{ width: 260px; }

.sec-01 .shop-area .detail-area td .strong{font-weight: bold;  font-size: 24px; font-size: 2.4rem; }

.sec-01 .shop-area .detail-area td .small{ font-size: 12px; font-size: 1.2rem; }

.sec-01 .shop-area .detail-area td .red{ color: #e60012; }

.sec-01 .shop-area .detail-area td .price{display: block;  position: relative; font-weight: bold; }

.sec-01 .shop-area .detail-area td .price:after{ content: ''; position: absolute; top: 50%; left: 50%; width: 70%; height: 2px; background: #e60012; -webkit-transform: translate(-50%, -50%) rotate(-5deg); transform: translate(-50%, -50%) rotate(-5deg); }

.sec-01 .shop-area .detail-area td .discount{display: block;  position: relative; color: #e60012; }

.sec-01 .shop-area .detail-area td .discount:before{ content: ''; position: absolute; top: -.1em; left: 50%; width: 28px; height: 6px; border-top: #e60012 6px solid; border-right: transparent 14px solid; border-left: transparent 14px solid; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

.sec-01 .shop-area .detail-area td .note{ padding: .1em 1em; color: #fff; font-size: 12px; font-size: 1.2rem; background: #e60012; }

.sec-01 .shop-area .equipment{ width: 100%; }

.sec-01 .shop-area .icon-list{ float: left; width: 600px; }

.sec-01 .shop-area .icon-item{display: table;  float: left; width: 144px; height: 50px; margin: 10px 8px 0 0; background: #1d2088; background: -webkit-gradient(linear, left top, right top, from(#1d2088), to(#005bac)); background: linear-gradient(to right, #1d2088 0%, #005bac 100%); border-radius: 6px; }

.sec-01 .shop-area .icon-item:nth-child(4) ,.sec-01 .shop-area .icon-item:nth-child(8){ margin-right: 0; }

.sec-01 .shop-area .icon-item> span{ display: table-cell; width: 100%; padding-left: 70px; color: #fff; letter-spacing: -.05em; font-size: 12px; font-size: 1.2rem; line-height: 1.214285714; vertical-align: middle; }

.sec-01 .shop-area .icon01> span{ background: url('../images/top/icn_shops-01.png') left center no-repeat; }

.sec-01 .shop-area .icon02> span{ background: url('../images/top/icn_shops-02.png') left center no-repeat; }

.sec-01 .shop-area .icon03> span{ background: url('../images/top/icn_shops-03.png') left center no-repeat; }

.sec-01 .shop-area .icon04> span{ background: url('../images/top/icn_shops-04.png') left center no-repeat; }

.sec-01 .shop-area .icon05> span{ background: url('../images/top/icn_shops-05.png') left center no-repeat; }

.sec-01 .shop-area .icon06> span{ background: url('../images/top/icn_shops-06.png') left center no-repeat; }

.sec-01 .shop-area .icon07> span{ background: url('../images/top/icn_shops-07.png') left center no-repeat; }

.sec-01 .shop-area .icon08> span{ background: url('../images/top/icn_shops-08.png') left center no-repeat; }

.sec-01 .shop-area .icon-item.off{ background: #595757; }

.sec-01 .shop-area .icon-item.off> span{ opacity: .6; }

.sec-01 .shop-area .btn-red{display: block;  float: left; width: 325px; height: 108px; margin: 12px 0 0 10px; background: #c00814; background: -webkit-gradient(linear, left top, right top, from(#c00814), to(#e94527)); background: linear-gradient(to right, #c00814 0%, #e94527 100%); }

.sec-01 .shop-area .btn-red> span{ display: inline-block; width: 11.5em; padding-right: 1em; color: #fff; font-size: 22px; font-size: 2.2rem; text-align: center; }

@media screen and (max-width: 640px){ .sec-01{ width: 93.75vw; margin: 12.5vw 3.125vw 0 3.125vw; }
.sec-01 .shop-area .shop-head{ padding: .5em; font-size: 4.375vw; }
.sec-01 .shop-area .shop-body{ padding: 1.5625vw; }
.sec-01 .shop-area .pho{overflow: auto; position: relative;  float: none; width: 100%; height: auto; }
.sec-01 .shop-area .pho> img{ position: relative; top: auto; left: auto; -webkit-transform: translate(0, 0); transform: translate(0, 0); }
.sec-01 .shop-area .detail-area{ float: none; width: 100%; height: auto; }
.sec-01 .shop-area .detail-area th ,.sec-01 .shop-area .detail-area td{ display: block; min-height: auto; padding: .5em; font-size: 4.0625vw; }
.sec-01 .shop-area .detail-area th{ width: 100%; }
.sec-01 .shop-area .detail-area th.paddingL{ padding: 1em; }
.sec-01 .shop-area .detail-area th.paddingS{ padding: 1em; }
.sec-01 .shop-area .detail-area td:first-of-type{ width: 100%; }
.sec-01 .shop-area .detail-area td{ width: 100%; }
.sec-01 .shop-area .detail-area td.w260{ width: 100%; }
.sec-01 .shop-area .detail-area td .strong{ font-size: 4.6875vw; }
.sec-01 .shop-area .detail-area td .small{ font-size: 3.4375vw; }
.sec-01 .shop-area .detail-area td .price{display: block;  position: relative; font-weight: bold; }
.sec-01 .shop-area .detail-area td .price:after{ width: 50%; }
.sec-01 .shop-area .detail-area td .discount{ margin-top: 1em; }
.sec-01 .shop-area .detail-area td .discount:before{ content: ''; position: absolute; top: -.5em; width: 6.25vw; height: .78125vw; border-top: #e60012 3.125vw solid; border-right: transparent 6.25vw solid; border-left: transparent 6.25vw solid; }
.sec-01 .shop-area .detail-area td .note{ font-size: 3.125vw; }
.sec-01 .shop-area .icon-list{ float: none; width: 100%; }
.sec-01 .shop-area .icon-item{display: table;  float: left; width: 44.53125vw; margin: 1.5625vw 1.5625vw 0 0; }
.sec-01 .shop-area .icon-item:nth-child(even){ margin-right: 0; }
.sec-01 .shop-area .icon-item> span{ padding-left: 21.875vw; font-size: 3.4375vw; }
.sec-01 .shop-area .icon01> span{ background: url('../images/top/icn_shops-01.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .icon02> span{ background: url('../images/top/icn_shops-02.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .icon03> span{ background: url('../images/top/icn_shops-03.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .icon04> span{ background: url('../images/top/icn_shops-04.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .icon05> span{ background: url('../images/top/icn_shops-05.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .icon06> span{ background: url('../images/top/icn_shops-06.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .icon07> span{ background: url('../images/top/icn_shops-07.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .icon08> span{ background: url('../images/top/icn_shops-08.png') left center no-repeat; background-size: auto 100%; }
.sec-01 .shop-area .btn-red{display: block;  float: left; width: 100%; height: 21.875vw; margin: 1.5625vw 0 0 0; }
.sec-01 .shop-area .btn-red> span{ font-size: 4.6875vw; } }

/* sec-02
---------------------------------------- */
.sec-02{ margin-top: 75px; }

.sec-02> .sec-title{ text-align: center; }

.sec-02> .bg-area{ margin-top: 5px; padding-bottom: 10px; background: url('../images/cmn/bg_stripe.png'); }

@media screen and (max-width: 640px){ .sec-02{ margin-top: 9.375vw; }
.sec-02> .sec-title{ padding: 0 3.125vw; }
.sec-02> .bg-area{ margin-top: 1.5625vw; padding: 0 3.125vw 3.125vw 3.125vw; } }

/* sec-03
---------------------------------------- */
.sec-03{ margin-top: 75px; }

.sec-03> .sec-title{ text-align: center; }

.sec-03> .bg-area{ margin-top: 5px; padding-bottom: 10px; background: url('../images/cmn/bg_stripe.png'); }

.sec-03 .inner{ position: relative; width: 960px; height: 390px; }

.sec-03 .inner> img{ position: absolute; top: 0; left: 0; }

.sec-03 .inner> .btn-brown{ width: 390px; height: 35px; margin: 325px 0 0 285px; background: #231815; z-index: 10; }

.sec-03 .inner> .btn-brown> span{ width: 15.5em; font-size: 16px; font-size: 1.6rem; }

@media screen and (max-width: 640px){ .sec-03{ margin-top: 9.375vw; }
.sec-03> .sec-title{ padding: 0 3.125vw; }
.sec-03> .bg-area{ margin-top: 1.5625vw; padding: 0 3.125vw 21.875vw 3.125vw; }
.sec-03 .inner{ width: 93.75vw; height: 101.5625vw; }
.sec-03 .inner> .btn-brown{ width: 93.75vw; height: 15.625vw; margin: 101.5625vw 0 0 0; background: #231815; z-index: 10; }
.sec-03 .inner> .btn-brown> span{ width: 15.5em; font-size: 4.6875vw; } }

/* sec-04
---------------------------------------- */
.sec-04{ width: 100%; height: 260px; margin-top: 75px; background: url('../images/top/bg_sec04.jpg') center center no-repeat; }

.sec-04> .inner{ height: 260px; }

.sec-04> .inner> .btn-search{ position: absolute; top: 50%; left: 50%; width: 780px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media screen and (max-width: 640px){ .sec-04{ width: 100%; height: 46.875vw; margin-top: 9.375vw; background: url('../images/top/bg_sec04.jpg') center center no-repeat; background-size: cover; }
.sec-04> .inner{ height: 46.875vw; }
.sec-04> .inner> .btn-search{ width: 93.75vw; } }
