@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');

/* 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:text-top;}
/*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:-.035em; 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:-.035em;}
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:800px; margin:0; padding:88px 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:1376px;*/ padding:0 2.5em; box-sizing:border-box;}
.inner.w1280{max-width:1240px; padding:0 20px; box-sizing:content-box;}
.inner.w1280.nopadding{max-width:1280px; padding:0;}
.inner.w1400{max-width:1376px; padding:0 12px; box-sizing:content-box;}
.inner.w1400.nopadding{max-width:1400px; padding:0;}
.inner:after{content:''; clear:both; display:block;}
.reading{clear:both; display:block; position:absolute; 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:-.035em; 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;}

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:#e4e4e4; 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:#e4e4e4; 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:#e4e4e4; 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{clear:both; position:absolute; position:fixed; width:100%; top:0; left:0; background:transparent; text-align:center; z-index:99; transition:.3s; transition-delay:.1s; transition-timing-function:cubic-bezier(.22,.61,.36,1); transform-origin:center top;}
#header.sticky{top:-89px;}
#header:hover,
#header.on,
#header.scroll{}

#header .logo{position:absolute; width:100%; margin:0; vertical-align:top; z-index:99;}
#header .logo h1{display:inline-block; position:absolute; width:272px; height:42px; top:23px; left:2.5em; background:transparent;}
#header .logo h1 a{display:block; width:100%; height:100%;}
#header .logo h1 a img{display:block; position:absolute; width:100%; max-width:fit-content; top:50%; left:50%; margin:0 auto; transform:translate(-50%,-50%);}

#header .gnb{clear:both; display:block; position:relative; width:100%; top:0; background:#fff; text-align:left; transition:height .4s; transition-delay:.1s; transition-timing-function:cubic-bezier(.22,.61,.36,1); z-index:9;}
#header .gnb.pc{height:88px;}
#header .gnb .nav.pc{width:100%; margin:0 auto; padding:0; background:transparent; border-bottom:1px solid transparent; box-sizing:border-box;}
#header.on .gnb .nav.pc,
#header.scroll .gnb .nav.pc,
#header:hover .gnb .nav.pc{border-bottom-color:#e4e4e4;}

#header .gnb .nav.pc .menuList{display:inline-block; width:100%; line-height:1; padding-right:4em; text-align:right; vertical-align:top; transition:.3s;}
#header .gnb .nav.pc .menuList ul{display:inline-block; width:100%; line-height:1;}
#header .gnb .nav.pc .menuList ul li{display:inline-block; position:relative; text-align:left;}
#header .gnb .nav.pc .menuList ul li a{position:relative; padding:1px 0; word-break:keep-all; overflow-wrap:anywhere;}
#header .gnb .nav.pc .menuList ul.depth01_lists{width:auto; line-height:inherit;}
#header .gnb .nav.pc .menuList ul li.depth01_list{padding:0 1.5em; vertical-align:top;}
#header .gnb .nav.pc .menuList ul li a.depth01{display:inline-block; line-height:88px; padding:0; color:#333; font-size:1.125em; font-weight:600; text-transform:uppercase;}
#header.on .gnb .nav.pc .menuList ul li a.depth01,
#header.scroll .gnb .nav.pc .menuList ul li a.depth01,
#header:hover .gnb .nav.pc .menuList ul li a.depth01{color:#333;}
#header .gnb .nav.pc .menuList ul li:focus a.depth01,
#header .gnb .nav.pc .menuList ul li:hover a.depth01,
#header .gnb .nav.pc .menuList ul li a.depth01:focus,
#header .gnb .nav.pc .menuList ul li a.depth01:hover{color:#056fb8;}
#header .gnb .nav.pc .menuList ul li a.depth01:after{content:''; display:block; position:absolute; width:100%; height:4px; bottom:-1px; background:#056fb8; transform:scaleY(0); transform-origin:bottom center; transition:.3s ease-in-out; transition-delay:.05s;}
#header .gnb .nav.pc .menuList ul li a.depth01:focus:after,
#header .gnb .nav.pc .menuList ul li a.depth01:hover:after,
#header .gnb .nav.pc .menuList ul li:hover a.depth01:after{transform:scaleY(1);}
#header .gnb .nav.pc .menuList ul li ul.depth02_lists{display:none; position:fixed; max-width:1376px; min-width:fit-content; line-height:88px; top:88px; left:50%; padding-left:calc(48px + 2em); background:transparent; opacity:0; visibility:hidden; text-align:left; transform:translateX(-50%) scaleY(0); transform-origin:top center; transition:.3s ease-in-out; transition-delay:.05s;}
#header .gnb .nav.pc .menuList ul li ul li.depth02_list{display:inline-block; line-height:1; margin:0 2.5em; text-align:center;}
#header .gnb .nav.pc .menuList ul li ul li.depth02_list:first-child{margin-left:1em;}
#header .gnb .nav.pc .menuList ul li ul li.depth02_list:last-child{margin-right:1em;}
#header .gnb .nav.pc .menuList ul li ul li a.depth02{display:block; padding:.125em; color:#808080; font-size:1.063em; transition:.3s;}
#header .gnb .nav.pc .menuList ul li ul li a.depth02 span{display:inline-block; position:relative;}
#header .gnb .nav.pc .menuList ul li ul li a.depth02 span:before{content:''; display:inline-block; position:absolute; width:100%; height:12px; bottom:-1px; left:0; background:#ffee5b; opacity:.4; transform:scaleX(0); transform-origin:left center; transition:.2s; z-index:-1;}
#header .gnb .nav.pc .menuList ul li ul li a.depth02:focus,
#header .gnb .nav.pc .menuList ul li ul li a.depth02:hover{color:#056fb8;}
#header .gnb .nav.pc .menuList ul li ul li a.depth02:focus span:before,
#header .gnb .nav.pc .menuList ul li ul li a.depth02:hover span:before{transform:scaleX(1);}

