@charset "UTF-8";

* {-webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box;}
a:focus {border:none; background:none; outline:0;}

/*********common*********/
#fullpage {position:relative; width:100vw; height:100vh; text-align:center; background:#f7e9ca url("../images/bg_study_top.png") no-repeat left top / 100% auto;}
#fullpage.page_k:before {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("../images/bg_study_bottom.png") no-repeat left bottom / 100% auto;}
#fullpage.page_k {background:#ffdde1 url("../images/bg_K_top.png") no-repeat left top / 100% auto;}
#fullpage.page_k:before {background:url("../images/bg_K_bottom.png") no-repeat left bottom / 100% auto;}
#fullpage.page_k.k_chatacter:after {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("http://roomkidsmon.cdn3.cafe24.com/bg_K_character.png") no-repeat left bottom / 100% auto;}
.content {position:absolute; left:0; top:0; width:100%; height:100%; z-index:10;}
.copyright {width:100%; text-align:center; font-size:0.8vw; opacity:1; z-index:100; position: absolute; left: 0; margin-top: 20px; font-family: 'Binggrae'; font-weight: bold; color:#999;}
.copyright a {font-size: 1vw;}
.copyright_m {position:absolute; left:0; bottom:4%; width:100%; text-align:center; font-size:2.4vw; opacity:1.5;}

.footer {position:absolute; left:0; bottom:1.6vw; width:100%; text-align:center; font-size:1vw; opacity:0.4;}

.header {position:relative; margin:2% 0 0 0;}
.header h2.tit {color:#352d2a; font-size:5vw; line-height:11vh; text-shadow:0 0.3vw #fcc8d2; font-family:'yg-jalnan';}
.header h2.tit span {color:#f7709a}
.header ul {position:absolute; top:0; width:30%;}
.header ul:after {clear:both; content:""; display:block;}
.header ul li {float:left; margin-right:1%; }
.header ul li a {display:block; width:6vw; height:6vw; text-indent:-9999px;}
.header ul li a.back {background:url("../images/btn_k_back.png") no-repeat center center / 100% 100%;}
.header ul li a.home {background:url("../images/btn_k_home.png") no-repeat center center / 100% 100%;}
.header ul li a.btn_mypage {background:url("../images/btn_k_mypage.png") no-repeat center center / 100% 100%;}
a.btn_admin {background:url("../images/btn_admin.png") no-repeat center center / 100% 100%;}
a.btn_logout {background:url("../images/btn_logout.png") no-repeat center center / 100% 100%;}
a.btn_login {background:url("../images/btn_login.png") no-repeat center center / 100% 100%;}
a.btn_question {background:url("../images/btn_question.png") no-repeat center center / 100% 100%;}

.header ul.home_btn {left:2%;}
.header ul.home_btn li {float:left;margin-right:1vw;}
.header ul.btn_right {right:2%;}
.header ul.btn_right li {float:right;}

.reg_tits {text-align: center; font-size: 4vw;}
.reg_body {display: block !important; padding-top: 120px;}
.help_t {color:#999; font-weight: 500 !important; margin-bottom: 3vh; font-size: 1.5vw; word-break: keep-all;}
.reg_body .fl {float:left; width: 59%; margin-bottom: 1vh;}
.reg_body .fr {float:right; width: 39%; margin-bottom: 1vh;}
.reg_body .fl input  {height:6.6vh !important; box-sizing: border-box;}
.reg_body .fr button {height:6.6vh !important;}
.reg_body .cb {clear: both;}

h1.logo {width:40%; margin:0 auto; padding-top:5%; padding-bottom:3%;}
ul.study_list {padding:0 7%;}
ul.study_list:after {clear:both; content:""; display:block;}
ul.study_list li {float:left; width:23%; margin:0 1%;}
ul.study_list li img:last-child {display:none;} 
ul.study_list li:hover img:first-child {display:none;}
ul.study_list li:hover img:last-child {display:inline-block;}
ul.study_list.type_center {padding:0 20%;}
ul.study_list.type_center li {width:31%;}

html, body {overflow-y: auto;}
.none_cl {cursor: inherit !important;}


ul.book_list {padding:0 12%;}
ul.book_list:after {clear:both; content:""; display:block;}
ul.book_list li {position:relative; float:left; width:18%; margin:0.5% 1%;}
ul.book_list li h3 {position:absolute; width:100%; top:30%; color:#888; font-weight:600;font-size:2.5vw; text-align:center; font-family: 'Binggrae';}
ul.book_list li h3 span {display:block; font-size:4vw; line-height:3.6vw;font-family: 'yg-jalnan';}
ul.book_list li h3 strong {display:inline-block; font-size:2vw; line-height:2.6vw; padding-top:1.8vw;}
ul.book_list li h3 b {display:block; height:6vw;}
ul.book_list li h3 b img {height:100%;}
ul.book_list li h3.level_icon {top:15%;}
ul.book_list li h3.level_icon strong {padding-top:0.6vw;}
ul.book_list li h4 {}
ul.book_list li h5 {display:none;}
ul.book_list li h6 {display:none;}
ul.book_list li.on h3 {color:#352d2a;}
ul.book_list li.on h4 {display:none;}
ul.book_list li.on h5 {display:block;}
ul.book_list li.on:hover h5 {display:none;}
ul.book_list li.on:hover h6 {display:block;}

.detail_video {position:relative; padding:1.5% 0;}
.detail_video .swiper-container {}
.detail_video .swiper-slide {margin:0 0.5%; width:12%; cursor:pointer;}
.detail_video .swiper-slide p {padding-top:3%;}
.detail_video .swiper-slide p span {font-size:1.2vw; color:#352d2a; padding-left:14%; font-family: 'Binggrae'; background:url("../images/btn_play.png") no-repeat left center / 1.6vw auto;}
.detail_video .swiper-slide a > span {display:block; position:absolute; right:0.5vw; top:0.5vw; color:#fff; font-size:1.6vw; width:2.6vw; height:2.6vw; line-height:2.6vw; z-index:1; background:#ec5c01; border-radius:100%; font-family: 'yg-jalnan';}


div.detail_day {position:relative; width:48%; margin:0 auto; padding:0.6%; background:#fff; border:0.3vw solid #f886a9; border-radius:3vw; /*background:url("../images/detail_k_bg.png") no-repeat center center / 100% auto;*/}
div.detail_day .day_box {padding:1% 9% 1% 7%; border:0.12vw dashed #f886a9; border-radius:2.4vw;}
div.detail_day .day {padding:1% 0;}
div.detail_day .day dl {}
div.detail_day .day dl:after {clear:both; content:""; display:block;}
div.detail_day .day dl dt {float:left; width:15%}
div.detail_day .day dl dd {float:left; width:15%; margin-left:2%; cursor:pointer; position:relative;}
div.detail_day .day dl dd h4 {}
div.detail_day .day dl dd h5 {display:none;}
div.detail_day .day dl dd:hover h4 {display:none;}
div.detail_day .day dl dd:hover h5 {display:block;}
div.detail_day .day dl dd span {display:block; position:absolute; right:0vw; top:0vw; color:#fff; font-size:0.8vw; width:1.4vw; height:1.4vw; line-height:1.4vw; z-index:1; background:#ec5c01; border-radius:100%; font-family: 'yg-jalnan';}

div.detail_day:after {position:absolute; left:-6%; top:10%; content:""; width:13%; height:100%; background:url("../images/day_k1.png") no-repeat left top / 100% auto;}
div.detail_day:before {position:absolute; right:-8%; bottom:-3%; content:""; width:15%; height:100%; background:url("../images/day_k2.png") no-repeat left bottom / 100% auto;}


.percent {}
.percent.width50 {width:50%; margin:1.5% auto 0; }
.percent .bar {text-align:left; position:relative; background:#d5d5d5; border:0.15vw solid #fff; border-radius:100px; height:1.6vw; box-shadow:inset 0 3px 3px rgba(0, 0, 0, .1); width:100%;}
.percent .bar .bar_color {position:relative; background:#ff5395; height:1.6vw; border-radius:100px;}
.percent .bar .bar_color:after {position:absolute; right:-1.5vw; top:-0.7vw; width:3vw; height:3vw; content:""; background:url("../images/process_heart.png") no-repeat right center / 100% 100%;}
.percent .bar_text {position:relative; width:100%; padding-top:1%;}
.percent .bar_text:after {clear:both; content:""; display:block;}
.percent .bar_text li {position:absolute; margin-left:-1.5%; color:#dd4e85; font-size:1.4vw; font-weight:600; font-family: 'Binggrae';}
.percent .bar_text li span {font-size:1vw;}
.percent .bar_text li.text_0per {left:0%; margin:0;}
.percent .bar_text li.text_20per {left:20%;}
.percent .bar_text li.text_50per {left:50%;}
.percent .bar_text li.text_80per {left:80%;}
.percent .bar_text li.text_100per {left:100%; margin-left:-4%;}
.percent .bar .bar_color.full_medal:after {right:-1vw; top:-1vw; width:3.5vw; height:3.5vw; background:url("../images/process_success.png") no-repeat right center / 100% 100%;}




/*mypage*/
::-webkit-scrollbar { width:0.8vw; border-radius:10px; background-color:#d5d5d5; box-shadow:inset 0 3px 3px rgba(0, 0, 0, .1);} /* 스크롤 바 */
::-webkit-scrollbar-track {  } /* 스크롤 바 밑의 배경 */
::-webkit-scrollbar-thumb { background: #1b2e75; border-radius: 10px; } /* 실질적 스크롤 바 */
::-webkit-scrollbar-thumb:hover { background: #1b2e75; } /* 실질적 스크롤 바 위에 마우스를 올려다 둘 때 */
::-webkit-scrollbar-thumb:active { background: #1b2e75; } /* 실질적 스크롤 바를 클릭할 때 */
::-webkit-scrollbar-button { display: none; } /* 스크롤 바 상 하단 버튼 */


#fullpage.page_my .header {margin-top:0;}
#fullpage.page_my .header ul.home_btn {padding-top:2%;}
#fullpage.page_my .header ul.home_btn li a.back {background:url("../images/btn_a_back.png") no-repeat center center / 100% 100%;}
#fullpage.page_my .header ul.home_btn li a.home {background:url("../images/btn_a_home.png") no-repeat center center / 100% 100%;}
.header ul li.my_info {position:relative; font-size:1.2vw; background:#fff4dc; border:0.1vw solid #fe792c; border-radius:100px; padding:0.4vw 1.2vw; margin-right:6.5vw; margin-top:1.5vw; font-family: 'yg-jalnan';}
.header ul li.my_info:after {position:absolute; right:-6.5vw; top:-1.5vw; content:""; width:6vw; height:6vw; background:url("../images/icon_info.png") no-repeat center center / 100% 100%;}
.header ul li.my_info span {color:#fe792c;}
.header .my_tit {padding-top:1.5vw;}
.header .my_tit .my_text {display:inline-block; padding-bottom:2.6vw; }
.header .my_tit .my_text h2 {font-size:3vw; padding-top:2vw; font-family: 'yg-jalnan';}
.header .my_tit .my_text h2 span {color:#fe792c;}
.header .my_tit .my_text h3 {font-size:2.4vw; padding-top:0.2vw; font-family: 'Binggrae';}
.header .my_tit .my_text h4 {display:inline-block; font-size:3.2vw; padding:0; color:#fe792c; margin-top:0vw; border-top:0.1vw dashed #fe792c; border-bottom:0.1vw dashed #fe792c; font-family: 'Binggrae';}
.header .my_tit .my_text p {font-size:1.2vw; color:#735043; padding-top:0.6vw; font-family: 'Binggrae';}


#fullpage.page_my {background:#fff4dc url("../images/mypage_bg_top.png") no-repeat left top / 100% auto;}
/*#fullpage.page_my:before {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("../images/mypage_bg_bottom.png") no-repeat left bottom / 100% auto;}
*/
.mypage_cont {margin:0 3vw; padding:4vw 6vw; border:0.4vw solid #e9c186; background:#fff4dc; border-radius:6vw; }
.mypage_cont table {font-family: 'Binggrae'}
.mypage_cont table th {background:#e9c186; padding:0.8vw; color:#fff; font-size:1.4vw; border-radius:10px; margin:10px; }
.mypage_cont table td {background:#fff;}
.mypage_box {height:26vw; overflow-y:scroll; overflow-x:hidden; }

.table_list {margin-right:2vw; font-family: 'Binggrae'}
.table_list > ul {width:100%; }
.table_list > ul:after {clear:both; content:""; display:block;}
.table_list > ul > li {float:left; box-sizing:border-box;}
.table_list > ul > li:after {clear:both; content:""; display:block;}
.table_list > ul > li:nth-child(1) {width:10%;}
.table_list > ul > li:nth-child(2) {width:80%;}
.table_list > ul > li:nth-child(3) {width:10%;}

.table_list > ul.table_th {}
.table_list > ul.table_th > li {background:#e9c186; padding:1.2vw 0; color:#fff; font-size:2vw; border-radius:0.8vw; border-bottom:0.25vw solid #d3a663;}
.table_list > ul.table_th > li:nth-child(1) {width:7.5%; margin-right:0.5%}
.table_list > ul.table_th > li:nth-child(2) {width:75%; margin:0 0.5%;}
.table_list > ul.table_th > li:nth-child(3) {width:15.5%; margin-left:0.5%}

.table_list > ul.table_td {background:#fff; border-radius:0.8vw; padding:1.5vw 0; margin-top:0.7vw;}
.table_list > ul.table_td > li {}
.table_list > ul.table_td > li:nth-child(1) {width:8%; font-size:1.8vw; padding:0.4vw 0;}
.table_list > ul.table_td > li:nth-child(2) {width:76%; padding:0 3%; border-left:0.1vw solid #e9c186; border-right:0.1vw solid #e9c186;}
.table_list > ul.table_td > li:nth-child(3) {width:16%; font-size:1.2vw;}
.table_list > ul.table_td > li .percent {float:left; width:88%;}
.table_list > ul.table_td > li .percent_total {float:left; width:12%; text-align:right; color:#aaaaaa; font-size:2vw;}
.table_list > ul.table_td > li .percent_total span {font-size:1.2vw;}
.table_list > ul.table_td > li .percent {padding-top:0.3vw;}
.table_list > ul.table_td > li .percent .bar {height:0.8vw;}
.table_list > ul.table_td > li .percent .bar .bar_color {height:0.8vw; background-image: linear-gradient(to right, #e7cda6 , #fe792c);}
.table_list > ul.table_td > li .percent .bar .bar_color:after {right:-0.7vw; top:-0.5vw; width:1.8vw; height:1.8vw; }
.table_list > ul.table_td > li .percent .bar_text {padding-top:0.5%; height:1vw;}
.table_list > ul.table_td > li .percent .bar_text li {font-size:0.8vw; color:#bc8134;}
.table_list > ul.table_td > li .percent .bar_text li span {font-size:0.8vw;}
.table_list > ul.table_td > li.full_100 .percent .bar .bar_color:after {right:-1vw; top:-0.8vw; width:3vw; height:3vw; background:url("../images/process_success.png") no-repeat right center / 100% 100%;}
.table_list > ul.table_td > li.full_100 .percent .bar_text li:last-child {display:none;}
.table_list > ul.table_td > li.full_100 .percent_total {color:#fe9500;}
.table_list > ul.table_td > li.btn a {display:inline-block; width:100%; height:2.5vw; font-size:1.5vw; padding-top:0.5vw; box-sizing:border-box;}
.table_list > ul.table_td > li.btn a span {padding-left:2vw; background:url("../images/btn_search.png") no-repeat left center / 1.4vw 1.4vw;}
.table_list > ul.table_td > li.btn a:hover {color:#fe9500;}
.table_list > ul.table_td > li.btn a:hover span {background:url("../images/btn_search_on.png") no-repeat left center / 1.4vw 1.4vw;}
.table_list > ul.table_td > li.td_left {font-size:1.8vw; text-align:left; padding:0.4vw 3%;}
.table_list > ul.table_td > li.td_left span {display:inline-block; color:#fff; margin-left:1%; width:2.2vw; height:2.2vw; line-height:2.2vw; text-align:center; background:#fe792c; border-radius:100%;}
.table_list > ul.table_td > li.td_result {height:2.8vw; padding:0.2vw 0;}
.table_list > ul.table_td > li.td_result img {height:100%;}

.result_friend {margin-right:2vw; margin-top:5vw;}
.result_friend .result_tit {position:relative; font-size:2.4vw; margin-bottom:1vw; font-family: 'Binggrae'; font-weight:600;}
.result_friend .result_tit:after {position:absolute; left:0; top:1.2vw; height:0.1vw; width:27vw; content:""; z-index:0; border-top:0.1vw dashed #fe792c;}
.result_friend .result_tit:before {position:absolute; right:0; top:1.2vw; height:0.1vw; width:27vw; content:""; z-index:0; border-top:0.1vw dashed #fe792c;}
.result_friend .result_cont {padding:1vw;}
.result_friend .result_cont:after {clear:both; content:""; display:block;}
.result_friend .result_cont .result_people {float:left; width:8%;}
.result_friend .result_cont .result_people img {width:100%;}
.result_friend .result_cont .percent {float:left; width:90%; margin-left:2%; margin-top:2%;}
.result_friend .result_cont .percent .bar .bar_color {background-image: linear-gradient(to right, #e7cda6 , #fe792c);}
.result_friend .result_cont .percent .bar_text li {color:#bc8134;}


/*k컬러변경*/
.page_k .detail_video .swiper-slide a > span{background:#dd4e85;}
.page_k div.detail_day .day dl dd span {background:#dd4e85;}


/*a컬러변경*/
#fullpage.page_a {background:#fee4cf url("../images/bg_A_top.png") no-repeat left top / 100% auto;}
#fullpage.page_a:before {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("../images/bg_A_bottom.png") no-repeat left bottom / 100% auto;}
#fullpage.page_a.a_chatacter:after {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("http://roomkidsmon.cdn3.cafe24.com/bg_A_character.png") no-repeat left bottom / 100% auto;}
.page_a .header h2.tit {text-shadow:0 0.3vw #f7c093;}
.page_a .header h2.tit span {color:#f27e41}
.page_a .header ul.home_btn li a.back {background:url("../images/btn_a_back.png") no-repeat center center / 100% 100%;}
.page_a .header ul.home_btn li a.home {background:url("../images/btn_a_home.png") no-repeat center center / 100% 100%;}
.page_a .header ul li a.btn_mypage {background:url("../images/btn_a_mypage.png") no-repeat center center / 100% 100%;}
.page_a div.detail_day {border:0.3vw solid #f9a353;}
.page_a div.detail_day .day_box {border:0.12vw dashed #f9a353;}
.page_a div.detail_day:after {background:url("../images/day_a1.png") no-repeat left top / 100% auto;}
.page_a div.detail_day:before {right:-13%; width:22%; background:url("../images/day_a2.png") no-repeat left bottom / 100% auto;}
.page_a .percent .bar .bar_color {background:#f27e41;}
.page_a .percent .bar_text li {color:#f27e41;}
.page_a .detail_video .swiper-slide a > span {background:#f27e41;}
.page_a div.detail_day .day dl dd span {background:#f27e41;}

/*b컬러변경*/
#fullpage.page_b {background:#deefca url("../images/bg_B_top.png") no-repeat left top / 100% auto;}
#fullpage.page_b:before {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("../images/bg_B_bottom.png") no-repeat left bottom / 100% auto;}
#fullpage.page_b.b_chatacter:after {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("http://roomkidsmon.cdn3.cafe24.com/bg_B_character.png") no-repeat left bottom / 100% auto;}
.page_b .header h2.tit {text-shadow:0 0.3vw #c2de9f;}
.page_b .header h2.tit span {color:#48a942}
.page_b .header ul.home_btn li a.back {background:url("../images/btn_b_back.png") no-repeat center center / 100% 100%;}
.page_b .header ul.home_btn li a.home {background:url("../images/btn_b_home.png") no-repeat center center / 100% 100%;}
.page_b .header ul li a.btn_mypage {background:url("../images/btn_b_mypage.png") no-repeat center center / 100% 100%;}
.page_b div.detail_day {border:0.3vw solid #a7d273;}
.page_b div.detail_day .day_box {border:0.12vw dashed #a7d273;}
.page_b div.detail_day:after {left:-8%; width:12%; background:url("../images/day_b1.png") no-repeat left top / 100% auto;}
.page_b div.detail_day:before {right:-11%; width:21%; background:url("../images/day_b2.png") no-repeat left bottom / 100% auto;}
.page_b .percent .bar .bar_color {background:#48a942;}
.page_b .percent .bar_text li {color:#48a942;}
.page_b .detail_video .swiper-slide a > span {background:#48a942;}
.page_b div.detail_day .day dl dd span {background:#48a942;}


/*c컬러변경*/
#fullpage.page_c {background:#ded6f6 url("../images/bg_C_top.png") no-repeat left top / 100% auto;}
#fullpage.page_c:before {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("../images/bg_C_bottom.png") no-repeat left bottom / 100% auto;}
#fullpage.page_c.c_chatacter:after {position:absolute; content:""; width:100%; left:0; bottom:0; height:100%; background:url("http://roomkidsmon.cdn3.cafe24.com/bg_C_character.png") no-repeat left bottom / 100% auto;}
.page_c .header h2.tit {text-shadow:0 0.3vw #d8b9ec;}
.page_c .header h2.tit span {color:#c172d8}
.page_c .header ul.home_btn li a.back {background:url("../images/btn_c_back.png") no-repeat center center / 100% 100%;}
.page_c .header ul.home_btn li a.home {background:url("../images/btn_c_home.png") no-repeat center center / 100% 100%;}
.page_c .header ul li a.btn_mypage {background:url("../images/btn_c_mypage.png") no-repeat center center / 100% 100%;}
.page_c div.detail_day {border:0.3vw solid #c172d8;}
.page_c div.detail_day .day_box {border:0.12vw dashed #c172d8;}
.page_c div.detail_day:after {left:-8%; background:url("../images/day_c1.png") no-repeat left top / 100% auto;}
.page_c div.detail_day:before {right:-10%; width:20%; background:url("../images/day_c2.png") no-repeat left bottom / 100% auto;}
.page_c .percent .bar .bar_color {background:#c172d8;}
.page_c .percent .bar_text li {color:#c172d8;}
.page_c .detail_video .swiper-slide a > span {background:#c172d8;}
.page_c div.detail_day .day dl dd span {background:#c172d8;}


.modal-video-body {width:60% !important; max-width:60% !important;}
.modal-video-close-btn {top:0px !important; right: -55px !important;}


.intro_bg {background:#ffffff; width:100vw; height:100vh;}
.product_main {display:none; position:relative; overflow:hidden;}
.intro_img {text-align:center; height:20vh; padding-top:40vh;}
.intro_img img {height:100%; width:auto;}


.modal .modal-dialog {width:30%; margin:4% auto 0;}
.modal .modal-content {background:none; box-shadow:none; border:none;}
.modal .login {position:relative;}
.modal .login img {width:100%;}
.modal .login_cont {position:absolute; left:10%; top:40%; width:80%;}
.modal .login_cont input {border:none; padding-left:5.5vw; font-size:1.5vw; color:#666; box-sizing:border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; font-family:'yg-jalnan';}
.modal .login_cont input::placeholder {color:#aaa;}
.modal .login_cont h4 {margin-bottom:1vh; margin-top:0;}
.modal .login_cont p {font-size:1.2vw; line-height:1.4vw; color:#aaa; font-family: 'yg-jalnan'; color:#666}
.modal .login_cont p input {width:1.4vw; height:1.4vw; margin:0; padding:0;}
.modal .login_cont .login_member {width:100%; height:5.8vw; line-height:5.8vw; background:url("../images/login_member.png") no-repeat; background-size:100% auto;}
.modal .login_cont .login_password {width:100%; height:5.8vw; line-height:5.8vw; background:url("../images/login_password.png") no-repeat; background-size:100% auto;}
.modal .login_cont .pin_member {width:100%; height:5.8vw; line-height:5.8vw; background:url("../images/pin_member.png") no-repeat; background-size:100% auto;}
.modal .login_cont .login_btn {padding-top:1vw;}
.modal .login_cont .login_btn:after {clear:both; content:""; display:block;}
.modal .login_cont .login_btn li {float:left; width:48%; margin:0 1%;}
.modal .login_cont .pin_btn {padding-top:0.8vw;}
.modal .login_cont .pin_btn li {padding-top:0.8vw;}
.modal .ui-input-text, .ui-input-search {margin:0;}
.ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a .ui-panel-wrapper {text-shadow:none !important;}


 /* IE10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.header h2.tit {padding-top:0.5%;}
}




/* new { */

@font-face {
    font-family: 'Binggrae';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/Binggrae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
            font-family: 'arial_rounded_mt_boldregular';
            src: url('/font/arlrdbd-webfont.woff2') format('woff2'),
                 url('/font/arlrdbd-webfont.woff') format('woff');
            font-weight: normal;
            font-style: normal;
        }


.fb {font-family: 'yg-jalnan' !important; font-weight: 200}
.fa {font-family: 'arial_rounded_mt_boldregular' !important; font-weight: 900;}
.fy {font-family: 'yg-jalnan';}
.n_main_wrap {font-family: 'yg-jalnan'; font-weight: 700; display: flex; align-items: center; position: absolute; top:0px; left: 0px; height: 100%; width:100vw; background-color: #fff; gap:0px 40px}
.n_main_wrap input:focus {outline: none !important;}
.n_main_wrap .n_main_left {margin-right: auto; text-align: left;}
.n_main_wrap .n_main_center {width: auto; text-align: center; height:auto;}
.n_main_wrap .n_main_center img {width: 70%;}
.n_main_wrap .n_main_right {margin-left:auto; text-align: right;}
.n_main_wrap .n_main_left img {height:100%;}
.n_main_wrap .n_main_right img {height:100%;}
.n_main_wrap .new_inp_login {border:2px solid #d8000f !important; height:3vw; width: 90%; border-radius: 40px; background-color: #fff; text-align: center; color:#000 !important; font-size: calc(0.2rem + 1vw)}
.n_main_wrap .new_inp_login::placeholder {color:#999;}
.n_main_wrap .new_btn_login {border:0px !important; height:3vw; width: 90%; border-radius: 40px; background-color: #d8000f; text-align: center; color:#fff !important; font-size: calc(0.2rem + 1vw)}
.n_main_wrap .new_btn_join {border:0px !important; height:3vw; width: 90%; border-radius: 40px; background-color: #1b2e75; text-align: center; color:#fff !important; font-size: calc(0.2rem + 1vw)}

.n_main_wrap .mt-40 {margin-top: 3vw;}
.n_main_wrap .mt-35 {margin-top: 4.5vw;}
.n_main_wrap .mt-30 {margin-top: 4vw;}
.n_main_wrap .mt-25 {margin-top: 3.5vw;}
.n_main_wrap .mt-20 {margin-top: 3vw;}
.n_main_wrap .mt-15 {margin-top: 2.5vw;}
.n_main_wrap .mt-10 {margin-top: 2vw;}
.n_main_wrap .mt-5 {margin-top: 1vw;}

.n_sub_wrap {font-family: 'Binggrae'; font-weight: 700; display: flex; align-items: center; position: absolute; top:0px; left: 0px; height: auto; width:100vw; background-color: #fff; gap:0px 15px}
.n_sub_wrap input:focus {outline: none !important;}
.n_sub_wrap .n_sub_left {margin-right: auto; text-align: left; height:auto;}
.n_sub_wrap .n_sub_center {width:95%; text-align: center; margin-top: 5vh; height:auto;}
.n_sub_wrap .n_sub_center img {width: 80%;}
.n_sub_wrap .n_sub_right {margin-left:auto; text-align: right; height:auto;}
.n_sub_wrap .n_sub_left img {height:100vh; margin-left: -0.5vw; width: 10vw;}
.n_sub_wrap .n_sub_right img {height:100vh; margin-right: -0.5vw; width: 10vw;}
.n_sub_wrap .new_inp_login {border:3px solid #d8000f !important; height:40px; width: 80%; border-radius: 40px; background-color: #fff; text-align: center; color:#000 !important;}
.n_sub_wrap .new_inp_login::placeholder {color:#999;}
.n_sub_wrap .new_btn_login {border:0px !important; height:40px; width: 80%; border-radius: 40px; background-color: #d8000f; text-align: center; color:#fff !important;}
.n_sub_wrap .new_btn_join {border:0px !important; height:40px; width: 80%; border-radius: 40px; background-color: #1b2e75; text-align: center; color:#fff !important;}
.n_sub_tit {position: fixed; top:3vw; left: 0px; width: 100%; z-index: 9900 !important; display: flex; align-items: center; align-items: center; justify-content: center;}
.n_sub_tit img {width: 14vw;}
.n_sub_btm {position: fixed; bottom:5%; left: 0px; width: 100%; z-index: 999 !important;}
.n_sub_btm img {width:10vw;}
.n_sub_btm img.small-logo {width: 7vw; /* 새로운 스타일 */}
.n_sub_tit .n_sub_tit_left {left: 2%; position: absolute; top:12%;}
.n_sub_tit .n_sub_tit_left img {width: 4.5vw; }
.n_sub_tit .n_sub_tit_center {
    position: absolute !important;  /* ✅ 항상 고정된 위치 유지 */
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: auto;
    min-width: 100px;
    white-space: nowrap;
}

.n_sub_tit, .detail_video {
    position: relative !important; /* ✅ 항상 특정 위치에 고정 */
    z-index: 1 !important; /* ✅ `sidebar-overlay`보다 아래에 위치 */
}





.n_sub_tit .n_sub_tit_right {right: 2%; position: absolute; top:8%;}
.n_sub_tit .n_sub_tit_right img {width: 4.5vw;}
.n_sub_tit .n_sub_tit_right2 {right: 2%; position: absolute; top:8%;}
.n_sub_wrap .n_sub_list {display: flex; gap:0 2vw; align-items: center; justify-content: center; margin-bottom: 2vw}
.n_sub_wrap .n_sub_list ul label {font-family: 'yg-jalnan'; font-size: 3vw; position: absolute; left: 0px; width: 100%; top:50%; transform: translateY(-50%); cursor: pointer;}
.n_sub_wrap .n_sub_list ul i img {position: absolute; right:-.4vw; bottom:-.4vw; width: 4.5vw; max-width: 70px;}
.n_sub_wrap .n_sub_list ul {width: 16%; position: relative; opacity: .5; cursor: pointer;}
.n_sub_wrap .n_sub_list ul img {width: 100%; cursor: pointer;}
.n_sub_wrap .n_sub_list ul:hover img{filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.3)) }
.n_sub_wrap .n_sub_list ul.on {opacity: 1;}
.emj1 {z-index: 99; position: absolute; top:0px; left: -40%;}

.login_info_box {border:3px solid #1b2e75; overflow: hidden; border-radius: 2vw; width: 90%; margin: 0 auto; margin-top: 30px;}
.login_info_box li {padding-top: 0.8vw; padding-bottom: 0.8vw; border-top:1px solid #ddd; color:#1b2e75;}
.login_info_box li:first-child {border-top:0px;}

.n_sub_tit_center {color:#d8000f; font-family: 'yg-jalnan'; font-size: 6vw; margin-top: 4%;}
.n_sub_tit_center_sk {color:#1b2e75;}
.detail_video {width: 64%; margin:0 auto; padding-bottom: 0px; padding-top: 0px;}
.detail_video .swiper-slide p span {background-image: none; padding-left: 0px;}
.detail_video .swiper-slide {width: 12%;}
.de_wrap1 .de_img1 img {width: 7vw;}
.de_wrap2 .de_img2 img {width: 11vw;}
.de_wrap3 .de_img3 img {width: 7vw;}
.de_wrap4 .de_img4 img {width: 9vw;}
.de_wrap {text-align: center; }
.de_wrap ul {display: inline-block; width: 20%; margin-right: 1vw;}
.de_wrap ul:last-child {margin-right: 0;}
.de_wrap ul.de_wrap4 {width: 34%; margin-left: -2vw;}
.de_wrap img {vertical-align: bottom;}
.de_btn1 {text-align: center; margin-top: 10px;}
.de_btn1 dl {display: inline-block; width: 7vw;}
.de_btn2 {text-align: center; margin-top: 10px;}
.de_btn2 dl {display: inline-block; width: 7vw;}
.de_btn3 {text-align: center; margin-top: 10px;}
.de_btn3 dl {display: inline-block; width: 7vw;}
.de_btn4 {text-align: center; margin-top: 10px;}
.de_btn4 dl {display: inline-block; width: 7vw;}
.de_btn_l {background-color: #d7000f; color:#fff; height:3vw; width: 100%; border:0px; border-radius: 40px; font-size: 1.1vw; border-bottom: 2px solid #bd0009; box-sizing: border-box; position: relative;}
.de_btn_l span {position: absolute; bottom:-1px; right:-1px;}
.de_btn_l span img {width: 1.3vw !important;}
.de_btn_r span {position: absolute; bottom:-1px; right:-1px;}
.de_btn_r span img {width: 1.3vw !important;}
.de_btn_sub1 .de_btn_l:hover {background-color: #fff; border:1px solid #d7000f; color:#d7000f; border-bottom: 2px solid #bd0009}
.de_btn_sub2 .de_btn_l:hover {background-color: #fff; border:1px solid #d7000f; color:#d7000f; border-bottom: 2px solid #bd0009}
.de_btn_r {background-color: #26259a; color:#fff; height:3vw; width: 100%; border:0px; border-radius: 40px; font-size: 1.1vw; border-bottom: 2px solid #1b2e75; box-sizing: border-box; position: relative;}
.de_btn_sub1 .de_btn_r:hover {background-color: #fff; border:1px solid #1b2e75; color:#1b2e75; border-bottom: 2px solid #1b2e75}
.de_btn_sub1 button {margin-top: 2px; margin-bottom: 2px;}
.de_btn_sub2 .de_btn_r:hover {background-color: #fff; border:1px solid #1b2e75; color:#1b2e75; border-bottom: 2px solid #1b2e75}
.de_btn_sub2 button {margin-top: 2px; margin-bottom: 2px;}
.de_btn_sub2 {position: relative;}
.n_sub_wrap .mt-40 {margin-top: 40px;}
.n_sub_wrap .mt-35 {margin-top: 35px;}
.n_sub_wrap .mt-30 {margin-top: 30px;}
.n_sub_wrap .mt-25 {margin-top: 25px;}
.n_sub_wrap .mt-20 {margin-top: 20px;}
.n_sub_wrap .mt-15 {margin-top: 15px;}
.n_sub_wrap .mt-10 {margin-top: 10px;}
.detail_video .swiper-slide {width:15.6%;}
.n_sub_center_de {vertical-align: top;}
.n_sub_wrap {background-size: 80vw; background-repeat: no-repeat; background-position: center center;}

.de_btn_sub1 dl {display: inline-block; width: 7vw; margin-top: 5px; vertical-align: top}
.de_btn_sub1 dl:nth-child(1) {padding-left: 0.5vw; padding-right: 0.5vw; box-sizing: border-box; background-color: #fff1f1; padding: 0.5vw; border-radius: 0.5vw;}
.de_btn_sub1 dl:nth-child(2) {padding-left: 0.5vw; padding-right: 0.5vw; box-sizing: border-box; background-color: #edecfc; padding: 0.5vw; border-radius: 0.5vw;}
.de_btn_sub2 dl {display: inline-block; width: 7vw; margin-top: 5px; vertical-align: top}
.de_btn_sub2 dl:nth-child(1) {padding-left: 0.5vw; padding-right: 0.5vw; box-sizing: border-box; background-color: #fff1f1; padding: 0.5vw; border-radius: 0.5vw;}
.de_btn_sub2 dl:nth-child(2) {padding-left: 0.5vw; padding-right: 0.5vw; box-sizing: border-box; background-color: #edecfc; padding: 0.5vw; border-radius: 0.5vw;}
.de_btn_sub2 dl:nth-child(3) {padding-left: 0.5vw; padding-right: 0.5vw; box-sizing: border-box; background-color: #fff1f1; padding: 0.5vw; border-radius: 0.5vw;}
#fullpage.page_k.k_chatacter:after {display: none;}
#fullpage.page_a.a_chatacter:after {display: none;}

.de_wrap2 .de_img2 {margin-bottom: -1vh;}
.de_wrap4 .de_img4 {margin-bottom: -1vh;}

.de_btn4 {margin-top: 40px;}
.de_btn4 dl {background-color: #fff1f1;}
.de_btn4 dl button {margin-top: -20px;}
.de_btn4 dl:nth-child(2) {background-color: #edecfc;}

.de_btn1 {margin-top: 40px;}
.de_btn1 dl {background-color: #fff1f1;}
.de_btn1 dl button {margin-top: -20px;}
.de_btn1 dl:nth-child(2) {background-color: #edecfc;}

.de_btn2 {margin-top: 40px;}
.de_btn2 dl {background-color: #fff1f1;}
.de_btn2 dl button {margin-top: -20px;}
.de_btn2 dl:nth-child(2) {background-color: #edecfc;}

.de_btn3 {margin-top: 30px;}
.de_btn3 dl {background-color: #fff1f1;}
.de_btn3 dl button {margin-top: -20px;}
.de_btn3 dl:nth-child(2) {background-color: #edecfc;}

.de_btn_sub1 dl {margin-top: 0px !important; border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; padding-top: 2px !important;}
.de_btn_sub2 dl {margin-top: 0px !important; border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; padding-top: 2px !important;}

.n_sub_wrap.de {gap:0;}
.n_sub_wrap {height:auto;}

#mb_password {color:#000 !important;}

#fullpage {position: relative; width: 100%; height:100vh; background-color: #fff !important; background-image: none !important;}
.imoji_wrap {position: absolute; top:50%; left: 0px; width: 100%; transform: translateY(-50%); text-align: center; z-index: 999; pointer-events: none; margin-top: 0.5vh; margin-left: -2vh;}
.imoji_wrap img {height:auto; width: 85vw; pointer-events: none;}
.vport_wrap {
    width: 100%; /* 기준 크기 설정 */
    height: 100vh;
    transform-origin: top left; /* 축소/확대 기준점 */
    /*transform: scale(calc(100vw / 100%));  뷰포트 비율에 맞게 확대/축소 */
}

.mypage_cont {
    margin: 0 3vw;
    padding: 4vw 6vw;
    border: 0.4vw solid #26259a;
    background: #f1f1f1;
    border-radius: 6vw;
}

.table_list > ul.table_th > li {
    background: #1b2e75;
    padding: 1.2vw 0;
    color: #fff;
    font-size: 2vw;
    border-radius: 0.8vw;
    border-bottom: 0.25vw solid #26259a;
}

.table_list > ul.table_td > li.td_left span {
    display: inline-block;
    color: #fff;
    margin-left: 1%;
    width: 2.2vw;
    height: 2.2vw;
    line-height: 2.2vw;
    text-align: center;
    background: #26259a;
    border-radius: 100%;
}

.header .my_tit .my_text h4 {
    display: inline-block;
    font-size: 3.2vw;
    padding: 0;
    color: #1b2e75;
    margin-top: 0vw;
    border-top: 0.1vw dashed #1b2e75;
    border-bottom: 0.1vw dashed #1b2e75;
    font-family: 'Binggrae';
}

.header .my_tit .my_text h2 span {color:#d7000f;}

.n_sub_wrap {align-items: flex-start;}
.n_sub_tit_center {margin-top: 5vw}
.n_sub_wrap .n_sub_center {margin-top: 13vw}
.imoji_wrap {top:0.0vw !important; transform: translateY(0%) !important;}
.imoji_wrap img {height:auto; width: 70%; margin-top: 2%;}
.n_sub_center_inner {width: 85%; margin: 0 auto;} 

.chk_box {position:relative}
.chk_box input[type="checkbox"] + label {padding-left:10px;color:#676e70; font-size: 1vw}
.chk_box input[type="checkbox"] + label:hover{color:#2172f8}
.chk_box input[type="checkbox"] + label span {position:absolute;top:1px;left:27%; transform: translateX(-50%); margin-left: -65px; width:17px;height:17px;display:block;background:#fff;border:1px solid #d0d4df;border-radius:3px}
.chk_box input[type="checkbox"]:checked + label {color:#000}
.chk_box input[type="checkbox"]:checked + label span {background:url('../g/mobile/skin/member/basic/img/chk.png') no-repeat 50% 50% #3a8afd;border-color:#1471f6;border-radius:3px}
.chk_li {padding-left:10px;line-height:20px}
.selec_chk {position:absolute;top:0;left:0;width:0;height:0;opacity:0;outline:0;z-index:-1;overflow:hidden}

/* 체크박스와 텍스트를 세로 정렬하면서 모두 가운데 정렬 */
.custom_chk_box {
    display: flex;
    flex-direction: column; /* 요소를 세로 배치 */
    align-items: center; /* 체크박스 + 텍스트 모두 가운데 정렬 */
    justify-content: center;
    text-align: center; /* 텍스트 가운데 정렬 */
    margin-bottom: 12px; /* 항목 간격 */
    width: 100%; /* 부모 요소를 초과하지 않도록 설정 */
}

/* 체크박스 스타일 */
.custom_chk_box input[type="checkbox"] {
    width: 18px;
    height: 18px;
    border: 1px solid #d0d4df;
    border-radius: 3px;
    background: #fff;
    cursor: pointer;
    appearance: auto; /* 기본 체크박스 스타일 유지 */
    margin-bottom: 6px; /* 체크박스와 텍스트 간격 */
}

/* 체크된 상태 스타일 */
.custom_chk_box input[type="checkbox"]:checked {
    background-color: #3a8afd;
    border-color: #1471f6;
    background-image: url('../g/mobile/skin/member/basic/img/chk.png');
    background-repeat: no-repeat;
    background-position: center;
}

/* 라벨 스타일 (텍스트) */
.custom_chk_box label {
    color: #676e70;
    font-size: 18px;
    cursor: pointer;
    white-space: normal; /* 텍스트가 길어지면 줄바꿈 */
    text-align: center; /* 텍스트 가운데 정렬 */
    line-height: 1.4; /* 가독성을 위한 줄 간격 */
}





.auto_login_box input[type="checkbox"] + label span {
  position: static; /* 절대 위치를 제거하고 기본 흐름으로 복귀 */
  margin-left: 0;
  width: 17px;
  height: 17px;
  display: inline-block;
  background: #fff;
  border: 1px solid #d0d4df;
  border-radius: 3px;
  vertical-align: middle;
}
/* } */
