@charset "utf-8";
@import url(../js/aos/aos.css);
@import url(../js/swiper/css/swiper.css);
@import url(../fonts/Poppins/Poppins.css);
@import url(../fonts/Paperlogy/Paperlogy.css);
@import url(../fonts/Tenada/Tenada.css);

html {font-size:20px;}
body {min-width:1400px;}
@media all and (max-width:1024px) {html {font-size:20px;} body {min-width:320px;}}
@media all and (max-width:890px) {html {font-size:19px;}}
@media all and (max-width:780px) {html {font-size:18px;}}
@media all and (max-width:640px) {html {font-size:17px;}}
@media all and (max-width:480px) {html {font-size:16px;}}
@media all and (max-width:380px) {html {font-size:15px;}}

#mobileNavi,
.menu_mobile {display:none;}

body {font-family:'Paperlogy',Helvetica,'Apple SD Gothic Neo','Microsoft JhengHei','맑은 고딕','Malgun Gothic','나눔고딕',NanumGothic,'Nanum Gothic','돋움',Dotum,Arial,sans-serif;}
.inner {position:relative; max-width:1520px; margin-left:auto; margin-right:auto;}
.inner.wide {max-width:1720px;}

#header,
#footer .fcontents,
#container {padding-left:2em; padding-right:2em;}
@media all and (max-width:740px) {
	#header,
	#footer .fcontents,
	#container {padding-left:1.2em; padding-right:1.2em;}
}


.action-keyboard *:focus {outline:2px dotted red;}

#wrap {overflow:hidden;}

