@charset "UTF-8";
/* Designed and Coding By MEDICAST */
/* Designer Yoon Jain (design,html,css,jquery) */

/* 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:#202122;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:#202122; font-size:16px; /*font-size:62.5%;*/ letter-spacing:0.000em; zoom:1; overflow:unset; scroll-behavior:smooth; overscroll‑behavior:none;}
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:0.000em; overscroll-behavior:none;}
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 blink-loop{0%,19%,35%,100%{opacity:1}20%,24%,30%,34%{opacity:0}25%,29%{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); -webkit-overflow-scrolling:touch;}
#container{clear:both; position:relative; width:100%; height:auto; min-height:800px; margin:0; padding: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 5em; box-sizing:border-box;}
.inner.w1280{max-width:1240px; padding:0 20px;}
.inner.w1280.nopadding{max-width:1280px;}
.inner.nopadding{padding:0;}
.inner:after{content:''; clear:both; display:block;}
.reading{clear:both; display:block; position:absolute; width:1px; height:1px; top:0; left:0; 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:0.000em; 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:#202122; 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'; font-style:normal;}
select{position:relative; appearance:none; -webkit-appearance:none; -moz-appearance:none; background:#fff url('../images/ico_arrow_bottom_gray-2.png') no-repeat right .75em center / 11px 7px;}
input:read-only:not([type="text"]):not([type="search"]):not([type="tel"])
:not([type="url"]):not([type="email"]):not([type="password"])
:not([type="number"]):not([type="date"]):not([type="month"])
:not([type="week"]):not([type="time"]):not([type="datetime-local"]),
textarea:read-only{background-color:#e5e6e8 !important; border-color:#cdcfd4 !important; color:#202122 !important; cursor:not-allowed;}
input:disabled, textarea:disabled, select:disabled{background-color:#e5e6e8 !important; border-color:#cdcfd4 !important; color:#84858a !important; cursor:not-allowed;}
input::placeholder, textarea::placeholder, select::placeholder{color:#84858a; transition:.3s;}
input:focus::placeholder, textarea:focus::placeholder, select:focus::placeholder,
input:hover::placeholder, textarea:hover::placeholder, select:hover::placeholder,
input:disabled::placeholder, textarea:disabled::placeholder, select:disabled::placeholder{color:#b8b9bc;}
.chk_pc{display:block;}

label.btn.select{display:inline-block; line-height:1; height:auto; margin:4px 8px 4px 0; padding:0; background:transparent; 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; opacity:0;}
label.btn.select input.pick ~ span.checkmark{display:inline-block; position:relative; width:1em; height:1em; margin-right:1px; line-height:1; background:#fff; border:1px solid #b8b9bc; border-radius:50%; transform:translateY(-1px); vertical-align:middle; 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:#525356; border-color:#525356;}
label.btn.select input.pick:disabled ~ span.checkmark{background:#e5e6e8; border-color:#cdcfd4; 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{transform:translateY(-3px);}
label.btn.select input.pick.chk:checked ~ span.checkmark{}
label.btn.select input.pick.chk:disabled ~ span.checkmark{background:#e5e6e8; border-color:#cdcfd4; cursor:not-allowed;}
label.btn.select input.pick.chk:disabled ~ span.txt{color:#575b63; cursor:not-allowed;}
label.btn.select input.pick.chk ~ span.checkmark:after{width:10px; height:8px; top:50%; left:50%; margin:-4px auto auto -5px; background:transparent;}
label.btn.select input.pick.chk:checked ~ span.checkmark:after{background:url('../images/sub/ico_check.png') no-repeat left 0 center / auto 100%;}
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; transform:translateY(0);}
label.btn.select input.pick.radio:checked ~ span.checkmark{}
label.btn.select input.pick.radio:disabled ~ span.checkmark{background:#e5e6e8; border-color:#cdcfd4; cursor:not-allowed;}
label.btn.select input.pick.radio:disabled ~ span.txt{color:#575b63; cursor:not-allowed;}
label.btn.select input.pick.radio ~ span.checkmark:after{width:50%; height:50%; top:50%; left:50%; background:#fff; border-radius:50%; transform:translate(-50%, -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:#fff; text-align:center; z-index:999; transition:.3s; transition-delay:.1s; transition-timing-function:cubic-bezier(.22,.61,.36,1); transform-origin:center top;}
#header.sticky{top:-72px;}
#header:hover,
#header.on,
#header.scroll{}

#header .inner{}
#header .inner::after{content:none;}
#header .flexW{display:flex; flex-wrap:wrap; justify-content:space-between;}
#header .flexW div a{display:inline-block; width:fit-content; max-width:118px; height:70px; line-height:70px;}
#header .flexW .office{}
#header .flexW .office a{display:block;}
#header .flexW .office a h1{display:inline-block; font-size:1.25em; font-weight:500;}
#header .flexW .linkW{}
#header .flexW .linkW ul{display:flex; justify-content:flex-end; gap:2.5em;}
#header .flexW .linkW ul li{width:auto;}
#header .flexW .linkW ul li a{font-weight:500;}
#header .flexW .linkW ul li a:hover,
#header .flexW .linkW ul li a:focus{color:#4046dc;}
#header .flexW .linkW ul li a span{}

/* footer */
#footer{clear: both; width: 100%; height: auto; padding: 0; position: relative;}
#footer .copyrightW{}
#footer .copyrightW .copyright{text-align:left;}
#footer .copyrightW .copyright div{display:block; margin:0 auto 1em;}
#footer .copyrightW .copyright div:last-child{margin:0 auto;}
#footer .copyrightW .copyright div span{display:inline-block; margin-right:1em; color:#b8b9bc; font-size:1em; word-break:keep-all; overflow-wrap:anywhere;}
#footer .copyrightW .copyright div span:last-child{margin-right:0;}
#footer .copyrightW .copyright div span strong{}
#footer .copyrightW .copyright.cit{}
#footer .copyrightW .copyright.cit div{}
#footer .copyrightW .copyright.cit div span{}
#footer .copyrightW .copyright.cit div span span{}
#footer .copyrightW .copyright.cit div span a{display:inline-block; color:inherit;}
#footer .copyrightW .copyright.copy{}
#footer .copyrightW .copyright.copy div{display:inline-block; margin:0 auto;}
#footer .copyrightW .copyright.copy div span{color:#84858a;}
#footer .copyrightW .copyright.copy div span strong{font-weight:400;}
#footer .area .layoutLeft, #footer .area .layoutRight{float:none;} 

#footer .area01, #footer .area02{padding:0; background:#202122;}

#footer .area01{padding:1.75em 0 0;}

#footer .area02{padding:1.125em .2em;}
#footer .area02 .flexW{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
#footer .area02 ul.sns{display:inline-block; text-align:right; vertical-align:middle;}
#footer .area02 ul.sns li{display:inline-block; margin:0 .5em;}
#footer .area02 ul.sns li:first-child{margin-left:0;}
#footer .area02 ul.sns li:last-child{margin-right:0;}
#footer .area02 ul.sns li a{}
#footer .area02 ul.sns li a i.ico{}
#footer .area02 ul.sns li a i.ico.sns{display:block; height:23px; background:transparent url('../images/ico_sns.png') no-repeat top 100% center / 100% 300%;}
#footer .area02 ul.sns li a i.ico.sns.kakaotalk{width:22px; background-image:url('../images/ico_sns_kakaotalk.png');}
#footer .area02 ul.sns li a i.ico.sns.blog{width:21px; background-image:url('../images/ico_sns_blog.png');}
#footer .area02 ul.sns li a i.ico.sns.navercafe{width:18px; background-image:url('../images/ico_sns_navercafe.png');}
#footer .area02 ul.sns li a i.ico.sns.facebook{width:15px; background-image:url('../images/ico_sns_facebook.png');}
#footer .area02 ul.sns li a i.ico.sns.instagram{width:20px; background-image:url('../images/ico_sns_instagram.png');}
#footer .area02 ul.sns li a i.ico.sns.youtube{width:23px; background-image:url('../images/ico_sns_youtube.png');}
#footer .area02 ul.sns li a span{}
#footer .area02 ul.sns li a:hover i.ico.sns,
#footer .area02 ul.sns li a:focus i.ico.sns{background-position:top 50% center;}
#footer .area02 .btnLinkW{display:inline-block; margin:0 0 0 2.5em; vertical-align:middle;}
#footer .area02 .btnLinkW .btnLink{position:relative;}
#footer .area02 .btnLinkW .btnLink button{position:relative; min-width:160px; line-height:1; padding:.7em 1.4285em .785em; background:#393a3c; border-radius:5em; color:#b8b9bc; font-size:.938em; text-align:left; vertical-align:top; cursor:pointer; z-index:3;}
#footer .area02 .btnLinkW .btnLink button::after{content:''; display:inline-block; position:absolute; width:11px; height:7px; top:50%; right:1.2em; margin-top:-3.5px; background:url('../images/ico_arrow_top.png') no-repeat left -11px top / 66px 7px; opacity:1; z-index:5;}
#footer .area02 .btnLinkW .btnLink button:hover,
#footer .area02 .btnLinkW .btnLink button:focus{background:#525356; color:#d2d3d5;}
#footer .area02 .btnLinkW .btnLink button.rotate::after{background:url('../images/ico_arrow_bottom.png') no-repeat left -11px top / 66px 7px; opacity:1;}
#footer .area02 .btnLinkW .btnLink button span{}
#footer .area02 .btnLinkW .btnLink ul.btnLinks{display:block; position:absolute; width:100%; height:auto; max-height:318px; bottom:0; margin-bottom:.25em; padding:1.125em .5em 1.125em 1.25em; background:#fff; border-radius:12px; box-shadow:2px 2px 12px rgba(32,33,34,.1); box-sizing:border-box; text-align:left; opacity:0; overflow:hidden; visibility:hidden; transition:.3s ease; z-index:1; scrollbar-width:thin;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar{/* 스크롤바 영역 */ width:18px; height:186px;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-thumb{/* 스크롤바 막대 */ outline:none; border-radius:1em; border:6px solid transparent; box-shadow:inset 6px 6px 0 #cdcdcd;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-thumb:hover{box-shadow:inset 6px 6px 0 #b5b5b5;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-track{/* 스크롤바 뒷 배경 */ background:#f1f1f1; border-radius:1em; border:6px solid #fff; box-shadow:none;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks::-webkit-scrollbar-button{/* 스크롤바 상하 화살표 버튼 */ display:none;}
#footer .area02 .btnLinkW .btnLink.show ul.btnLinks{max-height:336px; bottom:100%; opacity:1; visibility:visible; overflow-y:auto; z-index:2;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks li{float:none; height:auto; line-height:1; margin:.75em 0; padding:0;}
#footer .area02 .btnLinkW .btnLink ul li:first-child{margin-top:0;}
#footer .area02 .btnLinkW .btnLink ul li:last-child{margin-bottom:0;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks li a{display:block; padding:0; color:#525356; font-size:.938em; word-break:keep-all; overflow-wrap:anywhere; transition:.3s;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks li a span{display:inline-block; position:relative; width:100%;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks li a span::before{content:''; display:inline-block; position:absolute; width:100%; height:1em; bottom:-1px; left:0; background:#fefce4; transform:scaleY(0); transform-origin:center bottom; transition:.2s; z-index:-1;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks li a:hover,
#footer .area02 .btnLinkW .btnLink ul.btnLinks li a:focus{color:#f3977a;}
#footer .area02 .btnLinkW .btnLink ul.btnLinks li a:hover span::before,
#footer .area02 .btnLinkW .btnLink ul.btnLinks li a:focus span::before{transform:scaleY(1);}
#footer .area02 .btnLinkW .btnLink01{}

/* around */
#around{display:flex; width:100%; padding:3em 0; overflow:hidden;}
#around ul{display:flex; gap:6em; padding:0 3em;}
#around ul li{min-width:330px;}
#around ul li p{font-size:1.625em;}
#around ul.origin{animation: origin 30s linear 0s infinite normal forwards running;}
#around ul.clone{animation: clone 30s linear 0s infinite normal none running;}
@keyframes origin{
	0%{transform:translateX(0);} 50%{transform:translateX(-100%);} 50.01%{transform:translateX(100%);} 100%{transform:translateX(0);}
}
@keyframes clone{
	0%{transform:translateX(0);} 100%{transform:translateX(-200%);}
}

/* quick */
#quick{display:block; position:fixed; height:auto; bottom:2.5em; right:2.5em; /*right:4em;*/ padding:0; background:transparent; text-align:center; z-index:98; /*transform:translateY(50%);*/ transition:bottom .3s, transform .3s;}
#quick .btn_top{display:flex; position:relative; width:68px; height:0; bottom:0; right:0; margin:0 auto -11px; background:transparent; border-radius:50%; box-shadow:0 2px 8px rgba(57,58,60,.1); visibility:hidden; opacity:0; transform:scale(0); transform-origin:center center; transition:.3s; transition-delay:.3s;}
#quick .btn_top.show{height:68px; visibility:visible; opacity:1; transform:scale(1);}
#quick .btn_top button.back_to_top{display:block; position:relative; width:100%; height:100%; width:68px; height:68px; margin:0 auto; background:#393a3c; border-radius:50%; text-align:center; transition:all 0s, background .3s, opacity .3s; cursor:pointer;}
#quick .btn_top button.back_to_top span{}
#quick .btn_top button.back_to_top span.arrow{display:inline-block; position:absolute; width:15px; height:9px; top:50%; left:50%; margin:-1px auto 0; background:url('../images/ico_arrow_top_big.png') no-repeat center / cover; transform:translate(-50%,-50%);}
#quick .btn_top button.back_to_top:focus,
#quick .btn_top button.back_to_top:hover{background:#f3977a;}


@media all and (max-width:1599px){
	#wrap{min-width:1200px;}
	.inner, .inner.w1280{max-width:100%; padding: 0 2em;}
}

@media all and (max-width:1440px){
}

@media all and (max-width:1279px){
	#wrap{min-width:1000px;}
	.inner, .inner.w1280{width:100%; max-width:100%; min-width:960px;}
	caption{margin:0;}

	label.btn.select input.pick.chk ~ span.checkmark:after{width:7.5px; height:6px; margin:-3px auto auto -4px;}

	#quick .btn_top{width:52px;}
	#quick .btn_top.show{height:52px;}
	#quick .btn_top button.back_to_top{width:52px; height:52px;}
}

@media all and (max-width:1023px){
	[data-aos]{pointer-events:auto; opacity:1; transform:none;}
	#wrap{min-width:296px;}
	#container{min-height:500px; padding:0;}
	.inner, .inner.w1280{width:100%; min-width:296px; padding:0 1.5em;}
	.layoutLeft{float:none;}
	.layoutRight{float:none;}

	/* #header.sticky{top: 0;} */

	#footer .copyrightW .copyright.cit,
	#footer .copyrightW .copyright.copy{text-align: center;}
	#footer .copyrightW .copyright.cit div{margin: 0 auto;}
	#footer .copyrightW .copyright.cit div span{line-height: 1.75;}

	#footer .area01{padding: 1em 0;}

	#footer .area02{padding: 0 0 1em;}
	#footer .area02 .flexW .layoutLeft,
	#footer .area02 .flexW .layoutRight{width: 100%; text-align: center;}
	#footer .area02 .flexW .layoutLeft{margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px dotted #393a3c;}

	#quick .btn_top{width:40px; margin:0 auto -10px;}
	#quick .btn_top.show{height:40px;}
	#quick .btn_top button.back_to_top{width:40px; height:40px;}
}

@media all and (max-width:768px){
	html{font-size:15px;}
	.chk_pc{display:none;}
	.inner, .inner.w1280{padding: 0 1.125em;}

	label.btn.select input.pick.chk ~ span.checkmark{transform:translateY(-2px);}

	#header.sticky{top: -52px;}

	#header .flexW div a{height: 52px; line-height: 52px;}
	#header .flexW .linkW ul{gap: 1.5em;}

	#footer .copyrightW .copyright.cit,
	#footer .copyrightW .copyright.copy{text-align: left;}


	#around{padding:2.5em 0;}
	#around ul{gap:5em; padding:0 2.5em;}
	#around ul li{min-width:264px;}
	#around ul li p{font-size:1.375em;}

	#quick{right: 1.5em; bottom: 1.5em;}
	#quick .btn_top{margin:0 auto;}
}

@media all and (max-width:580px){
	#header .flexW .linkW{text-align:right;}

	#around{padding:1.5em 0;}
	#around ul{gap:3em; padding:0 1.5em;}
	#around ul li{min-width:218px;}
	#around ul li p{font-size:1.125em;}
}

@media all and (max-width:480px){

	#header.sticky{top: -102px;}

	#header .flexW{gap: 1em; padding: 1.6em 0;}
	#header .flexW div a{height: 20px; line-height: 20px;}
	/*#header .flexW .office,
	#header .flexW .linkW{width: 100%;}*/
	#header .flexW .linkW ul{justify-content: space-between; gap: 1em;}

	#footer .copyrightW .copyright div{margin: 0 auto;}
	#footer .copyrightW .copyright div > span{margin-bottom: .5em; font-size: .875em; line-height: 1.5;}
	#footer .copyrightW .copyright.copy div span{font-size: .75em;}

	#footer .area01{padding: 1em 0 0;}

	#footer .area02 ul.sns{display :block; text-align: center;}
	#footer .area02 .btnLinkW{display: block; width: 100%; margin: 1em auto 0; padding: 0 1em;}
	#footer .area02 .btnLinkW .btnLink button{width: 100%;}

	#quick{right: 1em; bottom: 1em;}
}

@media all and (max-width:319px){
	html{font-size:14.6px; /*zoom:.9;*/}
	#wrap{min-width:296px;}
	.inner{min-width:296px;}
}

/* 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){
}