@charset "utf-8";

html {overflow-y:scroll; width:100%; }
#wrap {position:relative; display:block; width:100%; height:100%; margin:0 auto; overflow:hidden;}

/* 헤더 TOP */
.headerTop {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 54px;
    background-color: #fed400;
}

.headerTop .notice {
    position: relative;
    display: flex;
    align-items: center;
    width:auto;
    max-width:360px;
    height:30px;
    padding-left: 30px !important;
    padding-right: 20px;
    background: url('../images/icon/header_notice.png')no-repeat left top 8px;
    font-family: 'NanumSquare';
    font-size:16px;
    transform: rotate(-0.03deg);
    font-weight: 600;
    overflow:hidden;
}

.headerTop .notice .teo {width:100%; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; white-space:nowrap; word-wrap:normal;}
.headerTop .notice .teo:hover{color: #e43c22;}
.headerTop .notice::after{
    display: block;
    content: '';
    position: absolute;
    width: 1px;
    height: 14px;
    right: 0;
    top: 8px;
    background-color: #bd9900;
}

.headerTop .PlusAcademyup a {
    position: relative;
    display: flex;
    align-items: center;
    width: 300px;
    height: 30px;
    margin-left: 20px;
    font-family: 'NanumSquare';
    font-weight: 600;
    transform: rotate(-0.03deg);
}

.headerTop .PlusAcademyup a .plus {
    position: relative;
    font-size: 20px;
    font-weight: 800;
    color: #000;
    margin-right: 12px;
}

.headerTop .PlusAcademyup a .plus .plusIcon {
    position: absolute;
    font-style: normal;
    color: #e43c22;
    font-size: 16px;
    font-weight: 800;
    right:-8px;
    top:-5px;
}

.headerTop .PlusAcademyup a .academyup {
    color: #000;
    font-size: 16px;
    font-weight: 800;
    margin-right: 6px;
    letter-spacing: 0.5px;
}


/* 헤더 MENU */
header {
    position:relative;
    border-bottom: 1px solid rgba(255, 255, 255, 1);
    background: #fff;
    z-index:1000;
    height:60px !important;
    transition: all .25s ease;
}

header.fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    transition: all .25s ease;
  }

header .gnb_wrap {
    position: relative;
    display:flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    max-width:1400px;
    height: 60px;
    background: #fff;
    margin:0 auto;
    z-index:1001;
}

header .gnb_wrap h1 {
    position: absolute;
    top: 16px;
    width: 144px;
    height: 30px;
    font-size: 0;
    z-index:1002;
}

header .gnb_wrap h1 a {
    display: block;
    width: 100%;
    height: 100%;
    background: url("../images/img/logo.png") no-repeat 0 0 / 100% auto;
    text-indent: -9999px;
}