#header .gnb .nav.pc .menuList ul li a.depth01:focus + ul.depth02_lists,
#header .gnb .nav.pc .menuList ul li a.depth01:hover + ul.depth02_lists,
#header .gnb .nav.pc .menuList ul li:hover > ul.depth02_lists,
#header .gnb .nav.pc .menuList ul li ul.depth02_lists.on{opacity:1; visibility:visible; transform:translateX(-50%) scaleY(1);}

#header .gnb .nav.pc .menuList ul li.new{}
#header .gnb .nav.pc .menuList ul li.new a{}
#header .gnb .nav.pc .menuList ul li.new a span:after{content:''; display:inline-block; width:1em; height:1em; margin-bottom:-.12em; margin-left:.28em; background:url('../images/ico_newlink.png') no-repeat center; background-size:100%;}
#header .gnb .nav.pc .menuList ul li.new a.depth01 span:after{background-image:url('../images/ico_newlink_white.png');}

#header .gnb .nav.pc .navBg{display:block; position:absolute; width:100%; height:88px; background:#fff; border-top:1px solid #ddd; box-shadow:0 10px 10px rgba(0,0,0,.06); opacity:0; visibility:hidden; transform:scaleY(0); transform-origin:top center; transition:.3s ease-in-out; transition-delay:.05s; z-index:-2;}
#header .gnb .nav.pc .navBg.on{opacity:1; visibility:visible; transform:scaleY(1);}

#header .snb{display:inline-block; position:absolute; top:50%; right:2.5em; margin-top:-24px; vertical-align:top;}
#header .snb .inner{min-width:auto;}
#header .snb .sitemap{width:48px; height:48px;}
#header .snb .sitemap button.navOpen{display:block; width:100%; height:100%; background:transparent; border-radius:2px; cursor:pointer;}
#header .snb .sitemap button.navOpen span{display:inline-block; position:absolute; width:16px; height:2px; top:50%; left:50%; margin:-1px auto 0 -8px; background:#056fb8; font-size:0; vertical-align:middle; transition:.3s;}
#header .snb .sitemap button.navOpen span:before,
#header .snb .sitemap button.navOpen span:after{content:''; display:block; position:absolute; width:16px; height:2px; right:0; background:#056fb8; border-radius:0; transition:.3s;}
#header .snb .sitemap button.navOpen span:before{top:-6px;}
#header .snb .sitemap button.navOpen span:after{bottom:-6px;}
#header:hover .snb .sitemap button.navOpen span,
#header.on .snb .sitemap button.navOpen span,
#header.on .snb .sitemap button.navOpen span:before,
#header.on .snb .sitemap button.navOpen span:after,
#header.scroll .snb .sitemap button.navOpen span,
#header.scroll .snb .sitemap button.navOpen span:before,
#header.scroll .snb .sitemap button.navOpen span:after
#header:hover .snb .sitemap button.navOpen span:before
#header:hover .snb .sitemap button.navOpen span:after{background:#00a1e9;}
#header.on .snb .sitemap button.navOpen:focus span,
#header.on .snb .sitemap button.navOpen:hover span,
#header.scroll .snb .sitemap button.navOpen:focus span,
#header.scroll .snb .sitemap button.navOpen:hover span
#header:hover .snb .sitemap button.navOpen:focus span,
#header:hover .snb .sitemap button.navOpen:hover span{background:#00a1e9;}
#header .snb .sitemap button.navOpen:focus,
#header .snb .sitemap button.navOpen:hover{background:rgba(240,252,255,1); background:#f0fcff;}

