@charset "utf-8";
@import url('reset.css');
@import url('content.css?v=1.2');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

body {overflow-x:hidden;}

/* common */
#hd {position:fixed; left:0; top:0; width:100%; height:90px; background:#fff;  z-index:10;}
#hd .hd-container {position:relative; width:96%; max-width:1200px;  margin:0 auto;}
.logo {position:absolute; left:0; top:25px; width:220px;}
.logo img {width:100%;}
.hd-util {position:absolute; display: flex; right:0; top:30px; z-index:10;}
.hd-util li {margin-left:25px;}
.hd-util a {font-size:13px; color:#888;}
.hd-util a i {color:#0055b8; vertical-align:middle;}
.hamburger {display:fixed; flex-direction:column; width:20px; cursor:pointer; margin-top:5px;}
.hamburger span {display:block; background:#0055b8; height:2px; margin-bottom:4px;}

@media (max-width:1240px){
	#hd {height:80px;}
	.logo {top:25px; width:180px;}
	.hd-util {top:26px;}
	.hd-util li {margin-left:20px;}
}
@media (max-width:1024px){
	#hd {height:70px;}
	.logo {top:22px; width:170px;}
}
@media (max-width:768px){
	#hd {height:60px;}
	#hd .hd-container {width:94%;}
	.logo {top:18px; width:150px;}
	.hd-util {top:18px;}
	.hd-util li {margin-left:15px;}
}
@media (max-width:568px){
	.hd-util a i {font-size:20px;}
	.hamburger {width:18px; }
	.hamburger span {margin-bottom:3px;}
}



.gnb {display:flex; position:absolute; left:250px; top:28px;}
.gnb > li {position:relative; height:62px; line-height:30px; padding:0 30px; }
.gnb > li > a {font-size:18px; color:#000; font-family: 'GmarketSansMedium', sans-serif;}
.gnb > li > a.active {}
.depth2	{display:none; position:absolute;  left:-10%; top:62px; background:#333; width:120%; padding:25px 15px;}
.depth2 > li > a {display:block; font-size:15px; color:#fff; padding:5px 0;}
.depth2 > li > a:hover{color:#37bbff;}

@media (max-width:1240px){
	.gnb {left:200px; top:25px;}
	.gnb > li {height:52px; line-height:30px; padding:0 22px; }
	.depth2	{top:55px; padding:25px 12px;}
}
@media (max-width:1024px){
	.gnb {display:none;}
}


#responsiveMenu {background:#fff; position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000; display:none;}
#responsiveMenu .btn_menuClose {position:absolute; right:30px; top:30px; color:#000;}
#responsiveMenu .btn_menuClose i {font-size:32px;}
#responsiveMenu h2 {padding:100px 0 80px;}
.inner {max-width:1200px; width:96%; margin:0 auto;}
#d-schedule {display:grid; grid-template-columns:repeat(5, 1fr); grid-grap:15px;}
#d-schedule > li > a {font-size:24px; color:#000; font-weight:500;}
#d-schedule > li > ul {display:block;padding-top:20px;}
#d-schedule > li > ul li a {display:inline-block; padding:5px 0; color:#888;}
#d-schedule > li > ul li a:hover {color:#0055b8}

@media (max-width:1024px){
	#responsiveMenu {top:70px; }
	#responsiveMenu .btn_menuClose {right:2%; top:-47px; background:#fff;}
	#responsiveMenu .btn_menuClose i {font-size:28px;}
	#responsiveMenu h2 {display:none;}
	#d-schedule	{display: block; width:100%; margin:0 auto;}
	#d-schedule > li > a {display:block; color:#000; padding:20px 0; font-size:24px; border-bottom:1px solid #f0f0f0}
	#d-schedule > li > a.open{color:#0055b8; font-weight:500}
	#d-schedule > li > ul{display: none; padding:10px; border-bottom:1px solid #f0f0f0; background:#fafafa;}
	#d-schedule > li > ul > li > a {display:block; color:#666; padding:5px 10px; font-size:18px; line-height:130%; cursor:pointer;}
	#d-schedule > li > ul > li > a:hover{color:#000;}
}
@media (max-width:768px){
	#responsiveMenu {top:60px; }
	#responsiveMenu .btn_menuClose {right:3%; top:-44px;} 
	#d-schedule > li > a {padding:18px 0; font-size:18px;}
	#d-schedule > li > ul > li > a {padding:5px 10px; font-size:16px;}
}
@media (max-width:568px){
	#responsiveMenu .btn_menuClose {top:-42px;} 
	#responsiveMenu .btn_menuClose i {font-size:25px;}
}



#container {}
#content {max-width:1200px; width:96%; margin:0 auto;}
#content:after	{content:" "; display:block; clear:both; height:0; visibility:hidden;}/* 기타 브라우져*/
.sub-cnt {padding-top:60px;}
.sub-cnt img {max-width:100%;height:auto;}

@media (max-width:768px){
	#content {width:94%;}
	.sub-cnt {padding-top:45px;}
}
@media (max-width:568px){
	.sub-cnt {padding-top:35px;}
}



#ft {background:#eaeaea; margin-top:90px; padding:40px 0;}
#ft .ft-container {width:96%; max-width:1200px;  margin:0 auto;}
.ft-menu {display:flex; flex-wrap:wrap;}
.ft-menu li {padding-right:20px;}
.ft-menu li:first-child a {color:#153273; }
.ft-contact {display:flex; flex-wrap:wrap; margin-top:20px;}
.ft-contact span {padding-right:20px;}
.ft-copyright {color:#888; font-size:14px; padding-top:8px;}

@media (max-width:1024px){
	#ft {margin-top:9vw; padding:30px 0;}
}
@media (max-width:768px){
	#ft .ft-container {width:94%;}
	.ft-menu li {padding-right:15px;}
	.ft-menu li a {font-size:15px;}
	.ft-contact span {padding-right:15px; font-size:15px;}
	.ft-copyright {font-size:13px}
}
@media (max-width:568px){
	#ft {margin-top:12vw; padding:20px 0;}
	.ft-menu li {padding-right:10px;}
	.ft-menu li a {font-size:13px;}
	.ft-contact {margin-top:10px;}
	.ft-contact span {padding-right:10px; font-size:13px;}
}


/* main */
.mySwiper-visual {position:relative; margin-top:90px; height:610px; background-size:cover; }
.mySwiper-visual .info-con {position:absolute; left:0; top:0; display:flex; align-items:center; justify-content: center; flex-direction:column; width:100%; height:100%; z-index:2;}	
.mySwiper-visual .info-con > p {font-size:40px; color:#fff; font-family: 'GmarketSansLight', sans-serif; line-height:90%; text-shadow: 0px 0px 12px rgba(0,0,0,0.7); animation: fadeUp 1.5s .2s both;}
.mySwiper-visual .info-con > span {font-size:50px; color:#fff; margin-top:30px; font-family: 'GmarketSansBold', sans-serif; line-height:80%; text-shadow: 0px 0px 12px rgba(0,0,0,0.4); animation: fadeUp 1.5s .4s both;}

.info-con .link {display:flex; margin-top:50px;}
.info-con .link li {position:relative; width:180px; height:180px; margin:0 35px; border-radius:50%; text-align:center; background:rgba(254,189,212,0.8); }
.info-con .link li a {display:block; height:100%;}
.info-con .link li span {display:block; width:100%; font-size:24px; color:#545454; font-family: 'GmarketSansMedium', sans-serif; line-height:120%; position:absolute; top:50%; transform:translateY(-50%);}
.info-con .link li:nth-child(2) {background:rgba(244,232,178,0.8);}
.info-con .link li:nth-child(3) {background:rgba(140,199,207,0.8);}
.info-con .link li:nth-child(1) {animation: fadeUp 1.2s 1.1s both;}
.info-con .link li:nth-child(2) {animation: fadeUp 1.2s 1.2s both;}
.info-con .link li:nth-child(3) {animation: fadeUp 1.2s 1.3s both;}

@keyframes fadeUp {
	0%		{opacity:0; transform:translateY(40px);}
	100%	{opacity:1; transform:translateY(0);}
}


@media (max-width:1240px){
	.mySwiper-visual {margin-top:80px; height:52vw;}
}
@media (max-width:1024px){
	.mySwiper-visual {margin-top:70px;}
	.mySwiper-visual .info-con > p {font-size:30px;}
	.mySwiper-visual .info-con > span {font-size:40px; margin-top:25px;}
	.info-con .link {margin-top:35px;}
	.info-con .link li {width:150px; height:150px; margin:0 25px;}
	.info-con .link li span {font-size:20px;}
}
@media (max-width:768px){
	.mySwiper-visual {margin-top:60px;}
	.mySwiper-visual .info-con > p {font-size:24px;}
	.mySwiper-visual .info-con > span {font-size:30px; margin-top:20px;}
	.info-con .link {margin-top:25px;}
	.info-con .link li {width:120px; height:120px; margin:0 15px;}
	.info-con .link li span {font-size:17px;}
}
@media (max-width:568px){
	.mySwiper-visual {height:62vw;}
	.mySwiper-visual .info-con > p {font-size:17px;}
	.mySwiper-visual .info-con > span {font-size:20px; margin-top:10px;}
}
@media (max-width:480px){
	.info-con .link {margin-top:15px;}
	.info-con .link li {width:90px; height:90px; margin:0 8px;}
	.info-con .link li span {font-size:15px;}
}



.latestBox {float:left; display:flex; justify-content:space-between; width:66.66%; height:231px; padding:40px 30px; margin-top:60px; background:#fff; box-shadow:0px 0px 10px rgba(100,100,100,0.2);}
.latest-list li {position:relative;line-height:140%;padding:6px 0 6px 12px;}
.latest-list li:before{position: absolute; top:16px; left:0px; width:3px; height:3px;background: #ccc; content: '';}
.latest-list li a {display:block; color:#555; font-weight:400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right:90px;}
.latest-list li a i {color:#0055b8; font-size:16px; vertical-align:middle;}
.latest-list li span {position:absolute; right:0; top:6px; color:#888;}

#tabmenu {display:flex; flex-direction:column; width:140px; margin:0; padding:0;}
#tabmenu li a {display:block; padding:12px 0; font-size:20px; border-radius:10px 0 15px 0; color:#000; text-decoration:none; text-align:center; background:#fff; font-family: 'GmarketSansMedium', sans-serif; margin-bottom:10px;}
#tabmenu li a.over {}
#tabmenu li a.selected	{color:#fff; background:#153273;}
#tabcontents {position:relative; width:calc(100% - 180px); }
#tabcontents .tabcontent{}

@media (max-width:1024px){
	.latestBox {width:66.66%; height:211px; padding:30px 20px; margin-top:50px;}

	#tabmenu {width:120px;}
	#tabmenu li a {padding:10px 0; font-size:18px; margin-bottom:8px;}
	#tabcontents {width:calc(100% - 150px); }
}
@media (max-width:768px){
	.latestBox {float:none; width:100%; height:211px; padding:30px 20px; margin-top:40px;}
	.latest-list li a {font-size:15px; padding-right:80px;}
	.latest-list li span {font-size:15px;}
}
@media (max-width:568px){
	.latestBox {height:191px; padding:20px 15px; margin-top:30px;}
	.latest-list li a {font-size:14px; padding-right:80px;}
	.latest-list li span {font-size:14px;}

	#tabmenu {width:100px;}
	#tabmenu li a {padding:8px 0 5px; font-size:16px;}
	#tabcontents {width:calc(100% - 130px); }
}
@media (max-width:488px){
	.latest-list li a {padding-right:0;}
	.latest-list li span {display:none;}

}



.goingBox {float:right; width:30.83%; height:231px; padding:40px 30px; margin-top:60px; background:#fff; box-shadow:0px 0px 10px rgba(100,100,100,0.2);}
.goingBox h3 {font-size:20px; color:#000; font-family: 'GmarketSansMedium', sans-serif; margin-bottom:10px;}
.goingBox .latest-survey {background:#f5f5f5; padding:15px; height:120px;}
.goingBox .latest-survey p {font-size:14px; color:#0055b8; font-weight:500;}
.goingBox .latest-survey h4 {padding-top:10px;font-size:18px; color:#000; font-weight:500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.goingBox .latest-survey .date {padding-top:20px; font-size:14px; color:#555; }

@media (max-width:1024px){
	.goingBox {width:30.83%; height:211px; padding:30px 20px; margin-top:50px;}
	.goingBox h3 {font-size:18px; margin-bottom:10px;}
	.goingBox .latest-survey {padding:15px; height:120px;}
	.goingBox .latest-survey h4 {padding-top:10px; font-size:17px;}
}
@media (max-width:768px){
	.goingBox {float:none; width:100%; margin-top:20px;}
	.goingBox h3 {font-size:18px; margin-bottom:10px;}
	.goingBox .latest-survey h4 {font-size:16px;}
}
@media (max-width:568px){
	.goingBox {height:191px; padding:20px 15px}
	.goingBox h3 {font-size:16px; }
}





/***** SUB VISUAL *****/
#sVisual {/*position:relative;*/ height:350px; width:100%; margin-top:90px;} 
.sv1 {background:url('/images/sVisual_01.jpg') no-repeat center 0; }
.sv2 {background:url('/images/sVisual_02.jpg') no-repeat center 0; }
.sv3 {background:url('/images/sVisual_03.jpg') no-repeat center 0; }
.sv4 {background:url('/images/sVisual_04.jpg') no-repeat center 0; }
.sv5 {background:url('/images/sVisual_05.jpg') no-repeat center 0; }
.sv_other {height:200px !important; background:#8ebfd8; }
.sv_other #sub_title h2 {padding-top:70px;}

#sub_title h2{text-align:center; color:#fff; font-size:36px; padding-top:120px; line-height:100%; font-family: 'GmarketSansBold', sans-serif; }
#sub_title p {text-align:center; color:#fff; font-size:15px; padding-top:15px; font-family: 'GmarketSansLight', sans-serif; text-transform:uppercase;}


@media (max-width:1024px){
	#sVisual {height:300px; background-size:cover; margin-top:70px;}
	#sub_title h2 {font-size:30px; padding-top:100px; }
	#sub_title p {font-size:13px; padding-top:10px;}
}

@media (max-width:768px){
	#sVisual {height:250px; margin-top:60px;}
	#sub_title h2 {font-size:24px; padding-top:70px;}

	.sv_other {height:140px !important;}
	.sv_other #sub_title h2 {padding-top:50px;}
}
@media (max-width:568px){
	#sVisual {height:180px; }
	#sub_title h2 {font-size:22px;}
	#sub_title p {font-size:12px; padding-top:5px;}

	.sv_other {height:120px !important;}
	.sv_other #sub_title h2 {padding-top:40px;}
}



/***** SUB MENU *****/
.snb {position:relative; display:flex; margin:0 auto; background:rgba(255,255,255,0.8); width:100%; max-width:1200px; z-index:5; bottom:-101px;}
.snb > div {display:flex;}

.snb .home {width:60px; height:60px; text-align:center; background:#153273;}
.snb .home i {color:#fff; line-height:60px;}
.dropdown, .dropdown2 {position: relative;}
.dropdown .dropbtn {width:290px; height:60px; color:#000; background:none; padding:0 20px; font-size:18px; border: none; border-right:1px solid #e4e4e4; cursor: pointer; text-align:left; letter-spacing:-0.05em; outline:none; font-weight:500;}
.dropdown2 .dropbtn {width:290px; height:60px; color:#000; background:none; padding:0 20px; font-size:18px; border: none; border-right:1px solid #e4e4e4; cursor: pointer; text-align:left; letter-spacing:-0.05em;  outline:none; font-weight:500;}
.dropbtn i {position:absolute; right:15px; top:20px; color:#888;}
.dropdown-content	 {display: none; position: absolute; left:-1px; top:60px; background-color:#fff; border:1px solid #ddd; border-top:none; border-bottom:none; width:291px; overflow: auto;  z-index: 100;}
.dropdown-content a {color:#888; padding:10px 12px; text-decoration: none; display: block; font-size:15px; border-bottom:1px solid #e8e8e8;}
.dropdown-content a:hover {color:#111; background:#f8f8f8;}
.show {display:block;}

.sub-title {font-size:32px; margin-bottom:60px; color:#000; font-weight:500; text-align:center;}
.sub-title2 {font-size:36px; margin-bottom:60px; color:#000; font-weight:600; text-align:center; background:#eee; border-radius:10px;  padding:15px;}


@media (max-width:1024px){
	.snb {bottom:-90px;}
	.snb .home	 {width:55px; height:55px;}
	.dropdown .dropbtn,
	.dropdown2 .dropbtn {width:250px; height:55px; padding:0 15px;  font-size:16px;}
	.dropbtn i {right:10px; top:17px; color:#888;}
	.dropdown-content {left:-1px; top:54px; width:251px;}
}
@media (max-width:768px){
	.snb {bottom:-80px;}
	.snb .home i {line-height:50px;}
	.snb .home	 {width:50px; height:50px;}
	.dropdown .dropbtn,
	.dropdown2 .dropbtn {width:240px; height:50px; padding:0 12px;  font-size:15px;}
	.dropdown-content {left:-1px; top:49px; width:241px;}

	.sub-title {font-size:28px; margin-bottom:45px;}
}
@media (max-width:568px){
	.snb {display:none;}
	.sub-title {font-size:24px; margin-bottom:30px;}
}
@media (max-width:375px){
	.sub-title {font-size:20px; margin-bottom:25px;}
}



/* POPUP */
.layerpop {display: none; z-index: 1000; border: 1px solid #ccc; background: #fff; }
.layerpop_area .title {padding: 10px 10px 10px 10px; border: 0px solid #aaaaaa; background: #f1f1f1; color: #0055b8; font-size: 1em; font-weight: bold; line-height: 14px; cursor: move; }
.layerpop_area .layerpop_close {width: 15px; height: 15px;  display: block; position: absolute; top: 5px; right: 15px; background: transparent no-repeat; }
.layerpop_area .layerpop_nevershow {width: 104px; height: 50px;  display: block; position: absolute; top: 12px; right: 40px; background: transparent no-repeat; }
.layerpop_area .content img {width:100%}
