/* BASIC css start */
.section{ position:relative; overflow:hidden; }
.main-visual-swiper .swiper-pagination { bottom:62px; }
.middle-area { display:flex; gap:60px; margin-top:110px; }
.middle-area .sub-banner { flex:2.5; /*width:500px; flex-shrink: 0;*/ }
.middle-area .sub-banner img { width:100%; display:block; }
.middle-area .lookbook { position:relative; flex:3; }
.middle-area .swiper-button-look { position:absolute; right:0; top:0; display:flex; }
.middle-area .swiper-button-look .xi { width:24px; height:24px; font-size:17px; text-align:center; line-height:24px; cursor:pointer; }
.middle-area .lookbook .section-title { padding:0 0 40px; }
.middle-area .lookbook .item-list > ul > li { width:175px; margin-bottom:0; }
@media (min-width: 1700px){
    .middle-area .sub-banner { flex:2; }
    .middle-area .lookbook { position:relative; flex:3.3; }
    .middle-area .lookbook .item-list > ul > li { width:200px; }
}

.product-athlife { position:relative; }
#athlife-wrap { margin-bottom:185px; }
#athlife-wrap .section-title { padding-top:110px; padding-bottom:36px; }
#athlife-wrap .section-title h4 { margin:0 auto 10px; }
#athlife-wrap .section-title .sub_txt { font-size:14px; line-height:18px; font-weight:400; text-align:center; color:#90949a; }
.product-athlife .athlife-box .insta-id { font-size:10px; line-height:22px; margin-top:8px; color:#666; }
.product-athlife .athlife-box .comment-wrap { position:relative; }
.product-athlife .athlife-box .comment-wrap img { width:100%; vertical-align:middle;}
.product-athlife .athlife-box .comment-wrap .comment-box { position:absolute; z-index:9;}
.product-athlife .athlife-box .comment-wrap .comment-box .xi { display:inline-block; width:40px; height:40px; color:#fff; cursor:pointer; font-size:22px; background:#000; text-align:center; line-height:40px; }
.product-athlife .athlife-box .comment-wrap .comment-box .item { display:none; margin-top:6px; position:absolute; }
.product-athlife .athlife-box .comment-wrap .comment-box .item a {display: flex; justify-content: flex-start; align-items: center; background-color: #fff;  width: 210px; height: 86px;}
.product-athlife .athlife-box .comment-wrap .comment-box .item .thumb { width: 66px; font-size: 0; }
.product-athlife .athlife-box .comment-wrap .comment-box .item .thumb img {  }
.product-athlife .athlife-box .comment-wrap .comment-box .item .desc { flex: 1; padding: 20px 16px; }
.product-athlife .athlife-box .comment-wrap .comment-box .item .desc .name { text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 14px; line-height: 20px; font-weight: 600; }
.product-athlife .athlife-box .comment-wrap .comment-box .item .desc .price { font-size: 14px; line-height: 16px; font-weight: 500; margin-top: 9px; }
.product-athlife .swiper-pagination { position:absolute; bottom:-50px; width:100%; top:auto; text-align:center; }
.product-athlife .swiper-pagination .swiper-pagination-bullet-active { background:#373737; }
.bottom-banner { margin-bottom:188px; }

.bottom-banner .inner-wrap { display:flex; overflow:visible; }
.bottom-banner .inner-wrap .store { width:100%; text-align:center; display:grid; align-items:center; justify-content: center;}
.bottom-banner .inner-wrap .store .section-title { padding:0; }
.bottom-banner .inner-wrap .store .sub_txt { font-size:14px; line-height:18px; margin-top:10px; margin-bottom:40px; }
.bottom-banner .inner-wrap .store a { font-size:14px; line-height:18px; text-decoration:underline; }
.bottom-banner .inner-wrap .about-swiper { width:700px; padding:0 55px; position:relative; }
.bottom-banner .inner-wrap .about-swiper .swiper-container { overflow:hidden; }
.bottom-banner .inner-wrap .about-swiper img { width:100%; }
.bottom-banner .inner-wrap .about-swiper .swiper-button-about { position:absolute; bottom:-37px; left:55px; top:auto; width:calc(100% - 110px); border-radius:3px; overflow:hidden; }
.bottom-banner .inner-wrap .about-swiper .about-prev { position:absolute; top:198px; font-size:17px; cursor:pointer; width:24px; height:24px; line-height:24px; text-align:center; left:18px; }
.bottom-banner .inner-wrap .about-swiper .about-next {  position:absolute; top:198px; font-size:17px; cursor:pointer; width:24px; height:24px; line-height:24px; text-align:center; right:18px; }
.bottom-banner .inner-wrap .about-swiper .swiper-slide { cursor:pointer; }
/*¸ÞÀÎºñÁÖ¾ó*/
.main-visual .inner-wrap-full .main-visual-swiper{ position:relative; }
.main-visual .inner-wrap-full .main-visual-swiper ul{ font-size:0px;}
.main-visual .inner-wrap-full .main-visual-swiper ul li{ position:relative; }
.main-visual .inner-wrap-full .main-visual-swiper ul li .item{ position:relative; font-size:0px; }
.main-visual .inner-wrap-full .main-visual-swiper ul li .item img { width:100%; }
.main-visual .inner-wrap-full .main-visual-swiper ul li .item a .txt{ position:absolute; bottom:136px; left:120px; text-align:left; }
.main-visual .inner-wrap-full .main-visual-swiper ul li .item a .txt h4{ line-height:60px; color:#fff; font-size:50px; padding-bottom:19px; }
.main-visual .inner-wrap-full .main-visual-swiper ul li .item a .txt p{ line-height:35px; color:#fff; font-size:18px; }
.main-visual .inner-wrap-full .main-visual-swiper ul li .item a{ display:block; text-align:center; }
.main-visual .inner-wrap-full .main-visual-swiper ul li.two .item{
    display:inline-block;
    width:50%;
    background:#e5e5e5;
    vertical-align:top;
}
.main-visual .inner-wrap-full .main-visual-swiper ul li .item .video-container {
    position:absolute;
    top:120px;
    left:34%;
    z-index:1000;
    width:800px;
    background:black;
}
.main-visual .inner-wrap-full .main-visual-swiper ul li .item .video-container .video {
    padding-bottom:56.25%;
}
.main-visual .inner-wrap-full .main-visual-swiper ul li .item .video-container .video video {
    position:absolute;
    top:0px;
    left:0px;
    bottom:0px;
    right:0px;
    z-index:1001;
}


/*¸ÞÀÎºñÁÖ¾ó swiper ÄÁÆ®·Ñ*/
.main-visual-swiper .arrows {
    position:absolute;
    bottom:0;
    right:120px;
    font-size:0px;
}
.main-visual-swiper .arrows .next,.main-visual-swiper .arrows .prev {
    position: relative !important;
    top: auto !important;
    left:auto !important;
    right:auto !important;
    width:50px !important;
    height:50px !important;
    margin-top:0 !important;
    z-index: 10;
    cursor: pointer;
    display: inline-block !important;
    align-items: center;
    justify-content: center;
    color: transparent !important;
    background:#fff;
}
.main-visual-swiper .arrows .prev {
    background:url('/design/huit8/img/2020/pc/swiper_prev_icon.jpg') no-repeat center center;
}
.main-visual-swiper .arrows .next {
    background:url('/design/huit8/img/2020/pc/swiper_next_icon.jpg') no-repeat center center;
    margin-left:1px;
}
.main-visual-swiper .arrows .next:before {
    position:absolute;
    top:0px;
    bottom:0px;
    left:-1px;
    width:1px;
    background:white;
    content:"";
}
.main-visual-swiper .arrows .next:after {
    position:absolute;
    bottom:14px;
    left:-1px;
    width:1px;
    height:20px;
    background:#e6e6e6;
    content:"";
} 
.swiper-button-prev:after {
    display:none !important;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    opacity: 1 !important;
    cursor: auto;
    pointer-events: none;
}
/*¸ÞÀÎºñÁÖ¾ó swiper ÆäÀÌÁö³×ÀÌ¼Ç*/

.main-visual-swiper .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 0 !important;
    background: transparent !important;
    border:1px solid #fff;
    opacity: 1 !important;

}
.main-visual-swiper .swiper-pagination-bullet-active {
    opacity: 1;
    background: #fff !important;
}
.main-visual-swiper.swiper-container-horizontal >.swiper-pagination-bullets .swiper-pagination-bullet {
    margin:0px 6.5px !important;
}
.main-visual-swiper.swiper-container-horizontal >.swiper-pagination-bullets, 
.main-visual-swiper .swiper-pagination-custom, 
.main-visual-swiper .swiper-pagination-fraction {
    bottom: 31px !important;
    left: 0;
    width: 100%;
}

/*º£½ºÆ® »óÇ° ¼½¼Ç*/
.best-product {
    position:relative;
}
.section-title {
    position:relative;
    padding-top:90px;
    padding-bottom:46px;
}
.section-title.top20 {
    padding-top:20px;
}
.section-title h4 {
    color:#111;
    font-size:24px;
    line-height:32px;
    font-weight:500;
}
.section-title .more-btn {
    position:absolute;
    bottom:70px;
    right:0px;
}
.best-product .section-title .section-title-tabs{
    text-align:center;
    margin-top:19px;
}
.best-product .section-title .section-title-tabs ul{
    font-size:0px;
}
.best-product .section-title .section-title-tabs ul li{
    display:inline-block;
    padding:0 24px;
    vertical-align:middle;
}
.best-product .section-title .section-title-tabs ul li a{
    line-height:22px;
    display:inline-block;
    color:#666;
    font-size:16px;
}
.best-product .section-title .section-title-tabs ul li a.active{
    font-weight:600;
    color:#212121;
    border-bottom:1px solid #333;
}
.best-product .item-list-con{
    display:none;
    position:relative;
}
.best-product .item-list-con .swiper-scrollbar-best { position:absolute; bottom:0; left:0; top:auto;  border-radius:3px; overflow: hidden;}
.best-product .item-list-con.active{
    display:block;
}
.swiper-pagination-progressbar { background:#e5e5e5; border-radius:3px; height:4px; }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background:#999; border-radius:10px; }
.icons {padding-top:10px;}
.icons img {padding-right:10px;}
.lookbook-box .item-list > ul > li .item-color {margin-left:2px;}
/* BASIC css end */