#header .gnb .nav.mobile{display:block;}
#header .gnb .navPanel{position:fixed; width:100%; height:100%; top:0; right:0; background:transparent; overflow-y:auto; visibility:hidden; opacity:0; backdrop-filter:blur(8px); transition:opacity .4s ease-in-out; z-index:1; overflow:hidden;/* -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);*/}
#header .gnb .navPanel .menuArea{position:absolute; width:100%; height:auto; top:-50%; right:auto; padding:0; background:transparent; overflow:unset; opacity:0; transition:top .6s ease-in-out, opacity .4s ease-in-out; transform:translateY(-50%); z-index:-1;}

#header .gnb .navPanel button.navClose{display:block; position:absolute; width:48px; height:48px; top:20px; right:2.5em; margin:0; padding:0; background:transparent; border-radius:2px; cursor:pointer;}
#header .gnb .navPanel button.navClose span{display:block; position:relative; width:18px; height:2px; margin:0 auto; background:transparent; border-radius:2px; font-size:0; transition:.3s;}
#header .gnb .navPanel button.navClose span:before,
#header .gnb .navPanel button.navClose span:after{content:''; display:block; position:absolute; width:18px; height:2px; background:#fff; transition:.3s;}
#header .gnb .navPanel button.navClose span:before{top:-8px; transform:translate3d(0,8px,0) rotate(45deg);}
#header .gnb .navPanel button.navClose span:after{bottom:-8px; transform:translate3d(0,-8px,0) rotate(-45deg);}
#header .gnb .navPanel button.navClose:focus,
#header .gnb .navPanel button.navClose:hover{background:rgba(0,0,0,.1);}
#header .gnb .navPanel button.navClose:focus span, #header .gnb .navPanel button.navClose:hover span,
#header .gnb .navPanel button.navClose:focus span, #header .gnb .navPanel button.navClose:hover span{transform:rotate(180deg);}
#header .gnb .navPanel button.navClose:after{content:''; clear:both; display:block;}
#header .gnb .navPanel .menuBg{position:absolute; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.8); background:linear-gradient(-45deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.64) 100%); opacity:0; z-index:-1; transition:opacity .4s ease-in-out;}