.goto-control {display:block; position:absolute; width:100%; height:0; overflow:hidden; bottom:0; left:0; right:0; z-index:-1000; background:#2292e9; text-align:center; color:#fff !important; opacity:0; box-sizing:border-box;}
.goto-control:focus {z-index:9999; opacity:1; height:auto; padding:10px;}

body.stop_scrolling {height:100% !important; overflow:hidden !important;}

/**********************************************
	Header
**********************************************/

#header {position:relative; height:5em; z-index:2; border-bottom:1px solid rgba(255,255,255,.1);}
#header > .inner {display:flex; position:static; justify-content:space-between; align-items:center; height:100%;}
#logo,
#header_side {display:block; position:relative; z-index:2;}
#logo {width:15.25em; height:3.6em;}
#logo > a {display:block; position:relative; width:100%; height:100%; text-indent:-999px; overflow:hidden; background:url(../img/common/logo_w.svg) no-repeat 50% 50% / contain;}
#header_side {display:flex; align-items:center;}
#header_side .banner {display:none;}
#header_side .banner a {display:block; position:relative; padding:.5em 1.25em; border-radius:9em; background:#fff;}
#header_side .banner span {color:#0a2d88; font-weight:700;}
#header_side .banner span em {font-weight:600; color:#d83515;}
#header_side .sitemap,
#header_side .menu_mobile {position:relative; width:2em; height:2em; text-indent:-999px; overflow:hidden; margin-right:-1em; margin-left:2em;}
#header_side .sitemap {display:block;}
#header_side .menu_mobile {display:none;}
#header_side .sitemap:before,
#header_side .menu_mobile:before {content:""; display:block; position:absolute; top:50%; left:50%; margin:-.5em 0 0 -.5em; width:1em; height:1em; background:url(../img/common/ico_all_menu.svg) no-repeat 0 0 / auto 100%;}

@media all and (max-width:1680px) {
	#header_side .sitemap,
	#header_side .menu_mobile {margin-right:0; margin-left:.5em;}
	#header_side .banner a {font-size:.9em;}
}

@media all and (max-width:1024px) {
	#header_side .sitemap {display:none;}
	#header_side .menu_mobile {display:block;}
}
@media all and (max-width:720px) {
	#header_side .banner {display:none;}	
}
@media all and (max-width:640px) {
	#logo {font-size:.741em;}
	#header {height:4em;}
	#header_side .menu_mobile {font-size:1.2em;}
}


/**********************************************
	LNB
**********************************************/

#header .lnb_wrap {height:100%;}
#header .lnb_wrap .lnb {position:absolute; left:19em; right:20em; top:0; height:100%; z-index:0;}
#header .lnb_wrap .depth02 {height:0; transition:.3s height;-webkit-transition:.3s height;}
#header .lnb_wrap .lnb-depth2-title {height:0; transition:.3s all;-webkit-transition:.3s all; border-radius:0 0 100% 100%;}
#header .lnb_wrap .lnb-depth2-title {position:absolute; top:0; left:0; right:0; z-index:-1; background:#fff url(../img/common/bak_lnb.svg) no-repeat top 100% right 2.3em / 22em auto; overflow:hidden;}
#header .lnb_wrap .lnb-depth2-title > div {display:block; position:absolute; left:0; top:5em; bottom:0; right:50%; margin-right:24.65em; border-radius:0 4em 0 0; background:linear-gradient(233.49deg,rgba(233,242,255,1) 0%,rgba(239,244,251,1) 100%);}
#header .lnb_wrap .lnb-depth2-title > div:after {content:""; display:block; position:absolute; right:3em; top:8.65em; width:13.1em; height:12.5em; background:url(../img/common/img_lnb_title.svg) no-repeat 50% 50% / contain; z-index:1;}
#header .lnb_wrap .lnb-depth2-title > div h2 {display:block; position:absolute; top:2em; right:3em; text-align:right; word-break:keep-all; font-size:1.5em; font-family:'Tenada'; color:#71a4ed; line-height:1.5em;}
#header .lnb_wrap .lnb-depth2-title > div h2 em {color:#3875cb;}

#header_lnb {display:flex; justify-content:space-between; margin-left:auto; margin-right:auto; width:39em; max-width:100%;}
#header_lnb > li {display:flex; align-items:center; position:relative; height:5em;}
#header_lnb > li > a {display:flex; align-items:center; font-size:1.1em; font-weight:600; color:#fff;}

#header_lnb .depth02 {position:absolute; top:100%; left:0; right:0;}
#header_lnb .lnb_2depth {display:block; position:absolute; top:2em; left:50%; opacity:0; transform:translateX(-50%); -webkit-transform:translateX(-50%); visibility:hidden; transition:.2s all; -webkit-transition:.2s all; transition-delay:0s; -webkit-transition-delay:0s;}
#header_lnb .lnb_2depth a {display:block; position:relative; text-align:center; white-space:nowrap; font-size:.9em;}
#header_lnb .lnb_2depth a:hover,
#header_lnb .lnb_2depth a:focus {font-weight:600; color:#222;}
#header_lnb .lnb_2depth a.on {color:#3875cb; text-decoration:underline;}
#header_lnb .lnb_2depth li + li {margin-top:.9em;}

#header_lnb #lnb_06 {display:none !important;}

#header.open-lnb #logo > a {background-image:url(../img/common/logo.svg);} 
#header.open-lnb .banner a {background:#f1f1f1;}
#header.open-lnb .sitemap:before {background-position-x:-1.5em;}
#header.open-lnb #header_lnb > li > a {color:#111;}
#header.open-lnb .lnb_wrap .depth02			{height:19em;}
#header.open-lnb .lnb_wrap .lnb-depth2-title {height:calc(19em + 5em); border-radius:0; box-shadow:2em 2em 2em 0 rgba(0,0,0,.02);}
#header.open-lnb .lnb_wrap .lnb-depth2-title:after {content:""; display:block; position:absolute; top:5em; left:0; right:0; height:1px; background:rgba(0,0,0,.1);}
#header.open-lnb .lnb_wrap .lnb_2depth {visibility:visible; opacity:1; transition-delay:.2s; -webkit-transition-delay:.2s;}

@media all and (max-width:1680px) {
	#header .lnb_wrap .lnb-depth2-title > div h2 {left:1em; right:1.5em; font-size:1.4em;}
	#header .lnb_wrap .lnb-depth2-title > div:after {right:1em;}
}
@media all and (max-width:1580px) {
	#header .lnb_wrap .lnb-depth2-title > div:after {font-size:.9em; top:11em;}
}
@media all and (max-width:1540px) {
	#header .lnb_wrap .lnb-depth2-title > div:after {left:1em; background-position-x:center; width:auto;}
	#header .lnb_wrap .lnb-depth2-title > div h2 {text-align:center; top:1.5em;}
	#header .lnb_wrap .lnb-depth2-title > div h2 em {display:block;}
	#header .lnb_wrap .lnb-depth2-title > div h2 br {display:none;}
}
@media all and (max-width:1024px) {
	#header .lnb_wrap {display:none !important;}
}



/**********************************************
	MNB
**********************************************/

#mobileNavi {display:block; position:fixed; top:0; right:0; left:0; bottom:0; z-index:9999; background:rgba(0,0,0,.2); backdrop-filter:blur(10px); visibility:hidden; opacity:0;}
#mobileNavi .bak-close {display:block; position:absolute; top:0; left:0; right:0; bottom:0; z-index:0; text-indent:-999px; overflow:hidden;}
#slide_menu {position:absolute; top:0; bottom:0; right:0; transform:translateX(100%); -webkit-transform:translateX(100%); background:linear-gradient(12deg,#4393DD 0%,#3875CB 100%); width:20em; max-width:100%; z-index:1; box-shadow:0 1.5em 2.5em 0 rgba(0,0,0,.2); border-radius:2em 0 0 2em; transition:.3s all; -webkit-transition:.3s all;}
#slide_menu .top {display:flex; align-items:center; justify-content:space-between; padding:0 1em; height:4em;}
#slide_menu .top .mo-logo {display:block; position:relative; width:15.25em; height:3.6em; text-indent:-999px; overflow:hidden; background:url(../img/common/logo_w.svg) no-repeat 0 50% / contain; font-size:.7em;}
#slide_menu .top .mnb-close {display:block; position:relative; width:2em; height:2em; text-indent:-999px; overflow:hidden; background:url(../img/common/btn_mnb_close.svg) no-repeat 50% 50% / 2em auto; }
#slide_menu .depth1 {display:block; position:absolute; top:4em; left:0; right:0; bottom:0; z-index:0;}
#slide_menu .depth1:after {content:""; display:block; position:absolute; top:0; right:0; bottom:0; border-radius:2em 0 0 0; background:#fff url(../img/common/bak_mnb.svg) no-repeat 50% 50% / 65% auto; z-index:-1;}
#slide_menu .depth2,
#slide_menu .depth1:after {left:7em;}
#slide_menu .depth2 {position:absolute; top:0; right:0; bottom:0; overflow:auto;}
#slide_menu .depth1 {padding:1em 0;}
#slide_menu .depth1 > li {width:7em;}
#slide_menu .depth1 > li + li {margin-top:.5em;}
#slide_menu .depth1 > li > a,
#slide_menu .depth1 > li > button {display:flex; position:relative; width:100%; height:2.5em; padding:0 0 0 1.5em; align-items:center; text-align:left; color:#fff; font-size:1.1em; border-radius:.5em 0 0 .5em; transition:.3s transform; -webkit-transition:.3s -webkit-transform;}
#slide_menu .depth1 > li > a strong,
#slide_menu .depth1 > li > button strong {display:block; font-weight:400; font-family:'Tenada'; margin-top:.3em;}
#slide_menu .depth1 > li.active > a,
#slide_menu .depth1 > li.active > button {background:#fff; transform:translateX(1em); -webkit-transform:translateX(1em); color:#0C479A; padding-left:1em; box-shadow:0 0 1em 0 rgba(0,0,0,.05);}
#slide_menu .depth2 {display:none; padding:1.5em 1em; overflow:auto; background:#fff; border-radius:2em 0 0 0;}
#slide_menu .depth1 > li.active .depth2 {display:block;}
#slide_menu .depth2 li {padding:.7em; border-bottom:1px solid rgba(0,0,0,.1);}
#slide_menu .depth2 li a {display:block; position:relative;}
#slide_menu .depth2 li a strong {font-weight:400;}
#slide_menu .depth2 li a:hover strong,
#slide_menu .depth2 li a:focus strong {font-weight:800;}
#slide_menu .depth2 li.active a:after {content:""; display:block; position:absolute; right:-.5em; top:50%; margin-top:-.4em; width:.8em; height:.8em; background:url(../img/common/ico_mnb_on.svg) no-repeat 50% 50% / contain;}
#slide_menu .depth2 li.active a strong {font-weight:800;}

.open-mnb #mobileNavi {visibility:visible; opacity:1;}
.open-mnb #slide_menu {transform:translateX(0); -webkit-transform:translateX(0);}

@media all and (min-width:1025px) {
	#mobileNavi {display:none !important;}
}


/**********************************************
	Footer
**********************************************/

#footer {background:#112130; color:#fff;}
#footer .copyright {display:block; position:relative; background:#0B1826; text-align:center; font-size:.8em; padding:calc((20 / 16) * 1em); word-break:keep-all; color:#ccc; font-family:'Poppins'; line-height:1.1; font-weight:200; letter-spacing:0;}
#footer .fcontents {padding-top:2em; padding-bottom:2em;}

#footer .f-nav ul {display:flex; align-items:center;}
#footer .f-nav a {font-size:.9em; color:#fff;}
#footer .f-nav li + li {margin-left:2em;}
#footer .f-nav li:last-child a {font-weight:700; color:#fff; text-decoration:underline;}

#footer .info {display:flex; margin-top:2em; justify-content:space-between; position:relative;}
#footer .info:after {content:""; display:block; position:absolute; top:0; bottom:0; width:1px; left:50%; background:rgba(255,255,255,.1);}
#footer .info > div {display:flex; align-items:start; width:45%;}
#footer .info .f-logo {display:block; position:relative; flex-shrink:0; width:8.3em; height:2.5em; text-indent:-999px; overflow:hidden; margin-right:3em; background:url(../img/common/logo_andong.svg) no-repeat 0 0 / contain;}
#footer .info .f-logo.ycg {background-image:url(../img/common/logo_yc.svg);}
#footer .info .desc {font-size:.9em; color:#D0D0D0; word-break:keep-all;}
#footer .info .desc strong {font-family:'Poppins'; color:#697480; margin-right:.5em;}

@media all and (max-width:1024px) {
	#footer .f-nav ul {justify-content:center; margin-bottom:1em;}
	#footer .info {flex-direction:column;}
	#footer .info:after {display:none;}
	#footer .info > div {width:100%;}
	#footer .info > div + div {border-top:1px solid rgba(255,255,255,.1); padding-top:1em; margin-top:1em;}
}
@media all and (max-width:640px) {
	#footer .info > div {flex-direction:column;}
	#footer .info .f-logo {font-size:.8em; margin-bottom:1em;}
	
}
@media all and (max-width:380px) {
	#footer .f-nav li + li {margin-left:1em;}
}

/**********************************************
	Side
**********************************************/

.goto-page-top {position:fixed; right:1em; bottom:2em; z-index:5; width:5em; height:5em; border-radius:1.5em; text-indent:-999px; overflow:hidden; background:#111 url(../img/common/btn_top.svg) no-repeat 50% 50% / auto 2.5em; box-shadow:0 0 1em 0 rgba(0,0,0,.1); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .25s ease,visibility .25s ease,bottom .15s ease; -webkit-transition:opacity .25s ease,visibility .25s ease,bottom .15s ease;}
.goto-page-top.is-show{opacity:1; visibility:visible; pointer-events:auto;}


/**********************************************
	Sub Layout
**********************************************/

.subVisualArea {display:block; position:relative; margin-top:-5em; margin-bottom:5em; padding:10em 1em 0; background:url(../img/common/bak_visual.jpg) no-repeat 50% 50% / cover; z-index:0;}
.subVisualArea:after {content:""; display:block; position:absolute; left:0; right:0; bottom:0; height:1.5em; background:#fff; z-index:-1;}
.subVisualArea .titWrap {margin-bottom:4em;}
.subVisualArea #sidetitle {text-align:center; color:#fff; font-family:'Tenada'; font-size:3.1em; line-height:1.1;}
@media all and (max-width:1024px) {
	.subVisualArea {margin-bottom:2em; padding:7em 1em 3em;}
	.subVisualArea .titWrap {margin-bottom:0;}
	.subVisualArea #sidetitle {font-size:2.5em;}
}
@media all and (max-width:640px) {
	.subVisualArea {margin-top:-4em;}
	.subVisualArea:after {display:none;}
}

#leftmenu ul {display:flex; align-items:center; justify-content:center;}
#leftmenu ul > li {margin:.25em; width:20%;}
#leftmenu li a {display:flex; align-items:center; justify-content:center; padding:.5em; height:3.5em; border:1px solid rgba(255,255,255,.2); background:rgba(0,0,0,.2); backdrop-filter:blur(10px); border-radius:1em;}
#leftmenu li a span {display:block; font-size:1.1em; font-weight:600; color:#fff;}
#leftmenu li a.on {background:linear-gradient(180deg,rgba(77,139,227,1) 0%,rgba(56,117,203,1) 100%); border-color:transparent;}
@media all and (max-width:1024px) {
	#leftmenu {display:none;}	
}

#page_title {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; padding-bottom:1em; border-bottom:1px solid #DADADA; margin-bottom:2.5em;}
#page_title h3 {font-family:'Tenada'; font-size:1.9em; color:#111;}
#page_title .path_wrap {display:flex; align-items:center; justify-content:space-between;}
#page_title .path_wrap .path {display:flex; align-items:center;}
#page_title .path_wrap .path li {display:block; position:relative;}
#page_title .path_wrap .path li:before {content:""; display:block; position:absolute; width:4px; height:4px; background:#D9D9D9; left:0; top:50%; margin:-2px 0 0 -2px;}
#page_title .path_wrap .path li + li {margin-left:.8em; padding-left:.8em;}
#page_title .path_wrap .path li span {font-size:.9em; font-weight:600; color:#5E5E5E;}
#page_title .path_wrap .path li:last-child span {color:#313131;}
#page_title .path_wrap .path li.home {width:1.2em; height:1.2em; text-indent:-999px; overflow:hidden; background:url(../img/common/spr_spot.svg) no-repeat 0 50% / auto 1.2em;}
#page_title .path_wrap .path li.home:before {display:none;}
#page_title .sub_acc {display:flex; align-items:center; justify-content:space-between; margin-left:2em;}
#page_title .sub_acc dl {display:block; position:relative; margin-right:.5em;}
#page_title .sub_acc button {display:block; position:relative; width:2em; height:2em; border-radius:.5em; border:1px solid #dadada; text-indent:-999px; overflow:hidden;}
#page_title .sub_acc button:before {content:""; display:block; position:absolute; top:50%; left:50%; margin:-.6em 0 0 -.6em; width:1.2em; height:1.2em; background:url(../img/common/spr_spot.svg) no-repeat -2.4em 50% / auto 1.2em;}
#page_title .sub_acc button.print:before {background-position-x:-3.6em;}
#page_title dl dd {position:absolute; visibility:hidden; opacity:0;}
#page_title dl .control {bottom:0; right:0; z-index:1;}
#page_title dl .control .close {background:#A9A9A9; border-color:#A9A9A9;}
#page_title dl .control .close:before {background-position-x:-1.2em;}
#page_title dl .share-items {bottom:100%; right:0; margin-bottom:.5em; z-index:1; transform:translateY(1em); -webkit-transform:translateY(1em); transition:.3s all; -webkit-transition:.3s all;}
#page_title dl .share-items ul {display:flex; align-items:center; justify-content:center; width:4.4em; height:2.2em; border-radius:.5em; background:#fff; border:1px solid #dadada; box-shadow:0 0 1.5em 0 rgba(119,39,68,.1);}
#page_title dl .share-items ul li + li {margin-left:.5em;}
#page_title dl .share-items a {display:block; position:relative; text-indent:-999px; overflow:hidden; width:1.2em; height:1.2em; background:url(../img/common/spr_spot.svg) no-repeat -4.8em 50% / auto 1.2em;}
#page_title dl .share-items a#snsFacebook {background-position-x:-6em;}
#page_title dl.open dd {visibility:visible; opacity:1;}
#page_title dl.open .share-items {transform:translateY(0); -webkit-transform:translateY(0);}

@media all and (max-width:640px) {
	#page_title {flex-direction:column;}
	#page_title > * {flex-grow:1; width:100%;}
}


#container {padding-bottom:5em;}





















