@charset "utf-8";
/* TOUN28-SD Team. YMJ. 20250509 */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap'); /* 웹폰트:NotoSansKR(한국어-고딕) */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200;300;400;500;600;700;900&display=swap'); /* 웹폰트:NotoSerifKR(한국어-명조) */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap'); /* 웹폰트:Roboto(영어) */

#wrap {text-align:center;}

.crewArea {display:inline-block; width:800px; margin:60px auto;}

/* 이미지 */
.crewArea .imgBox {display:block; position:relative; clear:both; overflow:hidden; padding:0; text-align:center;}
.crewArea .imgBox img {float:left; width:100%; object-fit:cover;}

/* 크루(noncrew) */
.crewArea .nonCrewBox {display:block; padding:150px 10%; text-align:left; background:#ebe3d8;}
.crewArea .nonCrewBox h3 {display:block; margin:0 0 90px 0; color:#1b1b1b; font-size:36px; font-weight:400;}
.crewArea .nonCrewBox .checkBox {position:relative; margin:0 0 45px 0;}
.crewArea .nonCrewBox .checkBox:last-child {margin:0;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle {display:none; border:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; box-sizing:border-box; resize:none;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle + label {display:block; position:relative; padding:0 0 0 55px; color:#1b1b1b; font-size:26px; font-weight:300; vertical-align:top; text-align:left; line-height:40px;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle + label:before {content:''; position:absolute; top:50%; left:0%; width:40px; height:40px; text-indent:-99px; border:none; border-radius:100px; background-color:#cfd0ca; transform:translate(0,-50%);}
.crewArea .nonCrewBox .checkBox .ipt_check_circle + label:after {content:''; position:absolute; top:50%; left:20px; width:18px; height:18px; background:url("https://toun28.s3.ap-northeast-2.amazonaws.com/img/new/ico_check_line_w.svg") no-repeat 50% 50%/100%; transform:translate(-50%,-50%); opacity:0.1;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle:checked + label {font-weight:400;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle:checked + label:before {background-color:#1b1b1b;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle:checked + label:after {opacity:1.0;}
.crewArea .nonCrewBox .btnBox {display:block; margin:90px 0 0 0;}
.crewArea .nonCrewBox .btnBox button {width:100%; height:70px; color:#fff; font-size:30px; letter-spacing:10px; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .nonCrewBox .btnBox button:hover, .crewArea .nonCrewBox .btnBox button:focus {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .nonCrewBox .btnBox button:disabled {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .nonCrewBox .btnBox button:disabled:hover, .crewArea .nonCrewBox .btnBox button:disabled:focus {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .nonCrewBox .btnBox button + .desc {display:block; font-size:20px; text-align:center;}
.crewArea .nonCrewBox .btnBox button + .desc {opacity:1.0;}
.crewArea .nonCrewBox .btnBox a {width:100%; height:60px; color:#fff; font-size:18px; line-height:60px; letter-spacing:0; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .nonCrewBox .btnBox a:hover, .crewArea .nonCrewBox .btnBox a:focus {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}

/* 크루(crew) */
.crewArea .crewBox {display:block; padding:0 0 90px 0; text-align:left; background:#ebe3d8;}
.crewArea .crewBox .imgBox {}
.crewArea .crewBox dl {display:block; margin:90px 0 0 0;}
.crewArea .crewBox dl dt {display:block; margin:0 0 70px 0; color:#1b1b1b; font-size:36px; font-weight:300; text-align:center; line-height:52px;}
.crewArea .crewBox dl dd {display:block; text-align:center;}
.crewArea .crewBox dl dd span {display:block; margin:0 0 20px 0; padding:0 30%; color:#1b1b1b; font-size:20px; font-weight:300; text-align:left;}
.crewArea .crewBox dl dd span:last-child {margin:0;}
.crewArea .crewBox dl dd span em {font-weight:300;}
.crewArea .crewBox .btnBox {display:block; margin:90px 0; padding:0 10%;}
.crewArea .crewBox .btnBox button {width:100%; height:70px; color:#fff; font-size:30px; letter-spacing:10px; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .crewBox .btnBox button:hover, .crewArea .crewBox .btnBox button:focus {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .crewBox .btnBox button:disabled {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .crewBox .btnBox button:disabled:hover, .crewArea .crewBox .btnBox button:disabled:focus {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .crewBox .btnBox button + .desc {display:block; font-size:20px; text-align:center;}
.crewArea .crewBox .btnBox button + .desc {opacity:1.0;}
.crewArea .crewBox .btnBox a {width:100%; height:60px; color:#fff; font-size:18px; line-height:60px; letter-spacing:0; border:2px solid #1b1b1b; background:#1b1b1b;}
.crewArea .crewBox .btnBox a:hover, .crewArea .crewBox .btnBox a:focus {color:#fff; border:2px solid #1b1b1b; background:#1b1b1b;}

/* 크루혜택 */
.crewArea .lst_benefit {display:block; padding:150px 10%; text-align:left; background:#dbd7cc;}
.crewArea .lst_benefit h3 {display:block; margin:0 0 90px 0; color:#1b1b1b; font-size:36px; font-weight:400;}
.crewArea .lst_benefit .dlBox {position:relative; margin:0 0 45px 0;}
.crewArea .lst_benefit .dlBox:last-child {margin:0;}
.crewArea .lst_benefit .dlBox dt {display:block; margin:0 0 5px 0; font-size:28px; font-weight:400;}
.crewArea .lst_benefit .dlBox dd {display:block; font-size:18px; font-weight:300;}

/* full popup */
.fullPopWrap {display:block; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(27,27,27,0.85); z-index:7777;}
.fullPopBox {display:none; overflow:hidden; position:absolute; top:50%; left:50%; width:450px; border-radius:0; background:#fffef1; transform:translate(-50%, -50%);}
.fullPopBox .fullPop_top {display:block; clear:both; overflow:hidden; position:relative; min-height:20px; padding:20px 25px; text-align:center; line-height:20px;}
.fullPopBox .fullPop_top h3 {color:#1b1b1b; font-size:18px; font-weight:500; letter-spacing:-0.5px;}
.fullPopBox .fullPop_top h3 + span {display:block; font-size:12px; font-weight:300; margin:5px 0 0 0; opacity:0.7;}
.fullPopBox .fullPop_top .btn_ico {overflow:hidden; position:absolute; top:10px; left:0; width:40px; height:40px; text-indent:-999px;}
.fullPopBox .fullPop_top .btn_ico.prev {background:url("https://toun28.s3.ap-northeast-2.amazonaws.com/img/new/arw_left_bk.svg") no-repeat 50% 50%/40%;}
.fullPopBox .fullPop_top .btn_txt {overflow:hidden; position:absolute; top:10px; right:16px; height:40px; font-size:14px; font-weight:400;}
.fullPopBox .fullPop_top .btn_txt.ft_clr_blue {color:#281DCB;}

.fullPopBox .fullPop_mid {display:block; overflow:auto; min-height:500px; max-height:600px;}

.fullPopBox .fullPop_mid .crew_txt {display:block; padding:50px 0; color:#1b1b1b; font-size:22px; font-weight:300; text-align:center; line-height:30px;}
.fullPopBox .fullPop_mid .crew_txt strong {display:block; margin:0 0 30px 0; font-size:36px; font-weight:400;}

.fullPopBox .fullPop_btm {display:block; clear:both; overflow:hidden; min-height:77px; padding:16px;}
.fullPopBox .fullPop_btm .desc {display:block; color:#989898; font-size:12px; font-weight:300; text-align:center;}
.fullPopBox .fullPop_btm .desc + a {margin:10px 0 0 0;}
.fullPopBox .fullPop_btm a {float:left; min-height:45px; color:#1b1b1b; font-size:15px; font-weight:500; text-align:center; line-height:45px; border:1px solid #d6d5cc; background:#fff;}
.fullPopBox .fullPop_btm a.btn_bg_bk {color:#fffef1; border:1px solid #1b1b1b; background:#1b1b1b;}
.fullPopBox .fullPop_btm a.btn_bg_bk:disabled {color:#ccc; border:1px solid #eee; background:#eee; cursor:not-allowed;}
.fullPopBox .fullPop_btm a:first-child:nth-last-child(1) {width:100%;}
.fullPopBox .fullPop_btm a:first-child:nth-last-child(2) {width:calc(50% - 3px); margin:0 3px 0 0;}
.fullPopBox .fullPop_btm a:first-child:nth-last-child(2) ~ a {width:calc(50% - 3px); margin:0 0 0 3px;}

.fullPopWrap .fullPopBox {display:block;}

/* -------------------- mobile -------------------- */
@media screen and (max-width:780px) {
.header h1 a {background-color:transparent; background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/renew/logo_white.svg); background-repeat:no-repeat; background-position:center 16px; background-size:contain;}
.header ul.list-gnb>li {color:#fff;}
.header ul.list-snb>li {color:#fff;}
.header ul.list-filter>li,.header ul.list-gnb>li {color:#fff;}
.header ul.list-gnb.mobile.m-sub-menu>li>a {color:#fff;}
.header ul.list-gnb.mobile.main>li {color:#fff;}
.header ul.list-gnb.mobile>li.cart {background-color:transparent; background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_cart_w.svg); background-repeat:no-repeat; background-position:center top; background-size:28px 28px;}
.header ul.list-gnb.mobile>li.cart .cart-count {color:#fff;}
.header ul.list-gnb.mobile>li.login {background-color:transparent; background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/toun/renew/icons/ico_login-w.svg); background-repeat:no-repeat; background-position:center top; background-size:28px 28px;}
.header ul.list-gnb.mobile li.ico-lang button {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_lang_w.svg);}
.header ul.list-gnb.gt-780>li.ico-cart a {color:#fff; background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_cart_w.svg);}
.header ul.list-gnb.gt-780>li.ico-like a {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_like_w.svg);}
.header .navTrigger i {background-color:#fff;}

.header .active h1 a {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/renew/logo_b.svg);}
.header .active ul.list-gnb>li {color:#1b1b1b;}
.header .active ul.list-gnb.mobile>li {color:#000;}
.header .active ul.list-gnb.mobile>li.cart,.header .cover ul.list-gnb.mobile>li.cart {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_cart_bk.svg);}
.header .active ul.list-gnb.mobile>li.login,.header .cover ul.list-gnb.mobile>li.login {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/toun/renew/icons/ico_login.svg);}
.header .active ul.list-gnb.mobile>li.cart .cart-count,.header .cover ul.list-gnb.mobile>li.cart .cart-count {color:#000;}
ul.list-gnb.mobile>li.like {background-color:transparent; background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_like_w.svg); background-repeat:no-repeat; background-position:center top; background-size:28px 28px;}
.header .active ul.list-gnb.mobile>li.like {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_like_bk.svg);}
.header .active ul.list-gnb.gt-780>li.ico-cart a {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_cart_bk.svg);}
.header .active ul.list-gnb.gt-780>li.ico-like a {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_like_bk.svg);}
.header .active ul.list-gnb.gt-780>li.ico-lang button {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_lang_bk.svg);}
.header .active ul.list-gnb.mobile li.ico-lang button {background-image:url(https://toun28.s3.ap-northeast-2.amazonaws.com/img/renew/ico_lang_bk.svg);}
.header .active .navTrigger i,.header .cover .navTrigger i {background-color:#000;}
.header .active ul.list-gnb.mobile.m-sub-menu>li>a {color:#000;}
	
.crewArea {width:100%; margin:0 0 70px 0;}
	
/* 크루(noncrew) */
.crewArea .nonCrewBox {padding:70px 15px;}
.crewArea .nonCrewBox h3 {margin:0 0 55px 0; padding:0 5px; font-size:1.6rem; font-weight:400;}
.crewArea .nonCrewBox .checkBox {margin:0 0 35px 0;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle + label {padding:0 0 0 45px; font-size:1.0rem; line-height:26px; letter-spacing:-1px;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle + label:before {width:34px; height:34px;}
.crewArea .nonCrewBox .checkBox .ipt_check_circle + label:after {left:17px; width:14px; height:14px;}
.crewArea .nonCrewBox .btnBox {margin:55px 0 0 0; padding:0 5px;}
.crewArea .nonCrewBox .btnBox button {height:60px; font-size:1.25rem; letter-spacing:5px;}
.crewArea .nonCrewBox .btnBox button + .desc {font-size:0.9rem;}
	
/* 크루(crew) */
.crewArea .crewBox {padding:0 0 70px 0;}
.crewArea .crewBox dl {margin:55px 0 0 0;}
.crewArea .crewBox dl dt {margin:0 0 35px 0; font-size:1.6rem; line-height:40px;}
.crewArea .crewBox dl dd span {margin:0 0 10px 0; padding:0 28%; font-size:1.0rem; line-height:26px;}
.crewArea .crewBox .btnBox {margin:55px 0 0 0; padding:0 20px;}
	
/* 크루혜택 */
.crewArea .lst_benefit {padding:70px 20px;}
.crewArea .lst_benefit h3 {margin:0 0 50px 0; font-size:1.6rem; font-weight:400;}
.crewArea .lst_benefit .dlBox dt {font-size:1.2rem;}
.crewArea .lst_benefit .dlBox dd {font-size:0.85rem; letter-spacing:-0.5px;}
	
/* full popup */
.fullPopBox {width:100%; height:100%;}
.fullPopBox .fullPop_top h3 {font-size:1.2rem;}
.fullPopBox .fullPop_top .btn_txt {top:12px; font-size:0.95rem;}
.fullPopBox .fullPop_mid {overflow:auto; height:auto; max-height:initial; min-height:inherit; padding:0 0 30px 0;}
.fullPopBox .fullPop_mid.only {height:calc(100% - 60px);}
.fullPopBox .fullPop_mid .crew_txt {font-size:1.25rem; line-height:normal;}
.fullPopBox .fullPop_mid .crew_txt strong {font-size:2.0rem;}
.fullPopBox .fullPop_btm {height:90px;}
.fullPopBox .fullPop_btm button {font-size:1rem;}
.fullPopBox .fullPop_btm a {height:50px; font-size:1rem;}
.fullPopBox .fullPop_btm .desc {font-size:0.7rem;}
}