#header .gnb .menuArea .menuList ul,
#header .gnb .menuArea .menuList ul li,
#header .gnb .menuArea .menuList ul li a,
#header .gnb .navPanel .menuArea .menuList{display:block; position:relative; line-height:1; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
#header .gnb .navPanel .menuArea .menuList{height:100%; padding:0; background:transparent; color:#fff; text-align:left; z-index:0; overflow-y:inherit;}
#header .gnb .navPanel .menuArea .menuList:before{display:none; width:0; height:0;}
#header .gnb .navPanel .menuArea .menuList ul{z-index:1;}
#header .gnb .navPanel .menuArea .menuList ul li a{display:inline-block; position:relative; border-radius:0; cursor:pointer; z-index:2;}
#header .gnb .navPanel .menuArea .menuList > ul{display:flex; justify-content:center; align-items:flex-start; width:100%; height:auto; padding:0 2.5em 0 0;}
#header .gnb .navPanel .menuArea .menuList > ul > li{flex:1 1 20%; max-width:20%; padding:0 0 0 5em;}
#header .gnb .navPanel .menuArea .menuList > ul > li:nth-child(n+6){display:none;}
#header .gnb .navPanel .menuArea .menuList > ul > li > a{line-height:1; padding:0; background:transparent; color:#fff; font-size:2em; font-weight:600; text-transform:uppercase; outline-offset:-1px; overflow:unset; transition:.3s;}
#header .gnb .navPanel .menuArea .menuList > ul > li > a:before{content:''; display:block; position:absolute; width:.25em; height:.25em; top:-.25em; left:-.5em; background:#00a1e9; background:linear-gradient(135deg,#00a1e9 0%, #60d0ff 100%); border-radius:50%; opacity:0; transition:.3s;}
#header .gnb .navPanel .menuArea .menuList > ul > li > a:hover,
#header .gnb .navPanel .menuArea .menuList > ul > li > a:focus,
#header .gnb .navPanel .menuArea .menuList > ul > li > a.on{background:linear-gradient(90deg,#00a1e9 0%, #60d0ff 100%); -webkit-background-clip:text; background-clip:text; color:#00a1e9; color:transparent;}
#header .gnb .navPanel .menuArea .menuList > ul > li > a:hover:before,
#header .gnb .navPanel .menuArea .menuList > ul > li > a:focus:before,
#header .gnb .navPanel .menuArea .menuList > ul > li > a.on:before{opacity:1;}
#header .gnb .navPanel .menuArea .menuList ul ul{display:block; margin:2em 0 0; padding:0; border:none; border-radius:0;}
#header .gnb .navPanel .menuArea .menuList ul ul li{margin:1.75em 0 0;}
#header .gnb .navPanel .menuArea .menuList ul ul li a{padding:0; color:#acacac; font-size:1.125em;}
#header .gnb .navPanel .menuArea .menuList ul ul li a:before{content:''; display:block; position:absolute; width:1em; height:1px; top:.6665em; left:0; background:#fff; transform:scaleX(0); transform-origin:left center; transition:.3s;}
#header .gnb .navPanel .menuArea .menuList ul ul li a:hover,
#header .gnb .navPanel .menuArea .menuList ul ul li a:focus{padding-left:1.333em; color:#fff;}
#header .gnb .navPanel .menuArea .menuList ul ul li a:hover:before,
#header .gnb .navPanel .menuArea .menuList ul ul li a:focus:before{transform:scaleX(1);}
#header .gnb .navPanel .menuArea .menuList ul ul li a span{line-height:1.3;}
#header .gnb .navPanel .menuArea .menuList ul ul ul{display:none;}

#header .gnb .navPanel .menuArea .menuList ul li.new a:after{content:''; display:inline-block; width:16px; height:16px; margin-top:4px; margin-left:8px; background:url('../images/ico_newlink.png') no-repeat center bottom / 100% auto; vertical-align:top;}
#header .gnb .navPanel .menuArea .menuList ul ul li.new a:after{width:13.5px; height:13.5px; margin-top:1.5px; margin-left:6px; background-position:center top; opacity:.8;}
#header .gnb .navPanel .menuArea .menuList ul ul ul li.new a:after{width:12px; height:12px; margin-top:2px; background-position:center bottom;}

#header .gnb .navPanel.open{visibility:inherit; opacity:1; z-index:99;}
#header .gnb .navPanel.open .menuArea{top:50%; right:auto; opacity:1; z-index:0;}
#header .gnb .navPanel.open .menuArea:before,
#header .gnb .navPanel.open .menuArea:after{left:-80px; box-shadow:-10px 10px 10px rgba(0,0,0,.02); opacity:1;}
#header .gnb .navPanel.open .menuBg{opacity:1;}

