@charset "utf-8";

/* main-popup */
.popup{border-radius: 15px;overflow: hidden;}
.popup .popup-contents{background: #fff;}
.popup a{display:block;}
.popup img{display:block;width:100%;}
.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-popup{display:none;position: fixed;top:50%;left:50%;transform: translate(-50%, -50%);background: #fff;width:100%;overflow: hidden; z-index: 999999;padding:50px 40px 60px;max-width:540px;}
.modal-popup .modal-top{display: flex;align-items: center;justify-content: space-between;padding-bottom: 19px;border-bottom: 1px solid #ccc;}
.modal-popup .modal-top h2{ font-size: 24px;font-weight: 600;letter-spacing: -0.6px;color: #202020;}
.modal-popup .close-modal{position:absolute;top:32px;right:32px;display: inline-block;width:25px;}
.modal-popup .modal-cont{}

.modal-private{ max-width:650px; }
.modal-private .modal-cont .policy-txt{height:360px;overflow-y: auto;font-size: 16px;font-weight: normal;line-height: 1.5;letter-spacing: -0.4px;color: #202020;}

.modal-signin{}
.modal-signin .modal-cont{}
.modal-signin .modal-cont .signin-box{}
.modal-signin .modal-cont .signin-box .txt{text-align: center;}
.modal-signin .modal-cont .signin-box .txt i{display: inline-block;}
.modal-signin .modal-cont .signin-box .txt i img{display:block;}
.modal-signin .modal-cont .signin-box .txt h3{margin-top:20px;font-size: 32px;font-weight: bold;letter-spacing: -0.8px;text-align: center;color: #202020;}
.modal-signin .modal-cont .signin-box .txt p{font-size: 18px;font-weight: 500;letter-spacing: -0.45px;text-align: center;color: #787878;}
.modal-signin .modal-cont .signin-box .btn-box{margin-top:40px;}
.modal-signin .modal-cont .signin-box .btn-box .input-box{}
.modal-signin .modal-cont .signin-box .btn-box .input-box + .input-box{margin-top:20px;}
.modal-signin .modal-cont .signin-box .btn-box button{position:relative;width:100%;height:60px; border-radius: 10px;font-size: 18px;font-weight: bold;letter-spacing: -0.45px;}
.modal-signin .modal-cont .signin-box .btn-box button:before{content: "";position: absolute;top:10px;left:20px;width:40px;height:40px;}
.modal-signin .modal-cont .signin-box .btn-box .btn-kakao{background: #ffe100;color:#191700;}
.modal-signin .modal-cont .signin-box .btn-box .btn-kakao:before{background: url(/_public/images2/icon/ico_kakao.svg) no-repeat;background-size: cover;}
.modal-signin .modal-cont .signin-box .btn-box .btn-naver{background:#35c505;color:#fff;}
.modal-signin .modal-cont .signin-box .btn-box .btn-naver:before{background: url(/_public/images2/icon/ico_naver.svg) no-repeat;background-size: cover;}



.modal-email{}
.modal-email .modal-cont{}
.modal-email .modal-cont .box{}
.modal-email .modal-cont .box .txt{text-align: center;}
.modal-email .modal-cont .box .txt i{display: inline-block;}
.modal-email .modal-cont .box .txt i img{display:block;}
.modal-email .modal-cont .box .txt h3{margin-top:20px;font-size: 32px;font-weight: bold;letter-spacing: -0.8px;text-align: center;color: #202020;}
.modal-email .modal-cont .box .txt p{font-size: 18px;font-weight: 500;letter-spacing: -0.45px;text-align: center;color: #787878;}
.modal-email .modal-cont .box fieldset{margin-top:40px;}
.modal-email .modal-cont .box fieldset .input-box{}
.modal-email .modal-cont .box fieldset .input-box input[type="text"]{width:100%;height:60px;  border-radius: 10px;border: solid 1px #d5d5d5;background-color: #f8f8f8;padding:0 20px;font-size: 18px;font-weight: normal;letter-spacing: -0.45px;}
.modal-email .modal-cont .box fieldset .input-box input[type="text"]::placeholder{color:#787878;}
.modal-email .modal-cont .box fieldset button{width:100%;height:60px;margin-top:20px; border-radius: 10px;background-color: #324b28;font-size: 18px;font-weight: bold;letter-spacing: -0.45px;color: #fff;}


.modal-vr{position: fixed;top:50%;left:50%;transform: translate(-50%, -50%);width:90%;max-width:1700px;height:90vh;z-index: 999999;padding:0;}
.modal-vr .close-modal{position: absolute;z-index: 10;top:20px;right:20px;}
.modal-vr .close-modal img{display: block;}


.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-private{}
.modal-private .close-modal{top: 54px;right: 40px;}

/* 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{top:0;left:0;width:100%;height:100%;transform: none;max-width:100%;padding:50px 20px 50px;}
    .modal-signin .modal-cont .signin-box .txt h3{font-size:28px;}
    .modal-signin .modal-cont .signin-box .txt p{font-size:16px;}
    .modal-signin .modal-cont .signin-box .btn-box button{height:50px;font-size: 16px;}
    .modal-signin .modal-cont .signin-box .btn-box .input-box + .input-box{margin-top:10px;}

    .modal-email .modal-cont .box .txt h3{font-size:28px;}
    .modal-email .modal-cont .box .txt p{font-size:16px;}
    .modal-email .modal-cont .box fieldset .input-box input[type="text"]{padding:0 15px;font-size:16px;height:50px;}
    .modal-email .modal-cont .box fieldset button{margin-top:10px;height:50px;font-size:16px;}

    .modal-vr{background: transparent;padding:20px;}
    .modal-vr .close-modal{top:35px;right:35px;}

    .modal-popup .modal-cont{height:100%;}

    .modal-private{padding:30px 20px;}

    .modal-private .modal-cont .policy-txt{height:100%;}
    .modal-private .close-modal{top: 37px;right: 20px;}
}