/* layout */
#wrap {overflow:hidden;}
#header {position:relative; z-index:98; width:100%; min-height:70px; box-sizing:border-box;}
#header .header_inner {width:100%; margin:0 auto; text-align:center;}
#header h1 {position:absolute; top:50%; transform:translateY(-50%); left:20px; margin:0; font-size:0;}
#header h1 img {width:auto; height:24px; transition:0.3s;}

#container .main_contents {position:relative; overflow:hidden; margin:0 auto;}
#container .main_contents .conwrap {position:relative; width:100%; overflow:hidden;}


/* 로그인,회원가입, 모바일 zoom */
.TopRight {display:none;}
.ZoomM {display:block; width:auto; background:#fff; border:1px solid #dfdfdf; text-align:left; padding:5px 20px; line-height:22px; position:absolute; bottom:5px; right:15px;}
.ZoomM span {margin:0 5px;}
.ZoomM img {width:20px;}

@media(min-width:1024px) {
	#header h1 {top:25px;}
	#header h1 img {height:34px;}
}

@media(min-width:1200px) {
	/* layout */
	#wrap {width:100%; position:relative; box-sizing:border-box;}
	#header {min-height:100px; background:transparent;}
	#header .header_inner {position:relative;}
	#header h1 {width:auto; height:auto; top:30px; left:1%; z-index:999;}
	#header h1 img {width:auto; height:auto;}

	#container .main_contents {box-sizing:border-box;}
	#container .main_contents .conwrap {margin:0 auto;}

	/* 로그인,회원가입 */
	.TopRight {display:block; position:absolute; top:0; right:calc(50% - 600px);}
	.TopRight li {float:left;}
	.TopRight li a {	
		display:inline-block; width:140px; height:40px; line-height:40px;  border:1px solid #e8e8e8; border-top:none; 
		color:#333; border-radius:0 0 10px 10px; text-decoration:none; margin-left:5px; font-size:16px; 
	}

	.TopSNS {display:block; position:absolute; top:30px; right:100px; z-index:999;}
	.TopSNS li {float:left; box-sizing:border-box; width:40px; height:40px; margin:0 0 0 5px; text-align:center; border-radius:100px;}
	.TopSNS li a {display:block; width:40px; height:40px;}
	.TopSNS li.i01 {background:url('/images/common/bg_instar.png') center no-repeat;}
	.TopSNS li.i02 {background:#ED2224;}
	.TopSNS li.i03 {background:#ffe000;}
	.TopSNS li:hover.i01 {background:url('/images/common/bg_instar_ov.png') center no-repeat;}
	.TopSNS li:hover.i02 {background:#da0f11}
	.TopSNS li:hover.i03 {background:#ffcc00}

	.TopSNS li.i01 a {background:url('/images/common/instar.svg') center no-repeat; background-size:20px;}
	.TopSNS li.i02 a {background:url('/images/common/ytube.svg') center no-repeat; background-size:20px;}
	.TopSNS li.i03 a {background:url('/images/common/kakaoc.svg') center no-repeat; background-size:20px;}
}

@media(min-width:1400px) {
	#header h1 {left:2%;}
}


/* 모바일 로그인 회원가입 */
#mgnTOP {
	display:block; position:fixed; width:100%; height:70px; padding:20px 0; box-sizing:border-box; overflow:hidden; z-index:2; 
	background:#34bc5f; 
	background:linear-gradient(150deg, #34bc5f 0%, #22a7dd 100%); 
}
#mgnTOP h1 {float:none; margin:0; width:auto; left:23px; background:none;}
#mgnTOP h1 a {
	display:block; font-size:14px; width:70px; height:30px; line-height:30px; border:1px solid #fff; color:#fff; 
	background:url('/images/common/homp.svg') 10px 50% no-repeat; background-size:20px; padding:0 0 0 25px; border-radius:10px; 
}
#mgnTOP .TopLogin {display:block; position:absolute; top:27px; left:30px; z-index:999;}
#mgnTOP .TopLogin li {float:left; box-sizing:border-box; width:auto; height:30px; margin:0 5px 0 0; text-align:center;}
#mgnTOP .TopLogin li a {
	display:block; color:#fff; font-size:13px; width:auto; height:30px; line-height:28px; box-sizing:border-box;
	border-radius:100px; border:1px solid #fff; border-radius:50px; padding:0 20px;
}

#mgnBOT {margin:0 20px 20px; overflow:hidden;}
#mgnBOT ul {overflow:hidden; margin:0 0 20px;}
#mgnBOT ul li {position:relative; line-height:16px; font-size:13px; height:40px; padding:0 20px; line-height:40px; margin:7px 0; background:#f9f9f9;}
#mgnBOT ul li a {color:#222; display:block;}
#mgnBOT ul li a:before {position:absolute; top:0; left:0; content:''; width:5px; height:100%;}
#mgnBOT li.i00 a:before {border-left:5px solid #5fafe8;}
#mgnBOT li.i01 a:before {border-left:5px solid #e83387;}
#mgnBOT li.i02 a:before {border-left:5px solid #ed2224;}
#mgnBOT li.i03 a:before {border-left:5px solid #6758ff;}
#mgnBOT li.i04 a:before {border-left:5px solid #6758ff;}
#mgnBOT li.i05 a:before {border-left:5px solid #fd7300;}
#mgnBOT li.i05 a {display:block; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1;}


/* 메인메뉴 */
#navi {display:block; visibility:hidden; position:fixed; left:auto; right:0; top:0; width:100%; height:100%; 
	overflow-y:visible; z-index:998; background:transparent;}
#navi .ovBG {background:rgba(0,0,0,.5); top:0; left:0; right:0; width:100%; height:100%; position:fixed;}
#navi>div.cont {background:#fff; position:fixed; left:auto; right:0; top:0; width:80%; max-width:320px; height:100%; 
	overflow-y:auto;}

#gnb .d1 {text-align:left; word-break:keep-all; font-weight:400; margin:70px 0 0;}
#gnb .d1 ul {padding:0 0 20px;}
#gnb .d1 ul li a span {position:relative; display:block; padding:20px; font-weight:bold; color:#222; font-size:16px; border-bottom:1px solid #e5e5e5;}
#gnb .d1 ul li a span:before {
	position:absolute; top:50%; right:20px; transform:translateY(-50%); content:''; 
	width:13px; height:7px; background:url('../images/cont/sel_arr.svg') center no-repeat;
}
#gnb .d1 ul li a .ov {border-bottom:none;}
#gnb ul li .subMenu {height:auto; opacity:1 !important;}
#gnb .subMenu ul {background:#f8f8f8; padding:12px 0;}
#gnb .subMenu ul li a {padding:10px 40px; color:#333; display:block; font-size:15px; font-weight:500;}
#gnb ul li .subMenu li .ov {color:#222; font-weight:700;}
#gnb ul li .subMenu li ol li {padding:0 10px; background:#fbfbfb;}
#gnb ul li .subMenu li ol {}
#gnb ul li .subMenu li ol .ov {color:#bad000;}
.subMenu li a[target="_blank"] {} 

