@charset "utf-8";

/* main-popup */
.popup{border-radius: 15px;overflow: hidden;}
.popup .popup-contents{background: #fff;}
.popup a{display:block;}
.popup img{display:block;}
.popup .popup-bottom{display: flex;}
.popup .popup-bottom button{display:inline-block;padding: 15px 5px;width:30%;color:#fff;text-align: center;background: #01ad40;font-size: 13px;}
.popup .popup-bottom button:first-child{width:70%;background:#777;}


.layer-password{position: fixed;top:0;left:0;width:100%;height:100%;z-index:1000;line-height: normal;}
.layer-password .layer-password-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius: 10px;box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.14);border: solid 1px #d4d4e8;background-color: #f5f5f8;padding:60px;width:100%;max-width: 550px;}
.layer-password .layer-password-wrap .pop-title{padding-left:37px;position: relative; font-size: 25px;font-weight: 800;color: #202020;}
.layer-password .layer-password-wrap .pop-title:before{content:"";position: absolute;left:0;width:32px;height:32px;background: url(/_public/images2/icon/password_ico.svg) no-repeat;background-size: cover;}
.layer-password .layer-password-wrap .layer-body{margin-top:20px;}
.layer-password .layer-password-wrap .layer-body .form-wrap{text-align: center;font-size:0;}

.layer-password .layer-password-wrap .layer-body .form-wrap input[type="password"]{border-radius: 10px;border: solid 1px #ccc;background-color: #fff;width:100%;height:60px;font-size: 18px;font-weight: 500;letter-spacing: 0.45px;padding:0 20px;}
.layer-password .layer-password-wrap .layer-body .form-wrap input[type="password"]::placeholder{color:#787878;}
.layer-password .layer-password-wrap .layer-body .form-wrap .button{margin-top:15px;display: block;width:100%;border-radius: 10px;background-color: #333;height:60px;font-size: 18px;font-weight: 500;letter-spacing: 0.45px;color:#fff;}
.layer-password .layer-password-wrap .layer-body .form-wrap .button:hover{background: #001039;}
.layer-password .layer-password-wrap .layer-body .layer-password-close{position:absolute;top:20px;right:20px;width:40px;height:40px;background: url(/_public/images2/icon/close_off.svg) no-repeat;background-size: cover;font-size:0;}
.layer-password .layer-password-wrap .layer-body .layer-password-close:hover{background: url(/_public/images2/icon/close_on.svg) no-repeat;background-size: cover;}


.modal-popup{display:none;position: fixed;top:50%;left:50%;transform: translate(-50%, -50%); border-radius: 10px;background-color: #fff;width:100%;max-width:1000px;padding:30px 40px;z-index: 999999;}
.modal-popup .modal-top{display: flex;align-items: center;justify-content: space-between;padding-bottom: 20px;border-bottom: 1px solid #dcdfe6;}
.modal-popup .modal-top h3{font-size: 24px;font-weight: bold;color: #202020;}
.modal-popup .modal-top button{display: inline-block;}
.modal-popup .modal-top button img{display: block;}
.modal-popup .modal-con{padding:30px 0;border-bottom: 1px solid #dcdfe6;}
.modal-popup .button-box{margin-top:20px;display: flex;justify-content: center;}
.modal-popup .button-box button{display: flex;align-items: center;justify-content: center;width:260px;height:55px; border-radius: 5px;background-color: #29c36b;font-size: 16px;font-weight: bold;color: #fff;}

.modal-policy .policy-txt{font-size: 16px;font-weight: 500;line-height: 1.75;color: #424242;max-height: 440px;overflow-y: auto;}
.modal-policy .policy-txt strong{display: block;  font-size: 18px;font-weight: bold;line-height: 1.33;color: #202020;}
.modal-policy .policy-txt .box{ word-break: keep-all;}
.modal-policy .policy-txt .box h4 { font-size: 20px}
.modal-policy .policy-txt .page-title { margin: 40px 0}
.modal-policy .policy-txt .box p { padding: 10px 0 40px; font-size: 16px; line-height: 26px}
.modal-policy .policy-txt .box table{margin-top:20px;border-top: 2px solid #202020;}
.modal-policy .policy-txt .box table thead tr th{font-size: 18px;font-weight: 500;text-align: center;color: #202020;padding: 16px 10px;background: #f3f4f8;border-bottom: 1px solid #cecece;border-left: 1px solid #cecece;}
.modal-policy .policy-txt .box table tbody tr td{border-bottom: 1px solid #cecece;border-left: 1px solid #cecece;padding: 16px 10px;font-size: 16px;font-weight: normal;letter-spacing: -0.4px;text-align: center;color: #5a5a5a;}


.modal-car{}
.modal-car .modal-con{}
.modal-car .modal-con .car-detail{display: flex;gap:30px;overflow: overlay; height: 620px;}
.modal-car .modal-con .car-detail .img-box{width:100%;max-width:585px;position: relative;}
.modal-car .modal-con .car-detail .img-box .slide-box{position: relative;}
.modal-car .modal-con .car-detail .img-box .swiper-slide{}
.modal-car .modal-con .car-detail .img-box .swiper-slide img{border-radius: 5px;display: block;width:100%;}
.modal-car .modal-con .car-detail .img-box .gallery-slide{}
.modal-car .modal-con .car-detail .img-box .swiper-button-next,
.modal-car .modal-con .car-detail .img-box .swiper-button-prev{width:70px;height:70px;top:auto;bottom:3px;margin:0;}
.modal-car .modal-con .car-detail .img-box .swiper-button-next{background: url(/_public/images2/icon/target_right2.svg) no-repeat;background-size: cover;right:-35px;}
.modal-car .modal-con .car-detail .img-box .swiper-button-prev{background: url(/_public/images2/icon/target_left2.svg) no-repeat;background-size: cover;left:-15px;}
.modal-car .modal-con .car-detail .img-box .swiper-button-next:after,
.modal-car .modal-con .car-detail .img-box .swiper-button-prev:after{display: none;}
.modal-car .modal-con .car-detail .img-box .gallery-slide .swiper-pagination{position:relative;margin-top:20px;display: flex;justify-content: center;gap:7px;}
.modal-car .modal-con .car-detail .img-box .gallery-slide .swiper-pagination .swiper-pagination-bullet{width:7px;height:7px;margin:0;background: #ccc;opacity: 1;}
.modal-car .modal-con .car-detail .img-box .gallery-slide .swiper-pagination .swiper-pagination-bullet-active{background: #00cd4a;}
.modal-car .modal-con .car-detail .img-box .thumnail-slide{margin-top:20px;}
.modal-car .modal-con .car-detail .img-box .thumnail-slide .swiper-slide{opacity:0.5;}
.modal-car .modal-con .car-detail .img-box .thumnail-slide .swiper-slide.swiper-slide-thumb-active{opacity:1;}
.modal-car .modal-con .car-detail .img-box .option-box{margin-top:20px;border-radius: 10px;background-color: #f9f9f9;padding: 14px 20px;display: flex;gap: 15px;}
.modal-car .modal-con .car-detail .img-box .option-box h4{width:30px;margin-top:5px;font-size: 14px;font-weight: 600;color: #202020;}
.modal-car .modal-con .car-detail .img-box .option-box .option-list{overflow-x: auto;}
.modal-car .modal-con .car-detail .img-box .option-box .option-list .inner-wrap{display: flex;flex-wrap:wrap;gap:8px;}
.modal-car .modal-con .car-detail .img-box .option-box .option-list span{display: flex;align-items: center;justify-content: center;height:28px;padding:0 10px; border-radius: 99px;border: solid 1px #dcdfe6;background-color: #fff;line-height:26px;font-size: 14px;font-weight: 600;color: #2a3246;}
.modal-car .modal-con .car-detail .img-box ul{margin-top:20px;}
.modal-car .modal-con .car-detail .img-box ul li{ font-size: 14px;font-weight: 500;line-height: 1.43;color: #787878;}
.modal-car .modal-con .car-detail .info-box{width:100%;max-width:305px;}
.modal-car .modal-con .car-detail .info-box .inner-box{border-radius: 10px;background-color: #f5f5f5;padding:20px 10px;}
.modal-car .modal-con .car-detail .info-box h3{font-size: 16px;font-weight: bold;color: #202020;}
.modal-car .modal-con .car-detail .info-box .price{margin-top:10px;display: flex;gap:8px;align-items: center;}
.modal-car .modal-con .car-detail .info-box .price strong{font-size: 20px;font-weight: bold;color: #202020;}
.modal-car .modal-con .car-detail .info-box .price span{font-size: 14px;font-weight: 500;color: #787878;}
.modal-car .modal-con .car-detail .info-box .spec{position:relative;margin-top:15px;border-radius: 10px;background-color: #fff;padding:40px 5px 15px 10px;display: flex;gap:9px;}
.modal-car .modal-con .car-detail .info-box .spec:before{content: "";display: block;position: absolute;left:10px;width:18px;height:18px;background: url(/_public/images2/icon/ico_s.svg) no-repeat;background-size: cover;top: 12px;}
.modal-car .modal-con .car-detail .info-box .spec span{position: relative;display:flex;gap:3px;font-size: 13px;font-weight: 600;color: #202020;}
.modal-car .modal-con .car-detail .info-box .spec span em{color:#787878;}
.modal-car .modal-con .car-detail .info-box .spec span:before{content: "";position:absolute;top:3px;left:-5px;display: block;width:1px;height:12px;background:#b9bfcc;}
.modal-car .modal-con .car-detail .info-box .spec span:first-child:before{display: none;}
.modal-car .modal-con .car-detail .info-box dl{margin-top:20px;border-radius: 10px;background-color: #fff}
.modal-car .modal-con .car-detail .info-box dl dt{position: relative;top:19px;padding-left: 50px;font-size: 15px;font-weight: 500;color:#202020;width:110px;}
.modal-car .modal-con .car-detail .info-box dl dt i{position:absolute;top:-1px;left:20px;display: inline-block;}
.modal-car .modal-con .car-detail .info-box dl dt i img{display: block;}
.modal-car .modal-con .car-detail .info-box dl dd{padding:15px 20px 15px 110px;font-size: 20px;font-weight: bold;color: #202020;text-align: right;border-bottom:1px solid #f5f5f5;}
.modal-car .modal-con .car-detail .info-box dl dd.ft14 { font-size: 16px}
.modal-car .modal-con .car-detail .info-box .spec2{display: flex;gap:15px;margin-top:15px;}
.modal-car .modal-con .car-detail .info-box .spec2 li{flex:1;padding:20px;border-radius: 10px;background-color: #fff;display: flex;flex-direction: column;gap:10px;}
.modal-car .modal-con .car-detail .info-box .spec2 li span{display: inline-block; font-size: 15px;font-weight: 500;color: #202020;}
.modal-car .modal-con .car-detail .info-box .spec2 li i{display: inline-block;}
.modal-car .modal-con .car-detail .info-box .spec2 li i img{display: block;}
.modal-car .modal-con .car-detail .info-box .spec2 li strong{display:inline-block;font-size: 20px;font-weight: bold;color: #202020;}
.modal-car .modal-con .car-detail .info-box .spec3{margin-top:15px;display: flex;padding:20px;background: #fff;border-radius: 10px;gap:30px;}
.modal-car .modal-con .car-detail .info-box .spec3 li{position:relative;flex:1;font-size: 15px;font-weight: 500;color: #202020;}
.modal-car .modal-con .car-detail .info-box .spec3 li:before{content: "";position:absolute;top:3px;left:-15px;display: inline-block;width:1px;height:14px;background: #b9bfcc;}
.modal-car .modal-con .car-detail .info-box .spec3 li:first-child:before{display: none;}

.modal-coupon{max-width:480px;padding-bottom: 10px;}
.modal-coupon .modal-con{padding:20px 0 0;border-bottom: 0;}
.modal-coupon .modal-con .coupon-top{display: flex;justify-content: space-between;align-items: flex-end;}
.modal-coupon .modal-con .coupon-top h4{font-size: 18px;font-weight: bold;color: #202020;}
.modal-coupon .modal-con .coupon-top span{display: inline-block;font-size: 15px;font-weight: bold;color: #202020;}
.modal-coupon .modal-con .coupon-list{margin-top:20px;overflow-y: auto;max-height: 548px;}
.modal-coupon .modal-con .coupon-list .radio{position: relative;}
.modal-coupon .modal-con .coupon-list .radio + .radio{margin-top:15px;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]{position: absolute;opacity: 0;}
.modal-coupon .modal-con .coupon-list .radio label{position: relative;display:block;width:100%;padding:20px 20px 20px 50px;  border-radius: 5px;border: dashed 1px #99a3b8;background-color: #fff;cursor: pointer;}
.modal-coupon .modal-con .coupon-list .radio label:before {content: "";position: absolute;top:20px;left: 20px;display: inline-block;width: 20px;height: 20px;background: url(/_public/images2/icon/ico_chk6.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:checked + label:before {background: url(/_public/images2/icon/ico_chk6_on.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .radio label .txt-box{position: relative;padding-left: 100px;}
.modal-coupon .modal-con .coupon-list .radio label .txt-box i{display: inline-block;position: absolute;left:0;max-width:82px;}
.modal-coupon .modal-con .coupon-list .radio label .txt-box i img{display: block;border-radius: 100%;}
.modal-coupon .modal-con .coupon-list .radio label em{display: block;font-size: 15px;font-weight: bold;color: #202020;}
.modal-coupon .modal-con .coupon-list .radio label strong{display: block;margin-top: 5px; font-size: 21px;font-weight: bold;color: #202020;}
.modal-coupon .modal-con .coupon-list .radio label span{display: block;margin-top:5px; font-size: 15px;font-weight: normal;color: #202020;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:checked + label{border-style: solid;border-color:#29c36b;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:checked + label em{font-weight: bold;color: #29c36b;}
.modal-coupon .modal-con .coupon-list .radio .open-txt{margin-top: 10px;border-top:1px dashed #99a3b8;display: block;width:100%;height:45px;position: relative;text-align: left;font-size: 15px;font-weight: 500;letter-spacing: normal;color: #787878;padding-right: 25px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.modal-coupon .modal-con .coupon-list .radio .open-txt:after{content: "";position: absolute;right:0;width:18px;height:18px;background: url(/_public/images2/icon/open_txt.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .radio .open-txt.on:after{background: url(/_public/images2/icon/open_txt_on.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .radio ul{display: none;}
.modal-coupon .modal-con .coupon-list .radio ul li{font-size: 15px;font-weight: 500;color: #787878;}
.modal-coupon .modal-con .coupon-list .radio ul li + li{margin-top:5px;}
.modal-coupon .modal-con .coupon-list .radio ul li span{display: inline-block;font-size: 15px;font-weight: 500;color: #202020;margin-right: 10px;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:disabled{}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:disabled + label{border:1px solid #f5f6f8;background: #f5f6f8;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:disabled + label:before{background: url(/_public/images2/icon/ico_check_disable.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:disabled + label em{color:#a5a9af;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:disabled + label strong{color:#a5a9af;}
.modal-coupon .modal-con .coupon-list .radio input[type="radio"]:disabled + label span{color:#a5a9af;}

.modal-coupon .modal-con .coupon-list .chk{position: relative;}
.modal-coupon .modal-con .coupon-list .chk + .chk{margin-top:15px;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]{position: absolute;opacity: 0;}
.modal-coupon .modal-con .coupon-list .chk label{position: relative;display:block;width:100%;padding:20px 20px 20px 50px;  border-radius: 5px;border: dashed 1px #99a3b8;background-color: #fff;cursor: pointer;}
.modal-coupon .modal-con .coupon-list .chk label:before {content: "";position: absolute;top:20px;left: 20px;display: inline-block;width: 20px;height: 20px;background: url(/_public/images2/icon/ico_chk6.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:checked + label:before {background: url(/_public/images2/icon/ico_chk6_on.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .chk label .txt-box{position: relative;padding-left: 100px;}
.modal-coupon .modal-con .coupon-list .chk label .txt-box i{display: inline-block;position: absolute;left:0;max-width:82px;}
.modal-coupon .modal-con .coupon-list .chk label .txt-box i img{display: block;border-radius: 100%;}
.modal-coupon .modal-con .coupon-list .chk label em{display: block;font-size: 15px;font-weight: bold;color: #202020;}
.modal-coupon .modal-con .coupon-list .chk label strong{display: block;margin-top: 5px; font-size: 21px;font-weight: bold;color: #202020;}
.modal-coupon .modal-con .coupon-list .chk label span{display: block;margin-top:5px; font-size: 15px;font-weight: normal;color: #202020;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:checked + label{border-style: solid;border-color:#29c36b;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:checked + label em{font-weight: bold;color: #29c36b;}
.modal-coupon .modal-con .coupon-list .chk .open-txt{margin-top: 10px;border-top:1px dashed #99a3b8;display: block;width:100%;height:45px;position: relative;text-align: left;font-size: 15px;font-weight: 500;letter-spacing: normal;color: #787878;padding-right: 25px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.modal-coupon .modal-con .coupon-list .chk .open-txt:after{content: "";position: absolute;right:0;width:18px;height:18px;background: url(/_public/images2/icon/open_txt.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .chk .open-txt.on:after{background: url(/_public/images2/icon/open_txt_on.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .chk ul{display: none;}
.modal-coupon .modal-con .coupon-list .chk ul li{font-size: 15px;font-weight: 500;color: #787878;}
.modal-coupon .modal-con .coupon-list .chk ul li + li{margin-top:5px;}
.modal-coupon .modal-con .coupon-list .chk ul li span{display: inline-block;font-size: 15px;font-weight: 500;color: #202020;margin-right: 10px;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled{}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled + label{border:1px solid #f5f6f8;background: #f5f6f8;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled + label:before{background: url(/_public/images2/icon/ico_check_disable.svg) no-repeat;background-size: cover;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled + label .txt-box i{opacity: 0.3;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled + label .txt-box i img{filter: grayscale(100%);}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled + label em{color:#a5a9af;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled + label strong{color:#a5a9af;}
.modal-coupon .modal-con .coupon-list .chk input[type="checkbox"]:disabled + label span{color:#a5a9af;}

.modal-coupon .modal-con .btn-box{margin-top:15px;display: flex;gap:10px;}
.modal-coupon .modal-con .btn-box button{display: flex;align-items: center;justify-content: center;flex:1;height:55px; font-size: 17px;font-weight: bold;border-radius: 5px;}
.modal-coupon .modal-con .btn-box .btn-cancel{box-shadow: 4px 8px 15px 0 rgba(160, 162, 175, 0.12);border: solid 1px #424242;background-color: #fff;color:#202020;}
.modal-coupon .modal-con .btn-box .btn-confirm{box-shadow: 4px 8px 15px 0 rgba(160, 162, 175, 0.12);background-image: linear-gradient(to right, #29c36b 2%, #2da585 96%);color:#fff;}

@media all and (max-width:1024px) {
    .modal-car{top:0;left:0;transform: none;max-width:100%;padding:20px;}
    .modal-car .modal-top h3{font-size:18px;}
    .modal-car .modal-top button{width:20px;}
    .modal-car .modal-con{max-height: calc(100vh - 150px);overflow-y: auto;overflow-x: hidden;}
    .modal-car .modal-con .car-detail{flex-direction: column;height: 100%;}
    .modal-car .modal-con .car-detail .img-box{max-width:100%;}
    .modal-car .modal-con .car-detail .info-box{max-width:100%;}
    .modal-car .modal-con .car-detail .img-box .swiper-button-next, .modal-car .modal-con .car-detail .img-box .swiper-button-prev{display: none;}
    .modal-car .modal-con .car-detail .img-box .option-box{flex-direction: column;}
    .modal-car .button-box button{height:45px;}

}


/* mobile */
@media all and (max-width:768px) {
    .layer-password .layer-password-wrap{max-width:90%;padding:40px 20px;}
    .layer-password .layer-password-wrap .pop-title{font-size:20px;padding-left:30px;}
    .layer-password .layer-password-wrap .pop-title:before{width:25px;height:25px;}
    .layer-password .layer-password-wrap .layer-body .layer-password-close{width:30px;height:30px;}
    .layer-password .layer-password-wrap .layer-body .form-wrap input[type="password"]{height:50px;font-size:14px;}
    .layer-password .layer-password-wrap .layer-body .form-wrap .button{height:50px;font-size:16px;margin-top:10px;}

    .popup{top:50% !important;left:50% !important;transform: translate(-50%, -50%);width:100%;max-width: 90%;}
    .popup .popup-contents img{display: block;width:100% !important;}

    .modal-popup{height:100%;border-radius: 0;padding:20px;}
    .modal-popup .button-box button{width:100%;}

    .modal-policy .policy-txt{max-height: 100%;height: calc(100vh - 231px);font-size: 15px;font-weight: 500;line-height: 1.73;color: #424242;}
    .modal-policy .policy-txt strong{font-size:16px;}
    .modal-policy .policy-txt .box table thead tr th{font-size: 15px;padding: 10px;}
    .modal-policy .policy-txt .box table tbody tr td{font-size: 13px;padding: 10px;word-break: break-all;}



    .modal-car .modal-con .car-detail .img-box .thumnail-slide{display: none;}
    .modal-car .modal-con .car-detail .info-box .spec span { font-size: 15px}

    .modal-coupon .modal-con{height:calc(100% - 65px);}
    .modal-coupon .modal-con .coupon-list{max-height: calc(100% - 100px);}

    .modal-coupon .modal-con .coupon-list .chk label .txt-box i{width:40px;}
    .modal-coupon .modal-con .coupon-list .chk label .txt-box{padding-left: 50px;}

    .modal-coupon .modal-con .coupon-list .radio label .txt-box i{width:40px;}
    .modal-coupon .modal-con .coupon-list .radio label .txt-box{padding-left: 50px;}

}
/* mobile */
@media all and (max-width:460px) {
.modal-car .modal-con .car-detail .info-box .spec span { font-size: 13px}
}