



.maw100p{ max-width: 100%; }
.title_l{font-size: var(--fz-xl);line-height: 1.3;font-weight: var(--fw-b);color: #000;}
.title1{font-size: var(--fz-l);line-height: 1.4;font-weight: var(--fw-b);color: #000;}

.layout-col-73{ display: flex;  }
.layout-col-73 > *{ min-width: 30%;  }
.layout-col-73 .fg{  flex-grow: 1; margin-right: 30px;  }
.layout-col-82{ display: flex;  }
.layout-col-82 > *{ min-width: 20%;  }
.layout-col-82 .fg{ flex-grow: 1; margin-right: 30px;  }


.txt-layout-type1{}
.txt-layout-type1 .area{display: flex;margin-top: 40px;}
.txt-layout-type1 .area .title_layout{min-width: 100px;margin-right: 30px;width: 90px;font-size: 15px;font-weight: var(--fw-b);}
.txt-layout-type1 .area .cont_layout{ flex-grow: 1; line-height: 1.5; }
.txt-layout-type1 .area .cont_layout p{ margin-top:25px; }
.txt-layout-type1 .area .cont_layout p:first-child{ margin-top:0;}
.txt-layout-type1 .area .cont_layout .lay2{display:flex;justify-content: space-between; margin-top: 25px;}
.txt-layout-type1 .area .cont_layout .lay2 > *{ width:45%; }
.txt-layout-type1 .area .cont_layout .lay2 img{ max-width:100%; }

.head-type1{
    margin-bottom: 40px;
}
.head-type1 .title{font-size: var(--fz-xl);font-weight: var(--fw-b);color: #000;}
.head-type1 .txt1{font-size: 17px;color: #000;font-weight: 300;margin-top: 10px;}

.area-video{position: relative;width: 100%;height: 0;padding-bottom: 56.3%; overflow: hidden;}
.area-video:after{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: transparent;  z-index: 1; content:""; }
.area-video > *{ position:absolute; left:0; top:0; width:100%; height:100%; }
.area-video.lineCut > *{position:absolute;left: -14%;top: -17%;width: 134%;height: 134%;}
.area-video.sz2{ display: inline-flex; max-width: 1000px;  }
.area-video.no_cover:after{ display: none; }
.ico-video{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%ffc72c'%3E%3Cpath d='M320-200v-560l440 280-440 280Zm80-280Zm0 134 210-134-210-134v268Z'/%3E%3C/svg%3E");
  background-size: cover;
}


.wrap-detail > .inner-detail{
    display: flex;
    min-height: 1px;
    position: relative;
}
.wrap-detail .detail_lft{
    flex-grow: 1;
    position: -webkit-sticky;
    position: sticky;
    top: 90px;
    max-height: 932px;
}

.wrap-detail .detail_rgh{min-width: 540px;margin-left: 90px;max-width: 540px;}

@media screen and (max-width: 1400px){
    .wrap-detail > .inner-detail{display: flex;min-height: 1px;position: relative;flex-direction: column;}
    .wrap-detail .detail_rgh{min-width: auto;margin-left: 0;max-width: 100%;margin-top: 60px;}
}

.wrap-detail-thumb{
    width: 100%;
    position: relative;
    height: 0;
    padding-bottom: 84%;
    overflow: hidden;
}
.wrap-detail-thumb .swiper-container{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.wrap-detail-thumb .swiper-wrapper{}
.wrap-detail-thumb .item{ background-color:#f2f6fa; position:relative;  }
.wrap-detail-thumb .item .ico_360{position:absolute;left: 20px;top: 20px;width: 80px;height: 80px;border-radius: 4px;background: #fff;opacity: 0;}
.wrap-detail-thumb .item .ico{position:absolute;left: 5%;top: 5%;width: 90%;height: 90%;background-repeat:no-repeat;background-position: 50% 50%;background-size: contain;}
.wrap-detail-thumb .item .img{position:absolute;left: 0%;top: 0%;width: 100%;height: 100%;background-repeat:no-repeat;background-position: 50% 50%;background-size: cover;}
.wrap-detail-thumb .item .img .btn-video{ background:#000; }
.wrap-detail-thumb .item .img .btn-video iframe{ position:absolute; width:100%; height:100%; }
.wrap-detail-thumb .swiper-prev.type4,
.wrap-detail-thumb .swiper-next.type4{top:auto;bottom:20px;box-shadow: none;-webkit-box-shadow: none; -moz-box-shadow: none;}
.wrap-detail-thumb .swiper-prev.type4{ left:20px; }
.wrap-detail-thumb .swiper-next.type4{ right:20px; }

@media screen and (max-width: 1820px){
    .wrap-detail .detail_lft{
        height: 50vw;
        max-height: none;
        min-height: auto;
    }   
   .wrap-detail-thumb{
    width: 100%;
    position: relative;
    height: 100%;
    padding-bottom: 0;
    }
}

@media screen and (max-width: 1400px){
   .wrap-detail .detail_lft{
        height: auto;
        max-height: none;
        min-height: auto;
        width: 100%;
        top: 0;
        position: relative;
        min-width: 100%;
   }   
   .wrap-detail-thumb{
    width: 100%;
    position: relative;
    height: 0;
    padding-bottom: 68%;
   }
}

.wrap-detail-info{}
.head-detail-info h1{
    font-size: 44px;
    line-height: 1.1;
    font-weight: var(--fw-b);
}
.head-detail-info h2{}
.head-detail-info .box-summary{
    margin-top: 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.head-detail-info .box-summary .price{
    font-size: var(--fz-xl);
    line-height: 1;
    font-weight: var(--fw-b);
}
.head-detail-info .box-summary .btn{}

.btn-type2{
    background: #000;
    color: #fff;
    font-size: 12px;
    line-height: 1;
    padding: 14px 25px;
    border-radius: 4px;
    display:inline-flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    font-weight: var(--fw-b);
    box-sizing:border-box;
}
.btn-type2.w2{ min-width: 68px; }
.btn-type2.pv2{ padding: 14px 35px; }
.btn-type2 i{ margin-top:-1px; }
.btn-type2 i + span{ margin-left:7px;}
.btn-type2.yellow{ background:#ffc72c; color:#000; }
.btn-type2.white{ background:#fff; color:#000; }

.btn-type2.rv{ background-color: #fff; border: 1px solid #000; color: #000; }
.bg-mode.black .btn-type2{ background-color: #fff; color: #000; }
.btn-type2.small{ font-size: 10px; padding: 11px 14px; }
.btn-type2.small i{ width:13px; height:13px;  }

@media (hover: hover) {
    .btn-type2:hover{color: #ffc72c;}
    .btn-type2.yellow:hover{background:#000; color:#ffc72c; }
    .btn-type2.white:hover{ background:#ffc72c; color:#000; }
    .bg-mode.black .btn-type2:hover{background-color: #ffc72c; color: #000; }
    .btn-type2.rv:hover{ background-color: #000; border: 1px solid #000; color: #ffc72c; }
}


.btn-txt1{
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    color: #000;
    font-weight: var(--fw-sb);
    line-height: 1;
}
.btn-txt1 .t{}
.btn-txt1 .t + i{
    margin-left: 9px;
    font-size: 16px;
}
.btn-txt1:hover{color: #f99200;}





.detail-step1{margin-top: 50px;}
.detail-step1 h2{font-size: 14px;line-height: 1.2;color: #000;font-weight: var(--fw-b);}
.detail-step1 .cont{margin-top: 13px;display: flex;align-items: center;justify-content: space-between;}
.detail-step1 .cont .price{font-size: var(--fz-xl);font-weight: var(--fw-b);color: #000;}
.detail-step1 .cont .btn{  }

.wrap-sizeBanner{border:1px #d7e3e8 solid;border-radius:3px;}
.wrap-sizeBanner > a{
    display: flex;
    padding: 0 20px;
    min-height: 100px;
    position: relative;
}
.wrap-sizeBanner .img{
    min-width: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50% 100%;
    margin-top: 12px;
}
.wrap-sizeBanner .t{margin-left: 38px;display: flex;align-items: flex-start;font-size: 16px;line-height: 1.5;color: #000;font-weight: 300;flex-direction: column;justify-content: center;}
.wrap-sizeBanner .circle{
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 24px;
    height: 24px;
    background: #000;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
}

@media (hover: hover) {
    .wrap-sizeBanner:hover{ border-color:#000; }
}


.wrap-color-select{}

.wrap-color-select h2{margin-top: 6px;overflow: hidden;font-size:14px;}
.wrap-color-select h2 .inr{ margin-left: -28px; display: flex; flex-wrap: wrap; }
.wrap-color-select h2 .inr span{ position: relative; margin-left: 14px; padding-left: 14px; }
.wrap-color-select h2 span:after{ position:absolute; left:0; top:calc(50% - 7px); width:1px; height:14px; background:#aaa; content:""; }

.btn_prd_select{
    position: relative;
    overflow: hidden;
}
.btn_prd_select .inner_select{
    display: flex;
    margin-left: -11px;
    margin-top: -11px;
}
.btn_prd_select .item{
    margin-top: 11px;
    margin-left: 11px;
    width: 130px;
    height: 130px;
    border: 1px #d7e3e8 solid;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.btn_prd_select .item:hover,
.btn_prd_select .item.on{ border-color: #000; }
.btn_prd_select .item .img{
    width: 60%;
    height: 60%;
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}


.detail-pagenate{position: absolute;left: 30px;top: 30px;z-index: 2;display: flex;flex-direction: column;}
.detail-pagenate > div{width: 80px;height: 80px;border-radius: 5px;background-color: #fff;display: flex;margin-bottom: 10px;overflow: hidden;position: relative; cursor:pointer;}
.detail-pagenate > div .ico{position:absolute;left: 20%;top: 20%;width: 60%;height: 60%;background-repeat:no-repeat;background-position: 50% 50%;background-size: contain;}
.detail-pagenate > div .img{position:absolute;left: 0%;top: 0%;width: 100%;height: 100%;background-repeat:no-repeat;background-position: 50% 50%;background-size: cover;}
.detail-pagenate > div .btn-video .btn{width: 30px;height: 30px;}


.box-prd-normal{
    position: relative;
}
.box-prd-normal .thumb{
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56%;
    border-radius: 5px;
    overflow: hidden;
}
.box-prd-normal .thumb .bg{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
}
.box-prd-normal .cont{
    margin-top: 31px;
}
.box-prd-normal .cont .t1{
    text-align: center;
    font-size: 17px;
    color: #000;
    font-weight: 600;
}
.box-prd-normal .cont .logo{
    text-align: center;
    margin-top: 25px;
}
.box-prd-normal .cont .logo img{ max-width:80%; max-height:40px }

.box-prd-thumb{
    position: relative;
}
.box-prd-thumb .thumb{
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    background: #f5f8fa;
    display: flex;
    justify-content: center;
    align-items: center;
}
.box-prd-thumb a.thumb:hover{background-color: #eaeaea;}
.box-prd-thumb .thumb .bg{
    position: absolute;
    left: calc(50% - 26%);
    top: calc(50% - 26%);
    width: 52%;
    height: 52%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: contain;
}
.box-prd-thumb .cont{
    margin-top: 36px;
    text-align: center;
    color: #000;
}
.box-prd-thumb .cont .t1{font-size: var(--fz-nl);font-weight: var(--fw-b);}
.box-prd-thumb .cont .t2{margin-top: 5px;font-size: var(--fz-s);font-weight: var(--fw-b);}

.bg-mode.black .box-prd-thumb .cont{ color: #fff; }

.btn-video{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.1);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}
.btn-video .btn{
    width: 70px;
    height: 70px;
    background-color: rgba(0,0,0,0.6);
    border-radius: 50%;
    display:flex;
    justify-content: center;
    align-items: center;
}
.btn-video.lg .btn{
    width: 110px;
    height: 110px;
}

.btn-video .btn:after{
    width: 80%;
    height: 80%;
    content:"";
    background-repeat:no-repeat;
    background-size: 100%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23ffc72c'%3E%3Cpath d='M320-200v-560l440 280-440 280Zm80-280Zm0 134 210-134-210-134v268Z'/%3E%3C/svg%3E");
}

.btn-video:hover .btn{
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    background-color: rgba(0,0,0,0.4);
}


.sliderGroup{ position: relative;  }

.swiper-prev.type4,
.swiper-next.type4{cursor:pointer;position: absolute;width: 50px;height: 50px;border-radius: 50%;background-color: #fff;border: 1px solid #ececec;top: calc(50% - 76px);left: auto;right: auto;box-shadow: 4px 5px 12px 1px rgb(14 14 14 / 19%);-webkit-box-shadow: 4px 5px 12px 1px rgb(14 14 14 / 19%);-moz-box-shadow: 4px 5px 12px 1px rgb(14 14 14 / 19%);display: flex;align-items: center;justify-content: center;z-index: 5;}
.swiper-prev.type4:hover,
.swiper-next.type4:hover{
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}
.swiper-prev.type4{left: -28px;}
.swiper-next.type4{right: -28px;}
.swiper-prev.type4:before,
.swiper-next.type4:before{
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color:#000;
  content:"\ea07";
  font-size:20px;
}
.swiper-next.type4:before{  content:"\ea09"; }
.swiper-prev.type4:after,
.swiper-next.type4:after{ display: none; }
.swiper-prev.type4.swiper-button-disabled,
.swiper-next.type4.swiper-button-disabled{opacity:0;cursor: default;}
.swiper-prev.type4.swiper-button-lock,
.swiper-next.type4.swiper-button-lock{ display: none; }


.wrap-models{
    display: flex;
    justify-content: center;
    color: #000;
    position: relative;
    /* overflow: hidden; */
}
.wrap-models .area-models{
    width: 31.84%;
    margin-left: 2.3%;
}
.wrap-models #cp-1.area-models{
    width: 31.84%;
    margin-left: 0;
}
.wrap-models .thumb{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px;
    height: 410px;
}
.wrap-models .thumb img{
    max-width: 80%;
    max-height: 360px;
}
.wrap-models .name{
    text-align: center;
}
.wrap-models .name .h_1{
    font-size: 19px;
    font-weight: var(--fw-sb);
    min-height: 54px;
}
.wrap-models .name .t_1{
    font-size: 17px;
    text-transform: uppercase;
    margin-top: 5px;
}
.wrap-models .name .arr{
    margin-top: 14px;
    position: relative;
}
.wrap-models .name .arr .select-type2{position:absolute;left: calc(50% - 125px);top: 40px; display:none;}
.wrap-models .name .arr.active .select-type2{ display:block;}

.wrap-models .name .arr > a{
    font-size: 26px;
    width: 100px;
    display: inline-block;
    height: 30px;
}
.wrap-models .name .arr > a > i{
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: all 300ms ease-in;
    -moz-transition: all 300ms ease-in;
    -ms-transition: all 300ms ease-in;
    -o-transition: all 300ms ease-in;
    transition: all 300ms ease-in;
    display: inline-flex;
}
.wrap-models .name .arr.active > a > i{
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.wrap-models .info{
    margin-top: 17px;
}
@media screen and (max-width: 1280px){
    .wrap-models #cp-1.area-models,
    .wrap-models #cp-2.area-models{
        width: 48%;
    }
    .wrap-models .area-models#cp-3{
        display:none;
    }
}



.lst-type1{ color:#000;}
.lst-type1 li{border-bottom: 1px #e0e8ed solid;padding: 15px 0;}
.lst-type1 li:last-child{ border-bottom: 0; }
.lst-type1 li .h_1{
    font-size: 11px;
    text-transform: uppercase;
    font-weight: var(--fw-m);
}
.lst-type1 li .t_1{
    margin-top: 6px;
    font-size: var(--fz-n);
    font-weight: var(--fw-b);
} 

.wrap-help-type1{ display: inline-flex; position: relative; }
.wrap-help-type1 .ico{}
.wrap-help-type1 .box_help{}
.wrap-help-type1 .box_help:after{}
.wrap-help-type1 .box_help{position: absolute;left: 0px;top: 34px;color: #000;background: #fff;border: 1px #000 solid;border-radius: 5px;padding: 10px 15px;width: 280px;font-size: 13px;font-weight: 600;box-shadow: 2px 2px 7px 0px rgba(0, 0, 0, 0.1);-webkit-box-shadow: 2px 2px 7px 0px rgba(0, 0, 0, 0.1);-moz-box-shadow: 2px 2px 7px 0px rgba(0, 0, 0, 0.1);opacity: 0;pointer-events: none;user-select: none;}
.wrap-help-type1 .ico:hover + .box_help{ opacity:1; }
.wrap-help-type1 .box_help .arr{
   width: 7px;
   height: 7px;
   border-top: 1px solid #000;
   border-right: 1px solid #000;
   transform: rotate(315deg);
   background-color: #fff;
   position: absolute;
   left: 8px;
   top: -5px;
}


.wrap-comes-with{display: flex;text-align: center;border: 1px #d7e3e8 solid;border-radius: 10px;padding: 30px 0;}
.wrap-comes-with img{}
.wrap-comes-with .item{
    width: 20%;
    margin: 0 2.5%;
}
.wrap-comes-with .thumb{
    width: 100%;
    display: inline-flex;
    height: 130px;
    justify-content: center;
    align-items: center;
}
.wrap-comes-with .thumb img{
    max-width: 140px;
    max-height: 130px;
}
.wrap-comes-with .cont{
    font-size: 17px;
    color: #000;
    margin-top: 10px;
}
.wrap-comes-with .cont .t1{
    font-weight: var(--fw-b);
}
.wrap-comes-with .cont .t2{
    font-size: var(--fz-ss);
    margin-top: 7px;
}

.wrap-description{ color: #000; }
.wrap-description h2{
    font-size: 14px;
    font-weight: var(--fw-b);
    text-transform: uppercase;
    margin-bottom: 25px;
}
.wrap-description .cont{
    font-size: 16px;
    line-height: 1.4;
    font-weight: 300;
}
.wrap-description .cont b{
    font-weight: 600;
}


.wrap-spec{ color:#000; }
.wrap-spec h2{font-size: 27px;font-weight: var(--fw-b);}
.wrap-spec .list{  }
.wrap-spec .list >li{  }
.wrap-spec .list .head{border-bottom: 1px #d7e3e8 solid;display: flex;width: 100%;justify-content: space-between;padding: 21px 0 20px;line-height: 1.2;align-items: center;}
.wrap-spec .list .head .t{font-size: 16px;font-weight: var(--fw-b); text-align: left; max-width: 80%;}
.wrap-spec .list .head  i{ color:#000; font-size:18px; }
.wrap-spec .list .cont{margin-top: -1px;font-weight:300;line-height:1.5;}
.wrap-spec .list .cont > .inner{ border-top:2px #000 solid; padding:25px 0 30px;  }
.wrap-spec .list .cont b{ font-weight:600;  }

.wrap-spec .list >li.active .head i{ 
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
 }


 .wrap-path{
    display: flex;
    align-items: center;
    color: #000;
}
 .wrap-path .home{
    display: flex;
    align-items: center;
    color: #000;
}
 .wrap-path .home .t{
    font-size: 14px;
    margin-right: 4px;
}
 .wrap-path .home i{
    font-size: 14px;
}
 .wrap-path .depth{
    border: 1px #494d4f solid;
    border-radius: 3px;
    padding: 9px 20px;
    font-size: 12px;
    font-weight: 600;
    color: #000;
    margin-left: 6px;
}
.wrap-path .depth:hover{ background:#000000; border-color:#000; color:#ffc72c; }
.wrap-detail .wrap-path{ padding-top: 40px; padding-bottom: 30px; }

.prd-bar-fix{position: fixed;left: 0;top: -80px;width: 100%;z-index: 10;background: #fff;box-shadow: 1px 2px 5px -1px rgba(0,0,0,0.14);-webkit-box-shadow: 1px 2px 5px -1px rgba(0, 0, 0, 0.14);-moz-box-shadow: 1px 2px 5px -1px rgba(0,0,0,0.14);display: flex;align-items: stretch;justify-content: space-between;height: 80px;padding: 15px 20px;box-sizing: border-box;
  transition: top 300ms cubic-bezier(0.680, 0.105, 0.365, 0.905); /* custom */
  transition-timing-function: cubic-bezier(0.680, 0.105, 0.365, 0.905); /* custom */
}
.prd-bar-fix .p_area{
    display: flex;
    align-items: center;
}
.prd-bar-fix .thumb{
    height: 66px;
    width: 66px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 15px;
}
.prd-bar-fix .thumb .img{position: absolute;left: calc(50% - 48%);top: calc(50% - 48%);width: 96%;height: 96%;background-repeat: no-repeat;background-position: 50% 50%;background-size: contain;}
.prd-bar-fix  .wrap-path .home .t{ font-size: 12px; margin-right: 4px; }
.prd-bar-fix  .wrap-path .home i{ font-size: 11px; }
 .prd-bar-fix  .wrap-path .depth{
    padding: 4px 13px 3px;
    font-size: 12px;
    margin-left: 5px;
}
.prd-bar-fix .name{margin-top:6px;font-weight: var(--fw-b);}
.prd-bar-fix .price{
    margin-right: 30px;
    font-size: var(--fz-nl);
    font-weight: var(--fw-b);
}
.prd-bar-fix .btns{}
.prd-bar-fix .btns > a,.prd-bar-fix .btns > button{padding: 14px 15px;} 
.prd-bar-fix.active{ top: 0;  }

@media screen and (max-width: 1280px){
    .prd-bar-fix{ display: none; }
}

.select-type2{width: 250px;background: #000;border-radius: 8px;auto;display: none;z-index: 1;}
.select-type2 .inner-select-type2{
    max-height: 300px;
    margin: 20px 15px;
    overflow: hidden;
    overflow-y: auto;
}
.select-type2 .lst-select-type2{
    
margin-left: 0;
    
margin-right: 10px;
}
.select-type2 .lst-select-type2 >li{
    text-align: left;
    margin-bottom: 7px;
}
.select-type2 .lst-select-type2 >li > a{
    color: #fff;
    font-size: var(--fz-sss);
    line-height: 1.4;
    display: inline-flex;
    text-transform: uppercase;
    font-weight: var(--fw-b);
    opacity: 0.5;
    transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
    transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
}
.select-type2 .lst-select-type2 >li > a i{
    font-size: 20px;
    opacity: 0;
    color: #ffd42b;
    transition: all 300ms cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
    transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); /* linear */
}
.select-type2 .lst-select-type2 >li > a .t{
    flex-grow: 1;
    margin-left: 5px;
}
.select-type2 .lst-select-type2 >li > a:hover,
.select-type2 .lst-select-type2 >li.active > a,
.select-type2 .lst-select-type2 >li > a:hover i,
.select-type2 .lst-select-type2 >li.active > a i{ opacity: 1;  }
@media (min-width:840px) {
    .select-type2 .inner-select-type2::-webkit-scrollbar {
        height: .8rem;
        width: 2px;
    }
    .select-type2 .inner-select-type2::-webkit-scrollbar-track {
        background: #404040;
    }
    .select-type2 .inner-select-type2::-webkit-scrollbar-thumb {
        background-color: #ffc72c;
        border-radius: .9rem;
        cursor: pointer !important;
    }
}

/* Modals */
#modal_overlay,#modal_overlay2{
    position: fixed;width: 100%; height: 100%;  left: 0; top: 0; z-index: 90;/* background:url("../img/common/transparent.png") repeat; */
    background-color: rgba(0, 0, 0, 0.8); display:none;visibility:hidden;opacity:0;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000)";
    -webkit-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -moz-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    -o-transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
    transition:visibility .3s ease-in-out, opacity .3s ease-in-out;
}

/* #modal_overlay:nth-child(n){filter:none} */
#modal_overlay.on,#modal_overlay2.on{visibility:visible;opacity:1;}

.modal{position: fixed;left:0;right:0;margin:auto;z-index: 100;display:none;visibility: hidden;opacity:0;-webkit-overflow-scrolling: touch;width: 55%; max-width:85%; min-width: 320px; max-height: 90%; min-height: 150px; overflow: hidden;
    -webkit-transform: scale(0.6,0.6);
    -moz-transform: scale(0.6,0.6);
    -ms-transform: scale(0.6,0.6);
    -o-transform: scale(0.6,0.6);
    transform: scale(0.6,0.6);
    -webkit-transition:visibility .4s ease-in-out, opacity .4s ease-in-out, -webkit-transform .3s ease-in-out .4s, width 0.5s cubic-bezier(.67,.04,.32,1);
    -moz-transition:visibility .4s ease-in-out, opacity .4s ease-in-out, -moz-transform .3s ease-in-out .4s, width 0.5s cubic-bezier(.67,.04,.32,1);
    -ms-transition:visibility .4s ease-in-out, opacity .4s ease-in-out, -ms-transform .3s ease-in-out .4s, width 0.5s cubic-bezier(.67,.04,.32,1);
    -o-transition:visibility .4s ease-in-out, opacity .4s ease-in-out, -o-transform .3s ease-in-out .4s, width 0.5s cubic-bezier(.67,.04,.32,1);
    transition:visibility .4s ease-in-out, opacity .4s ease-in-out, transform .3s ease-in-out .4s, width 0.5s cubic-bezier(.67,.04,.32,1);
}
.modal.on{visibility: visible;opacity:1; -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -ms-transform: scale(1,1); -o-transform: scale(1,1); transform: scale(1,1);
    -webkit-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -webkit-transform .4s cubic-bezier(.67,.04,.32,1) .1s, width 0.5s cubic-bezier(.67,.04,.32,1);
    -moz-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -moz-transform .4s cubic-bezier(.67,.04,.32,1) .1s, width 0.5s cubic-bezier(.67,.04,.32,1);
    -ms-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -ms-transform .4s cubic-bezier(.67,.04,.32,1) .1s, width 0.5s cubic-bezier(.67,.04,.32,1);
    -o-transition:visibility .3s ease-in-out, opacity .3s ease-in-out, -o-transform .4s cubic-bezier(.67,.04,.32,1) .1s, width 0.5s cubic-bezier(.67,.04,.32,1);
    transition:visibility .3s ease-in-out, opacity .3s ease-in-out, transform .4s cubic-bezier(.67,.04,.32,1) .1s, width 0.5s cubic-bezier(.67,.04,.32,1);
}
.modal.sz2{width: 1214px;}

#modal_overlay2{ z-index: 101; }
.modal.ty2{ z-index: 102;  }

.modal > .inner{position: relative;background-color: #fff;width: 100%;/* height: 100%;*/ padding: 0; border-radius: 8px; overflow: hidden; }
.modal > .inner:after{content: '';display: block;clear: both;}
.modal > .inner .modal_header {padding: 3.8em 3.15em 1.2em;padding-right: 60px;background-color: #fff;position: relative;}
.modal > .inner .modal_header > h2 { font-size: 27px; color: #000; font-weight: var(--fw-b); }
.modal > .inner .modal_header .close{position: absolute;right: 20px;top: 20px;font-size: 24px;}
.modal > .inner .modal_header.no_head{ padding: 0;  }

.modal > .inner .modal_content { overflow-y: auto; overflow-x: hidden; }
.modal > .inner .modal_content > .inner {padding: 1.2em 3.15em 3.8em;}
.modal > .inner .modal_content > .inner:after { content: ''; display: block; clear: both; }
.modal > .inner .modal_footer { padding: 10px 20px; border-top: 1px solid #e4e6ea; }
.modal > .inner .modal_footer .btn_group { margin-top: 0; }
.modal button.modal_close {position: absolute;top: 12px;right: 0.667em;z-index: 3;/* width: 19px;height: 19px; */overflow: hidden;}
.modal .modal_header button.modal_close { top: 50%; margin-top: -1.333em; color: #202429; }
.modal.lg{width: 90%; max-width: 1210px;}


.tbl_type1{
    width: 100%;
}
.tbl_type1 table{
    width: 100%;
}
.tbl_type1 thead{}
.tbl_type1 thead tr{}
.tbl_type1 thead th{}
.tbl_type1 thead th span{
    display: flex;
    justify-content: center;
    align-items: center;
    color: #ffc72c;
    background: #000;
    font-weight: var(--fw-b);
    font-size: 12px;
    padding: 16px;
}
.tbl_type1 thead th:first-child span{
    border-radius: 5px 0 0 5px;
}
.tbl_type1 thead th:last-child span{
    border-radius: 0 5px 5px 0;
}
.tbl_type1 tbody tr{}
.tbl_type1 tbody th{}
.tbl_type1 tbody td{ font-size: 15px; padding: 13px; }
.tbl_type1 tbody tr:nth-child(even){ background:#f3f6f8; }


.wrap-style-cody{
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    position: relative;
}
.wrap-style-cody .inner-cody{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #f5f8fa;
}
.wrap-style-cody .item{
    position: absolute;
    left: 0;
    top: 0;
}
.wrap-style-cody .item.n1{left: 67%;top: 6%;width: 14%;height: 12%;}
.wrap-style-cody .item.n2{left: 34%;top: 12%;width: 30%;height: 30%;}
.wrap-style-cody .item.n3{left: 19%;top: 46%;width: 16%;height: 15%;}
.wrap-style-cody .item.n4{left: 40%;top: 46%;width: 23%;height: 45%;}

.wrap-style-cody .item .img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: contain;
}

.wrap-style-cody .item .bubble{position:absolute;left:0;top:0;display:none;cursor: pointer;}
.wrap-style-cody .item .circle{position:absolute;left: 10px;top: -24px;width: 14px;height: 14px;border-radius:50%;background:#ffc72c;border: 5px #ffc72c solid;content:"";z-index: 0; cursor: pointer;}

.wrap-style-cody .item.n1 .circle{left: 25%;top: 47%;}
.wrap-style-cody .item.n2 .circle{left: 48%;top: 53%;}
.wrap-style-cody .item.n3 .circle{left: 33%;top: 21%;}
.wrap-style-cody .item.n4 .circle{left: 45%;top: 13%;}
.wrap-style-cody .item .bubble .inner_bubble{
    position: absolute;
    left: 0;
    top: 0;
    background:#fff;
    border:1px #000 solid;
    width: 260px;
    box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.15);
    border-radius:7px;
    z-index: 1;
    font-size: 14px;
    padding: 13px;
}

.wrap-style-cody .item .bubble .arr{
   width: 7px;
   height: 7px;
   border-top: 1px solid #000;
   border-right: 1px solid #000;
   transform: rotate(315deg);
   background-color: #fff;
   position: absolute;
   left: 20px;
   top: -4px;
   z-index: 2;
}
.wrap-style-cody .item.n1 .bubble .arr{ left: 256px; top: -4px; }
.wrap-style-cody .item.n2 .bubble .arr{left: 228px;top: -4px;}
.wrap-style-cody .item.n3 .bubble .arr{left: 38px;top: -4px;}
.wrap-style-cody .item.n4 .bubble .arr{left: 215px;top: -4px;}

.wrap-style-cody .item.n1 .bubble{left:auto;right: 307px;top: 53px;}
.wrap-style-cody .item.n2 .bubble{left:auto;right: 307px;top: 107px;}
.wrap-style-cody .item.n3 .bubble{left:auto;left: 0;top: 35px;}
.wrap-style-cody .item.n4 .bubble{left:auto;right: 277px;top: 51px;}
.wrap-style-cody .item .bubble .h{font-weight: var(--fw-b);}
.wrap-style-cody .item .bubble .t1{
    font-size: 12px;
    position: relative;
    margin-top: 7px;
    overflow: hidden;
}
.wrap-style-cody .item .bubble .t1 .inr{margin-left: -20px;display: flex;flex-wrap: wrap;}
.wrap-style-cody .item .bubble .t1 .inr span{position: relative;margin-left: 10px;padding-left: 10px;}
.wrap-style-cody .item .bubble .t1 .inr span:after{position:absolute;left:0;top: calc(50% - 5px);width:1px;height: 10px;background:#aaa;content:"";}
.wrap-style-cody .item .bubble .t2{
    font-size: 12px;
    margin-top: 4px;
}
.wrap-style-cody .item.hov .circle{
  background: #000000;
}
.wrap-style-cody .item.hov .bubble{ display: block; }

@media screen and (max-width: 1820px){

    .wrap-style-cody .item.n1{left: 67%;top: 6%;width: 14%;height: 12%;}
    .wrap-style-cody .item.n2{left: 34%;top: 12%;width: 30%;height: 30%;}
    .wrap-style-cody .item.n3{left: 19%;top: 46%;width: 16%;height: 15%;}
    .wrap-style-cody .item.n4{left: 40%;top: 46%;width: 23%;height: 45%;}


    .wrap-style-cody .item .bubble{position:absolute;left:0;top:0;display:none;cursor: pointer;}
    .wrap-style-cody .item .circle{position:absolute;left: 10px;top: -24px;width: 14px;height: 14px;border-radius:50%;background:#ffc72c;border: 5px #ffc72c solid;content:"";z-index: 0;cursor: pointer;}

    .wrap-style-cody .item.n1 .circle{left: 25%;top: 47%;}
    .wrap-style-cody .item.n2 .circle{left: 48%;top: 53%;}
    .wrap-style-cody .item.n3 .circle{left: 33%;top: 21%;}
    .wrap-style-cody .item.n4 .circle{left: 45%;top: 13%;}
    .wrap-style-cody .item .bubble .inner_bubble{
        width: 20vw;
        border-radius:7px;
        font-size: 14px;
        padding: 13px;
    }

    .wrap-style-cody .item .bubble .arr{
     width: 1vw;
     height: 1vw;
     border-top: 1px solid #000;
     border-right: 1px solid #000;
     transform: rotate(315deg);
     background-color: #fff;
     position: absolute;
     left: 20px;
     top: -4px;
     z-index: 2;
    }
    .wrap-style-cody .item.n1 .bubble .arr{left: 19.3vw;top: -0.5vw;}
    .wrap-style-cody .item.n2 .bubble .arr{left: 12vw;top: -0.6vw;}
    .wrap-style-cody .item.n3 .bubble .arr{left: 3.8vw;top: -0.6vw;}
    .wrap-style-cody .item.n4 .bubble .arr{left: 12vw;top: -0.5vw;}

    .wrap-style-cody .item.n1 .bubble{left:auto;right: 2.4vw;top: 3.5vw;width: 20vw;}
    .wrap-style-cody .item.n2 .bubble{left:auto;right: 16vw;top: 6.6vw;}
    .wrap-style-cody .item.n3 .bubble{left:auto;left: -1.5vw;top: 3vw;}
    .wrap-style-cody .item.n4 .bubble{left:auto;right: 15vw;top: 4vw;}
    .wrap-style-cody .item .bubble .t1{
        font-size: 12px;
        position: relative;
        margin-top: 7px;
        overflow: hidden;
    }
    .wrap-style-cody .item .bubble .t1 .inr{margin-left: -20px;display: flex;flex-wrap: wrap;}
    .wrap-style-cody .item .bubble .t1 .inr span{position: relative;margin-left: 10px;padding-left: 10px;}
    .wrap-style-cody .item .bubble .t1 .inr span:after{position:absolute;left:0;top: calc(50% - 5px);width:1px;height: 10px;background:#aaa;content:"";}
    .wrap-style-cody .item .bubble .t2{
    font-size: 12px;
    margin-top: 4px;
    }
    .wrap-style-cody .item.hov .circle{
    background: #000000;
    }
    .wrap-style-cody .item.hov .bubble{ display: block; }

}

.wrap-models-mobile{ display: none; }

.wrap-video-detail2{ max-width: 1000px; margin: 0 auto; }
.wrap-video-detail2 .cont{
    margin-top: 25px;
    display: flex;
}
.wrap-video-detail2 .cont .ico{
    width: 18px;
    min-width: 18px;
}
.wrap-video-detail2 .cont .rgh{
    flex-grow: 1;
    margin-left: 10px;
    color: #818991;
    font-size: 13px;
}
.wrap-video-detail2 .cont .t1{font-weight: var(--fw-b);}
.wrap-video-detail2 .cont .t2{margin-top: 5px;line-height: 1.5;}