@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
* { margin:0; padding:0; font:inherit; color:inherit; } 
*, :after, :before { box-sizing:border-box; flex-shrink:0; } 
:root { -webkit-tap-highlight-color:transparent; -webkit-text-size-adjust:100%; text-size-adjust:100%; cursor:default; line-height:1.5; overflow-wrap:break-word; -moz-tab-size:4; tab-size:4 } 
html, body { height:100%; line-height: 1; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; letter-spacing: -0.025em; } 
img, picture, video, canvas, svg { display: block; max-width:100%; } 
video { box-sizing: border-box; } 
input { box-sizing: border-box; background: transparent; } 
button { background:none; border:0; cursor:pointer; box-sizing: border-box; background: transparent; } 
a { text-decoration:none; transition: 0.3s; } 
table { border-collapse:collapse; border-spacing:0 } 
ul, ol, li { list-style: none; } 
pre {white-space: pre-wrap;}

input[type=text], input[type=number], input[type=email], button, textarea, select , input[type=button], input[type=submit], input[type=reset] {
	 appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}
select { background: transparent url("../Images/sel_arrow.svg") no-repeat calc(100% - 1.18rem) 50%; } 
input,
input:focus {outline: none;}


:root { 
	font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
    --color-inno-blue : #19255B; 
    --color-wihite : #fff; 
    --color-purple : #7163BA; 
	--color-black : #121212;
	--color-gray2 : #9a9a9a;
	--color-orange : #ff6600;
    --body-bg : #fafafa; 
	--nomal-bg : #ebeaf0;
	
    --lg-padding : 3.75rem; 
    --md-padding : 1.875rem; 
    --sm-padding : 1.355rem;    
	
	--box-radius : 0.625rem;
	--sm-radius : 0.5rem;
	--btn-radius : 0.25rem;
} 

body { background: var(--body-bg); } 
.wrap {position: relative;}
.mob_bg {display: none;}