/* footer */
#footer{clear:both; position:relative; width:100%; height:auto; background:#fff;}
#footer .area01{clear:both; padding:2.5em 0;}
#footer .area01 .flexW{display:flex; flex-wrap:wrap; justify-content:space-between; gap:2em;}
#footer .area01 .familysitesW{order:2;}
#footer .area01 .btnLinkW{display:inline-block; margin:-.625em 0 0 2.5em; vertical-align:middle;}
#footer .area01 .btnLinkW .btnLink{position:relative;}
#footer .area01 .btnLinkW .btnLink button{position:relative; min-width:216px; line-height:1; padding:1.125em .1em; background:transparent; border-bottom:1px solid #333; color:#333; font-size:1em; text-align:left; vertical-align:top; cursor:pointer; z-index:3;}
#footer .area01 .btnLinkW .btnLink button i.ico.more.dark{display:inline-block; position:absolute; width:14px; height:14px; top:50%; right:.1em; margin-top:-7px; opacity:1; z-index:5;}
#footer .area01 .btnLinkW .btnLink button i.ico.more.dark:before,
#footer .area01 .btnLinkW .btnLink button i.ico.more.dark:after{content:''; display:block; position:absolute; width:14px; height:2px; top:50%; margin-top:-1px; background:#333; transition:.3s;}
#footer .area01 .btnLinkW .btnLink button i.ico.more.dark:before{}
#footer .area01 .btnLinkW .btnLink button i.ico.more.dark:after{transform:rotate(90deg);}
#footer .area01 .btnLinkW .btnLink button.minus i.ico.more.dark::after {opacity: 0;} 
#footer .area01 .btnLinkW .btnLink button span{text-transform:uppercase;}
#footer .area01 .btnLinkW .btnLink button:focus,
#footer .area01 .btnLinkW .btnLink button:hover{border-bottom-color:#808080; color:#808080;}
#footer .area01 .btnLinkW .btnLink button:focus i.ico.more.dark:before,
#footer .area01 .btnLinkW .btnLink button:hover i.ico.more.dark:before,
#footer .area01 .btnLinkW .btnLink button:focus i.ico.more.dark:after,
#footer .area01 .btnLinkW .btnLink button:hover i.ico.more.dark:after{background:#808080;}
#footer .area01 .btnLinkW .btnLink button.rotate{}
#footer .area01 .btnLinkW .btnLink ul.btnLinks{display:block; position:absolute; width:100%; height:auto/*0*/; max-height:132px; bottom:0; margin-bottom:.25em; padding:1.5em 1.25em; background:#fff; border:1px solid #ddd; border-radius:8px; box-sizing:border-box; text-align:left; opacity:0; overflow:hidden; visibility:hidden; transition:.3s ease; z-index:1; scrollbar-width:thin;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar{/* 스크롤바 영역 */ width:18px; height:186px;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-thumb{/* 스크롤바 막대 */ outline:none; border-radius:1em; border:6px solid transparent; box-shadow:inset 6px 6px 0 #cdcdcd;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-thumb:hover{box-shadow:inset 6px 6px 0 #b5b5b5;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-track{/* 스크롤바 뒷 배경 */ background:#f1f1f1; border-radius:1em; border:6px solid #fff; box-shadow:none;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-button{/* 스크롤바 상하 화살표 버튼 */ display:none;}
#footer .area01 .btnLinkW .btnLink.show ul.btnLinks{max-height:150px; bottom:100%; opacity:1; visibility:visible; overflow-y:auto; z-index:2;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks li{float:none; height:auto; margin:1.375em 0; padding:0; line-height:1;}
#footer .area01 .btnLinkW .btnLink ul li:first-child{margin-top:0;}
#footer .area01 .btnLinkW .btnLink ul li:last-child{margin-bottom:0;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks li a{display:block; padding:0; color:#808080; font-size:1em; letter-spacing:-.015em; word-break:keep-all; overflow-wrap:anywhere; transition:.3s;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks li a span{display:inline-block; position:relative; width:100%;}
#footer .area01 .btnLinkW .btnLink ul.btnLinks li a:focus,
#footer .area01 .btnLinkW .btnLink ul.btnLinks li a:hover{color:#333;}
#footer .area01 .btnLinkW .btnLink01{}

#footer .area01 .copyW{order:1; display:flex; flex-wrap:wrap; align-items:flex-start; gap:1em 2.5em;}
#footer .area01 .copyW .logo.grayscale{width:272px; height:42px; filter:grayscale(1);}
#footer .area01 .copyW .logo.grayscale img{display:inline-block; width:100%; max-width:fit-content;}

#footer .area01 .copyW .addressW{padding:.25em 0 0;}
#footer .area01 .copyW .addressW address{}
#footer .area01 .copyW .addressW address div{display:block; margin:0 auto 1em;}
#footer .area01 .copyW .addressW address span{display:inline-block; margin-right:1em; color:#808080; text-transform:uppercase; letter-spacing:-.015em; word-break:keep-all; overflow-wrap:anywhere;}
#footer .area01 .copyW .addressW address span.ti{color:#333;}
#footer .area01 .copyW .addressW address span.address{}
#footer .area01 .copyW .addressW address span.tel{}
#footer .area01 .copyW .addressW address span.tel a{color:#808080;}
#footer .area01 .copyW .addressW address span.fax{}
#footer .area01 .copyW .addressW address span span{display:inline-block; margin-right:.25em; color:#333;}

