@charset "UTF-8";

:root {
	/*******************
		Color Pallte
	*******************/
	
	/* primary */
	--primary01: #0080ff;
	--primary02: #19202a;
	--primary03: #b0b8c1;
	
	--grey900: #111;
	--grey800: #191919;
	--grey700: #242424;
	--grey600: #333;
	--grey500: #444;
	--grey400: #666;
	--grey300: #888;
	--grey200: #ccc;
	--grey100: #d5d5d5;
	--grey50: #fafafa;
	
	--greyOp900: rgba(17, 17, 17, .9);
	--greyOp800: rgba(17, 17, 17, .8);
	--greyOp700: rgba(17, 17, 17, .7);
	--greyOp600: rgba(17, 17, 17, .6);
	--greyOp500: rgba(17, 17, 17, .5);
	--greyOp400: rgba(17, 17, 17, .4);
	--greyOp300: rgba(17, 17, 17, .3);
	--greyOp200: rgba(17, 17, 17, .2);
	--greyOp100: rgba(17, 17, 17, .1);
	
	--red900: #B71C1C;
	--red800: #C62828;
	--red700: #D32F2F;
	--red600: #E53935; /* default */
	--red500: #F44336;
	--red400: #EF5350;
	--red300: #E57373;
	--red200: #EF9A9A;
	--red100: #FFCDD2;
	--red50: #F2FAFF;

	--green900: #009900;
	--green800: #00BE00;
	--green700: #00D300;
	--green600: #00EA00; /* default */
	--green500: #4CAF50;
	--green400: #00FF00;
	--green300: #6CFF57;
	--green200: #E5EDFB;
	--green100: #EDF5FF;
	--green50: #F2FAFF;
	
	
}

:root {
	/* Font Weight [ 폰트명 : 'PRETENDARD' ] */
	--fw-regular: 400;
	--fw-medium: 500;
	--fw-bold: 700; 
}

:root {
	/* Default [기본값] */
	--pt-fixed: 13rem;
	--ly-w1120: 112rem;
	--ly-w1180: 118rem;
	--scrollbar-width: calc(100vw - 100%);
}

:root {
	/* space [여백] */
	--space04: .4rem;
	--space08: .8rem;
	--space10: 1rem;
	--space12: 1.2rem;
	--space14: 1.4rem;
	--space18: 1.8rem;
	--space24: 2.4rem;
	--space32: 3.2rem;
	--space48: 4.8rem;
	--space54: 5.4rem;
	--space64: 6.4rem;
}