header .gnb {position: absolute; left: 170px;}
header .gnb .menu {overflow: visible;}
header .gnb .menu ul {display: flex;}
header .gnb .menu ul li {position: relative; display: flex; align-items: center;}
header .gnb .menu ul li a.menu_title {
    position: relative;
    display: block;
    padding: 20px 26px;
    color: #000;
    font-family: "NanumSquare";
    transform: rotate(-0.03deg);
    font-size: 16px;
    font-weight:700;
    text-align: center;
    transition: all .25s ease;
}
header .gnb .menu ul li a.menu_title:hover {color: #04ac98; transition: all .25s ease;}
header .gnb .menu ul li a.menu_title.active {color: #04ac98 !important; font-weight:700 !important;}
header .gnb .menu ul li a.menu_title:hover::after {
    display: block;
    content: '';
    position: absolute;
    top:24px;
    right:5px;
    width: 10px;
    height: 10px;
    background: url("../images/icon/gnb_arrow.png")no-repeat center center;
}
header .gnb .menu ul li.active a.menu_title {color: #04ac98;}

header .gnb .menu ul li.active a.menu_title::after {
    display: block;
    content: '';
    position: absolute;
    top: 33px;
    right: 4%;
    width: 10px;
    height: 10px;
    background: url("../images/icon/gnb_dot.png")no-repeat center center;
}
header .gnb .menu ul li a.menu_title.no-arrow:hover::after {display: none;}


header .gnb .menu ul li a.menu_title .shop_titleA {
    padding-left: 20px;
    background: url("../images/icon/header/plus.png")no-repeat left center;
}
header .gnb .menu ul li a.menu_title .shop_titleB {
    padding-left: 20px;
    background: url("../images/icon/header/book.png")no-repeat left center;
}





header .gnb .menu ul li .sub_depth{
    position: absolute;
    display: block;
    visibility: hidden;
	width: inherit;
	top:60px;
    left: -20%;
    z-index:1002;
    min-width: 11rem;
    padding: 20px 24px;
    font-size: 1rem;
    color: #333;
    text-align: left;
    list-style: none;
    background-color:#fff;
    background-clip: padding-box;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
   	opacity: 0;
	transition: all .25s ease;
	transform: translateY(10px);
}

/* 헤더 MENU [주요기능] 메뉴 */
header .sub_depth .group{display: flex; width:100%; height:100%;}
header .sub_depth .group .dropgroup {display:flex; width:240px; margin-bottom:16px;}
header .sub_depth .group .dropgroup.mb10{margin-bottom:10px !important;}
header .sub_depth .group .dropgroup img {margin-top:12px; height: auto; max-height: 18px; object-fit: contain;}
header .sub_depth .group .dropgroup .block {width:100%; text-align: left; padding-left:10px;}
header .sub_depth .group .dropgroup .block h3 { color: #666; font-family:'NanumSquare'; transform: rotate(-0.03deg); font-size:15px; font-weight:600; line-height:1.6;}
header .sub_depth .group .dropgroup:hover .block h3 {color:#04ac98}
header .sub_depth .group .dropgroup .block h4 {font-size:13px; font-weight:300; font-family: 'Nanum Gothic', sans-serif; letter-spacing:0px; color:#999;}

/* 헤더 MENU 서브메뉴 및 서브메뉴박스 */
header .sub_depth li a {
    color: #666;
    text-align: left;
    font-family: 'NanumSquare';
    transform: rotate(-0.03deg);
    font-size: 15px;
    font-weight:600;
    padding: 8px 5px;
    display: block;
    padding-left: 14px;
    background: url("../images/icon/gnb_dot2.png") no-repeat 4px 15px;
}

header .sub_depth li a:hover {color:#04ac98; padding-left:14px; background: url("../images/icon/gnb_dot2_on.png") no-repeat 4px 15px;}
header .gnb .menu ul li:hover .sub_depth{display: block; width: auto; visibility: visible; opacity:1; transition: all .25s ease; transform: translateY( -4px);}
header .gnb .menu ul li .shadow{box-shadow: 0 0 1px rgba(190, 190, 190, 0.15),0 1px 2px rgba(156, 156, 156, 0.1),.1rem .2rem .40rem rgba(133, 133, 133, 0.15)!important;}

/* 헤더 LEFT MENU 회원가입 로그인 박스 버튼 */
header .userbox{z-index:1002; position:absolute; right:0px;} 
header .userbox .user{
    position: relative;  
    display:flex;     
    font-family: "NanumSquare";
    transform: rotate(-0.03deg);
    font-size: 15px;
    font-weight:600;
}
header .userbox .user li {padding-left:10px; line-height:36px;}
header .btn_join {
    width:100px;
	height:38px;
	color:#606871;
	background-color:#fff;
	border-radius: 5px;
    font-family: "NanumSquare";
    transform: rotate(-0.03deg);
    font-size: 15px;
    font-weight:600;
    text-align: center;
	border:1px solid #e0e0e0;
	display:block;
	line-height:38px;
    transition: all 0.25s ease;
} 
header .btn_join:hover { color:#04ac98; border:1px solid #04ac98; transition: all .25s ease;}
header .btn_login {
    width:100px;
	height:38px;
	color:#FFF;
	border-radius: 5px;
    font-family: "NanumSquare";
    transform: rotate(-0.03deg);
    font-size: 15px;
    font-weight:600;
    text-align: center;
	display:block;
	line-height:40px;
    transition: all 0.25s ease;
} 

header .btn_login_academy { background-color:#ffc000;} 
header .btn_login_academy:hover { transition: all .25s ease; background-color:#ff7800;}
header .btn_login_student { background-color:#0ab6a7;} 
header .btn_login_student:hover { transition: all .25s ease; background-color:#009182;}
header .btn_login_parents { background-color:#e3e6e9; color:#999;} 
header .btn_login_parents:hover { transition: all .25s ease; background-color:#007fdc; color:#FFF;}
header .btn_myinfo { background-color:#ffc000;} 
header .btn_myinfo:hover { transition: all .25s ease; background-color:#ff7800;}
header .btn_logout { background-color:#0ab6a7;} 
header .btn_logout:hover { transition: all .25s ease; background-color:#009182;}



/* 모바일 메뉴 활성화 버튼 */
header .nav_mobile_button {
    display:none; 
	width:40px; 
	height:40px;
	top:15px; 
	right:20px; 
	z-index:999999; 
	text-align:center; 
	position:absolute; 
	border-radius:5px; 
    background:url("../images/icon/mo_line1.png") no-repeat center 50%;
}


/* 모바일 메뉴 */
.menu_wrap {position:fixed; width:100%; height:100%; top:0; left:0; z-index:999999; display:none;  background:rgba(0,0,0,0.6);}
.menu_wrap > div {position:relative; max-width:100%; min-width:280px; width:100%; height:100%; margin:0 auto; overflow-x:hidden; }
.menu_wrap .menu_area {position:absolute; /*width:90%;*/ width:100%;  height:100%; top:0; right:-90%; background:#fff;}
.menu_wrap .menu_area > .height_finder { width:100%; height:0px;}

.menu_wrap .menu_area .row_01 {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 80px;
    overflow: hidden;

}
.menu_wrap .menu_area .row_01 .btn_close {position: relative; left:20px; margin-bottom: 10px;}
.menu_wrap .menu_area .row_01 .p_name {
    width: 144px;
    height: 50px;
    position: relative;
    font-size: 24px;
    color: #000;
    font-weight: 800;
    font-family: 'NanumSquare';
    letter-spacing: 0;
    margin: 0 auto;
    text-indent: -99999px;
    background: url('../images/img/logo.png') no-repeat center bottom / 100% auto;
}

.menu_wrap .menu_area .row_02 { width:100%; }
.menu_wrap .menu_area .row_02 > li {width:100%; border-bottom:1px solid #f5f5f5; overflow:hidden;}
.menu_wrap .menu_area .row_02 > li > a {
    display: block;
    width: 100%;
    height: 50px;
    color: #333;
    font-weight: 400;
    font-size: 17px;
    padding: 12px 20px;
    background: #fff url('../images/btn/gnbi_arrow.png') 96% center no-repeat;
    background-size: 8px auto;
}

.menu_wrap .menu_area .row_02 > li.selected > a { background:#ffffff url('../images/btn/gnbi_arrow_on.png') 96% center no-repeat; background-size:auto 8px;}
.menu_wrap .menu_area .row_02 > li > ul {width:100%; background:#747c89;}
.menu_wrap .menu_area .row_02 > li > ul > li {width:100%; border-bottom:1px solid #646a72;}
.menu_wrap .menu_area .row_02 > li > ul > li > a {display:block; width:100%; height:49px; line-height:49px; color:#fff; text-indent:20px; font-size:16px;}
.menu_wrap .menu_area .row_02 > li > ul > li > a > img{display:inline-block; padding-top:14px; padding-right:10px; opacity:0.5;}
.menu_wrap .menu_area .row_03 {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 120px;
    padding-top:40px;
    overflow: hidden;
    background: #fff;
}

.menu_wrap .menu_area .row_03 .tel {
    width: 100%;
    padding-left: 45px;
    font-family: 'S-CoreDream';
    font-size: 20px;
    line-height: 40px;
    background: url("../images/icon/menu_tel.png")no-repeat left center;
}


/* 모바일 메뉴 회원가입 로그인 */
.menu_wrap .menu_area .member {display: flex; align-items: center; justify-content: center; padding: 20px 0; background:#FFF; border-bottom:1px solid #EEE;}
.menu_wrap .menu_area .member > ul {display:flex; align-items:center; justify-content: center; flex-wrap:wrap; width:90%; height:auto;}
.menu_wrap .menu_area .member > ul > li {width:25%; font-size:16px; text-align: center; padding:10px;}
.menu_wrap .menu_area .member > ul > li a {display:block;}
.menu_wrap .menu_area .member > ul > li a.Mbtn {
    width:100%;
	height:44px;
	color:#FFF;
	border-radius: 5px;
    font-family: "NanumSquare";
    transform: rotate(-0.03deg);
    font-size: 15px;
    font-weight:600;
    display: flex;
    align-items: center;
    justify-content: center;
}
.menu_wrap .menu_area .member > ul > li a.Mbtn_join { color:#606871; background-color:#fff; border:1px solid #e0e0e0;} 
.menu_wrap .menu_area .member > ul > li a.Mbtn_login_academy { background-color:#ffc000;}
.menu_wrap .menu_area .member > ul > li a.Mbtn_login_student { background-color:#0ab6a7; }
.menu_wrap .menu_area .member > ul > li a.Mbtn_login_parents { background-color:#e3e6e9; color:#999;}
.menu_wrap .menu_area .member > ul > li a.Mbtn_myinfo { background-color:#ffc000;}
.menu_wrap .menu_area .member > ul > li a.Mbtn_logout { background-color:#0ab6a7;} 


/* 우측 배너 */
.Rbanner {position: absolute; z-index:999999; right: 10px; top: 80px; width: 120px; height: auto; border-radius: 6px; overflow: hidden;}
.Rbanner .banner {width: 100%; height: auto;}
.Rbanner .banner > li {width: 100%; margin-bottom: 6px; border-radius: 6px; overflow: hidden;}
.Rbanner .banner > li:last-child { margin-bottom: none;}



/* 풋터 */
footer {
    position: relative;
    width: 100%;
    height: auto;
    background: #fff;
    border-top: 1px solid #f5f5f5;
    padding: 70px 0;
}

footer .info {
    position: relative;
    width: 100%;
    max-width: 1400px;
    height: auto;
    margin: 0 auto;
    margin-bottom: 30px;
}

footer .info .footer_logo{
    margin-bottom:10px;
}

footer .info .address {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-left: -10px;
    font-family: 'NanumSquare';
    transform: rotate(-0.03deg);
    font-size: 16px;
    font-weight: 400;
    color: #868f9b;
}

footer .info .address li {
    position: relative;
    display: block;
    padding: 0 12px;
    letter-spacing: -0.5px;
    margin-top:10px;
    word-break: keep-all;
}

footer .info .address li .info_company {
    width: 120px;
    height: 24px;
    padding: 4px 0;
    background: #f3f5f9;
    font-size: 13px;
    color: #999;
    font-weight: bold;
    border-radius: 14px;
    border:1px solid #EEE;
    margin-left:4px;
}

footer .info .address li::after {
    display: block;
    content: '';
    position: absolute;
    width: 1px;
    height: 10px;
    right: 0;
    top: 4px;
    background-color: #d3d3d3;
}

footer .info .address li:last-child::after {
    display: none;
}

footer .info .footerMenu {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-left: -10px;
    margin-top:34px;
    font-family: 'NanumSquare';
    transform: rotate(-0.03deg);
    font-size: 16px;
    font-weight: 400;
    color: #868f9b;
}

footer .info .footerMenu li {
    position: relative;
    display: block;
    padding: 0 12px;
    letter-spacing: -0.5px;
    margin-top:10px;
    word-break: keep-all; 
}

footer .info .footerMenu li .Foot_social { 
    display: flex;
    align-items: center;
}

footer .info .footerMenu li .Foot_social span {
    padding: 0 12px;
}


footer .info .copyright {
    margin-top: 36px;
    margin-left: -10px;
    font-size: 15px;
    letter-spacing: 0px;
    font-weight:300;
    color: #a5acb6;
}

footer .info .copyright li {
    display: block;
    padding: 8px 10px;
}



/* 풋터 패밀리 사이트 */
footer .familysite {
    position: absolute;
    right: 0;
    top: 0;
    width: 180px;
    height: 44px;
    line-height: 44px;
    box-sizing: border-box;
    border-radius: 6px;
    background: #eeeff0;
}

footer .familysite_wrap:after{content:'';display:block;clear:both;}
footer .familysite i{position:absolute; right:10px; top:12px; font-size:-0px; width:18px; height:18px;}
footer .familysite i.xi-up{background:url("../images/icon/footer/xi-up.png")no-repeat center center;}
footer .familysite i.xi-down{background:url("../images/icon/footer/xi-down.png")no-repeat center center;}
footer .familysite .btn_fs_off{font-size:16px; display:none; width:180px; padding-left:14px;color:#9aa6b4;}
footer .familysite .btn_fs_off.active{display:block; text-align:left; text-decoration:none}
footer .familysite .btn_fs_on{font-size:16px; display:none; width:180px; padding-left:14px; color:#9aa6b4;}
footer .familysite .btn_fs_on.active{display:block; text-align:left; text-decoration:none;}
footer .family_site_list {
    display: none;
    position: absolute;
    bottom: 44px;
    width: 180px;
    background: #fff;
    border: 1px solid #e6e6e6;
    border-bottom: 0;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 50;
    border-radius: 6px 6px 0 0;
}

footer .family_site_list li{padding:7px 14px; margin:0; line-height:20px; text-align:left; color:#9aa6b4; border-bottom:1px solid #EEE;}
footer .family_site_list li.fm_div_head{background:#8691a2; font-size:15px; color:#fff;}
footer .family_site_list li > a{display:block; background:#fff; font-size:15px; color:#9aa6b4;}
footer .family_site_list li > a:hover{color:#ff9500;}


/* 큑메뉴 */
.quick {z-index: 9999; position:fixed; right:14px; bottom:-300px; /* 초기에는 숨겨진 상태로 시작 */ width: 64px;}
.quick ul li {margin-bottom:6px;}
.quick ul li a {position:relative; display:block;}


/* 공통 */
.page_target { display:block; position:absolute; top:-60px; /*페이지내 타겟 링크 top 위치1 */}


/* *********** 미디어쿼리 1480 *********** */
@media all and (max-width:1480px){


    /* 우측 배너 */
    .Rbanner {right:0px; top: 110px; width: 100px; height:auto;}


}




/* *********** 미디어쿼리 1280 *********** */
@media all and (max-width:1280px){

    /* 헤더 */
    header .gnb_wrap h1{left:30px;}
	header .gnb {left:200px;}
	header .gnb .menu ul li a.menu_title {padding:20px 16px;}
	header .userbox{right:30px;}

    /* 우측 배너 */
    .Rbanner {display: none;}


    /* 풋터 */
    footer { padding: 70px 30px;}

}



/* *********** 미디어쿼리 1240 *********** */
@media all and (max-width:1240px){

    /* 헤더 */
    header .gnb_wrap {height:60px;}
    header .gnb_wrap h1 {width:120px; top:18px;}
    header .gnb {display:none;}
	header .userbox {right:8%; top:14px;}
    header .userbox .user li {padding-left:6px; line-height:36px;}
    header .btn_join { width:90px; font-size: 14px;}
    header .btn_login {width:90px; font-size: 14px;} 
	header .nav_mobile_button {display:block; top:12px; }
	.quick{display:none}
    .page_target{display:block; position:absolute; top:-60px}


}



/* *********** 미디어쿼리 1100 *********** */
@media screen and (max-width:1100px) {
  

    /* 풋터 */
	footer .info{padding:30px 10px;}
    footer .info .footer_logo{width:120px; margin-bottom:20px;}

}


/* *********** 미디어쿼리 888 *********** */
@media screen and (max-width:888px) {

    /* 풋터 */
    footer {border-top:0px; padding:0;}
    footer .info {position:relative; padding:40px 30px; border-top:1px solid #EEE;}
    footer .info .address {display:block; margin-left:0px; font-size:15px; padding-left:0px;}
    footer .info .address li {display:block; padding:0 10px; background:url("../images/icon/footer/foot_dot.png")no-repeat left 6px;}
    footer .info .address li::after { display: none;}

    footer .info .copyright {display:block; margin-left:0px; font-size:13px; margin-top:30px; padding-top:30px; border-top:1px solid #EEE;}
    footer .info .copyright li {display:block; padding:5px 0; text-align:center;}

    footer .info .footerMenu {flex-wrap: wrap; margin-left: -10px; margin-top:24px; font-size: 15px;}
	footer .info .ft_mt {margin-top:20px;}
    footer .familysite {right: 30px;top: 20px;}

}


/* *********** 미디어쿼리 768 *********** */
@media screen and (max-width:768px) {

    /* 헤더 */
    header .userbox {right:10%;}

}


/* *********** 미디어쿼리 650 *********** */
@media screen and (max-width:650px) {

    /* 헤더 */
    .headerTop {justify-content: left; height: 44px; padding-left:30px;}
    .headerTop .PlusAcademyup {display: none;}
    .headerTop .notice {max-width:420px; background: url('../images/icon/header_notice.png')no-repeat left top 6px;}
    .headerTop .notice::after{ display: none;}

    /* header .userbox{display: none;} */
    header .userbox {right:70px;}
    header .userbox li:nth-child(2){display: none;}
    header .userbox li:nth-child(3){display: none;}
    header .userbox li:nth-child(4){display: none;}


    /* 풋터 */
    footer .info .footerMenu {flex-direction: column; margin-left:0; margin-top:24px; border-top:1px solid #EEE; padding-top: 20px;}
    footer .info .footerMenu li {padding: 4px 0;}
    footer .info .footerMenu li .Foot_social span { padding: 0 16px;}

}


/* *********** 미디어쿼리 500 *********** */
@media screen and (max-width:500px) {

    /* 풋터 */
    footer .info {padding:80px 30px 40px 30px; border-top:0px;}
    footer .info .address{font-size:14px;}

    /* 패밀리 사이트 */
    footer .familysite {left: 0; top: 0; width: 100%; border-radius: 0 !important; background: #333;}
    footer .familysite i.xi-up{background:url("../images/icon/footer/xi-up500.png")no-repeat center center;}
    footer .familysite i.xi-down{background:url("../images/icon/footer/xi-down500.png")no-repeat center center;}
    footer .familysite .btn_fs_off{width:100%; color:#FFF}
    footer .familysite .btn_fs_on{width:100%; color: #FFF;}
    footer .family_site_list {width: 100%;}

    /* 모바일 메뉴 */
    .menu_wrap .menu_area .member > ul > li {width:50%; font-size:15px; text-align: center; padding:5px;}

	
}


/* *********** 미디어쿼리 360 *********** */
@media screen and (max-width:360px) {

    /* 헤더 */
    /* header .nav_mobile_button {right:10px;} */

    /* 풋터 */
    footer .info {padding:80px 20px 20px 20px;}
    footer .info .copyright {font-size:12px;}
    footer .info .address li .info_company {border-radius:3px; margin-top:6px; margin-left:0px;}

}


/* *********** 미디어쿼리 320 *********** */
@media screen and (max-width:320px) {

    /* 풋터 */
    footer .info .copyright {font-size:10px;}

}