@charset "UTF-8";
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

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;
	font-size: 100%;
	vertical-align: baseline;
	line-height:160%;
    word-break: keep-all;
}
body {font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif; font-size:16px; color:#373737; }
address { font-style:normal;}
a {display:block; font-size:inherit; color:inherit;}
button{border:0; background:none; box-shadow:none; padding:0; cursor:pointer; font-family:inherit;}
html, body { width:100%; /*height:100%;*/ overflow-x:hidden; /*overflow-y:auto;*/ position:relative; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	table-layout:fixed;
}

input, select, textarea {
    vertical-align:initial;
	font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif; font-size:16px; color:#373737; 
	line-height:1.6;
}

img { 
	border:none;
	vertical-align:top;
	max-width:100%;
}

.clearfix:after { 
	content:"";
	display:block;
	clear:both;
}
.fl-l{float:left;}
.fl-r{float:right;}

a:link, a:visited { color:#666; text-decoration:none;}
a:active, a:hover { color:#666; text-decoration:none;}

.site-wrap { height:100%; max-width:100%; margin:0 auto;}
.wrapper{width:94%; max-width:1500px; margin:0 auto; position:relative;}

/*hidden*/
.hidden { position:absolute; left:-9999px; font-size:1px; width:1px; height:1px; line-height:0; }

/*스킵메뉴*/
#skip_menu { width:300px; position:absolute; z-index:9999;}
#skip_menu a { position:absolute; top:-100px;}
#skip_menu a:hover,
#skip_menu a:active,
#skip_menu a:focus { position:absolute; top:0; width:300px; height:20px; display:block; background:#333; color:#fff; text-align:center; font-size:16px; font-weight:bold;}

*{box-sizing:border-box;}

.algn-c{text-align:center;}
.algn-l{text-align:left;}
.algn-r{text-align:right;}

:root {
  --main-color:#064cb5;
  --main-color-dark:#08306d;
}
.bg--main{background-color:var(--main-color);}
.bg--yellow{background-color:#ed9d00;}
.bg--black{background-color:#222;}
.bg--white{background-color:#fff;}
.bg-gray{background-color:#666;}
.bg-lightgray{background-color:#ddd;}
.clr--main{color:var(--main-color);}
.clr--yellow{color:#ed9d00;}
.clr--black{color:#222;}
.clr--white{color:#fff;}
.clr-gray{color:#666;}
.clr-lightgray{color:#ddd;}

.inline-justify{font-size:0;}
.inline-justify > *{display:inline-block; font-size:16px;}

.list{}
.list > *{position:relative; margin-bottom:0.6em; padding-left:1em;}
.list > *:last-child{margin-bottom:0;}
.list > *:before{position:absolute; content:""; left:0; top:0.75em;}
.list.list--dot > *:before{margin-top:-2px; width:4px; height:4px; background:#ed9d00; border-radius:100%;}


/* Header */
#header{border-bottom:1px solid rgba(255,255,255,0.3); position:relative; background:#fff; z-index:99999;}
#header .logo a{position:relative; padding:20px 0;}
#header .logo a img { max-height:40px;}
#header .gnb{margin-right:45px;}
#header .gnb .menuDepth1{position:relative;}
#header .gnb .menuDepth1 > a{height:80px; line-height:80px; color:#222; position:relative; font-size:18px; font-weight:500; padding:0 45px;}
#header .gnb .menuDepth1:hover > a:after{position:absolute; content:""; width:5px; height:5px; background:var(--main-color); border-radius:50%; top:26px; margin-left:5px;}
#header .gnb .ulDepth2{display:none; text-align:center; font-size:0; background:var(--main-color); position:absolute; left:50%; top:100%; margin-top:1px; width:186px; padding:0.75rem 0; transform:translateX(-50%);}
#header .gnb .menuDepth2{position:relative; vertical-align:top;}
#header .gnb .menuDepth2 > a{font-size:16px; color:#ffffffdb; padding:8px 0;}
#header .gnb .menuDepth2.on > a{color:#fff;}

#header #m_gnb{position:absolute; right:50%; margin-right:-761px; top:50%; transform:translateY(-50%); z-index:999999;}
#header #m_gnb a{width:40px; height:40px; position:relative;}
#header #m_gnb a:before{position:absolute; content:""; width:18px; height:2px; background:#222; top:50%; margin-top:-7px; left:50%; margin-left:-9px; transition:all .2s;}
#header #m_gnb a:after{position:absolute; content:""; width:18px; height:2px; background:#222; top:50%; margin-top:5px; left:50%; margin-left:-9px; transition:all .2s;}
#header #m_gnb a span{display:block; position:absolute; width:18px; height:2px; background:#222; top:50%; margin-top:-1px; right:50%; margin-right:-9px; transition:all .2s;}
#header #m_gnb.on{right:20px; margin-right:0; border:1px solid rgba(255,255,255,0.2);}
#header #m_gnb.on a:before{top:50%; margin-top:-1px; transform:rotate(45deg); background:#fff;}
#header #m_gnb.on a:after{top:50%; margin-top:-1px; transform:rotate(-45deg); background:#fff;}
#header #m_gnb.on a span{width:0; opacity:0; background:#fff;}

/* Header - mGnb */
#header #m_bg{display:none; position:fixed; left:0; top:0; width:100%; height:100%; z-index:999997; overflow:hidden; background:rgba(0,0,0,0.5);}
#header #mGnb{position:fixed; z-index:999998; right:-300px; top:0; width:300px; height:100%; overflow:hidden; background:var(--main-color); padding-top:80px;}
#header .mGnb{height:100%; overflow-x:hidden; overflow-y:auto;}
#header .mGnb .menuDepth1{border-bottom:1px solid rgba(255,255,255,0.2);}
#header .mGnb .menuDepth1 > a{text-align:center; padding:0.75em 2%; font-size:18px; color:#fff;}
#header .mGnb .ulDepth2{display:none;}
#header .mGnb .menuDepth2 > a{text-align:center; padding:0.5em 2%; background:var(--main-color); color:#ffffffdb;}
#header .mGnb .menuDepth2.on > a{color:#fff;}

/*lang*/

.lang-wrap {
    position: relative;
    z-index: 9999999;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    margin-top: 17px;
    margin-right: 50px;
    /* background: #101532; */
    cursor: pointer;
    z-index: 99999;
  }
  .lang-wrap .lang-icon {
    position: relative;
    z-index: 1;
  }
  .lang-wrap ul.lang-list {
    display: none;
    position: absolute;
    top: 0;
    /* right: 9px; */
    padding: 11px 13px;
    padding-top: 42px;
    background: #ffffff;
    border-radius: 50px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    /* transform: translateX(-50%); */
  }
  .lang-wrap ul.lang-list li {
    margin-top: 10px;
    width:22px;
  }
  .lang-wrap ul.lang-list li a {
    text-align: center;
    display: block;
    line-height: 1;
  }

/* Footer */
#footer{background:#202020; padding:50px 0 60px;}
#footer .footer_logo{margin-bottom:30px;}
#footer .footer_logo img { opacity: .5;}
#footer .footer_info address span{color:#fff; display:inline-block; position:relative; padding:0 16px;}
#footer .footer_info address span b{font-weight:600;}
#footer .footer_info address span:after {
     content: "";
     width: 1px;
    height: 15px; 
    background: #666;
    display: inline-block;
}
 #footer .footer_info .copyright{color:#666; font-size:14px; }

.footer_bot {
    display: flex;
    margin: 0 auto;
    max-width: 1500px;
    align-items: flex-start;
    justify-content: flex-start;
    gap:6rem
}
.footer_info {
    text-align: left;
    color:#ddd;
}

.footer_info p {
    line-height: 1.8;
    font-size: 1.125rem;
}
/* CAservice */
#CAservice{position:fixed; right:3%; bottom:5%; z-index:9; /*overflow:hidden; width:68px; height:68px;*/ border-radius:34px; box-shadow:0 0 24px rgba(0,0,0,0.2);}
#CAservice button{display:block; cursor:pointer; position:relative; right:0; top:0; z-index:2; width:68px; height:68px; border-radius:34px; overflow:hidden;}
#CAservice button img{position:absolute; left:0; top:0; width:100%;}
#CAservice button:after{position:absolute; content:""; left:0; top:0; width:100%; height:100%; border-radius:100%; background:#fff; opacity:0; transition:all .2s;}
#CAservice button:hover:after{opacity:0.2;}
#CAservice div{position:absolute; z-index:1; height:68px; right:34px; left:34px; border-radius:34px 0 0 34px; top:0; background:#fff; overflow:hidden; white-space:nowrap; box-shadow:0 0 24px rgba(0,0,0,0.2);}
#CAservice div span{display:block; font-size:16px; font-weight:700; line-height:1; padding:13px 0 6px; padding-left:34px;}
#CAservice div strong{display:block; font-size:20px; font-weight:700; color:var(--main-color); line-height:1; padding-left:34px;}
#CAservice.main{}
#CAservice.main div{left:-200px;}
#CAservice.main button{pointer-events:none;}

/* toTop */
#toTop{position:fixed; right:3%; bottom:5%; margin-bottom:80px; z-index:9; border-radius:34px; box-shadow:0 0 24px rgba(0,0,0,0.2); background:#fff;}
#toTop button{display:block; cursor:pointer; position:relative; right:0; top:0; z-index:2; width:68px; height:68px; border-radius:34px; overflow:hidden; background:var(--main-color) linear-gradient(-45deg, var(--main-color), var(--main-color)); color:#fff; font-size:18px; font-weight:600; transition:all .2s;}
#toTop button:hover{opacity:0.8;}

/* 문의하기 퀵메뉴 */
@font-face {
   font-family: 'Oagothic';
   src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2302@1.0/OAGothic-ExtraBold.woff2') format('woff2');
   font-weight: 800;
   font-display: swap;
}
.quick-btn a {position: fixed; right: 2rem; bottom: 2rem; background: #0066cc; font-family: 'Oagothic'; color: #fff; font-size: 1.5rem; padding: 1rem 1.5rem 1.125rem; border-radius: 0.75rem; line-height: 1; border: 2px solid #2f528f; transition: 0.2s all linear;}
/* .quick-btn a:hover {background: #2f528f; transition: 0.2s all linear;} */




/********************************** 반응형 *************************************/

@media(max-width:1595px){
	#header #m_gnb{right:3%; margin-right:0;}
}

@media(max-width:1200px){
	#header .gnb{display:none;}

	#footer .footer_logo{max-width:60%; margin:0 auto 30px;}
	#footer .footer_info{width:100%; margin-top:1.5em;}
}

@media(max-width:1024px){
}

@media(max-width:640px){
	body,
	.inline-justify > *{font-size:15px;}

	#header .logo a{padding:20px 0;}
	#header .logo img{width:120px;}
	#header .logo img:last-child{top:20px;}

  }

@media(max-width:480px){

   /* .quick-btn a {right: 1.5rem; bottom: 1.5rem; width: 60px; height: 60px; background-size: 26px;} */
   .quick-btn a {right: 1.5rem; bottom: 1.5rem; font-size: 1.125rem; padding: 0.75rem 1rem 0.75rem;}
   
}

@media(max-width:420px){
	body,
	.inline-justify > *{font-size:14px;}

  	#footer .familySite button{width:180px; font-size:15px;}
}