/*기존 innoedu common css -(e) */
.inputContainer { position: relative; float: left; font-size: 1rem; }
.formError { position: absolute; top: 300px; left: 300px; display: block; z-index: 115000; cursor: pointer; }
.ajaxSubmit { padding: 20px; background: #55ea55; border: 1px solid #999; display: none }
.formError .formErrorContent { transform: translate(55%, 74%); background: #e95454f5; position:relative; z-index:115001; color: #fff; font-size: 0.8125rem; padding: 0.5rem 1rem; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
.greenPopup .formErrorContent { background: #33be40; }
.blackPopup .formErrorContent { background: #393939; color: #FFF; }
.formError .formErrorArrow { width: 15px; margin: -2px 0 0 150px; position:relative; z-index: 115006; display:none;}
.formError .formErrorArrowBottom { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; margin: 0px 0 0 12px; top:2px; }
.formError .formErrorArrow div { border-left: 2px solid #ddd; border-right: 2px solid #ddd; box-shadow: 0 2px 3px #444; -moz-box-shadow: 0 2px 3px #444; -webkit-box-shadow: 0 2px 3px #444; font-size: 0px; height: 1px; background: #ee0101; margin: 0 auto; line-height: 0; font-size: 0; display: block; }
.formError .formErrorArrowBottom div { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; }
.greenPopup .formErrorArrow div { background: #33be40; }
.blackPopup .formErrorArrow div { background: #393939; color: #FFF; }
.formError .formErrorArrow .line10 { width: 15px; border: none; }
.formError .formErrorArrow .line9 { width: 13px; border: none; }
.formError .formErrorArrow .line8 { width: 11px; }
.formError .formErrorArrow .line7 { width: 9px; }
.formError .formErrorArrow .line6 { width: 7px; }
.formError .formErrorArrow .line5 { width: 5px; }
.formError .formErrorArrow .line4 { width: 3px; }
.formError .formErrorArrow .line3 { width: 1px; border-left: 2px solid #ddd; border-right: 2px solid #ddd; border-bottom: 0 solid #ddd; }
.formError .formErrorArrow .line2 { width: 3px; border: none; background: #ddd; }
.formError .formErrorArrow .line1 { width: 1px; border: none; background: #ddd; }


#policy_auth_alert {z-index:9999;}
#shadow_login_alert {z-index:998;}
#pass_auth_alert { z-index:999;}
#marketing_agree_alert {z-index: 9998;}

.b-modal {opacity: 0.8 !important;}
#marketing_agree_alert,
#policy_auth_alert ,
#shadow_login_alert,
#pass_auth_alert { background:#fff; display:none;  }

.r_pop_tit { background: #243045; color:#fff; padding: 1rem 25px; }
.r_pop_tit h2{ display: inline-block; font-size: 1.85rem; }
.r_pop_textarea { color: #787878; line-height: 180%; border: 1px solid #ccc; border-radius: 6px ; overflow-y:auto; width :94%; margin:20px auto 0; padding: 15px 24px; font-size:1.15rem;}
.r_pop_subtit {border: 1px solid #ccc; background :#edf1f7; width: 94%; margin: 15px auto; padding: 15px; font-size: 1.15rem;}
.r_pop_shdow_tb_wrap { max-height: 350px; overflow: auto;}
.r_pop_shdow_tb {border: 1px solid #ccc; width:94%; vertical-align: middle; margin: 0 auto 20px; }
.r_pop_shdow_tb tr th {background :#edf1f7; border: 1px solid #ccc;  padding: 10px 0; text-align: center;}
.r_pop_shdow_tb tr td {border: 1px solid #ccc; padding: 8px 15px;}
.r_pop_shdow_tb tr td.show_index, .r_pop_shdow_tb tr td.show_date {text-align: center; color:#787878;}

.r_pop_tb {border: 1px solid #ccc; width:94%; vertical-align: middle; margin: 0 auto 20px;}
.r_pop_tb tr td {border: 1px solid #ccc; padding: 10px 15px;}
.r_pop_tb tr th {width: 32%; background :#edf1f7; border: 1px solid #ccc;  padding: 16px 0; text-indent: 22px;}
.r_pop_tb tr td input {width: 99%; padding: 3px 3%;  font-size: 1rem; border:1px solid #ccc;  border-radius: 4px;}


.r_pop_chk_area {width :94%; margin:0 auto;}
.r_pop_chk_area label {font-size: 1.15rem; color:#222; vertical-align: middle; padding: 10px 0;}
.r_pop_chk_area label input {margin-right: 8px; margin-bottom: 7px;}
.r_pop_btn_area {text-align: center;}

.r_pop_btn {font-size:1.25rem; color:#fff; background: #243045; padding: 0.75rem 3rem; display: inline-block;}
.r_pop_none_btn {font-size:1.25rem; color:#787878; background: #ccc; padding: 0.75rem 3rem; display: inline-block;}

.b-close{ cursor:pointer; position:absolute; left:240px; top:110px;}

/*기존 innoedu common css - (e)*/


/*nav*/
.top_nav { position: absolute; top:0; left:0; width: 100%; z-index: 99 } 
.top_nav > div { max-width: 1440px; width: 100%; margin: 1.375rem auto 0; display: flex; justify-content: flex-end; font-size: 0.9375rem; position: relative;; } 
.top_nav div > a { display: flex; color: #343434; } 
.top_nav > div.before_login > span {padding-right: 0.75rem;}

.top_nav > div.before_login > a:last-of-type::after {display: none;}
.dark-mode .top_nav div > span,
.dark-mode .top_nav div > a,
.dark-mode .top_nav div > .go_login::after,
.dark-mode .top_nav > div.before_login > a::after { color: var(--color-wihite); } 
.dark-mode .top_nav div > .go_login::after,
.dark-mode .top_nav > div.before_login > a:nth-of-type(1)::after { opacity: 0.7; } 
.dark-mode .top_nav > div.before_login > a:nth-of-type(1) { padding-right: 0.75rem; } 
.dark-mode .top_nav > div.before_login > a:nth-of-type(1)::after {  display: none; padding-right: 0.75rem; } 



.gnb { width: 100%; padding-top: 0.375rem; padding-bottom: 1.1875rem; position: absolute; top:2.3125rem; left:0; z-index: 99; } 
.sc-max-top .gnb,
.dark-mode .gnb { margin-bottom: 0.875rem; } 
.menu_on.sc-down .gnb  {background: none; box-shadow: none;}
.sc-down .gnb { background: var(--color-wihite); box-shadow: -1px 5px 4px rgb(180 180 180 / 20%); position: fixed; top:0; left:0; z-index: 999; padding: 0.375rem 0; } 

.gnb div { max-width: 1440px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; } 
.gnb div h1 a { display: flex; width: 6.75rem; height: 1.875rem; text-indent: -9999px; color: transparent; position: relative; } 
.gnb div h1 a svg { position: absolute; width: 100%; top:0; left:0; } 
.dark-mode .gnb div h1 a svg path { fill: var(--color-wihite) } 

.gnb div nav { display: flex; align-items: center; } 
.gnb div nav a { font-size: 1.125rem; padding: 1.75rem; font-weight: 600; color:#343434; } 
.dark-mode .gnb div nav a { color: var(--color-wihite); } 
.gnb div nav a:hover { color: #341EA5; } 
.dark-mode .gnb div nav a:hover { color: #c7b5ff; } 

.gnb div nav span {display: flex;}
.gnb div nav a.down_btn:nth-last-of-type(2) { margin-left: 1.25rem; } 
.gnb div nav a.down_btn:nth-last-of-type(1) { margin-left: 0.9375rem; } 
.gnb div nav a.down_btn { display: flex; justify-content: center; align-items: center; background: var(--color-purple); color: var(--color-wihite); font-size: 0.9375rem; padding: 0 2.5rem; height: 2.75rem; gap: 0.5rem; border-radius: 1.375rem; position: relative; top: -0.5px; } 
.gnb div nav a.down_btn::before { content: url("../Images/ic_down.svg"); position: relative; top: 1px; } 
.gnb div nav a.down_btn:hover { background: #53488f; } 

footer { width: 100%; background: #EBEAF0; padding: 2.875rem 0 3.375rem 0; position: relative; z-index: 9; } 
footer > .footer_inner { max-width: 1440px; width: 100%; margin: 0 auto; display: flex; flex-direction: column; gap: 1.56rem; } 
.footer_inner > div { display: flex; position: relative; align-items: flex-end; } 
.footer_inner > div > select { position: absolute; top: -0.5rem; right: 0; width: 13.75rem; height: 2.87rem; padding: 0 1.18rem;  color:#434343; border-radius: 0.25rem; border: 1px solid #aaa; } 
.footer_inner > div span { margin-right : 2.18rem; } 
.footer_inner > div span svg path { fill : #8C8E9E; } 
.footer_inner > div a { color:#97959D; font-size:1.06rem; font-weight: 600; letter-spacing: 0; cursor: pointer;} 
.footer_inner > div > a:nth-of-type(1) { margin-right: 1.125rem; } 
.footer_inner > p { color:#9f9da5; line-height: 152%; font-weight: 400; } 
.footer_inner > p span { opacity: 0.5; padding: 0.35rem; font-weight: 200; } 


@media (max-width:1440px) { header.top_nav, header.gnb, footer, .sc-down header.gnb,
	main > h2,
    main > section { padding-right : var(--lg-padding); padding-left : var(--lg-padding); } 
}

@media (max-width:1280px) { 
	header.top_nav, header.gnb, footer, .sc-down header.gnb,
	main > h2,
    main > section { padding-right : var(--md-padding); padding-left : var(--md-padding); } 
    .gnb { padding-top: 1.15rem; } 
    .gnb div nav a { padding: 1rem 0.85rem; font-size: 1.125rem} 
    .gnb div nav a.down_btn { padding: 1rem 1.25rem; } 
    .gnb div nav a.down_btn:nth-of-type(1) { margin-left: 0; }     
	.gnb div nav a.down_btn:nth-last-of-type(1) {margin-left:  0.85rem;}
}

@media (min-width:991px){
    #mobileBtn,    
    .sc-down .top_nav { display: none; } 
	.footer_inner > div span:nth-last-of-type(1) {display: flex; gap: 1rem; margin-right: 0;}
	.top_nav div > .go_login::after,
	.top_nav > div.before_login > a::after { content: "I"; padding: 0 0.75rem; font-weight: 200; color: #343434; opacity: 0.3; }
	.top_nav > div.before_login > a:nth-of-type(1) { padding-right: 0.75rem; }
	.top_nav > div.before_login > a:nth-of-type(1)::after { display: none; }
	.top_nav div > a.goManger2 {background: #727f8c; padding: 0.5rem 1rem; display: inline-block; font-size: 0.8125rem; border-radius: 100rem; position: relative; top: -0.5rem; font-weight: 400; color:#fff;}
	.goManger2::after {display: none;}
	.goManger2:hover { opacity: 0.8; }
}
@media (max-width:990px) { 
	body.menu_on {overflow-y: hidden;}
	header.top_nav, header.gnb, footer, .sc-down header.gnb,
	main > h2,
    main > section { padding-right : var(--sm-padding); padding-left : var(--sm-padding); } 
    header.top_nav,
    .gnb div nav { display: none; } 
	.sc-down .gnb {padding-top: 1rem; padding-bottom: 1rem;}
    header.gnb { position: fixed; top:0; left:0; margin-bottom: 0; } 
    header.gnb { padding-top: 2rem; padding-bottom: 2rem; } 
    #mobileBtn { display: flex; flex-direction: column; width:2rem; height: 2rem; position: relative; gap: 0.5rem; z-index: 9999;} 
    #mobileBtn span { width: 100%; height: 3px; border-radius: 2px; background: #232323; display: block; transition: .5s; } 
    .menu_on #mobileBtn span,
    .dark-mode #mobileBtn span { background: var(--color-wihite); } 
    .menu_on #mobileBtn span { position: absolute; top:50%; } 
    .menu_on #mobileBtn span:nth-of-type(1) { transform: translateY(-50%) rotate(45deg); transform-origin:center; } 
    .menu_on #mobileBtn span:nth-of-type(2) { opacity: 0; } 
    .menu_on #mobileBtn span:nth-of-type(3) { transform: translateY(-50%) rotate(-45deg); } 
	header.top_nav div.before_login a {width: 9rem;}
	.dark-mode .top_nav > div.before_login > a:nth-of-type(1) {
		padding-right: 0;
	}
	.gnb div h1 a svg {top: -2px;}
    /*
	.gnb div nav { background: var(--body-bg); display: flex; position: fixed; top: 0; left: -74vw; width: 74vw; height: 100vh; flex-direction: column; align-items: flex-start; transition: 0.5s; z-index: 99999; padding-top: 6.5rem; padding-left: var(--sm-padding); gap: 0.5rem;}  
	.menu_on .mob_bg { content: ""; display: block; width: 100%; height: 100%; position: fixed; top:0; left:0; background: #000; z-index: 99; opacity: 0.6; } 
	*/
    .gnb div nav span {display: none;}	
	.gnb div nav {  display: none; position: fixed; top: 0; width: 100vw; height: 100vh; transition: 0.5s; opacity: 0; z-index: 999;  } 
	.menu_on header.top_nav,
    .menu_on .gnb div nav { display: flex; align-items: center; opacity: 1; } 
	.gnb div nav::before {opacity: 0; transition: 0.5s;}
    header.top_nav {position: fixed; top: 6.5rem; left:0; z-index: 9999; display: flex; width:100%; transition: 0.5s; display: none;}
    header.top_nav div {justify-content: center; align-items: center; margin-top: 0; gap: 8px;}

	
    .menu_on.dark-mode .top_nav div > a,
    header.top_nav div a { display: flex; border: 1px solid #ccc; color:#fff; font-weight: 600; font-size: 1.25rem; height: 3.65rem; line-height: 0; justify-content: center;align-items: center; width: 9rem; margin-right: -1px; border-radius: var(--btn-radius);}
	header.top_nav div.before_login a {width: 9rem}
    header.top_nav div a:nth-last-of-type(1) {order: -1;}
	header.top_nav div.before_login a:nth-last-of-type(1) {order: 1;}
    .menu_on .top_nav div > .go_login::after {display: none;}
 	
	header.top_nav div > a,
	header.top_nav div > span {display: none}
	header.top_nav div.after_login > a, 
	header.top_nav div.before_login > .mypage,
	header.top_nav div.before_login > .logout {display: flex;}
	
	.menu_on .gnb div nav { flex-direction: column;  padding-top: 12rem; margin-left: -1.355rem;}
	.menu_on .gnb div nav::before { content: ''; width: 100%; height: 100%; position:absolute; background: #000; top:0; left:0; opacity: 0.9;  backdrop-filter: blur(5px) ;  z-index: 98;}
    .menu_on .gnb div nav a {color :#fff; font-size: 1.85rem; padding: 1.85rem 2rem; z-index: 99;}
	.menu_on .gnb div nav span {position: absolute; width: calc(100% - var(--sm-padding) * 2); bottom:  var(--sm-padding); display: flex; justify-content: space-between; z-index: 9999; }    
    .menu_on .gnb div nav span > a.down_btn {width: calc(50% - 2px); border-radius: 0.25rem; font-size: 1.25rem; height: 3.65rem; padding: 0;}
    .menu_on .gnb div nav span > a.down_btn:nth-last-of-type(1),
    .menu_on .gnb div nav span > a.down_btn:nth-last-of-type(2) {margin-left: 0;}
    .menu_on .gnb div nav a.down_btn {color :#fff;}

	
	
    footer > .footer_inner { align-items: center; } 
    .footer_inner > div { flex-direction: column; align-items: center; gap: 1.5rem; } 
    .footer_inner > div > select { position: relative; top:0; width: 100%; max-width: 16.75rem; border:1px solid #ccc; color:#787878;} 
    .footer_inner > p { text-align: center; } 
    .footer_inner > p br { display: none; } 
    .footer_inner > div span {margin-right: 0; display: flex; gap:1.25rem;}
    .footer_inner > div span a {font-size: 1.125rem;}   
	
	.formError {left: 0 !important;}
}


@media (max-width:530px) { 	
    html, body {font-size: 15px;}
	.gnb div nav {padding-top: 5.65rem; gap : 0 ;}
	.gnb div nav a {font-size: 1.25rem;}
    header.gnb {padding-top: 1.5rem; padding-bottom: 1.5rem;}
	.gnb div nav a, 
	.gnb div nav a.down_btn:nth-last-of-type(1) {padding: 0.65rem 1rem 0.65rem 0;}
    .gnb div h1 a {width: 4.75rem;}
    #mobileBtn {width: 1.8rem; height: 1.25rem; gap : 0.35rem;}

    .gnb div nav a.down_btn::before {display: none;}
    .gnb div nav a {font-size: 1.15rem;}
	main > section {padding-bottom: 3rem;}
	footer {padding-top: 1.65rem; padding-bottom: 2rem;}
	.footer_inner > div {gap : 0.85rem; width: 100%;}
	.footer_inner > div span:first-child {width: 5rem;}
	.footer_inner > div span { display: flex;  gap: 1rem; align-items: center; justify-content: center; }
	.footer_inner > div span a {font-size: 1rem;}
	footer > .footer_inner {gap:0.85rem;}
	.footer_inner > p {font-size: 0.85rem; line-height: 135%;}
	.footer_inner > div > select {height:  auto; padding: 0.75rem 1.125rem; font-size: 1rem;}
	.menu_on .gnb div nav a {font-size: 1.625rem; }	
}



@media (max-width:412px) { 
    .menu_on .gnb div nav span {flex-direction: column; gap: 0.25rem;}
    .menu_on .gnb div nav span > a.down_btn {width: 100%; height: auto; padding: 1.25rem; font-size: 1rem;}
	.gnb div nav a.down_btn::before {display: inline-block;}
}

@media (max-width:339px) { 
    html, body {font-size: 12px;}

}

/*탭*/
.tab-content { display: none; }
.tab-content.active {display: flex;}

/*모달*/
.modal { display: none; position: fixed; justify-content: center;align-items: center; z-index: 99999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto;  background-color: rgba(0,0,0,0.8); }
.modal-content { background-color: #fefefe; width: 92%; max-width: 1100px; }

.t_c_view .modal_body h3  { display: inline-block; color:#111; font-size: 1.75rem; font-weight: 700; background-position: 100% 100%, 0 104%; background-repeat: no-repeat;   background-image: linear-gradient(transparent, transparent),linear-gradient(#B5AEDA, #B5AEDA);  background-size: 0 0.5rem, 100% 0.5rem; padding-bottom: 0.25rem; margin-bottom: 2rem;} 
.t_c_view .modal_body  {font-weight: 400; color:#676767; line-height: 160%; letter-spacing: -0.05em; font-size: 1rem;}
.t_c_view .modal_body .txt_tit01 {display: block; font-size: 1.125rem; font-weight: 600; color:#222; }
.t_c_view .modal_body .txt_tit02 {font-size: 1rem; font-weight: 600; color:#222; }
.t_c_view .modla_footer button { display: flex; font-weight: 600; justify-content: center; align-items: center; border-radius: 0.25rem; padding: 1rem 3rem; width: 100%; max-width: 16rem; transition: 0.3s; background: var(--color-purple); color:#fff;}

.modal-content .modal_body { max-height: calc(90vh - 2rem); padding: 2rem; overflow-y: auto; }
.modal-content {  border-radius: 0.5rem;}
.modal-content .modal_body {max-height: calc(90vh - 2rem); padding: 2rem; overflow-y: auto;}
.modal-content .modal_body::-webkit-scrollbar { width: 3px; }
.modal-content .modal_body::-webkit-scrollbar-thumb { background-color: var(--color-purple); }
.modal_body::-webkit-scrollbar-track {  background-color: #f1f1f1; }
.modla_footer {display: flex; padding: 1rem 1rem 1.5rem 1rem ; justify-content: center; align-items: center;}
.modla_footer button {display: flex; font-weight: 600; justify-content: center; align-items: center; border-radius: var(--btn-radius);  padding: 1rem 3rem; width: 100%; max-width: 16rem; border:1px solid #aaa; transition: 0.3s; background:var(--color-purple); border:1px solid var(--color-purple); color:#fff;} 
.modla_footer button:hover { opacity: 0.8;}

@media screen and (max-width: 1000px) {
    .modal-content {
        width: 90%; 
    }
}
@media screen and (max-width: 900px) {
	.t_c_view .modla_footer {padding:0;}
    .t_c_view .modla_footer button {max-width: 100%; border: 0;   border-radius: 0 0 0.25rem 0.25rem; padding:1.125rem 0;}
	.modal-content .modal_body {padding: 1rem; }
	.t_c_view .modal_body h3 {background-image: none; line-height: 135%; margin-bottom: 1.5rem;}
	#refund_form.t_c_view .modla_footer {gap: 0;}
	#refund_form.t_c_view .modla_footer button {width: 50%;}
	#refund_form.t_c_view .modla_footer button:nth-of-type(1) {border-radius: 0 0 0 0.25rem;}
	#refund_form.t_c_view .modla_footer button:nth-of-type(2) {border-radius: 0 0 0.25rem 0;}

}