
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */color: #bdbdbd;opacity: 1; /* Firefox */}
:-ms-input-placeholder { /* Internet Explorer 10-11 */color: #bdbdbd;}
::-ms-input-placeholder { /* Microsoft Edge */color: #bdbdbd;}


/* popup */
.popup-wrap {position: fixed;top: 0;left: 0;width: 100%;height: 100%;overflow-x: hidden;overflow-y: auto;padding: 0rem; z-index: 100;display: none;background-color: rgba(255, 255, 255, 0.5);}
.popup-wrap img {width:100%;}
.popup-wrap .popup-dimed {position:absolute;top:0;left:0;width:100%;height: 100%;background-color: rgba(255, 255, 255, 0);}
.popup-container {width: 100%;margin: 0 auto;position: relative;max-width: 720px;}
.popup-container .popup-header {position: absolute;top:0px;left:0px;width: 100%;}
.popup-container .popup-header .close-btn {position:absolute;top: 26%;left: 3.1%;width: 5%;z-index: 1;cursor:pointer;}
.popup-container .popup-section {position: relative;width: 100%;margin: 0 auto;background-image: url(../images/popup/popup-bg.jpg);background-repeat: repeat;background-size: contain;}

#popup-noMemberData .popup-btn1 {top: 77%;left: 6%;right: 6%;height: 8.4%;}

/*회원정보*/
#popup-member-info .popup-section .popup-content {margin: 6vw 5vw 0 4.6vw;}
#popup-member-info .title1 {font-size: 6vw;font-weight: bold;color:#fff;line-height: 1.5;}
#popup-member-info .title2 {font-size: 5vw;/* font-weight: bold; */color:#ffda8e;}
#popup-member-info .title3 {font-size: 6vw;font-weight: bold;color:#fff;line-height: 1.5;}
#popup-member-info .title4 {font-size: 6vw;/* font-weight: bold; */color:#ffda8e;}
#popup-member-info .info-container {position:relative;width:100%;border-radius: 6px;overflow: hidden;background-color: #eeeeee;margin-top: 4.6vw;padding: 4.5vw;line-height: 1.5;}
#popup-member-info .info-container .it-1{font-size: 4.5vw;color:#ba8523;}
#popup-member-info .info-container .it-2{font-size: 4.7vw;color:#000;line-height: 2.2;border-bottom: 1px solid #c9c9c9;margin-bottom: 7.6vw;}
#popup-member-info .info-container .it-3{font-size: 4.5vw;color:#ba8523;}
#popup-member-info .info-container .it-4{font-size: 4vw;color:#242424;}
#popup-member-info .info-container .it-5{font-size: 4vw;color: #242424;line-height: 1.9;}
#popup-member-info .info-container .price-table{border-radius: 4px;overflow: hidden;border:1px solid #c9c9c9;margin-top: 2vw;line-height: 12.2vw;}
#popup-member-info .info-container .price-table div{width:100%;clear: both;/* line-height: 3; */padding: 0 3.1vw;}
#popup-member-info .info-container .price-table div:last-child{border-top: 1px solid #c9c9c9;}
#popup-member-info .info-container .price-table div .title{float:left;font-size: 4.3vw;font-weight: bold;color:#000;}
#popup-member-info .info-container .price-table div .price{float:right;font-size: 4.9vw;font-weight: bold;color:#ba8523;}
#popup-member-info .info-container .comment{font-size: 3.2vw;color:#363636;clear:both;display: block;padding-top:2vw;}
#popup-member-info .info-container .month-select-box{display:flex;margin-bottom:30px;}
#popup-member-info .info-container .month-select { /*background: #261f18;*/background: #919191;padding:2px 20px;margin-right: 5px;color:#fff;border-radius: 6px 6px 0px 0px;font-size:4.3vw;}
#popup-member-info .info-container .month-select.selected {background: #261f18;}
#popup-member-info table.date-table {width:100%;border-collapse: collapse;margin: 8vw 0 0vw 0;/* border-radius: 4px; *//* overflow: hidden; */}
#popup-member-info table.date-table tr th{border:unset;color:#fff;text-align: center;}
#popup-member-info table.date-table tr td{text-align: center;border-bottom: 1px solid #c9c9c9;}
#popup-member-info table.date-table tr td:nth-child(1) {font-size: 3.7vw;color:#3b3228;border-left:1px solid #3b3228;line-height: 2.5;}
#popup-member-info table.date-table tr td:nth-child(2) {font-size: 4vw;color:#ba8523;border-left:1px solid #3b3228;text-align: right;padding-right: 5px;}
#popup-member-info table.date-table tr td:nth-child(3) {font-size: 4vw;color:#ba8523;border-left:1px solid #3b3228;border-right:1px solid #3b3228;}
#popup-member-info table.date-table thead tr:nth-child(2) {border:1px solid #3b3228;}
#popup-member-info table.date-table thead tr:nth-child(2) td{font-size: 4vw;font-weight: bold;line-height: 2.4;border:1px solid #3b3228;color:#3b3228;text-align: center;}
#popup-member-info table.date-table tr th:first-child{border-radius: 4px 4px 0 0;overflow: hidden;background-color: #3b3228;line-height: 1.9;font-size: 4.8vw;}
#popup-member-info table.date-table tr:last-child td {border-bottom:1px solid #3b3228;}
#popup-member-info .popup-btn-1 {width:34.4%;cursor:pointer;max-width: 116px;}
#popup-member-info .popup-btn-2 {float:right;width: 42.2%;vertical-align: middle;cursor:pointer;max-width: 136px;}
#popup-member-info .popup-btn-3 {width:100%;margin-top: 5vw;cursor:pointer;}
#popup-member-info .popup-btn-4 {float:right;width:30%;margin: 3vw 0;cursor:pointer;max-width: 123px;}
#popup-member-info .popup-btn-5 {width:100%;margin: 10vw 0;cursor:pointer;}

/*지니 멤버스 등급별 헤택*/
#popup-benefit .benefit-tab {position: relative;}
#popup-benefit .benefit-tab img {display: none;}
#popup-benefit .benefit-tab img.active {display: block;}
#popup-benefit .benefit-tab .popup-btn-1 {top:0;width: 50%;left:0%;height:100%;cursor:pointer;}
#popup-benefit .benefit-tab .popup-btn-2 {top:0;width: 50%;left:50%;height:100%;cursor:pointer;}
#popup-benefit .benefit-tab-cont {position:relative;width:100%;display: none;}
#popup-benefit .benefit-tab-cont.active {display: block;}
#popup-benefit .benefit-tab-cont .benefit-tab2-tab {position: relative;width:100%;cursor:pointer;}
#popup-benefit .benefit-tab-cont .benefit-tab2-tab img{display: none;}
#popup-benefit .benefit-tab-cont .benefit-tab2-tab img.active {display: block;}
#popup-benefit .benefit-tab-cont .benefit-tab-2-cont{display: none;background-image: url(../images/popup/benefit-tab-cont-bg.jpg);background-repeat: repeat;background-size: 100%;padding: 0 9.1vw;}
#popup-benefit .benefit-tab-cont .benefit-tab-2-cont.active {display: block;}
#popup-benefit .benefit-tab-cont .popup-btn-3 {top:0;width: 50%;left:0%;height:100%;cursor:pointer;}
#popup-benefit .benefit-tab-cont .popup-btn-4 {top:0;width: 50%;left:50%;height:100%;cursor:pointer;}
#popup-benefit .benefit-tab-cont .benefit-tab-2-cont .desc{margin-bottom: 3vw;}
#popup-benefit .benefit-tab-cont .benefit-tab-wrap {position: relative;width:100%;margin-top:1px;}
#popup-benefit .benefit-tab-cont .benefit-tab-wrap .benefit-tab-header{position: relative;width:100%;cursor:pointer;}
#popup-benefit .benefit-tab-cont .benefit-tab-wrap .benefit-tab-header .arrow{position: absolute;top:50%;right: 6.2%;width: 4.9%;transform: translateY(-50%);display: none;}
#popup-benefit .benefit-tab-cont .benefit-tab-wrap .benefit-tab-header .arrow.active{display: block;}
#popup-benefit .benefit-tab-cont .benefit-tab-wrap .benefit-tab-body {display: none;padding: 4vw 0 7vw 0;}
#popup-benefit .benefit-tab-cont .benefit-tab-wrap .benefit-tab-body.active {display: block;}

/*본인인증*/
#popup-auth .popup-section .popup-content {margin: 6vw 5vw 0 4.6vw;padding-bottom: 8vw;}
#popup-auth .info-container {position:relative;width:100%;border-radius: 6px;overflow: hidden;background-color: #eeeeee;margin-top: 4.6vw;padding: 4.5vw;line-height: 1.5;margin-bottom: 7vw;}
#popup-auth .info-container .privacy{position:relative;width:100%;}
#popup-auth .auth-table {width:100%;background-color:#fff;border-radius: 4px;overflow: hidden;border:1px solid #c9c9c9; }
#popup-auth .auth-table .auth-table-row {position:relative;border-bottom: 1px solid #c9c9c9;clear: both;/* line-height: 12vw; */}
#popup-auth .auth-table .auth-table-row input {font-size: 4vw;line-height: 12vw;padding-left: 5px;}
#popup-auth .auth-table .auth-table-row .username {width:100%;background-color: transparent;border:unset;}
#popup-auth .auth-table .auth-table-row .mobile {width:70%;background-color: transparent;border:unset;}
#popup-auth .auth-table .auth-table-row .certifyno {width: 82%;background-color: transparent;border:unset;}
#popup-auth .auth-table .auth-table-row .timer {position: absolute;right: 3.3%;width:20%;top:50%;font-size: 3.5vw;transform: translateY(-50%);color: #f94e4e;text-align: right;}
#popup-auth .popup-btn-1 {position:absolute;top:50%;transform:translateY(-50%);right:2.3%;width:25%;}
#popup-auth .popup-btn-2 {position:absolute;top:50%;transform:translateY(-50%);right:2.3%;width:25%;}
#popup-auth .check {position:absolute;top:40%;left:5%;width: 6.3%;cursor:pointer;}
#popup-auth .check .check-on {display: none;}
#popup-auth .check .check-off {display: block;}
#popup-auth .check.active .check-on {display: block;}
#popup-auth .check.active .check-off {display: none;}
#popup-auth .check1 {top: 37.9%;left:5%;}
#popup-auth .check2 {top: 61%;left:5%;}
#popup-auth .popup-btn-6 {top: 35%;left:5%;width:90%;height: 20%;}
#popup-auth .popup-btn-7 {top: 60%;left:5%;width:90%;height: 17%;}

/*약관*/
#popup-privacy .privacy-content {position: absolute;top: 20%;left: 6.3%;width: 87.2%;height: 57.4%;border:1px solid #c9c9c9;border-radius: 4px;overflow:hidden;background-color: #fff;}
#popup-privacy .privacy-content img{width:500px;}
#popup-privacy .popup-btn-1 {left: 6%;bottom: 5.9%;width: 88.2%;height: 7.9%;}

@media (min-width: 450px) {
    .popup-container {max-width: 450px;}

    .popup-container.mw450 {max-width: 450px;}
    .popup-container.mw530 {max-width: 530px;}

    #popup-member-info .popup-section .popup-content {margin: 24px 20px 0 18px;}
    #popup-member-info .title1 {font-size: 24px;}
    #popup-member-info .title2 {font-size: 20px;}
    #popup-member-info .title3 {font-size: 24px;}
    #popup-member-info .title4 {font-size: 24px;}
    #popup-member-info .info-container {margin-top: 18px;padding: 18px;}
    #popup-member-info .info-container .it-1{font-size: 18px;}
    #popup-member-info .info-container .it-2{font-size: 18px;margin-bottom: 30px;}
    #popup-member-info .info-container .it-3{font-size: 18px;}
    #popup-member-info .info-container .it-4{font-size: 16px;}
    #popup-member-info .info-container .it-5{font-size: 16px;}
    #popup-member-info .info-container .price-table{margin-top: 8px;line-height: 49px;}
    #popup-member-info .info-container .price-table div{padding: 0 12px;}
    #popup-member-info .info-container .price-table div .title{font-size: 17px;}
    #popup-member-info .info-container .month-select-box{margin-bottom:30px;}
    #popup-member-info .info-container .month-select {font-size: 18px;}
    #popup-member-info .info-container .price-table div .price{font-size: 19px;}
    #popup-member-info .info-container .comment{font-size: 13px;padding-top:8px;}
    #popup-member-info table.date-table {margin: 24px 0 0px 0;}
    #popup-member-info table.date-table tr td:nth-child(1) {font-size: 15px;}
    #popup-member-info table.date-table tr td:nth-child(2) {font-size: 16px;}
    #popup-member-info table.date-table tr td:nth-child(3) {font-size: 16px;}
    #popup-member-info table.date-table thead tr:nth-child(2) td{font-size: 16px;}
    #popup-member-info table.date-table tr th:first-child{border-radius: 16px 16px 0 0;font-size: 19px;}
    #popup-member-info .popup-btn-3 {margin-top: 20px;}
    #popup-member-info .popup-btn-4 {margin: 12px 0;}
    #popup-member-info .popup-btn-5 {margin: 40px 0;}

    /*지니 멤버스 등급별 헤택*/
    #popup-benefit .benefit-tab-cont .benefit-tab-2-cont{padding: 0 9%;}
    #popup-benefit .benefit-tab-cont .benefit-tab-2-cont .desc{margin-bottom: 12px;}
    #popup-benefit .benefit-tab-cont .benefit-tab-wrap .benefit-tab-body {padding: 16px 0 28px 0;}

    /*본인인증*/
    #popup-auth .popup-section .popup-content {margin: 24px 20px 0 18px;padding-bottom: 32px;}
    #popup-auth .info-container {margin-top: 18px;padding: 20px;margin-bottom: 28px;}
    #popup-auth .auth-table .auth-table-row input {font-size: 16px;line-height: 48px;height:48px;}
    #popup-auth .auth-table .auth-table-row .timer {font-size: 15px;}
    #popup-auth .popup-btn-1 {position:absolute;top:50%;transform:translateY(-50%);right:2.3%;width:25%;cursor:pointer;max-width: 107px;}
    #popup-auth .popup-btn-2 {position:absolute;top:50%;transform:translateY(-50%);right:2.3%;width:25%;cursor:pointer;}
    #popup-auth .check {position:absolute;top:40%;left:5%;width: 6.3%;cursor:pointer;}
    #popup-auth .check .check-on {display: none;}
    #popup-auth .check .check-off {display: block;}
    #popup-auth .check.active .check-on {display: block;}
    #popup-auth .check.active .check-off {display: none;}
    #popup-auth .check1 {top: 37.9%;left:5%;}
    #popup-auth .check2 {top: 61%;left:5%;}
    #popup-auth .popup-btn-6 {top: 35%;left:5%;width:90%;height: 20%;cursor:pointer;}
    #popup-auth .popup-btn-7 {top: 60%;left:5%;width:90%;height: 17%;cursor:pointer;}
}