@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: #1e4ba0;font-size: 13px;}
.popup .popup-bottom button:first-child{width:70%;background:#777;}

.modal-wrap{display:none;position: fixed;top: 0;left: 0;right: 0;bottom: 0;width: 100%;height: 100%;background: rgba(255,255,255,0.95);z-index: 9999;}

.modal-popup{display:none;position: fixed;top:0;left:0;width:100%;height: 100%;z-index: 9999;padding:80px 0 30px;}

.modal-img .modal-close{position: absolute;top:28px;right:60px;}
.modal-img .slide-box{position:relative;height:100%;padding-bottom: 40px;}
.modal-img .slide-box .control-navi{position: absolute;top:50%;left:0;width:100%;padding:0 60px;transform: translateY(-50%);z-index: 10;display: flex;align-items: center;justify-content: space-between;}
.modal-img .slide-box .swiper-button{position: relative;margin:0;top:initial;left:initial;right:initial;bottom:initial;width:50px;height:50px;}
.modal-img .slide-box .swiper-button:after{display: none;}
.modal-img .slide-box .swiper-button-prev{background: url(/_public/images2/icon/target_left2.svg) no-repeat;background-size: cover;}
.modal-img .slide-box .swiper-button-next{background: url(/_public/images2/icon/target_right2.svg) no-repeat;background-size: cover;}
.modal-img .slide-box .swiper-pagination{top:initial;left:0;bottom:0;}
.modal-img .slide-box .swiper-pagination span{font-size: 15px;font-weight: 500;letter-spacing: -0.3px;color: #aaa;}
.modal-img .slide-box .swiper-pagination span.swiper-pagination-current{font-weight: bold;color:#0d0d0d}
.modal-img .slide-box .imgSwiper{position:relative;height:100%;}
.modal-img .slide-box .swiper-slide{position:relative;width: 100%;height: 100%;cursor: grab;}
.modal-img .slide-box .swiper-slide.swiper-slide-active{}
.modal-img .slide-box .swiper-slide .inner{position:relative;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}
.modal-img .slide-box .swiper-slide img{max-width: 100%;max-height: 100%;object-fit: contain;margin: auto;width: auto;height: auto;cursor: grab;}



.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;}


@media all and (max-width:1024px) {
    .modal-popup{padding:50px 0 20px;}
    .modal-img .modal-close{top:20px;right:20px;}
    .modal-img .slide-box .control-navi{padding:0 20px;top:initial;transform: none;bottom:-5px;z-index: 100;}
    .modal-img .slide-box .swiper-button{width:40px;height:40px;}
}

@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;}
}