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

@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');



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

/*html, body {overflow-x:hidden;}*/
html {font-size:62.5%; scroll-behavior: smooth;}
body {background:#fff; overflow-x: hidden;}
body::-webkit-scrollbar-thumb {height:15%;}


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, input , button ,textarea ,input{font-family: "Nanum Gothic", serif;}
p{font-weight: 400;}


.f-info p{font-family: "Noto Sans", serif;}
.f-info .f-txt li{font-family: "Noto Sans", serif;}

.subPage h3.sub-tit ,
.about-cont.about03 .management-li li h4{font-family: "Futura Hv BT Heavy"; font-weight: 700;}
                                                





img {vertical-align:middle; object-fit:contain;}
a {font-size:1.5rem; display:block; color:#000; text-decoration:none;}
p {font-size:1.5rem; color:#444; font-weight:400; word-break:keep-all;}
h1, h2, h3, h4, h5, h6{font-size:100%; margin:0; padding:0;}

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%; text-align:center; min-width:320px;}
.inwrap {width:1360px; margin:auto;}


/*container*/
#container {position:relative; width:100%;}

/*header*/
#header {position:fixed; width:100%; top: 0; left:0; z-index: 9999; transition: all 0.5s ease; background:#fff;}
#header .navigation .inwrap{width: 1360px; height: 120px; display: flex; align-items: center; justify-content: flex-end;  position: relative; }
#header .navigation .logo{position: absolute; left: 50%; transform: translateX(-50%);  width: 382px; height: 43px;}
#header .navigation .logo a{width: 100%; height: 100%; background: url(../images/logo.png) no-repeat center; background-size: contain; text-indent: -9999px;}
#header .navigation .pc-li{display: flex; gap: 50px; position: relative;}
#header .navigation .pc-li li::after{display: block; content: ''; width: 0; height: 1px; background: #000; margin-top: 2px;}
#header .navigation .pc-li li:hover::after{width: 100%; transition: all 0.5s}
#header .navigation .menu-btn{display: none; flex-wrap: wrap; width: 30px; height: 30px; justify-content: space-between; row-gap: 4px;}
#header .navigation .menu-btn span{display: block; width: 13px; height: 13px; background: #3b3630;}

.mobile-menu{ display: block; background-color: #fff; position: fixed; z-index: 10; top: 0; right: -375px; width: 0; height: 100%; overflow-y: auto;
	transition: all 0.4s ease;}

/*footer*/
#footer{position:relative; width:100%; background:#ffffff;  border-top: 1px solid #d6d6d6;}
.main-footer{top: 120px;}
#footer .inwrap {width: 1360px; margin:auto; padding: 40px 0; text-align:left; box-sizing: border-box;}
.txt-wrap{display: flex; gap: 40px; align-items: center;}
.f-info p{font-size: 1.6rem; font-weight: 500; line-height: 16px; margin-bottom: 8px; color: #444444;}
.f-info .f-txt{display: flex; justify-content: left;  width: 100%; flex-wrap: wrap; gap: 25px; row-gap: 5px;}
.f-info .f-txt li {font-size:1.42rem; letter-spacing:0.02em;  line-height: 24px; font-weight: 300;}







/* 1025px 이상 해상도 데스크탑  */
@media (max-width: 1499px) {


 /*inwrap*/
 .inwrap{width: 94%;}

 #header{padding: 0;  background: #fff;}
 #header .inwrap{width: 94% !important; justify-content: space-between;}
 #header .gnb{position: unset; right: 0; transform: unset; width: 600px;}
 #header .gnb a{font-size: 1.8rem;}

 #footer .inwrap {width: 94%; margin: 0 auto;}




}



/* 태블릿, 아이패드(세로)  */
@media (max-width: 1279px) {
	#header .navigation .inwrap{height: 100px;}
	#header .navigation .logo{width: 250px; height: 38px;}
	#header .gnb{width: 550px;}

	#header .gnb a{font-size: 1.7rem;}

	.f-info p,
	.f-info .f-txt li{font-size: 1.5rem;}



  

}


@media (max-width: 1024px){

     p{font-size: 1.4rem;}
     #header{height: 100px; }
     #header .gnb{display: none;}
     #header .navigation .inwrap{ justify-content: space-between;}
     #header .navigation .logo{position: unset; transform: unset;}
	 #header .navigation .pc-li{gap: 30px;}
	 
	 .main-footer{top: 100px;}

	 
     
}

@media (max-width: 767px){
	#header{height: 80px;}
	#header .navigation .inwrap{height: 80px;}
	#header .navigation .pc-li{display: none;}
	#header .navigation .menu-btn{display: flex; flex-wrap: wrap; width: 20px; height: 20px; cursor: pointer;}
	#header .navigation .menu-btn span{width: 8px; height: 8px;}

	.mobile-menu.active{right: 0; width: 100%;}

	.mobile-menu .mobile-top{height: 80px;}
	.mobile-menu .mobile-top .inwrap{display: flex; height: 80px; align-items: center;}
	.mobile-menu .mobile-top .h-logo{width: 180px; height: 20px;}
	.mobile-menu .mobile-top .h-logo a{width: 100%; height: 100%; background: url(../images/logo.png) no-repeat center; background-size: contain; text-indent: -9999px;}
	.mobile-menu .mobile-top .mobile-close{cursor: pointer;}
	.mobile-menu .mobile-top .mobile-close span{display: block; width: 25px; height: 2px; background: #3b3630; }
	.mobile-menu .mobile-top .mobile-close span:nth-child(1){transform: rotate(-45deg);}
	.mobile-menu .mobile-top .mobile-close span:nth-child(2){transform: rotate(45deg); position: relative; top: -2px;}
	.mobile-menu .mobile-area .title{width: 100%; }
	.mobile-menu .mobile-area .title li{width: 100%;}
	.mobile-menu .mobile-area .title a{font-size: 1.5rem; line-height: 55px;}

	.txt-wrap{gap: 30px;}
	.txt-wrap .f-logo img{width: 100px;}
}


@media (max-width: 480px){

	#header .navigation .logo{width: 180px; height: 20px;}

	.txt-wrap{display: block;}
	.txt-wrap .f-logo{margin-bottom: 18px; text-align: center;}
	.f-info p{display: none;}
	.f-info .f-txt{justify-content: center; row-gap: 0;}
	.f-info p, .f-info .f-txt li{text-align: center; font-size: 1.4rem;}
	
}

@media (max-width: 410px){

}