/* Layout Common */
html {font-size: 10px;scroll-behavior: smooth;}
body {font-size: 100%;overflow-x: hidden !important;letter-spacing: 0;}
/* body *:not(span) {font-size: 1.4rem;line-height: 1.4;} */
body.pop_scroll {overflow: hidden !important;height: 100%;}
a {color: rgb(29,29,31);text-decoration: none;}
textarea {width: 100%;height: 60%;resize: none;}
hr {border-left: 0;border-right: 0;border-top: 1px solid #444;border-bottom: 1px solid #242424;}
/* hr {position: relative;width: 100%;height: .1rem;visibility: inherit;border-color: var(--grey500);} */

.mt5{margin-top: 5px !important;}
.mt10{margin-top: 10px !important;}
.mt20{margin-top: 20px !important;}
.ml5 {margin-left: 5px;}
.mr5 {margin-right: 5px;}

.red {color: #e71818;}
.gray {color: #999;}
.white {color: #fff;}

.t-blue{color: #0080ff;}
.bold{font-weight: 900;}
.clear {clear: both;}
.purple {background: #8842fc !important;}
.underline {text-decoration: line-through;}
div.fake_scroll {position: absolute;top: -9999px;overflow: scroll;width: 2rem;height: 2rem;}

.bg {display: none;position: fixed;width: 100%;height: 100%;background: rgba(24, 24 ,24, 0.5);z-index: 2;}
.back-over {display: none;position: fixed;top: 0;left: 0;background: rgba(24, 24 ,24, 0.8);width: 100%;height: 100%;z-index: 999;}

#container.main {padding-bottom: 120px !important;}
.CodeMirror-lines {font-size: 1.6rem;line-height: 1.4;}

*,
:after,
:before {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.scroll-hidden::-webkit-scrollbar {overflow: hidden;}
::selection {background-color: var(--primary01);color: #fff;}
/* [Scroll Custom] */
@media screen and (min-width: 1024px) {
	::-webkit-scrollbar-track {background-color: #111;}
	::-webkit-scrollbar {width: 8px;height: 8px;background: #111;}
	::-webkit-scrollbar-thumb {background: #aaa;border-radius: 8px;}
}
/* ::-webkit-scrollbar {width: 10px;background: none;}
::-webkit-scrollbar-thumb {background: #c1c1c1;opacity: .4;}
::-webkit-scrollbar-track {background: #f1f1f1;} */


/* input */
input {border: 1px solid #444;}
input:hover {border: 1px solid var(--grey300);}
input:focus {border: 1px solid #555;}


/* Header */
header {position: fixed;top: 0;left: 0;width: 100%;height: 7.6rem;z-index: 20;}
header form {height: 100%;}
header i {color: #fff;}
header .gnb_nav {height: 100%;transition: .5s ease;}
header .gnb_nav.active {background: rgba(17, 17, 17, .7);transition: .6s ease-in;backdrop-filter: blur(25px);-webkit-backdrop-filter: blur(25px);}
header .nav_logo {display: block;width: 12.4rem;margin-right: 2.8rem;padding-top: .5rem;}
header .searchWordForm {display: flex;}
header .pc_gnb_wrap {display: flex;align-items: center;width: 100%;}
header .pc_gnb_wrap .gnb_logo_block {display: flex;padding: 1.33rem 0;}
header .pc_gnb_wrap .gnb_menu_block {display: flex;justify-content: space-between;align-items: center;flex: 1 1 auto;}
header .pc_gnb_wrap .gnb_menu_block .menu_left_block {display: flex;align-items: center;white-space: nowrap;}
header .pc_gnb_wrap .gnb_menu_block .menu_right_block {display: flex;align-items: center;}
header .local-nav {height: 52px;border-bottom: 1px solid #ddd;}
header .gnb_nav_wrap,
header .local-nav-links {width: 100%;height: 100%;margin: 0 auto;padding: 0 4.4rem;align-items: center;box-sizing: border-box;}
header .gnb_nav_wrap {justify-content: space-between;}
#gnb_dim_bg {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: #000;opacity: 0;z-index: 19;}


/* Header - GNB */
header .gnb_wrap {}
header .gnb_wrap ul#gnb {display: flex;}


/* darkmode - code modal */
.cm-s-ayu-dark.CodeMirror {border-radius: .5rem;}
.code_modal {display: none;justify-content: center;align-items: center;position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 999;}
.code_modal .code_modal_cont {max-width: 64rem;width: 100%;max-height: 72rem;height: 100%;background: #242424;border-radius: 1rem;padding: 1.2rem 2.4rem;}
.code_modal .code_modal_top {display: flex;justify-content: flex-start;align-items: center;padding: 1.8rem 0 1.2rem;}
.code_modal .code_modal_top h3 {color: #fff;font-size: 2.4rem;margin-right: 1.2rem;line-height: 1.4;line-height: 1.4;}
.code_modal .code_modal_top .select_box {position: relative;border-radius: .5rem;width: 13rem;padding: 1.6rem 0;}
.code_modal .code_modal_top .select_box:before {content: '\f0d7';position: absolute;top: 1rem;right: 1rem;font-weight: 800;color: #fff;font-size: 1.4rem;z-index: 1;pointer-events: none;}
.code_modal .code_modal_top .select_box select {position: absolute;top: 0;left: 0;width: 100%;height: 100%;font-size: 1.5rem;color: #fff;background: #242424;border-radius: .5rem;padding: 0 .8rem;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.code_modal .code_modal_top .select_box select::-ms-expand {display: none;}

.code_modal .code_modal_content {max-height: 58rem;height: 100%;}
.code_modal .code_modal_content .CodeMirror {height: 100%;}

.code_modal .code_modal_bottom {display: flex;justify-content: center;align-items: center;padding: 1.2rem 0;}
.code_modal .code_modal_bottom button {display: block;background: #555;padding: .6rem 2.4rem;font-size: 1.6rem;line-height: 1.4;color: #fff;border-radius: .5rem;}
.code_modal .code_modal_bottom button.md_confirm {margin-left: .8rem;background: var(--primary01);}
.code_modal .code_dim {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(255, 255, 255, .25);z-index: -1;}

.note-editable pre {cursor: pointer;border: 1px solid #111;background: #242424;border-radius: .5rem;padding: 1.2rem 2.4rem;line-height: 1.6;}
.note-editable pre:hover {border: 1px solid #333;background: #111;}


/* malgun - GNB2 */
#gnb1 {display: flex;align-items: center;}
#gnb1 > li {position: relative;}
#gnb1 > li > a {display: flex;align-items: center;padding: 2.6rem 1.8rem 2.8rem;color: #fff;font-size: 1.8rem;font-weight: bold;}
#gnb1 > li > a.on {color: var(--primary01);}
#gnb1 > li > a.active {color: var(--primary01);}
#gnb1 > li > a figure {margin: 0;width: 2.2rem;background: #fff;padding: .4rem;margin-right: .6rem;border-radius: .5rem;}
#gnb1 > li > a i {margin-left: .6rem;color: var(--primary01);transform: rotate(0);}
#gnb1 > li > ul.depth2 {display: none;position: absolute;width: 17.4rem;border-radius: 1rem;background: #242424;padding: 1.2rem 2.4rem;box-sizing: border-box;}
#gnb1 > li > .depth2 {top: 120%;left: 50%;margin-left: -9rem;opacity: 0;z-index: 1;}
#gnb1 > li > .depth2:before {content: '';border-color: transparent transparent #242424;border-style: solid;border-width: 0px 10px 10px;position:absolute;width: 1rem;height: 1rem;top: -10px;left: 50%;margin-left: -.5rem;z-index:2;}
#gnb1 > li > .depth2 li:not(:last-child) {border-bottom: 1px solid var(--grey500);}
#gnb1 > li > .depth2 li a {display: block;padding: 1.8rem 0;color: var(--grey200);font-size: 1.6rem;font-weight: 600;letter-spacing: .5px;line-height: 1.2;}
#gnb1 > li > .depth2 li a:hover {color: var(--primary01);}


/* Header - Serch - Pc */
header .pc_gnb_wrap .serch_wrap {display: flex;position: relative;width: 28rem;margin-left: 1.2rem;}
header .pc_gnb_wrap .serch_wrap > input {width: 100%;height: 3.8rem;padding: 0 1.8rem;background-color: rgba(255, 255, 255, .1) !important;font-size: 1.4rem;color: #ccc;border-radius: 5rem;border: 1px solid rgba(255, 255, 255, .2) !important;transition: .5s ease;box-sizing: border-box;}
header .pc_gnb_wrap .serch_wrap > input:focus {color: #fff;border: 1px solid #888 !important;transition: .5s ease;}
header .pc_gnb_wrap .fa-search {position: absolute;top: 8px;right: 10px;padding: 0 1.2rem 0 .8rem;font-size: 1.8rem;font-weight: 300;cursor: pointer;}
/* Header - Serch - M */
header .sidemenu__inner .serch_wrap {display: flex;position: relative;padding: 0 2.4rem;}
header .sidemenu__inner .serch_wrap > input {width: 100%;height: 3.8rem;padding: 0 1.2rem;background-color: rgba(255, 255, 255, .1) !important;font-size: 1.4rem;color: #ccc;border-radius: .5rem;border: 1px solid rgba(255, 255, 255, .2) !important;transition: .5s ease;box-sizing: border-box;}
header .sidemenu__inner .serch_wrap > input:focus {color: #fff;border: 1px solid #888 !important;transition: .5s ease;}
header .sidemenu__inner .fa-search {position: absolute;top: 10px;right: 26px;padding: 0 1.2rem 0 .8rem;font-size: 1.6rem;font-weight: 300;cursor: pointer;}

/* Header - MyMenu */
header .pc_gnb_wrap .nav_mymenu {position: relative;height: auto;margin-top: 0;padding: 1.6rem 1.2rem;text-align: center;color: #fff;}
header .pc_gnb_wrap .nav_mymenu i {font-size: 2.4rem;padding: 0 .2rem;}
header .pc_gnb_wrap .nav_mymenu .far.fa-user {font-weight: 300;}
header .pc_gnb_wrap .nav_mymenu .fas.fa-user {color: #0080ff;}
.top_profile {display: block;width: 2.8rem;height: 2.8rem;object-fit: cover;border-radius: 2.8rem;}
header .nav_mymenu .mypage {display: none;position: absolute;top: 56px;right: -60px;width: 25rem;background: rgba(0, 0, 0, .9);border: 1px solid #333;border-radius: 1rem;box-sizing: border-box;z-index: 1;}
header .nav_mymenu .mypage:before {content: '';border-color: transparent transparent rgba(0, 0, 0, .9);border-style: solid;border-width: 0px 10px 10px;position:absolute;top: -9px;right: 74px;width: 1rem;height: 1rem;margin: 0 auto;z-index: 3;}
header .nav_mymenu .mypage:after {content: '';border-color: transparent transparent #333;border-style: solid;border-width: 0px 10px 10px;position:absolute;top: -11px;right: 74px;width:1rem;height: 1rem;margin: 0 auto;z-index: 2;}
header .nav_mymenu .mypage.user_util {width: 22.5rem;right: -8rem;}
header .nav_mymenu .mypage.user_util:before,
header .nav_mymenu .mypage.user_util:after {right: 9.5rem;}
header .nav_mymenu .mypage.nav_login {width: 16rem;padding: .6rem 0;}
header .nav_mymenu .mypage.nav_login .mypage-menu {border-bottom: none;}
header .nav_mymenu .mypage.nav_login .mypage-menu li a {padding: .8rem 0;color: #aaa;line-height: 1.2;}
header .nav_mymenu .mypage .nav_profile {display: flex;align-items: center;flex-wrap: nowrap;justify-content: center;padding: 2.4rem 0;border-bottom: 1px solid #444;}
header .nav_mymenu .mypage .nav_profile .nav_profile_img {width: 5.4rem;height: 5.4rem;border: 1px solid #777;margin-right: 1.2rem;border-radius: 4rem;overflow: hidden;}
header .nav_mymenu .mypage .nav_profile .nav_profile_img img {display: block;width: 100%;height: 100%;object-fit: cover;}
header .nav_mymenu .mypage .nav_profile > p {font-size: 1.8rem;font-weight: bold;text-decoration: underline;cursor: pointer;}
header .nav_mymenu .mypage .mypage-menu {width: 100%;padding: .8rem 0;border-bottom: 1px solid #333;box-sizing: border-box;}
header .nav_mymenu .mypage .mypage-menu li a {display: block;width: 100%;height: 100%;padding: 1rem 0;font-size: 1.5rem;color: #999;font-weight: 600;font-style: normal;text-align: center;line-height: 1.2;}
header .nav_mymenu .mypage .mypage-menu li a:hover {color: #fff;}
header .nav_mymenu .mypage .nav_logout {background: rgba(0, 0, 0, .9);border-bottom-left-radius: 1rem;border-bottom-right-radius: 1rem;}
header .nav_mymenu .mypage .nav_logout:hover {background: rgba(22, 22, 22, .8);}
header .nav_mymenu .mypage .nav_logout a {display: block;height: 100%;padding: 1.6rem 0;font-size: 1.4rem;font-weight: bold;color: #0080ff;}
header .nav_hash {display: none;}

header .login_blk {display: none;justify-content: space-between;align-items: center;}
header .login_blk a {display: block;padding: 1.2rem 2.4rem;background: var(--primary01);border: .5rem;}
header .login_blk a:first-child {margin-right: 2rem;}

.m-footer-menu {display: none;}
.global-nav-logo {position: absolute;top: 21px;left: 4em;}
.global-nav-logo img {max-width: 100%;}

/* Header - KH BI */
header .nav_kh {display: block;height: 2.8rem;padding-left: 1.2rem;}
header .nav_kh img {height: 100%;}

/* Header - Mobile */
header .mobile_gnb_wrap {display: none;}

/* Header - SideMenu - Mobile */
header .sidemenu {display: none;}

/* Header - myMenu - Mobile */
.mymenu_wrap {display: none;}

/* Footer */
footer {width: 100%;background: #02080d;}

footer .footer_famliy_group {width: 100%;height: 20rem;background: #020b13;}
footer .footer_famliy_group .footer_famliy_wrap {max-width: var(--ly-w1180);margin: 0 auto;padding: 0 2rem;height: 100%;}
footer .footer_famliy_group .footer_famliy_flx {display: flex;justify-content: space-between;align-items: center;height: 100%;}
footer .footer_famliy_group .footer_famliy_item {display: flex;flex-direction: column;justify-content: center;align-items: center;flex: 1;height: 100%;transition: all .3s;}
footer .footer_famliy_group .footer_famliy_item:not(:first-child):hover {background: #061e34;transition: all .3s;}
footer .footer_famliy_group .footer_famliy_item:not(:first-child):hover p {color: #fff;}
footer .footer_famliy_group .footer_famliy_item.first img {display: block;margin-bottom: 1.4rem;opacity: 1;animation: call-circle-img-anim 2s infinite ease-in-out;}
footer .footer_famliy_group .footer_famliy_item.first p {font-size: 2.6rem;font-weight: 900;color: #fff;margin-bottom: 1.2rem;line-height: 1.2;}
footer .footer_famliy_group .footer_famliy_item.first span {font-size: 1.3rem;font-weight: 500;color: #aaa;line-height: 1.2;}
footer .footer_famliy_group .footer_famliy_item:not(.first) img {display: block;margin-bottom: 2.4rem;}
footer .footer_famliy_group .footer_famliy_item:not(.first) p {font-size: 1.6rem;font-weight: 800;color: var(--primary01);line-height: 1.2;margin-bottom:.8rem;transition: all .3s;}
footer .footer_famliy_group .footer_famliy_item:not(.first) span {font-size: 1.2rem;font-weight: 300;color: #b6babd;line-height: 1.2;}

footer .footer_wrap {color: var(--grey300);}
footer .footer-header {width: 100%;}
footer .footer-header-flex {display: flex;justify-content: space-between;align-items: center;max-width: var(--ly-w1180);margin: 0 auto;padding: 1.8rem 2rem;}
footer .footer-logo {width: 12rem;}
footer .footer-logo img {display: block;width: 100%;}
footer .footer-link {display: flex;align-items: center;font-size: 1.6rem;font-weight: 600;}
footer .footer-link a {display: inline-block;margin: 0 1.4rem 0;color: #888;line-height: 1.6;}
/* footer .footer-link a.footer_privacy_policy {color: var(--primary01);} */
footer .footer-link a:hover {text-decoration: underline;}
footer .footer-link a:first-child {margin-left: 0;}
footer .footer-sns {display: flex;align-items: center;}
footer .footer-sns a {display: block;width: 4.8rem;height: 4.8rem;border-radius: 4.8rem;text-align: center;transition: all .5s;}
footer .footer-sns a:first-child {margin-right: .8rem;}
footer .footer-sns a:hover {background: #242424;transition: all .5s;}
footer .footer-sns a i {font-size: 1.8rem;color: var(--grey300);padding-top: 1.3rem;}
footer .footer-sns a img {display: block;width: 2.3rem;margin: 0 auto;padding-top: 1.3rem;}

footer .footer-bottom {max-width: var(--ly-w1180);margin: 0 auto;padding: 0 2rem;}
footer .footer-bottom .ft_bt_wrap {display: flex;justify-content: space-between;align-items: flex-start;width: 100%;border-top: 1px solid #242424;padding: 2.4rem 0 7.2rem;}
footer .footer-bottom .footer-info {display: block;width: 100%;word-wrap: break-word;word-break: break-word;font-size: 1.3rem;line-height: 1.6;text-align: left;}
footer .footer-bottom .famliy_wrap {position: relative;margin-bottom: .8rem;}
footer .footer-bottom .famliy_wrap .famliy_toggle {display: flex;justify-content: space-between;align-items: center;position: relative;width: 100%;height: 5.2rem;padding: 0 1.2rem;border: 1px solid #444;border-radius: .5rem;z-index: 1;}
footer .footer-bottom .famliy_wrap .famliy_toggle:hover {border-color: #666;}
footer .footer-bottom .famliy_wrap .famliy_toggle span {font-size: 1.5rem;color: #aaa;font-weight: 700;}
footer .footer-bottom .famliy_wrap .famliy_toggle i {font-size: 1.5rem;color: var(--primary01);}
footer .footer-bottom .famliy_wrap .famliy_toggle.active i {color: #f00;}
footer .footer-bottom .famliy_wrap .famliy_sub {display: none;position: absolute;left: 0;bottom: 51px;width: 100%;height: 0;background: rgba(17, 17, 17, 8);border: 1px solid #444;border-radius: .5rem;overflow: hidden;}
footer .footer-bottom .famliy_wrap .famliy_sub li a {display: flex;justify-content: space-between;align-items: center;padding: 1.2rem;font-size: 1.5rem;color: #aaa;font-weight: 700;}
footer .footer-bottom .famliy_wrap .famliy_sub li:hover a {background: #333;color: #ccc;}
footer .footer-bottom .famliy_wrap .famliy_sub li:hover a i {color: var(--primary01);}
footer .footer-bottom .footer-bt-right {width: 25rem;}
footer .footer-bottom .footer-bt-right .footer-cert a {display: flex;align-items: center;;padding: 1.4rem 2.4rem;background: #242424;color: #aaa;font-size: 1.3em;border-radius: .3rem;font-weight: 500;line-height: 1.4;}
footer .footer-bottom .footer-bt-right .footer-cert a:hover {color: #ccc;background-color: #333;}
footer .footer-bottom .footer-bt-right .footer-cert a i {display: block;font-size: 1.6rem;margin-right: 1.2rem;}


/* [ 22.04.14 ]
footer {width: 100%;}
footer .footer_wrap {max-width: var(--ly-w1180);margin: 0 auto;color: #aaa;}
footer .footer-group {display: flex;width: 100%;margin: 0 auto;padding: 6.4rem 2rem 3.2rem;box-sizing: border-box;-webkit-box-sizing: border-box;text-align: left;}
footer .footer-logo {display: block;position: relative;width: 14rem;height: 5.2rem;margin: 0 5rem 2rem 0;}
footer .footer-logo img {position: absolute;top: 0;}
footer .footer-content {display: block;width: 100%;font-size: 1.3rem;line-height: 2.3rem;text-align: left;}
footer .footer-content .footer-link {font-size: 1.4rem;font-weight: 700;}
footer .footer-content .footer-link a {display: inline-block;margin: 0 .5% 0;color: #aaa;}
footer .footer-content .footer-link a:hover {text-decoration: underline;}
footer .footer-content .footer-link a:first-child {margin-left: 0;}
footer .footer-content .footer-info {display: block;width: 100%;word-wrap: break-word;word-break: break-word;margin-top: var(--space12);}
footer .footer-content .footer-info span {margin: 0 .5% 0;}
footer .footer-content .footer-copyright {display: block;margin-top: var(--space08);}
footer p {display: inline-block;width: 100%;}
*/

/* Go To Top */
.top-move {position: fixed;bottom: 0px;right: 44px;padding: 1.4rem 2rem;background: #fff;border: 1px solid #444;border-radius: .5rem;color: #444;opacity: 0;font-size: 1.4rem;transition: ease .3s;z-index: 10;}
.top-move:hover {background: var(--greyOp600);border: 1px solid #000;color: #fff;}
.top-move i {display: block;font-size: 1.6rem;padding-bottom: .6rem;}

/* Visually Hidden */
.visually-hidden {position: absolute;left: 0;top: 0;overflow: hidden;width: 1px;height: 1px;}

.left-menu-mobile .bold{display: flex;font-weight: 900;font-size: 2.375em;vertical-align: top;white-space:nowrap; align-items: center;overflow: hidden;letter-spacing: -.08em;padding: 3.5rem 0;box-sizing: border-box;line-height: 1.2;}

.modal-sec {display: none;position: absolute;top: 50%;left: 50%;background: #292929;padding: 5.1rem;transform: translate(-50%,-50%);z-index: 1000;}
.modal-sec .tit {font-size: 2.8rem;font-weight: 900;letter-spacing: -2.94px;text-align: left;color: #fff;text-align: center;}
#couponLayer {width: 600px;}
.modal-sec .radio-box {display: block;margin: 3rem auto 0 auto;width: 400px;border: solid 1px #545454;padding: 25px;}
.modal-sec .radio-box input {background: #fff;font-size: 0;letter-spacing: 0;text-align: center;border: 1px solid #292929;}
.modal-sec .btn-group {width: 370px;margin: 30px auto;}
.modal-sec .btn {display: inline-block;background: #1a1a1a;line-height: 48px;font-size: 2rem;width: 180px;text-align: center;margin: 0;cursor: pointer;}
.modal-sec .blue-btn {display: inline-block;background: #0080ff;line-height: 48px;font-size: 2rem;width: 180px;text-align: center;margin: 0 0 0 .5rem;}
.modal-sec .reason-label {display: inline-block;font-size: 18px;height: 48px;margin-left: 15px}
.modal-sec .radio-box span {display: inline-block;width: 49%;}
.modal-sec .radio-box textarea {background-color: #535353;color: #fff;height: 50px;font-size: 14px;padding: 10px;box-sizing: border-box;}
.modal-coupon {display: none;position: absolute;top: 50%;left: 50%;background: #292929;padding: 5.1rem;transform: translate(-50%,-50%);z-index: 1000;}
.modal-coupon .tit {font-size: 2.8rem;font-weight: 900;letter-spacing: -2.94px;text-align: left;color: #fff;text-align: center;}
.modal-sec .notice {display: inline-block;width: 450px;margin: 30px auto;}
.modal-sec .notice li {line-height: 20px;list-style-type: disc;margin: 10px;}
.modal-sec .chk-box {font-size: 1.8rem;font-weight: 900;}

#couponLayer {width: 600px;}
.modal-coupon .coupon-input {display: block;margin: 3rem auto 0 auto;width: 400px;}
.modal-coupon .coupon-input input {background: #fff;font-size: 2rem;letter-spacing: -.1px;text-align: center;width: 30%;border: 1px solid #292929;height: 48px;}
.modal-coupon .btn-group {width: 370px;margin: 30px auto;}
.modal-coupon .x-btn {position: absolute;top: 20px;right: 20px;cursor: pointer;}
.modal-coupon .x-btn img {width: 20px;height: 20px;}
.modal-coupon .btn {display: inline-block;background: #1a1a1a;line-height: 48px;font-size: 1.8rem;width: 180px;text-align: center;margin: 0;cursor: pointer;font-weight: bold;}
.modal-coupon .blue-btn {display: inline-block;background: #0080ff;line-height: 48px;font-size: 1.8rem;width: 180px;text-align: center;margin: 0 0 0 .5rem;cursor: pointer;font-weight: bold;}

.privacy_content {display: none;position: fixed;top: 50%;left: 50%;width: 57.8rem;color: #222;overflow-x: hidden;font-size: 12px;line-height: 15px;background: #fff;transform: translate(-50%,-50%);padding-bottom: 3rem;z-index: 1000;}
.privacy_content .use-Iterms {overflow-y: scroll;width: 51.4rem;height: 56.5rem;margin: 0 auto;border-top: 2px solid #222;margin-top: 2rem;}
.privacy_content .use-Iterms03 {height: auto;padding-top: 2rem;}
.privacy_content .use-Iterms ul li:first-child h3 {padding: 2rem 0 1rem;}
.privacy_content .use-Iterms ul li h3 {padding: 3rem 0 1rem;color: #222;letter-spacing: -.08em;}
.privacy_content .use-Iterms .text_cont {width: 92%;margin: 0 auto;}
#content02 .use-Iterms .text_cont {width: 95% !important;}
.privacy_content .use-Iterms p {line-height: 1.3;text-indent: -3%;}
.privacy_content .close-x {position: absolute;top: 4.2rem;right: 3.3rem;width: 2.2rem;height: 2.2rem;cursor: pointer;}
.privacy_content h1 {margin: 0 3.1rem;padding-top: 4.3rem;letter-spacing: -.08em;box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;}
	
table.table_cont {margin: 3.5% auto 0;}
table.table_cont th,
table.table_cont td {padding: 3%}
.modal-alert {display: none;position: fixed;top: 20%;left: 50%;max-width: 300px;padding: 5%;font-size: 21px;line-height: 20px;background: #292929;transform: translate(-50%,-50%);height: 80px;cursor: pointer;z-index:9999999;border-radius: 8px;}
.modal-alert .txt {font-size:16px;margin-top: 35px;}
.modal-alert .close-x {position: absolute;top: 30px;right: 30px;width: 20px;height: 20px;background: #292929;cursor: pointer;}
.player-modal {display: none;position: fixed;top: 0;background: rgba(0,0,0,0.9);width: 100%;height: 100%;z-index: 9999;}
.player-modal .player-container {display: inline-block;position: absolute;top: 69%;left: 50%;width: 50%;transform: translate(-50%,-50%);vertical-align: middle;max-width: 640px;max-height: 100%;width: 100%;padding: 0 5px;}
#youTubePlayer1 {position: relative;width: 100%;padding-bottom: 56.25%;height: 360px;}
#youTubePlayer1 iframe {position: absolute;width: 100%;height: 100%;}
.player-close {position: absolute;top: 40px;right: 40px;cursor: pointer;}

#modal_popup {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;overflow: hidden;background-color: rgba(0,0,0,0.7);z-index: 9999;}
#modal_popup .modal_content {margin: auto;padding: 5rem;width: 42.7rem;text-align: center;box-sizing: border-box;background: #fff;margin-top: 30rem;border-radius: .5rem;}
#modal_popup .modal_content p {line-height: 2.5rem;font-size: 1.75rem;color: #222;letter-spacing: -0.10em;padding: 2rem 0 4.4rem 0;box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;}
#modal_popup .modal_content span {font-weight: bolder;}
#modal_popup .modal_content #modal_close {border: 0;width: 12.4rem;height: 4.8rem;background: #333;font-size: 1.5rem;letter-spacing: -.10em;cursor: pointer;}
#modal_popup .modal_content #modal_cancel {border: 0;width: 12.4rem;height: 4.8rem;background: #333;font-size: 1.5rem;letter-spacing: -.10em;cursor: pointer;}


/*****************/
/* malgn css add */
/*****************/
.pay_total_wrap,
.pay_type,
.pinfo,
.tb_price,
.tb_box table th,
.tb_box table td,
.read_page table th,
.read_page table td,
.faq_wrap,
.find_id,
.suc_agree,
.suc_p,
.course_subtitle,
.course_tutor_period,
#wrap_classroom .nodata,
#wrap_classroom .tb_list_resp tbody td,
#wrap_classroom .tb_list_resp tbody td p small {font-size: 1.4rem;line-height: 1.4;}

.g_box_in,
.gray_box .check,
.find_box p,
.box_tx {font-size: 1.2rem;line-height: 1.2;}

.log_find {line-height: 1.2;}

.tb_title {height: auto !important;}
.type_list tbody td.tal span {font-size: 1.2rem;}
.main_pop .type_list {margin: 0 0 !important;}

.sub_top_classroom .top_title {height: auto;}

@media (max-width: 1200px) {
	#wrap_classroom .sub_top_classroom .top_title {height: auto;}

	#wrap_classroom .nodata,
	#wrap_classroom .tb_list_resp tbody td,
	#wrap_classroom .tb_list_resp tbody td p small {font-size: 1.4rem;line-height: 1.4;}
}

@media (max-width: 767px) {
	.type_list.review_list tbody tr td:nth-child(4),
	.type_list.review_list tbody tr td:nth-child(5),
	.type_list.board_list tbody tr td:nth-child(3),
	.type_list.board_list tbody tr td:nth-child(4),
	.type_list.board_list tbody tr td:nth-child(5) {font-size: 1.2rem;line-height: 1.2;}

	.tb_box table th {padding: 1.2rem;}

	.coupon_box .button {margin-top: 0;}
}




/*=====  Media Screen  ====*/
@media screen and (max-width: 1299px) {  /* malgn css setting */
	#wrap {padding-top: 0 !important;}
}


@media screen and (max-width:1024px) {
	/* Header PC */
	header {width: 100%;height: 6.6rem;}
	header .gnb_nav_wrap,
	header .local-nav-links {padding: 0 2rem;}
	header.header_br_bt_m {border-bottom: 1px solid #444;}
	header .gnb_nav {transition: none;}
	header .gnb_nav.active {backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);max-height: 100%;transition: none;}
	header .pc_gnb_wrap {display: none;}
	
	/* Header - Mobile */
	header .mobile_gnb_wrap {display: flex;align-items: center;width: 100%;padding: 1.6rem 0;}
	header .mobile_gnb_wrap .btn_sidemenu i {font-size: 2.4rem;font-weight: 300;}
	header .mobile_gnb_wrap .profile_m {width: auto;}
	header .mobile_gnb_wrap .profile_m a {display: block;font-size: 1.4rem;color: #fff;}
	header .mobile_gnb_wrap .profile_m img {display: block;border: 1px solid #777;border-radius: 2.6rem;width: 2.6rem;height: 2.6rem;object-fit: cover;}
	header .mobile_gnb_wrap .nav_logo_m {display: block;text-align: center;height: 3.2rem;margin: 0 auto;}
	header .mobile_gnb_wrap .nav_logo_m img {height: 100%;}
	header .mobile_gnb_wrap .nav_logo {display: none;}
	header .mobile_gnb_wrap .global-nav-logo-m img {height: 100%;}
	
	/* Header - SideMenu - Mobile */
	header .sidemenu {display: block;position: fixed;top: 0;left: -2000px;overflow: hidden;width: 30rem;height: 100%;box-shadow: 10px 10px 10px var(--greyOp600);box-sizing: border-box;z-index: 101;}
	header .sidemenu .sidemenu__inner {height: 100%;background: var(--grey900);overflow-y: auto;}
	header .sidemenu .sidemenu__logo {display: flex;align-items: center;justify-content: center;position: relative;height: 7rem;margin-bottom: 1.2rem;padding: 3.2rem 0;}
	header .sidemenu .sidemenu__logo img {width: 9.8rem;opacity: 1;}
	header .sidemenu .sidemenu__logo i {position: absolute;right: 1.4rem;font-size: 2.6rem;font-weight: 300;}
	header .sidemenu .sidemenu__search {position: relative;width: 100%;}
	header .sidemenu .sidemenu__search input {width: 100%;background: var(--grey900);padding: 1.8rem 1rem 1.8rem 4.4rem;color: #fff;font-size: 1.6rem;font-weight: bold;border: none;}
	header .sidemenu .sidemenu__search input::placeholder {color: var(--grey300);}
	header .sidemenu .sidemenu__search i {position: absolute;left: 14px;top: 20px;color: var(--grey300);font-size: 1.6rem;font-weight: 500;}
	
	header .sidemenu .m_gnb {}
	header .sidemenu ul .m_step {position: relative;width: 100%;overflow: hidden;}
	header .sidemenu ul .m_step > a {display: flex;align-items: center;justify-content: flex-start;width: 100%;height: 100%;padding: 2.4rem;font-size: 1.4rem;font-weight: bold;color: #fff;font-size: 1.6rem !important;line-height: 1.2;}
	header .sidemenu ul .m_step:first-child > a {border-bottom: none;}
	header .sidemenu ul .m_step a {font-size: 1.4rem;font-weight: bold;line-height: 1.4;}
	header .sidemenu ul .m_step a.m_step-all {color: #aaa !important;}
	header .sidemenu ul .m_step a.m_step-all i {color: #aaa !important;font-size: 1.2rem;font-weight: 500;}
	header .sidemenu ul .m_step > a i {margin-left: 1.4rem;color: var(--primary01);font-size: 1.6rem;}
	header .sidemenu ul .m_step.active > a {color: var(--primary01);}
	
	/* malgun */
	header .sidemenu .depth1 {}
	header .sidemenu .depth1 > li {position: relative;width: 100%;overflow: hidden;}
	header .sidemenu .depth1 > li.active > a {color: var(--primary01);}
	header .sidemenu .depth1 > li > a {display: flex;align-items: center;justify-content: flex-start;width: 100%;padding: 2.4rem;font-size: 1.4rem;font-weight: bold;color: #fff;font-size: 1.6rem !important;line-height: 1.2;}
	header .sidemenu .depth1 > li a {font-size: 1.4rem;font-weight: bold;line-height: 1.4;}
	header .sidemenu .depth1 > li > a i {margin-left: 1.4rem;color: var(--primary01);font-size: 1.6rem;}
	header .sidemenu .depth1 > li > .m_step_div {height: 0;padding: 0 2.4rem;}
	header .sidemenu .depth1 > li > .m_step_div .depth2 {width: 100%;background: var(--grey600);padding: 0 2.4rem;border-radius: .5rem;}
	header .sidemenu .depth1 > li > .m_step_div .depth2 li {text-align: left;}
	header .sidemenu .depth1 > li > .m_step_div .depth2 li:not(:last-child) {border-bottom: 1px solid var(--grey500);}
	header .sidemenu .depth1 > li > .m_step_div .depth2 li a {display: block;padding: 1.8rem 0;color: var(--grey200);font-size: 1.6rem;}
	header .sidemenu .m_gnb__space {}

	header .sidemenu .m_gnb__footer {padding: 4.4rem 0 4.4rem;}
	header .sidemenu .m_gnb__footer ul li {margin-bottom: 1.8rem;}
	header .sidemenu .m_gnb__footer ul li a {display: block;color: #888;font-size: 1.4rem;}
	
	
	/* Header - myMenu */
	header .mymenu_wrap {display: block;position: fixed;top: 0;right: -500px;width: 27rem;height: 100%;background: #1d1d1d;box-shadow: -10px 20px 20px rgb(0 0 0 / 20%);z-index: 200;}
	header .mymenu_wrap .my_user_box {position: relative;width: 100%;height: auto;background: #141414;padding: 2rem 0;border-bottom: 1px solid #0080ff;}
	header .mymenu_wrap .my_user_box .btn_mymenu_close {position: absolute;top: 10px;right: 10px;font-size: 2.8rem;font-weight: 300;}
	header .mymenu_wrap .my_user_box .my_login_box {padding: 4.4rem 2.4rem 3.6rem;}
	header .mymenu_wrap .my_user_box .my_login_box p {margin-bottom: 1.6rem;color: #fff;font-size: 1.6rem;text-align: center;line-height: 1.2;}
	header .mymenu_wrap .my_user_box .my_login_box a {display: block;width: 100%;padding: 1.6rem 0;font-size: 1.6rem;color: #fff;text-align: center;border-radius: .5rem;}
	header .mymenu_wrap .my_user_box .my_login_box a.my_login {background: #0080ff;margin-bottom: .8rem;}
	header .mymenu_wrap .my_user_box .my_login_box a.my_join {background: #4c4c4c;}
	header .mymenu_wrap .my_user_box .my_profile_box {padding: 1.4rem 0;}
	header .mymenu_wrap .my_user_box .my_profile_box a {display: block;width: 8rem;margin: auto;}
	header .mymenu_wrap .my_user_box .my_profile_box img {display: block;width: 8rem;height: 8rem;margin: 0 auto 1.4rem;border-radius: 8rem;object-fit: cover;border: 1px solid #777;box-sizing: border-box;}
	header .mymenu_wrap .my_user_box .my_profile_box p {color: #fff;font-size: 1.8rem;font-weight: bold;text-align: center;line-height: 1.2;text-decoration: underline;}
	header .mymenu_wrap .my_menu_box {display: flex;flex-direction: column;align-items: center;padding: 1.2rem 0;}
	header .mymenu_wrap .my_menu_box ul {width: 100%;margin: 0 auto;}
	header .mymenu_wrap .my_menu_box ul li {width: 100%;padding: 1.8rem 0;color: #888;font-size: 1.6rem;font-weight: bold;text-align: center;}
	header .mymenu_wrap .my_menu_box ul li a {color: #888;}
	header .mymenu_wrap .my_menu_box .my_logout {display: flex;align-items: center;position: absolute;bottom: 0;left: 50%;margin-left: -14%;font-size: 1.6rem;font-weight: bold;color: #0080ff;padding: 2rem 0;}
	header .mymenu_wrap .my_menu_box .my_logout .fa-power-off {font-size: 2rem;color: #0080ff;font-weight: 500;margin-right: .4rem;}
	
	header .dim,
	header .dim2 {display: none;position: fixed;top: 0;left: 0;background: #000;opacity: 0;width: 100%;height: 100%;z-index: 100;}
	header .mask {display: block;position: absolute;top: 0%;left: 10%;border-radius: 20rem;width: 0;height: 0;background: #0080ff;opacity: .1;-webkit-animation: btn_effect 1s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;animation: btn_effect 1s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;}
	
	/* Footer */
	footer .footer_famliy_group {display: none;}
	footer .footer-group {padding: 1.4rem 0 1.4rem;}
	footer .footer-header {border: none !important;}
	footer .footer-link {display: none;}
	footer .footer-bottom .footer-cert {display: none;}
	footer .footer-bottom {padding: 0 2rem;}
	footer .footer-bottom .ft_bt_wrap {border: none;flex-direction: column-reverse;padding: 0 0 7.2rem;;}

	/* FooterNav - Fixed */
	footer .m-footer-menu {display: none;position: fixed;bottom: 0;left: 0;width: 100%;background: #111;font-size: 2rem;line-height: 2rem;padding: 0;border-top: 1px solid #444;border-top-left-radius: 2rem;border-top-right-radius: 2rem;z-index: 11;}
	footer .m-footer-menu .footer-btn-group {display: flex;max-width: 48rem;justify-content: space-between;margin: 0 auto;padding: 1.4rem 0; box-sizing: border-box;}
	footer .m-footer-menu .footer-btn-group div {height: 2.4rem;}
	footer .m-footer-menu .footer-btn-group i {width: 33.3%;text-align: center;font-style: normal;cursor: pointer;}
	footer .m-footer-menu .footer-btn-group i img {height: 100%;vertical-align: -webkit-baseline-middle;}
	footer .m-footer-menu .footer-btn-group i span {display: block;margin-top: 1rem;font-size: .65em;color: #727272;}
	
	/* Go To Top */
	.top-move {display: none;}
	
	/* Scroll Custom */
	::-webkit-scrollbar {width: normal;background: normal;}
}

@media screen and (max-width:800px) {
	header .gnb_nav_wrap, header .local-nav-links {padding: 0 2rem;}
}

@media screen and (max-width:751px) {
	.global-nav-search-pc img {display: none;} 
}

@media screen and (max-width:750px) {
	#modal_popup .modal_content {width: 90% !important;line-height: 1.3;margin-top: 50% !important;padding: 5rem 0;}	
	.gnb_nav {height: 60px;}
	.nav_mymenu {display: none;}
	.nav_kh {display: none;}
	.global-nav-logo {position: absolute;top: 28px;left: 53%;transform: translate(-50%,0);}
	.slider-frame .btn.next.active {background-size: 30% !important;padding: 0;top: 10px;}
	.slider-frame .btn.prev.active {background-size: 30% !important;padding: 0;top: 10px;}
	.global-nav-search-mobile {position: absolute;top: 18px;right: 2rem;height: 2.4rem;}
	.global-nav-search-mobile img {height: 100%;}
	.nav_hash {display: block;position: absolute;top: 18px;left: 2rem;height: 2.4rem;}
	.nav_hash img {height: 100%;}	
		
	/* footer {margin-bottom: 0rem;}
	footer .footer-group {margin: 0 auto;padding: 4rem 2rem;box-sizing: border-box;-webkit-box-sizing: border-box;}
	footer .footer-content {display: inline;}
	footer .footer-content .footer-link a {display: inline-block;color: #aaa;}
	footer .footer-content .footer-link {width: 100%; margin: 0 auto;}
	footer .footer-content .footer-copyright {margin: 2.4rem 0 0 0;}
	footer .footer-content .footer-info {margin: 3% auto 0;} */

	.modal-coupon {display:none;position: fixed;top: 50%;left: 50%;background: #292929;padding: 5.1rem 3.1rem 3.1rem;transform: translate(-50%,-50%);z-index: 1000;}
	.modal-coupon .tit {font-size: 2.8rem;font-weight: 900;letter-spacing: -0.08em;text-align: left;color: #fff;text-align: center}
	#couponLayer {width: 90% !important;padding: 12% 3%;}
	.modal-coupon .coupon-input {display: block;margin: 0 auto;width: 90%;padding: 9% 0;text-align: center;}
	.modal-coupon .coupon-input input {background: #fff;font-size: 1.7em;letter-spacing: -.08em; margin: 0 1.125%; text-align: center;width: 22.5%;border: 1px solid #292929;height: 4rem;}
	.modal-coupon .coupon-input #coupon01 {margin-left: 0;}
	.modal-coupon .coupon-input #coupon03 {margin-right: 0;}
	.modal-coupon .coupon-input:last-child input {margin-right: 0;}
	.modal-coupon .btn-group {width: 80%;margin: 0 auto;}
	.modal-coupon .btn {display: inline-block;background: #1a1a1a;line-height: 48px;font-size: 1.5em;width: 48.25%;text-align: center;margin: 0;cursor: pointer;}
	.modal-coupon .blue-btn {display: inline-block;background: #0080ff;line-height: 48px;font-size: 1.5em;width: 48.25%;text-align: center;margin: 0 0 0 .5rem;cursor: pointer;letter-spacing: -.08em;}

	.serachForm {display: flex;position: absolute;top: 0;left: 20px;width: 0;background: #006ad3;overflow: hidden;z-index: 20;}
	.serachForm .searchIcon {float: left;width: 70px;height: 60px;background: #006ad3;padding: 20px 21px;box-sizing: border-box;}
	.serachForm .searchIcon img {width: 21px;vertical-align: middle;}
	.serachForm .searchInput {height: 52px;box-sizing: border-box;background: #006ad3;border: 0;font-size: 2.5rem;letter-spacing: -.08em;color: #fff;font-style: normal;width: 100%;}
	.serachForm .searchDel {float: left;height: 52px;box-sizing: border-box;width: 40px;background: #006ad3;padding: 24px 5px;}
	.left-menu-mobile .top .login-btn {display: flex;font-size: 2em;font-weight: bolder;letter-spacing: -.08em;width: 15.6rem; white-space: nowrap;margin: 0;padding: 4rem 0px;overflow: hidden;align-items: center;background: none;}
	.privacy_content h1 {font-size: 1.5em;}
}

@media screen and (max-width:480px) {
	footer .footer-logo {width: 10rem;}
	footer .footer-bottom .footer-bt-right {width: 100%;margin-bottom: .8rem;}
}

@media screen and (max-width:357px) {
	.left-menu-mobile .top .login-btn {width: 12.6rem;}
}

@media screen and (max-width:350px) {
	.nav_mymenu {display: none;}
	.nav_kh {display: none;}
	.global-nav-logo {position: absolute;top: 31px;left: 55%;transform: translate(-50%,0);}	
	
	.left-menu-mobile .top .login-btn {width: 12.6rem;font-size: 1.8em;}
	.left-menu-mobile .bold {font-size: 2em !important;}
}


/*=====  Animation  =====*/
@keyframes btn_effect {
    from {left: 10%;top: 0%;width: 0;height: 0;opacity: .2;}
    to {left: 80%;width: 10rem;height: 10rem;opacity: 0;}
}

@keyframes call-circle-img-anim {
	0% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg)
    }
}