#footer .area02{padding:.75em 0; background:#e4e4e4;}
#footer .area02 .copyright{color:#808080; text-align:center; word-break:keep-all; overflow-wrap:anywhere;}
#footer .area02 .copyright span.copy{}
#footer .area02 .copyright span.copy strong{font-weight:inherit;}

#footer .snb{display:inline-block; position:absolute; bottom:.75em; left:2.5em;}
#footer .snb ul{}
#footer .snb ul li{display:inline-block; margin:0 2px;}
#footer .snb ul li a{display:inline-block; width:12px; height:16px; opacity:.4; text-indent:-999999px;}
#footer .snb ul li a:focus,
#footer .snb ul li a:hover{opacity:.6;}
#footer .snb ul li.login a{background:url('../images/ico_admin_login.png') no-repeat center;}
#footer .snb ul li.logout a{background:url('../images/ico_admin_logout.png') no-repeat center;}
#footer .snb ul li.admin a{background:url('../images/ico_admin_login.png') no-repeat center;}

/* 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:#333; 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:13px; height:7px; 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:#4d4d4d;}

@media all and (min-width:1921px){
	/*html{font-size:18px;}*/
}

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

@media all and (max-width:1440px){
	#wrap{min-width:1200px;}
	.inner, .inner.w1280, .inner.w1400{max-width:100%; padding:0 2.5em;}
	.inner.w1400 {box-sizing:border-box;}

	#header .gnb .navPanel .menuArea .menuList > ul > li{padding:0 0 0 3.5em;}
	#header .gnb .navPanel .menuArea .menuList > ul > li > a{font-size:1.875em;}

	#footer .area01 .copyW .addressW address span.ti{display:block; width:100%; margin:0 0 .625em;}
	#footer .area01 .copyW .addressW address span.address{display:block; width:100%;}
}

@media all and (max-width:1279px){
	#wrap{min-width:1000px;}
	.inner, .inner.w1280, .inner.w1400{width:100%; max-width:100%; padding:0 1em;}
	caption{margin:0;}

	#header .logo h1{left:1em;}
	#header .snb{right:1em;}
	#header .gnb .nav.pc .menuList{padding-right:3em;}
	#header .gnb .nav.pc .menuList ul li.depth01_list{padding:0 1em;}

	#header .gnb .navPanel .menuArea .menuList > ul > li{padding:0 0 0 2.5em;}
	#header .gnb .navPanel .menuArea .menuList > ul > li > a{font-size:1.5em;}
	#header .gnb .navPanel .menuArea .menuList ul ul li{margin:1.5em 0 0;}
	#header .gnb .navPanel .menuArea .menuList ul ul li a{font-size:1.063em;}

	#footer .area01 .copyW{flex:2;}
	#footer .area01 .copyW .addressW{flex:1 1 100%;}
	#footer .area01 .btnLinkW{margin:-.625em 0 0;}
}