.m_menu {position:absolute; right:15px; top:-45px; width:30px; height:24px; padding-top:10px; z-index:1000; box-sizing:border-box;}
.m_menu span {display:inline-block; text-indent:-9999px; width:30px; height:2px; border-radius:15px; background:#111; margin:1px 0 0;}
.m_menu:before,.m_menu:after {position:absolute; right:0; display:block; content:""; height:2px; border-radius:5px; background:#111;}
.m_menu:before {top:0; width:30px;}
.m_menu:after {bottom:0; width:30px;}
.m_menu.open span {width:0px;}
.m_menu.open:before {width:30px; top:9px; transform:rotate(45deg); transition:0.2s; background:#fff;}
.m_menu.open:after {top:9px; transform:rotate(-45deg); transition:0.2s; background:#fff;}

@media(min-width:768px) {
	#navi>div.cont {width:60%; max-width:initial;}

	#mgnTOP {min-height:70px;}
	#mgnTOP h1 {left:30px;}

	#gnb .d1 ul a span {}
}

@media(min-width:1200px) {
	.m_menu {display:none;}

	#header h1 {width:auto; height:auto; left:30px; z-index:92; transform:translateY(0);}
	#header h1 img {width:auto; height:auto;}
	#gnb {clear:both; position:absolute; top:100px; left:250px; display:block; z-index:91; height:100px;}
	#mgnTOP {display:none;}
	#mgnBOT {display:none;}
	#navi {visibility:visible; position:static; left:0; right:0; top:0; width:auto; min-height:100px; overflow-y:visible; background:none;}
	#navi .ovBG {display:none;}
	#navi .on {display:block; visibility:visible; right:0;}
	#navi>div.cont {position:absolute; top:0; left:0; width:100%; overflow-y:visible; background:#fff;}
	#navi.on>div.cont {right:0;}

	#gnb .d1 {visibility:visible; box-sizing:border-box; margin:0;}
	#gnb .d1 ul {display:flex; justify-content:center; text-align:center; margin:0 auto; padding:0 0 0 3%; 
		max-width:1200px;}
	#gnb .d1 ul > li {display:block; width:190px; box-sizing:border-box; vertical-align:top;
		text-align:center;}
	.navi>li>a {display:block; padding:0 2.5vw;  text-decoration:none; position:relative;}
	.navi>li>a:before{content:''; position:absolute; top:0; right:0; width:1px; height:20px; border-left:1px dashed #ccc;}
	
	#gnb .d1 ul li a span {position:relative; color:#222; font-size:20px; padding:0; margin:0; height:100px; 
		line-height:100px; border:none; background:none;}
	#gnb .d1 ul li a span:before {display:none;}
	#gnb .d1 ul li a span:after {position:absolute; content:''; top:30px; right:-5px; width:0; height:0; opacity:0; border-radius:50px;}

	#gnb .d1 ul a .ov {background:none; color:#fff;}


	/* 서브메뉴 */
	#gnb ul li .subMenu {list-style:none; display:none; z-index:999; height:265px; line-height:1.6; 
		box-sizing:border-box; background-color :rgb(255,255,255, 0.8); margin:40px 0 0 0; 
		font-family: 'Escoredream';
		}
	#gnb ul li .subMenu:hover {height:265px;}
	#gnb ul li .subMenu ul {display:block; max-width:190px; background:transparent; padding:0; height:265px; 
		box-sizing:border-box;}
	#gnb ul li .subMenu ul:before {display:none;}
	#gnb ul li .subMenu ul li {border:none; width:100%; word-break:keep-all; display:block; margin:0;}
	#gnb ul li .subMenu ul li a {position:relative; display:block; padding:10px 0 !important; font-size:16px; 
		line-height:1.5; box-sizing:border-box; font-weight:300; color:#111;
		text-decoration:none;}
	#gnb ul li .subMenu ul li a:hover {border:none; background:#2fb8bb; color:#fff; font-weight:500;}
	#gnb ul li .subMenu ul li:before {display:none;}
	#gnb ul li .subMenu ul li:hover a {text-decoration:none;}
}

