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

/* font */
@import url('./pretendard.css');
@import url('./pretendardvariable.css');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cardo&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:#050708;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 #e4c1c1;}*/
/* basic */
html{position:relative; overflow-y:auto; line-height:1; color:#050708; font-size:16px; /*font-size:62.5%;*/ letter-spacing:-.00em; box-sizing:border-box; zoom:1; scroll-behavior:smooth;}
html:after{content:''; position:fixed; width:100vw; height:100vh; bottom:0; left:0; }
body{width:100%; height:100%; margin:0 auto; background:#fff; font-family: 'Cardo', serif; /*font-size:1.6rem;*/ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; letter-spacing:-.0em;}
body.hidden{min-height:100%; overflow-y:hidden !important; touch-action:none;}
@keyframes fade-in-bottom{0%{-webkit-transform:translateY(50px);transform:translateY(50px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}
@keyframes fade-in-bottom-h2{0%{-webkit-transform:translateY(50px);transform:translateY(50px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:.6}}
@keyframes scale-in-hor-center{0%{-webkit-transform:scaleX(0);transform:scaleX(0);opacity:0}100%{-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1}}
/* common */
#wrap{clear:both; position:relative; width:100%; min-width:1200px; 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; margin:0; padding:0; background:transparent; z-index:auto; transition:.3s;}
#container:after{content:''; clear:both; display:block;}
.inner{clear:both; position:relative; margin:0 auto; width:1180px; padding:0 10px; box-sizing:content-box;}
.inner.w1200{width:1200px; max-width:1200px; padding:0;}
.inner.full{width:100%; max-width:1880px; box-sizing:border-box;}
.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:.875rem; overflow:inherit;}
caption.view:before{content:'<';}
caption.view:after{content:'>';}
a, button, input, select, textarea{font-family:'Quicksand','Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,system-ui,'Helvetica Nenu','Segoe UI','Apple SD Gothic Neo','Noto Sans KR','Malgun Gothic','FontAwesome',sans-serif; font-size:100%; letter-spacing:-.0em; transition:color .3s ease, background .3s ease, border .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{color:inherit; transition:color .3s ease, background .3s ease, border .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:absolute; top:0; z-index:999999;width:80%;margin:10px}
ul.skip li{text-align:right;}
ul.skip li a {padding:0px 0px;display:inline-block;font-size:0.8em}
ul.skip li a span {display:inline-block;padding:5px}
ul.skip li .naverplace{background:#FFF;color:#009e39;border:1px solid #00c045;margin-right:20px}
ul.skip li a.skipTo{position:fixed; top:-99px; left:0; width:100%; padding:16px 0; background:#050708; color:#fff;  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;}
ul.skip li img {width:33px;margin:0px; padding:0px}
i.ico{display:inline-block; font-family:'FontAwesome';}
.chk_pc{display:block;}
#bo_v_con{font-family:initial;}

/* header */
#header{clear:both; position:relative; width:100%; top:0; left:0; background:transparent; border-bottom:0px solid #eee; text-align:center; z-index:10; transition:.3s;background:#FEFBF7}
#header .logo{position:relative; width:100%; padding:28px 0; text-align:center;}
#header .logo h1{display:inline-block; width:240px;}
#header .logo h1 a{display:block;}
#header .logo h1 a img{width:auto; max-width:480px;}

#header .gnb{padding:0 0 20px;}
#header .gnb .navPanel{visibility:visible;}
#header .gnb .navPanel .menuArea{}
#header .gnb .navPanel .menuArea nav.menuList{}
#header .gnb .navPanel .menuArea .menuList ul.depth01_lists{display:flex; justify-content:center;}
#header .gnb .navPanel .menuArea .menuList ul li.depth01_list{display:inline-block; width:10%; max-width:204px; line-height:28px;border:0px solid #ddd}
#header .gnb .navPanel .menuArea .menuList ul li a.depth01{line-height:1; padding:4px; color:#050708; font-size:0.85em; letter-spacing:0.10em;font-family: 'Cardo', serif;}
#header .gnb .navPanel .menuArea .menuList ul li a.depth01 span{position:relative;}
#header .gnb .navPanel .menuArea .menuList ul li a.depth01 span:before{content:''; display:block; position:absolute; top:0; left:50%; margin-left:-.5em; color:#ffeeeb; font-size:10px; text-align:center; opacity:0; transition:.3s ease-in-out;}
#header .gnb .navPanel .menuArea .menuList ul li a.depth01:focus, #header .gnb .navPanel .menuArea .menuList ul li a.depth01:hover{color:#999;}
#header .gnb .navPanel .menuArea .menuList ul li a.depth01:focus span:before, #header .gnb .navPanel .menuArea .menuList ul li a.depth01:hover span:before{top:-12px; color:#ffc9c0; opacity:1;}

#header .gnb button.navOpen,
#header .gnb .navPanel button.navClose,
#header .gnb .navPanel .menuBg{display:none;}


/* footer */
#footer{clear:both; width:100%; height:auto; padding:28px 0;background:#FEFBF7;border-top:0px solid #ddd;font-family: 'Cardo', serif;letter-spacing:.085em;font-size:0.90em;color:#5D5D5D}
#footer .info strong{color:#2A2A2A;font-family: 'Cardo', serif;;letter-spacing:.185em;font-weight:600;font-size:0.87em}
#footer .company{color:#666; font-size:.875em; text-align:center;}
#footer .company span{display:inline-block; line-height:1.6; margin-right:20px; word-break:keep-all;}
#footer .company span:last-child{margin-right:0;}
#footer .company .info{}
#footer .company .info span{}
#footer .company .info span a{color:inherit;}
#footer .company .copyright{margin-top:8px;}
#footer .company .copyright span{}
#footer .company .copyright span strong{font-weight:600;color:#2A2A2A}

@media all and (max-width:1279px){
	#wrap{min-width:1000px;}
	.inner,	.inner.w1200{width:100%; min-width:960px; padding:0 20px; box-sizing:border-box;}
	caption{margin:0;}

	#header .gnb .navPanel .menuArea nav.menuList ul li.depth01_list{width:9%;}
}

@media all and (max-width:1023px){
	#wrap{min-width:296px;}
	#container{padding-top:106px;}
	.inner, .inner.w1200{width:100%; min-width:296px; padding:0 12px; box-sizing:border-box;}
	.layoutLeft{float:none;}
	.layoutRight{float:none;}

	#header{position:fixed; top:0; background:rgba(255,255,255,.8); text-align:left; z-index:1999;}
	#header .gnb{width:100%; top:0; padding:0;}
	#header .gnb button.navOpen,
	#header .gnb .navPanel button.navClose,
	#header .gnb .navPanel .menuBg{display:block;}

	#header .gnb button.navOpen{display:block; position:absolute; width:26px; height:26px; top:40px; right:15px; margin:0; padding:0; background:transparent; cursor:pointer;}
	#header .gnb button.navOpen span{display:inline-block; position:absolute; width:26px; height:2px; top:calc(50% - 1px); left:0; margin:0 auto; background:#050708; font-size:0; vertical-align:middle; transition:background .3s;}
	#header .gnb button.navOpen span:before, #header .gnb button.navOpen span:after{content:''; display:block; position:absolute; width:26px; height:2px; background:#050708; transition:background .3s;}
	#header .gnb button.navOpen span:before{top:-8px;}
	#header .gnb button.navOpen span:after{bottom:-8px;}
	#header .gnb button.navOpen:focus span, #header .gnb button.navOpen:hover span,
	#header .gnb button.navOpen:focus span:before, #header .gnb button.navOpen:hover span:before,
	#header .gnb button.navOpen:focus span:after, #header .gnb button.navOpen:hover span:after{background:#999;}

	#header .gnb .navPanel{position:fixed; width:100%; height:100%; top:0; right:0; background:transparent; overflow-y:auto; visibility:hidden; opacity:0; transition:.3s ease-in-out; z-index:-1; overflow:hidden;}
	#header .gnb .navPanel .menuArea{position:absolute; width:80%; max-width:280px; height:100%; top:0; right:-100%; padding:0; background:#fff; opacity:0; transition:right .6s ease-in-out, opacity .3s ease-in-out; z-index:-1;}
	#header .gnb .navPanel .menuArea nav.menuList,
	#header .gnb .menuArea .menuArea nav.menuList ul,
	#header .gnb .menuArea .menuArea nav.menuList ul li,
	#header .gnb .menuArea .menuArea nav.menuList ul li a{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 nav.menuList{padding:80px 0 40px; background:#fff; color:#fff; z-index:0; overflow-y:auto;}
	#header .gnb .navPanel .menuArea nav.menuList ul.depth01_lists{display:inline-block; width:100%; padding:8px 20px;}
	#header .gnb .navPanel .menuArea nav.menuList ul li.depth01_list{display:inline-block; width:100%; max-width:100%; padding:0; text-align:left;}
	#header .gnb .navPanel .menuArea nav.menuList ul li a.depth01{display:block; padding:16px 20px;}
	#header .gnb .navPanel .menuArea .menuList ul li a.depth01 span:before{top:6px; left:-32px; margin-left:0;}
	#header .gnb .navPanel .menuArea .menuList ul li a.depth01:focus span:before,
	#header .gnb .navPanel .menuArea .menuList ul li a.depth01:hover span:before{top:6px; left:-16px;}

	#header .gnb .navPanel button.navClose{position:absolute; width:26px; height:26px; top:40px; right:15px; margin:0; padding:0; background:transparent; cursor:pointer;}
	#header .gnb .navPanel button.navClose span{display:block; position:relative; width:26px; 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:26px; height:2px; background:#050708; 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 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%; left:0; background:#000; opacity:0; z-index:-1; transition:opacity .4s ease-in-out;}
	#header .gnb .navPanel.open{visibility:inherit; opacity:1; z-index:0;}
	#header .gnb .navPanel.open .menuArea{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;}

	#hd_pop, #hd_wrapper, #tnb ul, #gnb .gnb_wrap, #container_wr, #ft_wr{width:100%;}
	.hd_pops{width:100%; max-width:550px; top:68px !important; left:50% !important; margin-left:-275px;z-index:10000000 !important}
	.hd_pops img{width:100% !important;z-index:10000000 !important}
	.hd_pops_con{width:100% !important; height:auto !important;}
}

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

	.hd_pops{width:100%; max-width:70%; top:68px !important; left:50% !important; margin-left:-35%;}
	.hd_pops_footer button{font-size:.813rem;}
}

@media all and (max-width:495px){
	#container{padding-top:78px;}

	#header .logo h1 a img{width:auto; max-width:80px !important;}
	#header .logo{padding:24px 0;}
	#header .logo h1{width:150px;}
	

    #footer{clear:both; width:100%; height:auto; padding:28px 0;background:#FFF;border-top:0px solid #ddd;font-family: 'Cardo', serif;letter-spacing:.005em;font-size:0.80em;color:#5D5D5D}
	#header .gnb button.navOpen{width:18px; height:18px; top:30px; right:12px;z-index:1099;}
	#header .gnb button.navOpen span{width:18px;}
	#header .gnb button.navOpen span:before, #header .gnb button.navOpen span:after{width:18px;}
	#header .gnb button.navOpen span:before{top:-6px;}
	#header .gnb button.navOpen span:after{bottom:-6px;}
	#header .gnb .navPanel button.navClose{width:18px; height:18px; top:30px; right:12px;}
	#header .gnb .navPanel button.navClose span{width:18px;}
	#header .gnb .navPanel button.navClose span:before, #header .gnb .navPanel button.navClose span:after{width:18px;}

	#footer{font-size:14px;}

	.hd_pops{max-width:90%; margin-left:-45%;}
	.hd_pops_footer button{font-size:.775rem;}
}

@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){
}