@charset "UTF-8";
/* Designed and Coding By MEDICAST */
/* Designer Yoon Jain (design,html,css,jquery) */
/* Designer Choi Seohyun (sub design,html,css) */

/* font */
@import url('./pretendardvariable.css');
@import url('./pretendard.css');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&display=swap');

/* reset */
*{box-sizing:border-box;-webkit-text-size-adjust:none;} /* 아이폰 텍스트 자동확대 막기 */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video{margin:0;padding:0;border:0;list-style:none;font-size:100%;font:inherit;vertical-align:baseline;}
body{line-height:1;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
a{color:#333;text-decoration:none;}
a:visited,a:active{text-decoration:none;}
a:hover,a:focus{text-decoration:none;}
table{border-collapse:collapse;border-spacing:0;}
img{vertical-align:middle;}
b,strong{font-weight:bold;}
i,em{font-style:italic;}
u{text-decoration:underline;}
sup{font-size:.75em; vertical-align:super;}
/*a:focus,button:focus,input:focus,textarea:focus,select:focus{outline:2px dotted #717171;}*/

/* basic */
html{line-height:1; color:#333; font-size:16px; /*font-size:62.5%;*/ letter-spacing:-.015em; zoom:1; overflow:unset; scroll-behavior:smooth;}
body{width:100%; height:100%; margin:0 auto; background:#fff; font-family:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,system-ui,'Helvetica Nenu','Segoe UI','Apple SD Gothic Neo','Malgun Gothic','FontAwesome',sans-serif; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; letter-spacing:-.015em;}
body.hidden{min-height:100%; overflow-y:hidden !important; touch-action:none;}
@keyframes scrolldown{0%{transform-origin:0% 0%;transform:scale(1,0);}50%{transform-origin:0% 0%;transform:scale(1,1);}50.1%{transform-origin:0% 100%;transform:scale(1,1);}100%{transform-origin:0% 100%;transform:scale(1,0);}}
@keyframes fade-in-bottom{0%{-webkit-transform:translateY(50px);transform:translateY(50px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}

/* common */
#wrap{clear:both; position:relative; width:100%; min-width:1240px; height:100%; margin:0 auto; opacity:1; transition:.5s cubic-bezier(.165,.84,.44,1.000);}
#container{clear:both; position:relative; width:100%; height:auto; min-height:600px; margin:0; padding:0 0; background:#fff; z-index:auto; transition:.3s;}
#container:after{content:''; clear:both; display:block;}
.inner{clear:both; position:relative; margin:0 auto; width:100%; max-width:1920px; padding:0 40px; box-sizing:border-box;}
.inner.w1280{max-width:1280px; padding:0 20px;}
.inner.w1280.nopadding{max-width:1280px; padding:0;}
.inner.w1440{max-width:1440px; padding:0 10px; box-sizing:border-box;}
.inner.w1440.nopadding{max-width:1440px; padding:0;}
.inner.w1720{max-width: 1744px; padding: 0 12px;}
.inner.w1720.nopadding{max-width: 1720px; padding: 0;}
.inner:after{content:''; clear:both; display:block;}
.reading{clear:both; display:block; width:1px; height:1px; margin:-1px; border:0; overflow:hidden; clip:rect(1px,1px,1px,1px); clip-path:inset(50%);}
caption{clear:both; width:1px; height:1px; margin:-1px -1px 0; overflow:hidden;}
caption.view{width:auto; height:auto; margin:0 auto 5px; color:#acacac; font-size:.875em; overflow:inherit;}
caption.view:before{content:'<';}
caption.view:after{content:'>';}
a, button, input, select, textarea{font-family:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,system-ui,'Helvetica Nenu','Segoe UI','Apple SD Gothic Neo','Malgun Gothic','FontAwesome',sans-serif; font-size:100%; letter-spacing:-.015em; transition:margin .3s ease, padding .3s ease, color .3s ease, background .3s ease, border-color .3s ease, opacity .3s ease, box-shadow .3s ease, transform .3s;}
a,a:hover,a:active,a:focus,button,button:hover,button:active,button:focus,input,input:hover,input:focus,select,select:hover,select:focus,textarea,textarea:hover,textarea:focus{transition:margin .3s ease, padding .3s ease, color .3s ease, background .3s ease, border-color .3s ease, opacity .3s ease, box-shadow .3s ease, transform .3s;}
button{border:none;}
.layoutLeft{float:left;}
.layoutRight{float:right;}
.layoutRight:after{content:''; clear:both; display:block;}
ul.skip{position:fixed; top:0; z-index:999999;}
ul.skip li{}
ul.skip li a.skipTo{position:fixed; top:-99px; left:0; width:100%; padding:16px 0; background:#333; color:#fff; text-align:center; opacity:0;}
ul.skip li a.skipTo:focus, ul.skip li a.skipTo:hover, ul.skip li a.skipTo:active{display:block; top:0; opacity:1;}
i.ico{display:inline-block; position:relative; font-family:'FontAwesome';}
.chk_pc{display:block;}
#bo_v_con{font-family:initial;}
.subFont {font-family: "Merriweather", serif;}

label.btn.select{display:inline-block; line-height:1; height:auto; margin:4px 8px 4px 0; padding:0; border:none; border-radius:0; color:inherit; font-size:inherit; font-weight:normal; text-align:left; vertical-align:middle; transition:0s; cursor:inherit;}
label.btn.select input.pick{display:inline-block; position:absolute; width:0; height:0; line-height:1; top:0; left:0; opacity:0;}
label.btn.select input.pick ~ span.checkmark{display:inline-block; position:relative; width:1em; height:1em; line-height:1; background:#fff; border:1px solid #ddd; border-radius:50%; vertical-align:bottom; cursor:pointer;}
label.btn.select input.pick:focus ~ span.checkmark{border-color:#000 !important; outline:1px solid #000;}
label.btn.select input.pick:checked ~ span.checkmark{background:#333; border-color:#333;}
label.btn.select input.pick:disabled ~ span.checkmark{background:#e3e3e3; border-color:#ddd; cursor:not-allowed;}
label.btn.select input.pick ~ span.checkmark:after{content:''; display:block; position:absolute;}
label.btn.select input.pick ~ span.txt{margin-left:-4px; padding-left:6px; cursor:pointer;}
label.btn.select input.pick.chk{}
label.btn.select input.pick.chk ~ span.checkmark{border-radius:2px; vertical-align:text-top;}
label.btn.select input.pick.chk:checked ~ span.checkmark{}
label.btn.select input.pick.chk:disabled ~ span.checkmark{background:#e3e3e3; border-color:#ddd; cursor:not-allowed;}
label.btn.select input.pick.chk:disabled ~ span.txt{color:#808080; cursor:not-allowed;}
label.btn.select input.pick.chk ~ span.checkmark:after{width:10px; height:9px; top:50%; left:50%; margin-top:-4.5px; margin-left:-5px; background:transparent;}
label.btn.select input.pick.chk:checked ~ span.checkmark:after{background:url('../images/sub/ico_check.png') no-repeat center / cover;}
label.btn.select input.pick.chk:disabled ~ span.checkmark:after{}
label.btn.select input.pick.radio{}
label.btn.select input.pick.radio ~ span.checkmark{vertical-align:text-top;}
label.btn.select input.pick.radio:checked ~ span.checkmark{}
label.btn.select input.pick.radio:disabled ~ span.checkmark{background:#e3e3e3; border-color:#ddd; cursor:not-allowed;}
label.btn.select input.pick.radio:disabled ~ span.txt{color:#808080; cursor:not-allowed;}
label.btn.select input.pick.radio ~ span.checkmark:after{width:.438em; height:.438em; top:50%; left:50%; margin-top:-.219em; margin-left:-.219em; background:#fff; border-radius:50%;}
label.btn.select input.pick.radio:checked ~ span.checkmark:after{}
label.btn.select input.pick.radio:disabled ~ span.checkmark:after{background:#bbb;}
label.btn.select span.txt{vertical-align:text-top;}



/* header */
#header {width: 100%; background: transparent; text-align: center; position: absolute; position: fixed; left: 0; top: 0; z-index: 99; transition: .3s; transition-timing-function: cubic-bezier(.22,.61,.36,1); transform-origin: center top;}
#header::before {content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1;}
#header:hover,
#header:focus,
#header.scroll {background: #fff;}
#header.on,
#header.sticky {}

#header .inner {min-width: 280px;}

#header .logo {width: 100%; margin: 0; position: absolute; z-index: 99;}
#header .logo h1 {display: inline-block; width: 164px; height: 60px; background: transparent; position: absolute; left: 3em; top: 1.25em;}
#header .logo h1 a {display: block; width: 100%; height: 100%; transition: .3s;}
#header .logo h1 a img {display: block; width: 100%; max-width: fit-content; margin: 0 auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: .3s;}
#header .logo h1 a.white img {opacity: 1; visibility: visible;}
#header .logo h1 a.ori img {opacity: 0; visibility: hidden;}
#header .logo h1 a:hover,
#header .logo h1 a:focus {}
#header .logo h1 a:hover.ori img,
#header .logo h1 a:focus.ori img,
#header:hover .logo h1 a.ori img,
#header:focus .logo h1 a.ori img,
#header.scroll .logo h1 a.ori img {opacity: 1; visibility: visible;}
#header .logo h1 a:hover.white img,
#header .logo h1 a:focus.white img,
#header:hover .logo h1 a.white img,
#header:focus .logo h1 a.white img,
#header.scroll .logo h1 a.white img {opacity: 0; visibility: hidden;}

#header .gnb {clear: both; display: block; width: 100%; height: calc(100px + 1px); border-bottom: 1px solid rgba(255, 255, 255, .3); background: transparent; text-align: center; position: relative; z-index: 99;} 
#header .gnb .nav {}
#header .gnb .nav .menuList {}
#header .gnb .nav .menuList ul {}
#header .gnb .nav .menuList ul li {}
#header .gnb .nav .menuList ul li a {}
#header .gnb .nav .menuList ul li a span {}
#header .gnb .nav .menuList ul li.new {}
#header .gnb .nav .menuList ul li.new a {}
#header .gnb .nav .menuList ul li.new a span {}
#header .gnb .nav .menuList ul.depth01_lists {}
#header .gnb .nav .menuList ul li.depth01_list {}
#header .gnb .nav .menuList ul li a.depth01 {}
#header .gnb .nav .menuList ul li a.depth01 span {}
#header .gnb .nav .menuList ul li ul.depth02_lists {}
#header .gnb .nav .menuList ul li ul li.depth02_list {}
#header .gnb .nav .menuList ul li ul li a.depth02 {}
#header .gnb .nav .menuList ul li ul li a.depth02 span {}

#header .gnb.pc {}
#header .gnb.pc .nav {display: flex; justify-content: flex-end; gap: 2em; width: fit-content; padding: 0; background: transparent; box-sizing: border-box; position: absolute; right: 3em;}
#header .gnb.pc .nav .menuList {display: inline-block; width: auto; line-height: 1; background: transparent; text-align: center; vertical-align: top; transition: .3s;}
#header .gnb.pc .nav .menuList ul {display: flex; width: 100%; line-height: 1;}
#header .gnb.pc .nav .menuList ul li {display: inline-block; position: relative;}
#header .gnb.pc .nav .menuList ul li a {display: block; word-break: keep-all; overflow-wrap: anywhere;}
#header .gnb.pc .nav .menuList ul li a span {}
#header .gnb.pc .nav .menuList ul li.new {}
#header .gnb.pc .nav .menuList ul li.new a {}
#header .gnb.pc .nav .menuList ul li.new a span {}
#header .gnb.pc .nav .menuList ul.depth01_lists {width: auto; line-height: inherit;}
#header .gnb.pc .nav .menuList ul li.depth01_list {}
#header .gnb.pc .nav .menuList ul li a.depth01 {height: calc(100px + 1px); line-height: calc(100px + 1px); padding: 0 1em; background: transparent; color: #fff; position: relative; transition: .3s;}
#header .gnb.pc .nav .menuList ul li a.depth01::before {content: ''; display: block; width: 100%; height: 6px; background: transparent; position: absolute; left: 50%; top: 0; transform: translateX(-50%); transition: .3s;}
#header .gnb.pc .nav .menuList ul li a.depth01 span {}
#header .gnb.pc .nav .menuList ul li ul.depth02_lists {display: block; width: 100%; min-width: max-content; background: #22336e; opacity: 0; visibility: hidden; text-align: left; position: absolute; left: 0; top: calc(100px + 1px); transform-origin: top center; transition: .3s ease-in-out; transition-delay: .05s;}
#header .gnb.pc .nav .menuList ul li ul li.depth02_list {display: block; width: 100%; border-bottom: 1px solid #2c418d;}
#header .gnb.pc .nav .menuList ul li ul li.depth02_list:first-child {border-top: 1px solid transparent;}
#header .gnb.pc .nav .menuList ul li ul li.depth02_list:last-child {border-bottom-color: transparent;}
#header .gnb.pc .nav .menuList ul li ul li a.depth02 {padding: 1.6em 1.334em; color: #a2b1e2; font-size: .938em; line-height: 1;}
#header .gnb.pc .nav .menuList ul li ul li a.depth02 span {line-height: 1;}
#header:hover .gnb,
#header:focus .gnb,
#header.scroll .gnb {border-bottom-color: #eee;}
#header:hover .gnb.pc .nav .menuList ul li a.depth01,
#header:focus .gnb.pc .nav .menuList ul li a.depth01,
#header.scroll .gnb.pc .nav .menuList ul li a.depth01 {color: #222;}
#header .gnb.pc .nav .menuList ul li a.depth01:hover,
#header .gnb.pc .nav .menuList ul li a.depth01:focus,
#header .gnb.pc .nav .menuList ul li a.depth01.on {background: #e9ebf5; color: #22336e;}
#header .gnb.pc .nav .menuList ul li a.depth01:hover::before,
#header .gnb.pc .nav .menuList ul li a.depth01:focus::before,
#header .gnb.pc .nav .menuList ul li a.depth01.on::before {background: #2c418d;}
#header .gnb.pc .nav .menuList ul li a.depth01:hover + ul.depth02_lists,
#header .gnb.pc .nav .menuList ul li a.depth01:focus + ul.depth02_lists,
#header .gnb.pc .nav .menuList ul li ul.depth02_lists:hover,
#header .gnb.pc .nav .menuList ul li ul.depth02_lists:focus {opacity: 1; visibility: visible;}
#header .gnb.pc .nav .menuList ul li ul li a.depth02:hover,
#header .gnb.pc .nav .menuList ul li ul li a.depth02:focus {color: #fff;}

#header .gnb.mobile {display: none;}

#header .snb {display: flex; justify-content: center; flex-direction: column;}
#header .snb .btnW {}
#header .snb .btnW a {display: block; width: fit-content; padding: .778em 1em; background: #910002; color: #fff; font-size: 1.125em; font-weight: 500; line-height: 1;}
#header .snb .btnW a:hover,
#header .snb .btnW a:focus {background: #7e0003;}
#header .snb .btnW a span {line-height: 1; position: relative;}
#header .snb .btnW a span::before {content: ''; display: inline-block; width: 1em; height: 1em; margin: 0 .4em .125em 0; background: url('../images/ico_member.png') no-repeat 0 0 / cover; vertical-align: middle;}
#header .snb .btnW a.btn {}
#header .snb .btnW a.btn span {}
#header .snb .btnW .navOpen {}
#header .snb .btnW .navOpen span {}
#header .snb.pc {}
#header .snb.mobile {}



/* footer */
#footer {clear: both; width: 100%; height: auto; background: #0f1630; position: relative;}
#footer .inner.w1440 {}
#footer .flexW {display: flex; justify-content: space-between; flex-wrap: wrap; gap: 3em; padding: 3.25em 0 5.125em;}
#footer .area01 {order: 2;}
#footer .area01 .linkW {}
#footer .area01 .linkW .tiW {width: 100%; text-align: center; position: relative; z-index: 1;}
#footer .area01 .linkW .tiW::before {content: ''; width: 100%; height: 1px; background: rgba(255, 255, 255, .5); position: absolute; left: 50%; top: calc(50% - 1px); transform: translateX(-50%); z-index: 0;}
#footer .area01 .linkW .tiW p {display: inline-block; padding: 0 .5em; background: #0f1630; color: #fff; line-height: 1; letter-spacing: .015em; text-transform: uppercase; position: relative; z-index: 0;}
#footer .area01 .linkW .linkList {margin: 1.125em auto 0;}
#footer .area01 .linkW .linkList ul {display: flex; justify-content: center; gap: .5em;}
#footer .area01 .linkW .linkList ul li {}
#footer .area01 .linkW .linkList ul li a {display: block; width: 3em; height: 3em; background: rgba(255, 255, 255, .3); border-radius: 50%; transition: .3s;}
#footer .area01 .linkW .linkList ul li a span {display: block; width: 100%; height: 100%; font-size: 0; position: relative;}
#footer .area01 .linkW .linkList ul li a span::before {content: ''; display: block; width: 32px; height: 32px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
#footer .area01 .linkW .linkList ul li.link01 a span::before {background: url('../images/ico_link_youtube.png') no-repeat 0 0 / cover;}
#footer .area01 .linkW .linkList ul li.link02 a span::before {background: url('../images/ico_link_facebook.png') no-repeat 0 0 / cover;}
#footer .area01 .linkW .linkList ul li.link03 a span::before {background: url('../images/ico_link_website.png') no-repeat 0 0 / cover;}
#footer .area01 .linkW .linkList ul li a:hover,
#footer .area01 .linkW .linkList ul li a:focus {background: rgba(255, 255, 255, .15);}

#footer .area02 {order: 1;}
#footer .area02 .reportW {margin-bottom: 2em;}
#footer .area02 .reportW p {color: #e1e5f6; margin-bottom: .5em; font-size: 1.125em; line-height: 1.5; word-break: keep-all;}
#footer .area02 .reportW p:last-child {margin-bottom: 0;}
#footer .area02 .reportW p strong {font-weight: 500;}
#footer .area02 .copyW {}
#footer .area02 .copyW p.copy {display: inline-block; color: #c2cbec; line-height: 1.5;}
#footer .area02 .snb {display: inline-block; margin-left: .5em; position: relative; bottom: 1px;}
#footer .area02 .snb ul {}
#footer .area02 .snb ul li {display: inline-block; margin: 0 2px;}
#footer .area02 .snb ul li a {display: inline-block; width: 12px; height: 16px; opacity: .4; text-indent: -999999px;}
#footer .area02 .snb ul li.login a {background: url('../images/ico_admin_login.png') no-repeat center;}
#footer .area02 .snb ul li.admin a {background: url('../images/ico_admin_login.png') no-repeat center;}
#footer .area02 .snb ul li.logout a {background: url('../images/ico_admin_logout.png') no-repeat center;}
#footer .area02 .snb ul li a:hover, #footer .area02 .snb ul li a:focus {opacity: .6;}



/* quick */
/* #quick{display:block; position:fixed; width:36px; height:36px; bottom:1.5em; right:1.5em; text-align:center; z-index:98;}
#quick .btn_top{display:flex; width:100%; height:100%; margin:0 auto; background:#00a1e9; border-radius:2px; overflow:hidden; visibility:hidden; opacity:0; transform:scaleX(0); transition:.3s; transition-delay:.3s;}
#quick .btn_top.show{visibility:visible; opacity:1; transform:scaleX(1);}
#quick .btn_top .back_to_top{display:block; width:100%; height:100%; margin:0 auto; background:transparent; text-align:center; transition:all 0s, background .3s, opacity .3s; cursor:pointer;}
#quick .btn_top .back_to_top span{}
#quick .btn_top .back_to_top span.arrow{display:inline-block; position:absolute; width:15px; height:9px; top:50%; left:50%; margin:0 auto; background:url('../images/ico_arrow_top_light.png') no-repeat center / 100% 100%; transform:translate(-50%,-50%);}
#quick .btn_top .back_to_top:focus,
#quick .btn_top .back_to_top:hover{background:#056fb8;} */



@media all and (max-width:1699px){
    #header .logo h1 {left: 1.5em;}
    #header .gnb.pc .nav {right: 1.5em;}
}

@media all and (max-width:1599px){
    #wrap {min-width: 1200px;}

    #header .logo h1 {width: 134px; height: 49px; top: 1.625em;}
    #header .gnb.pc .nav {gap: 1em;}
    #header .gnb.pc .nav .menuList ul li a.depth01 {font-size: .938em;}
    #header .snb .btnW a {font-size: 1em;}

    #footer .inner.w1440 {padding: 0 1.5em;}
}

@media all and (max-width:1440px){
    #header .logo h1 {left: 10px; top: 1.125em;}

    #header .gnb {height: calc(84px + 1px);}
    #header .gnb .inner.w1440 {width: 100%; height: 100%;}
    #header .gnb.pc {display: none;}
    #header .gnb.mobile {display: block;}
    
    #header .gnb.mobile .nav {}
    #header .gnb.mobile .nav .navPanel {width: 100%; height: 100%; background: #000; background: transparent; opacity: 0; visibility: hidden; overflow: hidden; overflow-y: auto; position: fixed; right: 0; top: 0; transition: opacity .4s ease-in-out; z-index: 999;}
    #header .gnb.mobile .nav .navPanel .menuArea {width: 50%; min-width: 480px; height: 100%; padding: 0; background: #0f1630; backdrop-filter: blur(8px); overflow: hidden; opacity: 0; position: absolute; right: 0; transition: opacity .4s ease-in-out; z-index: -100;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList {height: calc(100% - calc(3em + 1.125em * 2) - 1.125em); margin-top: calc(3em + 1.125em * 2); overflow-y: auto;}
    /* #header .gnb.mobile .nav .navPanel .menuArea .menuList::-webkit-scrollbar {} */
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul,
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li,
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a {display: block; line-height: 1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: left; cursor: pointer;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a span {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul.depth01_lists {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list {border-bottom: 1px solid #33394f;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list:last-child {border-bottom-color: transparent;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth01 {padding: 1em calc(20px + calc(3em / 3) - calc(14px / 4 * 3)) 1em 2em; color: #fff; font-size: 1.5em; font-weight: 500;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth01 span {display: block; width: 100%;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul.depth02_lists {display: none; margin-top: 1px; padding: 1.25em 0; background: rgba(225, 229, 246, .15); cursor: auto;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth02_list {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth02 {padding: .834em 2.667em; color: #a2b1e2; font-size: 1.125em; font-weight: 300; cursor: pointer;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth02 span {padding-left: calc(.667em + .5em); position: relative;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth02 span::before {content: ''; display: block; width: .667em; height: 1px; background: #a2b1e2; position: absolute; left: 0; top: .556em;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub a.depth01 {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub a.depth01 span {position: relative;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub a.depth01 span::after {content: ''; display: inline-block; width: 14px; height: 8px; background: url('../images/ico_arrow_bottom_light.png') no-repeat 0 0 / cover; position: absolute; right: 0; top: .334em;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub.open {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub.open a.depth01 {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub.open a.depth01 span {}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li.depth01_list.hasSub.open a.depth01 span::after {background: url('../images/ico_arrow_top_light.png') no-repeat 0 0 / cover;}

    #header .gnb.mobile .nav .navPanel .close {position: absolute; right: 20px; top: 1.125em;}
    #header .gnb.mobile .nav .navPanel .close .navClose {display: block; width: 3em; height: 3em; background: rgba(255, 255, 255, .15); border: 1px solid transparent; cursor: pointer;}
    #header .gnb.mobile .nav .navPanel .close .navClose span {display: block; /*width: 100%; height: 100%;*/ background: transparent; font-size: 0; position: relative; transition: .3s; transform: rotate(45deg);}
    #header .gnb.mobile .nav .navPanel .close .navClose span::before,
    #header .gnb.mobile .nav .navPanel .close .navClose span::after {content: ''; display: block; background: #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: .15s;}
    #header .gnb.mobile .nav .navPanel .close .navClose span::before {width: 18px; height: 2px;}
    #header .gnb.mobile .nav .navPanel .close .navClose span::after {width: 2px; height: 18px;}
    #header .gnb.mobile .nav .navPanel .menuBg {width: 100%; height: 100%; background: rgba(0, 0, 0, .75); /*background: linear-gradient(-45deg, rgba(0, 0, 0, .75) 0%, rgba(0, 0, 0, .5) 100%);*/ position: absolute; left: 0; top: 0; transition: opacity .4s ease-in-out; opacity: 0; z-index: -1;}

    #header .gnb.mobile .navPanel.open {opacity: 1; visibility: visible;}
	#header .gnb.mobile .navPanel.open .menuArea {right: 0; opacity: 1; visibility: visible; z-index: 0;}
	#header .gnb.mobile .navPanel.open .menuBg {opacity: 1; visibility: visible;}

    #header .snb {display: block; width: fit-content; position: absolute; right: 20px; top: 1.125em;}
    #header .snb .btnW {display: flex; justify-content: flex-end; gap: 1em;}
    #header .snb .btnW a {display: flex; justify-content: center; flex-direction: column; padding: 0 1em; background: #a70004;}
    #header .snb .btnW .navOpen {display: block; width: 3em; height: 3em; background: #910002; cursor: pointer;}
    #header .snb .btnW .navOpen:hover,
    #header .snb .btnW .navOpen:focus {background: #550002;}
    #header .snb .btnW .navOpen span {display: block; width: 18px; height: 2px; background: #fff; font-size: 0; position: relative; left: 50%; transform: translateX(-50%);}
    #header .snb .btnW .navOpen span::before,
    #header .snb .btnW .navOpen span::after {content: ''; display: block; width: 100%; height: 2px; background: #fff;}
    #header .snb .btnW .navOpen span::before {transform: translateY(-6px);}
    #header .snb .btnW .navOpen span::after {transform: translateY(4px);}
}

@media all and (max-width:1279px){
    #wrap {min-width: 1000px;}
    .inner {padding: 0 20px;}
}

@media all and (max-width:1023px){
    #wrap {min-width: 280px;}
}

@media all and (max-width:768px){
	html{font-size:15px;}
	.chk_pc{display:none;}

    #header .logo h1 {width: 116px; height: 42px; top: .867em;}

    #header .gnb {height: calc(68px + 1px);}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList {height: calc(100% - calc(2.75em + .867em * 2) - .867em); margin-top: calc(2.75em + .867em * 2);}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth01 {font-size: 1.375em;}
    #header .gnb.mobile .nav .navPanel .close {position: absolute; right: 20px; top: .867em;}
    #header .gnb.mobile .nav .navPanel .close .navClose {width: 2.75em; height: 2.75em;}

    #header .snb {top: .867em;}
    #header .snb .btnW {gap: .75em;}
    #header .snb .btnW a {font-size: .938em;}
    #header .snb .btnW .navOpen {width: 2.75em; height: 2.75em;}

    #footer .area02 .snb {display: none;}
}

@media all and (max-width:580px){
    #footer .area01, #footer .area02 {flex: 1 1 100%;}
    #footer .area01 {order: 1;}
    #footer .area01 .linkW .linkList ul li {flex: 1 1 33.333%;}
    #footer .area01 .linkW .linkList ul li a {width: 100%; border-radius: 0;}
    #footer .area02 {order: 2;}
}

@media all and (max-width:480px){

    #header .logo h1 {width: 98px; height: 36px; top: .85em;}

    #header .gnb {height: calc(60px + 1px);}
    #header .gnb.mobile .nav .navPanel .menuArea {width: 100%; min-width: 280px;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList {height: calc(100% - calc(2.25em + .85em * 2) - .85em); margin-top: calc(2.75em + .85em * 2);}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth01 {padding: 1em calc(20px + calc(3em / 3) - calc(14px / 4 * 3)) 1em 1.5em; font-size: 1.25em;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul.depth02_lists {padding: .75em 0;}
    #header .gnb.mobile .nav .navPanel .menuArea .menuList ul li a.depth02 {padding: .834em 2.167em; font-size: 1em;}
    #header .gnb.mobile .nav .navPanel .close {position: absolute; right: 20px; top: .85em;}
    #header .gnb.mobile .nav .navPanel .close .navClose {width: 2.25em; height: 2.25em;}
    
    #header .snb {top: .85em;}
    #header .snb .btnW {gap: .5em;}
    #header .snb .btnW a {font-size: .875em;}
    #header .snb .btnW .navOpen {width: 2.25em; height: 2.25em;}

    #footer .area02 .reportW p {font-size: 1em;}
    #footer .area02 .copyW p.copy {font-size: .938em;}   
}

@media all and (max-width:319px){
    
}



/* ie hack */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) and (max-width:768px){
}