@media(min-width:1600px) {
	#header h1 {z-index:92; margin:0;}

	#gnb .d1 ul {max-width:1200px;}
}


/* 전체메뉴 */
@media(min-width:1200px) {
	.allRight {display:block; position:absolute; top:35px; right:30px; z-index:999;}
	.allRight .aicon {display:block; cursor:pointer; width:40px; height:30px; background:url('/images/common/menu.png') center no-repeat;}
}

@media(max-width:1199px) {
	.all_DIV {display:none !important;}
}

@media(min-width:1200px) {
	.all_DIV {
		display:block; position:fixed; top:0; bottom:0; display:block; width:100%; height:100%; z-index:99991; text-align:center; overflow-y:auto; 
		background:#ebf8ff url('../images/main/main_visual.png') center bottom no-repeat; background-size:auto; 
	}
	.all_DIV:before {position:absolute; top:0; left:0; content:''; width:100%; height:100%; background:rgba(0,0,0,0);}
	.all_DIV .w1200 h3 {text-align:left; margin:0 0 20px;}
	.all_DIV .w1200 {position:absolute; top:5%; left:50%; transform:translateX(-50%); width:96%; max-width:1200px;}
	.all_DIV .w1200 ul {overflow:hidden; margin:80px 0 0;}
	.all_DIV .w1200 ul > li {box-sizing:border-box; padding:10px;}
	.all_DIV .w1200 ul > li a {display:block; color:#111;}
	.all_DIV .w1200 ul > li span a {text-align:center; padding:10px 0; font-size:17px; border-bottom:1px solid #333;}
	.all_DIV .w1200 ul > li > ol > li > a {transition:all 0.3s ease-out; padding:10px;}
	.all_DIV .w1200 ul > li > ol > li > a:hover {}
	.all_DIV .w1200 ul > li > ol > li > ol > li a{padding:5px 20px; color:#eee; transition:all 0.3s ease-out;}
	.all_DIV .w1200 ul > li > ol > li > ol > li a:hover {}
	.all_DIV .w1200 ul {margin:0; display:flex; flex-wrap:nowrap; width:100%; height:100%;}
	.all_DIV .w1200 ul > li {position:relative; padding:30px 25px; overflow:hidden; font-size:17px; width:auto; flex:1; box-sizing:border-box; text-align:center;}
	.all_DIV .w1200 ul > li:nth-child(1):hover span a {color:#ff5378;}
	.all_DIV .w1200 ul > li:nth-child(2):hover span a {color:#16a05c;}
	.all_DIV .w1200 ul > li:nth-child(3):hover span a {color:#20a3d9;}
	.all_DIV .w1200 ul > li:nth-child(4):hover span a {color:#ff9114;}
	.all_DIV .w1200 ul > li:nth-child(5):hover span a {color:#ffcc00;}
	.all_DIV .w1200 ul > li:nth-child(6):hover span a {color:#703fc3;}
	.all_DIV .w1200 ul > li:hover {background:rgba(255,255,255,.8); border-radius:50px;}

	.all_DIV .w1200 ul > li span {display:table; width:100%; margin:0 0 15px;}
	.all_DIV .w1200 ul > li span a {display:table-cell; vertical-align:top; font-size:30px; padding:0 0 15px; font-family:var(--point-font-family);}

	.all_DIV .w1200 ul > li > ol > li > a {padding:10px 0;}
	.all_DIV .w1200 ul > li > ol > li > a:hover {text-decoration:underline;}
	.all_DIV .w1200 ul > li > ol > li > ol {display:none;}
	.all_DIV .w1200 ul > li > ol > li > ol > li a {padding:5px 20px; color:#eee; font-size:16px;}
	.all_DIV .w1200 ul > li > ol > li > ol > li a:hover {text-decoration:underline;}

	.all_DIV .all_close {
		position:absolute; right:-60px; top:0; width:50px; height:50px; background:#fff url('/images/common/plus.svg') center no-repeat; 
		transition:all 0.3s ease-out; border-radius:100%; transform:rotate(45deg); box-shadow:0 0 25px rgba(0, 0, 0, .15); border:none; 
	}
}

@media(min-width:1400px) {
	.all_DIV .w1200 {max-width:1400px;}
}