@media all and (max-width:1023px){
	[data-aos]{pointer-events:auto; opacity:1; transform:none;}
	.chk_pc{display:none;}
	#wrap{min-width:280px;}
	#container{min-height:500px; padding:72px 0 0;}
	.inner, .inner.w1280, .inner.w1400{width:100%; min-width:280px; padding:0 .875em; box-sizing:border-box;}
	.layoutLeft{float:none;}
	.layoutRight{float:none;}

	#header{width:100%; height:72px; top:0; left:0; border-bottom:1px solid rgba(229,230,232,.4); z-index:999;}
	#header.ios-device{}
	#header.sticky{top:0;}
	#header.scroll{top:0; box-shadow:0 0 8px rgba(0,0,0,.1);}

	#header .inner{padding:0;}
	#header .gnb.pc{height:72px; background:#fff; border-bottom:none;}
	#header.scroll .gnb{background:#fff;}

	#header .logo h1{top:14px;}

	#header .gnb.pc .nav.pc .menuList{display:none;}
	#header .gnb.pc .nav.pc .snb{top:12px; margin-top:auto;}

	#header .gnb .navPanel .menuArea{position:absolute; width:25%; min-width:480px; height:100%; top:auto; right:-100%; padding:80px 0 1em; background:#fff; overflow:hidden; opacity:0; transition:right .6s ease-in-out, opacity .4s ease-in-out; transform:translateY(0); z-index:-1;}

	#header .gnb .navPanel button.navClose{display:block; position:absolute; width:48px; height:48px; top:12px; right:1em; margin:0; padding:0; background:transparent; border-radius:2px; cursor:pointer;}
	#header .gnb .navPanel button.navClose span{display:block; position:relative; width:18px; height:2px; margin:0 auto; background:transparent; border-radius:2px; font-size:0; transition:.3s;}
	#header .gnb .navPanel button.navClose span:before,
	#header .gnb .navPanel button.navClose span:after{content:''; display:block; position:absolute; width:18px; height:2px; background:#333; transition:.3s;}
	#header .gnb .navPanel button.navClose span:before{top:-8px; transform:translate3d(0,8px,0) rotate(45deg);}
	#header .gnb .navPanel button.navClose span:after{bottom:-8px; transform:translate3d(0,-8px,0) rotate(-45deg);}
	#header .gnb .navPanel button.navClose:focus,
	#header .gnb .navPanel button.navClose:hover{background:rgba(129,135,143,.1);}
	#header .gnb .navPanel button.navClose:focus span, #header .gnb .navPanel button.navClose:hover span,
	#header .gnb .navPanel button.navClose:focus span, #header .gnb .navPanel button.navClose:hover span{transform:rotate(180deg);}
	#header .gnb .navPanel button.navClose:after{content:''; clear:both; display:block;}
	#header .gnb .navPanel .menuBg{position:absolute; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,.8); background:linear-gradient(-45deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.64) 100%); opacity:0; z-index:-1; transition:opacity .4s ease-in-out;}

	#header .gnb .menuArea .menuList ul,
	#header .gnb .menuArea .menuList ul li,
	#header .gnb .menuArea .menuList ul li a,
	#header .gnb .navPanel .menuArea .menuList{display:block; position:relative; line-height:1; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
	#header .gnb .navPanel .menuArea .menuList{height:100%; padding:0 .25em; background:#fff; color:#fff; text-align:left; z-index:0; overflow-y:auto;}
	#header .gnb .navPanel .menuArea .menuList:before{content:''; display:block; position:absolute; width:100%; height:1em; top:0; left:0; background:linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); z-index:2;}
	#header .gnb .navPanel .menuArea .menuList ul{z-index:1;}
	#header .gnb .navPanel .menuArea .menuList ul li a{display:block; position:relative; border-radius:2px; cursor:pointer; z-index:2;}
	#header .gnb .navPanel .menuArea .menuList > ul{display:block; width:auto; height:auto; padding:0;}
	#header .gnb .navPanel .menuArea .menuList > ul > li{max-width:100%; padding:0;}
	#header .gnb .navPanel .menuArea .menuList > ul > li:nth-child(n+6){display:block;}
	#header .gnb .navPanel .menuArea .menuList > ul > li > a{line-height:1.2; padding:1.2em 3em 1.2em 1.2em; background:#fff; color:#333; font-size:1.25em; font-weight:600; outline-offset:-1px; overflow:hidden;}
	#header .gnb .navPanel .menuArea .menuList > ul > li > a:before{display:none; width:0; height:0;}
	#header .gnb .navPanel .menuArea .menuList > ul > li > a:focus,
	#header .gnb .navPanel .menuArea .menuList > ul > li > a:hover{color:#00a1e9;}
	#header .gnb .navPanel .menuArea .menuList > ul > li.hasSub > a:after{content:''; display:inline-block; position:absolute; width:13px; height:7px; top:50%; right:1.2em; margin-top:-3.5px; background:url('../images/ico_arrow_bottom_dark.png') no-repeat center / 100% 100%; opacity:1; z-index:5;}
	#header .gnb .navPanel .menuArea .menuList > ul > li.hasSub.open > a{color:#00a1e9; font-weight:700;}
	#header .gnb .navPanel .menuArea .menuList > ul > li.hasSub.open > a:after{background:url('../images/ico_arrow_top_dark.png') no-repeat center / 100% 100%; opacity:1;}
	#header .gnb .navPanel .menuArea .menuList ul ul{display:none; margin:0 1.2em; padding:8px; background:#333; border:none; border-radius:2px;}
	#header .gnb .navPanel .menuArea .menuList ul ul li{margin:0;}
	#header .gnb .navPanel .menuArea .menuList ul ul li a{padding:.8em 2.625em .8em .75em; color:#acacac; font-size:1.063em;}
	#header .gnb .navPanel .menuArea .menuList ul ul li a:before{display:none; width:0; height:0;}
	#header .gnb .navPanel .menuArea .menuList ul ul li a:focus,
	#header .gnb .navPanel .menuArea .menuList ul ul li a:hover{color:#fff; text-decoration:underline;}
	#header .gnb .navPanel .menuArea .menuList > ul ul > li.hasSub > a:after{content:''; display:inline-block; position:absolute; width:13px; height:7px; top:50%; right:1em; margin-top:-4px; background:url('../images/ico_arrow_bottom_light.png') no-repeat center / 100% 100%; opacity:1; z-index:5;}
	#header .gnb .navPanel .menuArea .menuList > ul ul > li.hasSub.open > a{background:#fff; border-radius:2px 2px 0 0; color:#056fb8; font-weight:600; text-decoration:none;}
	#header .gnb .navPanel .menuArea .menuList > ul ul > li.hasSub.open > a:after{background:url('../images/ico_arrow_top_dark.png') no-repeat center / 100% 100%; opacity:1;}
	#header .gnb .navPanel .menuArea .menuList ul ul ul{display:none; margin:0 auto; padding:8px 4px; background:#fff; border:none; border-radius:0 0 2px 2px;}
	#header .gnb .navPanel .menuArea .menuList ul ul ul li a{padding:.625em 1em; color:#4d4d4d; font-size:1em;}
	#header .gnb .navPanel .menuArea .menuList ul ul ul li a:focus,
	#header .gnb .navPanel .menuArea .menuList ul ul ul li a:hover{color:#808080; text-decoration:underline;}

	#header .gnb .navPanel.open{visibility:inherit; opacity:1; z-index:99;}
	#header .gnb .navPanel.open .menuArea{top:auto ;right:0; opacity:1; z-index:0;}
	#header .gnb .navPanel.open .menuArea:before, #header .gnb .navPanel.open .menuArea:after{left:-80px; box-shadow:-10px 10px 10px rgba(0,0,0,.02); opacity:1;}
	#header .gnb .navPanel.open .menuBg{opacity:.5;}

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

@media all and (max-width:768px){
	html{font-size:15px;}
	#container{padding:54px 0 0;}

	#header,
	#header .gnb.pc{height:54px;}

	#header .logo h1{width:220px; top:6px; left:.75em;}

	#header .gnb.pc .nav.pc .snb{top:.438em; right:.75em;}
	#header .snb .sitemap{width:40px; height:40px;}

	#header .gnb .navPanel .menuArea{width:100%; max-width:480px; min-width:280px;}
	#header .gnb .navPanel .menuArea .msnb{padding:48px 1em 12px;}
	#header .gnb .navPanel .menuArea .menuList > ul > li > a{padding:1em 3em 1em 1.2em; font-size:1.125em;}

	#header .gnb .navPanel button.navClose{width:40px; height:40px; top:.438em; right:.75em; border-radius:17px;}

	#footer .area01 .copyW{flex:1 1 100%;}
	#footer .area01 .copyW .logo.grayscale{width:220px; height:auto;}
	#footer .area01 .copyW .addressW address span{line-height:1.3;}
	#footer .area01 .familysitesW{flex:1 1 100%;}

	#quick{display:none !important;}
	#footer .snb{display:none !important;}
}

@media all and (max-width:480px){
	#header .gnb .navPanel .menuArea{min-width:84%; /*max-width:320px;*/}

	#footer .area01 .copyW .addressW address span.tel{display:block; margin:0 0 .625em;}
	#footer .area01 .copyW .addressW address span.fax{display:block;}
}

@media all and (max-width:319px){
	html{font-size:14.6px; /*zoom:.9;*/}
	#wrap{min-width:280px;}
	.inner{min-width:280px;}
}

/* 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){
}