@charset "utf-8";
#sub {margin-top:110px;}
#subVisual {height:400px;background-color:#000;background-image:url('../img/sub/sub01Bg.jpg');background-size:cover;border-radius: 50px 0 0 0;margin-left:100px; width:calc(100vw - 100px); position:relative;}
#subVisual h2 {position:relative; padding-top:175px; font-size:48px; color:#fff; text-align:center; font-weight:400;}
#subVisual.sub01 {background-image:url('../img/sub/sub01Bg.jpg');}
#subVisual.sub02 {background-image:url('../img/sub/sub02Bg.jpg');}
#subVisual.sub03 {background-image:url('../img/sub/sub03Bg.jpg');}
#subVisual.sub04 {background-image:url('../img/sub/sub04Bg.jpg');}
#subVisual.sub05 {background-image:url('../img/sub/sub05Bg.jpg');}
#subVisual.sub06 {background-image:url('../img/sub/sub06Bg.jpg');}

/*scroll icon */
@-webkit-keyframes scroll {
	0% {-webkit-transform:translateY(-10px);}
	100% {-webkit-transform:translateY(139px);}
}
@keyframes scroll {
	0% {-webkit-transform:translateY(-10px);}
	100% {-webkit-transform:translateY(139px);}
}
.scrollDown {position:absolute;left: -50px;bottom: 0;text-align:center;z-index:99;}
.scrollDown a {color:#999; font-size:18px;}
.scrollDown a span {font-weight:400; transform:translate(-50%, -100%) rotate(-90deg); display:block; margin-bottom:30px;}
.scrollDown a em {display:block; background:#999; width:1px; height:150px; position:relative;}
.scrollDown a em:before {display:block; position:absolute; content:''; width:11px; height:11px; background:#0078FF; border-radius:50%; top:0; left:-5px;}
.scrollDown a em:before {display:block; animation:scroll 2s infinite;}

	@media screen and (max-width:1419px){
		#sub {margin-top:80px;}
		#subVisual {width:calc(100% - 80px); margin-left:80px;}
		.scrollDown {left:-40px;}
	}

	@media screen and (max-width:999px){
		#subVisual {height:350px; width:97%; margin-left:3%;}
		.scrollDown {display:none;}
	}

	@media screen and (max-width:799px){
		#subVisual {height:250px;}
	}

	@media screen and (max-width:599px){
		#sub {margin-top:60px;}
	}



#subTabBox {width:calc(100% - 100px);height:85px;border-bottom:1px solid #ddd;margin-left:100px;padding-right:100px; overflow:hidden;}
#subTabBox .subTab {display: flex;text-align:center;padding:0; align-items: center;height: 100%;}
#subTabBox .subTab li {position:relative;width:auto;height: auto;}
#subTabBox .subTab li:not(:first-child):before {position:absolute;display:block;content:'·';left: -1px;}
#subTabBox .subTab li a {display:block;color: #000;font-weight: 400;font-size: 18px;letter-spacing:-0.02em;position:relative; margin:0 25px;}
#subTabBox .subTab li a:before {position:absolute;content:'';display:block;width:100%;height:2px;background:transparent;left:0;bottom: -31px;}
#subTabBox .subTab li a.on {color: #0078FF;}
#subTabBox .subTab li a.on:before {background: #0078FF;}

	@media screen and (max-width:1419px){
		#subTabBox {width:calc(100% - 80px);margin-left: 80px;height: 70px;padding: 0;}
		#subTabBox .subTab li {}
		#subTabBox .subTab li a {margin:0 15px;}
		#subTabBox .subTab li a:before {bottom: -24px;}
	}

	@media screen and (max-width: 999px){
		#subTabBox {padding:0; margin-left: 3%; width:97%;}
		#subTabBox .subTab {/*overflow-x: scroll; */width:100%;}
		#subTabBox .subTab::-webkit-scrollbar {display:none;}
		#subTabBox .subTab li {flex-shrink:0;}
		#subTabBox .subTab li a {font-size: 17px;white-space: nowrap;}
	}

	@media screen and (max-width:599px){
		#subTabBox {height:60px;}
		#subTabBox .subTab li {}
		#subTabBox .subTab li a {font-size:16px;}
		#subTabBox .subTab li a:before {bottom: -20px;}
	}


#subContent {margin:90px 0 0; }
#subContent .subContTit {text-align:center;}
#subContent .subContTit p.contentSubTit {text-transform:uppercase;color:#0078FF;font-family:'Montserrat', 'Pretendard', sans-serif;font-weight:600;font-size:16px;letter-spacing:-.5px;word-break: keep-all;}
#subContent .subContTit h3#contentTitle {position:relative;font-size:40px;font-weight:500;letter-spacing:-0.02em;text-align:center;margin: 20px auto 70px;display:inline-block;word-break: keep-all;}
#subContent .subContTit h3#contentTitle:after {position:absolute; width:14px; height:14px; background:url('../img/sub/icon_tit.png'); background-size:contain; content:''; }

#subContent .contentWrap {}

	@media screen and (max-width:1419px){
		
	}

	@media screen and (max-width:999px){
		#subContent {margin:60px 0 0;}
		#subContent .subContTit h3#contentTitle {font-size:34px;margin: 15px auto 50px;}
	}

	@media screen and (max-width:599px){
		#subContent .subContTit p.contentSubTit {font-size:15px;}
		#subContent .subContTit h3#contentTitle {font-size: 28px;margin: 10px auto 35px;}
	}

	@media screen and (max-width:499px){
	}


.subTabUl {display:flex;justify-content:center;align-items:center;margin-bottom: 40px;}
.subTabUl li {margin:0 10px; position:relative;}
.subTabUl li:before {position:absolute;display:none;content:'';width: 0px;height: 0px;border-right: 5px solid transparent;border-top: 5px solid #0078ff;border-left: 5px solid transparent;bottom: -10px;left: 50%;transform: translateX(-50%);}
.subTabUl li a {transition-duration:.3s; display:flex; min-width:150px; height:50px; border-radius:20px; justify-content:center; align-items:center; background:#f5f5f5; font-size:16px; color:#666;}
.subTabUl li:hover a {background:rgb(0,120,255,0.1); color:#0078FF;}
.subTabUl li.on a {background:#0078FF; color:#fff;}
.subTabUl li.on:before {display:block;}

	@media screen and (max-width:1419px){
		
	}

	@media screen and (max-width:999px){
		
	}

	@media screen and (max-width:599px){
		.subTabUl {}
		.subTabUl li {margin: 0 5px;}
		.subTabUl li a {height: 45px; border-radius: 15px; min-width: auto; padding: 0 30px; font-size: 15px;}
	}

	@media screen and (max-width:499px){
	}


/* 게시판 */
.boardWrap {margin-bottom:150px !important;}

	@media screen and (max-width:1419px){
		.boardWrap {margin-bottom:120px !important;}
	}	

	@media screen and (max-width:999px){
		.boardWrap {margin-bottom:80px !important;}
	}

	@media screen and (max-width:599px){
		.boardWrap {margin-bottom:60px !important;}
	}