@charset "utf-8";
@import url('./main.css');
@import url('./sub.css');
/*@import url('./board.css');*/


@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Noto+Sans:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://webfontworld.github.io/score/SCoreDream.css');
@import url('https://webfontworld.github.io/gmarket/GmarketSans.css');



/*common*/
* {margin:0; padding:0;}

html {font-size:62.5%;}
/*html, body {overflow-x:hidden;}*/
body {min-width:340px;}

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 {font-family:'Noto Sans KR', sans-serif;}

a {display:block; color:#000; text-decoration:none; }
img {vertical-align:middle;}

ul, ol {list-style:none}

table {border-collapse:collapse; border-spacing:0;}
table caption {width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}

/*wrap*/
#wrap {position:relative; width:100%; background:#fff;}

/*header*/
#header {position:fixed; overflow:hidden; top:0; left:0; z-index:9999; width:100%; min-width:1280px; height:200px; background:#fff; transition:all 0.2s;}
#header .header_in {position:relative; width:100%; transition:all 0.2s;}

#header.open {height:530px; border-bottom:1px solid #d7d7d7;}

.top_wrap .t_left {display: flex; gap: 20px;}
.top_wrap {position:relative; width:1280px; height:140px; margin: 0 auto; font-size:0; display: flex; align-items: center;}
.top_wrap > div {display:inline-block; position:absolute; padding-top:20px;}
.top_wrap .t_logo {background: url(../images/main-logo.png) no-repeat; width: 300px; height: 120px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.top_wrap .t_right {margin-left:960px; display: flex;}
.top_wrap .t_right div {display:inline-block; height:60px;}
.top_wrap .t_right img {margin:-15px 10px 0 15px;}
.top_wrap .t_right p {display:inline-block; font-family:'SCoreDream', sans-serif; line-height:50px;}
.top_wrap .t_phone {background: url(../images/logo-04.png) no-repeat; width:240px; height: 60px; padding-right: 20px;}
.top_wrap .t_tel {background: url(../images/m04-01.png) no-repeat; width:60px; height: 60px;}
.top_wrap .t_tel p {color:#feffd0; font-size:2.2rem; font-weight:800;}
.top_wrap .t_tel p span {font-size:1.8rem;}
.top_wrap .t_place {background: url(../images/m04-02.png) no-repeat; width: 60px; height: 60px;}
.top_wrap .t_place p {color:#fff; font-size:2rem; font-weight:600;}
.top_wrap .t_kakao {background: url(../images/m04-03.png) no-repeat; width: 60px; height: 60px;}

.top_wrap .t_blog {background: url(../images/logo-04.png) no-repeat; width:240px; height: 60px;}

.top_nav {position:relative; width:100%; background:#5c84d3; text-align:center;}
.top_nav .gnb {position:relative; width:1230px; margin:auto; font-size:0;}
.top_nav .gnb > div {display:inline-block; width:calc(100%/5);}
.top_nav .gnb > div > a {position:relative; color:#fff; font-size:2.1rem; font-weight:500; line-height:60px;}
.top_nav .gnb > div > a:after {display:none; position:absolute; content:''; left:50%; bottom:0; width:100%; height:5px; background:#feffd0; transform:translateX( -50% ); -webkit-transition:all .2s cubic-bezier(0.68, -0.55, 0.265, 1.55); -o-transition:all .2s cubic-bezier(0.68, -0.55, 0.265, 1.55); transition:all .2s cubic-bezier(0.68, -0.55, 0.265, 1.55);}
.top_nav .gnb .lnb {position:absolute; top:70px; width:calc(100%/5); height:320px; border-left:1px solid #ddd; padding-top:10px; transition:all 0.2s;}
.top_nav .gnb > div:last-child .lnb {border-right:1px solid #ddd;}
.top_nav .lnb > li > a {display:block; color:#000; font-size:1.9rem; font-weight:500; line-height:48px; transition:color 0.2s; letter-spacing:-0.05em;}
.top_nav .lnb_more li {text-align:left;}
.top_nav .lnb .lnb_more li a {color:#5e5e5e; font-size:1.8rem; font-weight:400; line-height:30px; padding-left:80px;}

.top_nav .gnb > div.on > a:after {display:block;}
.top_nav .lnb > li.on > a {color:#3953a8; text-decoration:underline;}
.top_nav .lnb > li.on .lnb_more li a:hover {color:#000; text-decoration:underline;}

.mobile_menubtn {display:none;}

/*container*/
#container {position:relative; width:100%; top:185px; overflow-x: hidden; }

/* 세로 이중스크롤 제거 */
#container{
    -ms-overflow-style: none;
 }
#container::-webkit-scrollbar{
   display:none;
 }

/*footer*/
#footer {position:relative; width:100%; height:120px; border-top:1px solid #e3e3e3; top:350px;}
.footer_wrap {display:flex; position:relative; width:1270px; margin:auto; justify-content: flex-start;}
.f_logo {background: url(../images/f-logo.png) no-repeat; background-size: contain; line-height:122px; width: 120px; height: 80px; margin-top: 25px;}
.f_txt {margin-left:30px; padding-top:25px;}
.f_txt p {display:inline-block; font-size:1.6rem; line-height:25px; font-weight:300; color:#000; white-space: nowrap; text-transform: uppercase;}
.f_txt p:last-child {display:block; margin-right:0;}
#footer .link {position: absolute; top: 60px; left: 47%; width: 90px; height: 40px;}

/*quick_menu*/
.quick_menu {display:none;}



#header.active {height:100%; transition:1s ease;}

.top_nav.active {display:block;}
.top_nav.active  .lnb {display:block;}

.mobile_menubtn.active span:nth-child(1) {transform:rotate(40deg); transition:1s ease;}
.mobile_menubtn.active span:nth-child(2) {display:none; transition:1s ease;}
.mobile_menubtn.active span:nth-child(3) {transform:rotate(-40deg); transition:1s ease;}






@media (max-width: 1279px){
/*header*/
#header {min-width:768px; height:60px; box-shadow:0 0 10px rgba(0,0,0,0.1);}

#header.open {height:100%; border-bottom:0;}
#header.open .header_in {height:100%;}
#header.open .top_nav {margin-top:0;}

.top_wrap {height:60px; width: 100%; background: #003065;}
.top_wrap > div {padding-top:0;}
.top_wrap .t_logo {line-height:93px; margin-left:-15px; background: url(../images/main-logo-768.png) no-repeat center;}
.top_wrap .t_left {display: none;}
.top_wrap .t_right {position: absolute; top: 10px; right: 15px; margin-left: 0;}
.top_wrap .t_right div {height: 35px; width: 35px;} 
.top_wrap .t_blog {background: url(../images/logo-768.png) no-repeat center;}

.top_nav {margin-top:1px; height:100%; background:#3953a8;}
.top_nav .gnb {position:relative; width:100%;}
.top_nav .gnb > div {display:block; width:100%;}
.top_nav .gnb > div > a {display:inline-block; color:#fff; font-size:2.5rem; line-height:70px;}
.top_nav .gnb > div.on .lnb {display:block;}
.top_nav .gnb > div > a:after {display:block; position:absolute; content:''; left:50%; bottom:0; width:0%; height:5px; background:#feffd0;}
.top_nav .gnb .lnb {display:none; position:relative; top:unset; width:100%; height:unset; border-left:0;}
.top_nav .gnb > div:last-child .lnb {border-right:0;}
.top_nav .lnb li a {display:block; color:#fff; opacity:0.6;}
.top_nav .lnb_more li {text-align:center;}
.top_nav .lnb .lnb_more li a {color:#fff; opacity:0.6; padding-left:0;}

.top_nav .gnb > div.on .lnb.on a:hover {color:#fff; text-decoration:underline;}
.top_nav .gnb > div.on > a:after {width:100%; border-radius:5px;}
.top_nav .lnb > li.on > a {color:#fff; opacity:0.8;}
.top_nav .lnb > li.on a:after {width:100%;}
.top_nav .lnb > li.on .lnb_more li a:hover {color:#fff; opacity:0.8; text-decoration:unset;}

.mobile_menubtn {display:block; position:absolute; top:5px; left: 15px; width:35px; height:35px; cursor:pointer;}
.mobile_menubtn span {display:block; width:25px; height:2px; background:#fff; border-radius:0; margin:0 auto 8px; transition:all 0.2s;}
.mobile_menubtn span:first-child {margin-top:14px;}
.mobile_menubtn span:nth-child(2) {width: 18px; margin-left: 5px;}
.mobile_menubtn span:last-child {margin-bottom:0;}
#menu.open span {width:25px;}
#menu.open span:nth-child(1) {transform:rotate(45deg); margin:27px 0 0 9px;}
#menu.open span:nth-child(2) {display:none;}
#menu.open span:nth-child(3) {transform:rotate(-45deg); margin:-3px 0 0 9px;}

/*container*/
#container {top: -84px;}

/*footer*/
#footer {height: 140px; top:-40px; }
.footer_wrap {display:block; width:530px; margin-bottom:20px;}
.f_logo {line-height:80px; text-align:center; background: url(../images/f-logo-768.png) no-repeat center; width: 220px; height: 50px; margin: 10px auto;}
.f_logo img {width:140px;}
.f_txt {margin-left:0; padding-top:0; text-align:center;}
.f_txt p {font-size:1.6rem; line-height:22px; margin-right:15px; white-space: normal; }
#footer .link {top: 10px; left: 75%;}

}





@media (max-width: 767px){
/*header*/
#header {min-width:auto; height:60px;}

.top_wrap {height:60px;}
.top_wrap > div {padding-top:6px;}
.top_wrap .t_logo {background: url(../images/main-logo-340.png) no-repeat center; width:190px; height: 40px; line-height:54px; margin-left:0;}
.top_wrap .t_logo img {width:100%;}
.top_wrap .t_right {top: 14%; right: 10px;}
.top_wrap .t_right div {height: 30px; width: 30px;}

.top_nav .gnb {padding-top:20px;}
.top_nav .gnb > div > a {font-size:2.1rem; line-height:60px;}
.top_nav .lnb li a {font-size:1.8rem; line-height:30px;}
.top_nav .lnb .lnb_more li a {font-size:1.6rem; line-height:30px;}

.top_nav .gnb > div.on .lnb.on a:hover {color:#fff; text-decoration:underline;}
.top_nav .gnb > div.on > a:after {width:100%;}
.top_nav .lnb > li.on > a {color:#fff; opacity:0.8;}
.top_nav .lnb > li.on a:after {width:100%;}
.top_nav .lnb > li.on .lnb_more li a:hover {color:#fff; opacity:0.8; text-decoration:unset;}

.mobile_menubtn {top:12px; left: 10px; width:25px; height:25px;}
.mobile_menubtn span {width:23px; margin:6px auto 5px;}
.mobile_menubtn span:first-child {margin-top:9px;}
.mobile_menubtn span:nth-child(2) {margin-left: 1px;}

#menu.open span {width:32px;}
#menu.open span:nth-child(1) {transform:rotate(45deg); margin:17px 0 0 8px;}
#menu.open span:nth-child(3) {transform:rotate(-45deg); margin:-3px 0 0 8px;}

/*container*/
#container {top:45px;}

/*footer*/
#footer {top:60px; height: 270px;}
.footer_wrap {width:337px; margin-bottom:30px;}
.f_logo {line-height:60px; margin: 5px auto;}
.f_logo img {width:112px;}
.f_txt {margin-left:0; padding-top:0;}
.f_txt p {display:block; margin-right:0; font-size:1.5rem; line-height:18px; margin-right:0; word-break: auto-phrase; word-spacing: 1.5px;}
.f_txt p:last-child {font-size: 1.45rem; word-break: break-all;}
#footer .link {top: 146px; left: 69%;}
#footer .link img {width: 70px; height: 30px;}


/* quick_menu */
.quick_menu {display:block; position:fixed; bottom:0; width:100%; height:90px; transition:all 0.2s; background:#fff; z-index:999;}
.quick_menu .quick_wrap {padding:10px 5px 0;}
.quick_menu ul {display:flex; border-top:3px solid #637ac3; font-size:0; justify-content:center;} 
.quick_menu ul li {display:inline-block; width:110px; height:77px;} 
.quick_menu ul li a {font-size:1.2rem; font-family:'SCoreDream', sans-serif; line-height:12px; text-align:center; font-weight:400; color:#404040;}
.quick_menu .icon {height:35px; line-height:35px; margin:11px auto 9px;}

}