@charset "utf-8";


#main_gal{position:relative; height: 980px; overflow: hidden;}
.video-wrap {
  position: relative;
  width: 100%;
  height:100vh; /* 화면 꽉 차게 */
  overflow: hidden; /* 넘치는 부분 안보이게 */
}

.video-wrap video {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 비율 유지하며 꽉 채움 */
  transform: scale(1); /* 💡 약간 확대해서 자막 부분 가리기 */
  transform-origin: center center; /* 중앙 기준으로 확대 */
}

.video-wrap  img.cover{position: absolute; top:0; left:50%; margin-left: -50%;  transform: scale(1.2); opacity: 0.2; height: 100%}

#main_gal .slogan{position: absolute; text-align: center; width: 100%; top:355px; color: #fff;}
#main_gal .slogan .p1{font-size: 26px; font-weight: 600; letter-spacing: 7px; opacity: 0.85;}
#main_gal .slogan .p2{font-size: 74px; font-weight: 800;text-shadow: 3px 3px 3px rgba(0,0,0,0.12); margin-top: 20px;}
#main_gal .slogan .p2 span{color:#2d9bfd} 
#main_gal .slogan .p3{font-size: 19px; opacity: 0.85; margin-top: 17px;}

@media screen and (max-width:1230px) {
#main_gal{ height: auto; }
.video-wrap { height: auto; }

#main_gal .slogan{ top:45%; padding: 0 15px; word-break: keep-all; }
#main_gal .slogan .p1{font-size: 20px;letter-spacing: 7px;}
#main_gal .slogan .p2{font-size: 50px;  margin-top: 5px;}
#main_gal .slogan .p3{font-size: 16px;  margin-top: 12px;}
}



@media screen and (max-width:768px) {
/*팝업창 이미지 사이즈 재설정 - 필수*/
.drag_pop{max-width:310px !important;}



#main_gal .slogan{ top:35%; padding: 0 15px;  }
#main_gal .slogan .p1{font-size:16px;letter-spacing: 4px;}
#main_gal .slogan .p2{font-size: 35px;  margin-top: 0px;}
#main_gal .slogan .p3{font-size: 13px;  margin-top: 6px;}

}

@media screen and (max-width:480px) {
#main_gal .slogan{ top:33%; padding: 0 15px;  }
#main_gal .slogan .p1{font-size:12px;letter-spacing: 2px;}
#main_gal .slogan .p2{font-size: 24px;  line-height: 1.2;margin-top: 4px;}
#main_gal .slogan .p3{font-size: 13px;  margin-top: 6px;}
}






.section{padding: 130px 0;}
#s1{padding-top: 130px; background:url(/img/main/s1_bg.png) no-repeat left -50px bottom -50px;  }
#s1>div{color: #222; padding-right: 680px; min-height:487px; background: url(/img/main/s1_1.png) no-repeat top right ; padding-top: 5px;}
#s1>div .p1{font-size: 14px; font-weight: 800; letter-spacing: 3px; color: #4c626d; opacity: 0.5;}
#s1>div .p2{font-size:49px; line-height: 58px; font-weight: 300;  margin: 20px 0 25px; word-break: keep-all;}
#s1>div .p2 span{font-weight: 700; }
#s1>div .p3{font-size: 18px; line-height: 28px;  font-weight: 400; word-break: keep-all; color: #555;}
#s1>div a{letter-spacing:-1px; display: inline-block; padding:9px 40px; border:1px solid #999; margin-top:60px; color:#222; font-weight: 500;  border-radius: 3px;}
#s1>div a:hover{background: #222; color: #fff; border:1px solid #222; }

@media screen and (max-width:1230px) {
#s1>div{ padding-right:500px; min-height:380px; background: url(/img/main/s1_1.png) no-repeat top right ; padding-top: 5px; background-size: 450px; word-break: keep-all;}

}

@media screen and (max-width:980px) {
.section{padding: 100px 0;}
#s1{padding-top: 130px; background:url(/img/main/s1_bg.png) no-repeat left -50px bottom -10px;  background-size: 900px;}	
#s1>div .p2{font-size:38px; line-height: 46px;   }
	}
@media screen and (max-width:900px) {
#s1{padding-top: 130px; background:url(/img/main/s1_bg.png) no-repeat left -50px bottom -10px;  background-size: 700px;}
#s1>div{ padding-right:0px; min-height:auto; background: url(/img/main/s1_1.png) no-repeat top center ; padding-top: 400px; background-size: 450px; word-break: keep-all;}	
#s1>div .p2{font-size:30px; line-height: 36px;   }


}
@media screen and (max-width:768px) {
.section{padding: 70px 0;}
#s1{padding-top: 70px; background:url(/img/main/s1_bg.png) no-repeat left -50px bottom -10px;  background-size: 500px;}
#s1>div{ padding-right:0px; min-height:auto; background: url(/img/main/s1_1.png) no-repeat top center ; padding-top: 400px; background-size: 450px; word-break: keep-all;}	
#s1>div .p2{font-size:30px; line-height: 36px;   margin: 10px 0 15px; }
#s1>div .p3{font-size: 16px; line-height: 25px; }

#s1>div a{margin-top:40px; }
}

@media screen and (max-width:480px) {
.section{padding: 50px 0;}
#s1{padding-top: 50px; background:url(/img/main/s1_bg.png) no-repeat left -20px bottom -10px;  background-size: 380px;}
#s1>div{ padding-right:0px; min-height:auto; background: url(/img/main/s1_1.png) no-repeat top center ; padding-top: 270px; background-size: 300px; word-break: keep-all;}	
#s1>div .p1{font-size: 12px;  letter-spacing: 3px;}
#s1>div .p2{font-size:26px; line-height: 32px;   margin: 7px 0 11px; }
#s1>div .p3{font-size: 14px; line-height: 22px; }

#s1>div a{margin-top:30px; }
}	


#s2{background:url(/img/main/s2_bg.jpg) no-repeat center center;background-size: cover; text-align: center; background-size: cover;}
.section .tit1{font-size: 52px;  color:#fff; font-weight: 700; word-break: keep-all; }
.section .tit2{font-size: 17px;line-height: 1.5; margin-top: 9px;color:#fff; opacity: 0.7; word-break: keep-all;}

 .jarallax {
     /* height:100vh;*/
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
    }

#s2 ul.b1{margin-top: 55px;display:flex;flex-wrap: wrap; justify-content: space-between;}

#s2 ul.b1 li{width: 32.9%; position: relative;  }
#s2 ul.b1 li a{display: inline-block; width: 100%; height: 100%; color: #222; text-align: left;   }
#s2 ul.b1 li a .s2_tt{ position: absolute; top:0; left:0; width: 100%; height: 100%;padding: 30px 0 0 30px; color: #fff;}
#s2 ul.b1 li a .p1{font-size:24px; font-weight: 700; color:#fff; letter-spacing: 0px;  background-size: cover;}
#s2 ul.b1 li a .line{width: 33px; height: 1px; display: inline-block; background:#47afd6; vertical-align: top; margin-top: 7px;}
#s2 ul.b1 li a .p2{opacity: 0.85; font-size: 16px;}

#s2 ul.b1 li .img img{opacity:1;}
#s2 ul.b1 li .img{overflow: hidden; background: #0d0e10;}
#s2 ul.b1 li .img img{transition: opacity 1s, transform 1s;
	-webkit-transition: opacity 1s, -webkit-transform 1s;
	-moz-transition: opacity 1s, -moz-transform 1s;
	-ms-transition: opacity 1s, -ms-transform 1s;
	-o-transition: opacity 1s, -o-transform 1s;}
#s2 ul.b1 li a:hover .img img{	
	transform: scale3d(1.1,1.1,1);
	-webkit-transform: scale3d(1.1,1.1,1);
	-moz-transform: scale3d(1.1,1.1,1);
	-ms-transform: scale3d(1.1,1.1,1);
	-o-transform: scale3d(1.1,1.1,1); opacity: 1;}



@media screen and (max-width:980px) {
#s2 ul.b1{margin-top: 40px;}

#s2 ul.b1 li{width: 100%; position: relative;  margin-bottom: 5px;  overflow: hidden;}
#s2 ul.b1 li a .p1{font-size:22px;}
#s2 ul.b1 li a .p1 span{ font-size: 16px;}

#s2 ul.b1 li .img {text-align: right;}
#s2 ul.b1 li .img img{margin-top: -50px}
}

@media screen and (max-width:768px) {
.section .tit1{font-size: 34px;  }
.section .tit2{font-size: 14px;}



}
@media screen and (max-width:480px) {
.section .tit1{font-size: 32px;  }
.section .tit2{font-size: 13px; margin-top: 5px;}

#s2 ul.b1{margin-top: 25px;}
#s2 ul.b1 li a .s2_tt{ padding: 20px 0 0 20px; }
#s2 ul.b1 li a .p1{font-size:18px;}
#s2 ul.b1 li a .p2{ font-size: 14px;}
#s2 ul.b1 li .img img{width:80%;margin-top:0px}
}	




#s3{ background:url(/img/main/s3_bg.jpg) no-repeat center bottom -120px;  }
#s3>div{display: flex; flex-wrap: wrap; justify-content: space-between;}
#s3>div .left{width: 50%; padding-right: 100px;}
#s3>div .left .p1{font-size: 14px; font-weight: 800; letter-spacing: 3px; color: #4c626d; opacity: 0.5;}
#s3>div .left .p2{font-size:49px; line-height: 54px; font-weight: 300;  margin: 20px 0 25px; word-break: keep-all;  color: #222;}
#s3>div .left .p2 span{font-weight: 700; }
#s3>div .left .p3{font-size: 18px; line-height: 28px;  font-weight: 400; word-break: keep-all; color: #555;}
#s3>div a{letter-spacing:-1px; display: inline-block; padding:9px 40px; border:1px solid rgba(255,255,255,0.5); margin-top:190px; color:#fff; font-weight: 500;  border-radius: 3px; background: #a5c5d9;}
#s3>div a:hover{background: #222; color: #fff; border:1px solid #222; }
#s3>div .right{width: 50%; display: flex; flex-wrap: wrap; justify-content: space-between;}
#s3>div .right div{width: 48%; text-align: center;}
#s3>div .right div img{ box-shadow: 6px 6px 9px 2px rgba(0, 0, 0, 0.08);}
#s3>div .right div p{color: #072e75; font-weight: 600; margin-top: 20px; font-size: 16px;}
#s3>div .right div span{font-size: 16px; color: #333;}


@media screen and (max-width:980px) {
	#s3{ background:url(/img/main/s3_bg.jpg) no-repeat center bottom -180px;  }
	#s3>div .left{ padding-right: 60px;}
#s3>div a{margin-top: 70px;}
#s3>div .left .p2{font-size:38px; line-height: 46px;}
	}




@media screen and (max-width:768px) {
#s3>div .left{width: 100%; padding-right: 0px;}
#s3>div .right{width:100%; margin-top: 50px;}

#s3>div .left .p2{font-size:30px; line-height: 1.5;  margin: 10px 0 10px;}
#s3>div .left .p3{font-size: 16px; line-height: 1.5;}

#s3>div a{ border:none; margin-top:30px; }
#s3>div .right div{width: 49%; text-align: center;}
}




@media screen and (max-width:480px) {
#s3{ background:url(/img/main/s3_bg.jpg) no-repeat center bottom -210px;  }

#s3>div .left .p1{font-size: 12px;}
#s3>div .left .p2{font-size:24px; line-height: 1.5;  margin: 5px 0 5px;}
#s3>div .left .p3{font-size: 14px; line-height: 1.5;}

#s3>div a{ border:none; margin-top:20px; }
#s3>div .right div p{margin-top: 10px; font-size: 14px;}
#s3>div .right div span{font-size: 13px; display: inline-block; vertical-align: top;}
	}




#s4{background:url(/img/main/s4_bg.jpg) no-repeat top center;  text-align: center; }
#s4 .tit1{color: #222; font-weight: 300;}
#s4 .tit1 span{font-weight: 700;}
#s4 .tit2{color: #222;}

#s4 ul.news{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 60px;}
#s4 ul.news li{width: 31%; background: #fff; padding: 20px;box-shadow: 6px 6px 9px 2px rgba(0, 0, 0, 0.05);}
#s4 ul.news li a{display: inline-block;width: 100%; height: 100%;}
#s4 ul.news li a:hover{opacity: 0.8;}

.news_cont{margin-top: 15px; text-align: left;}
.news_cont .news_tit{font-size: 21px; font-weight: 700; color: #222;overflow: hidden;white-space: nowrap; text-overflow: ellipsis;  overflow: hidden; }
.news_cont .news_t{font-size: 15px; margin-bottom: 15px;margin-top: 5px; height: 66px; line-height: 1.4; overflow: hidden;}
.news_cont .date{color: #3ca3ff; opacity: 0.7; font-weight: 300;  font-size: 13px;}
.news_cont .more{float: right; font-size: 14px; opacity: 0.5; letter-spacing: 0;}

#s4 a.bt{letter-spacing:-1px; display: inline-block; padding:9px 40px; border:1px solid #999; margin-top:50px; color:#222; font-weight: 500;  border-radius: 3px;}
#s4 a.bt:hover{background: #222; color: #fff; border:1px solid #222; }

#s4 ul.banner{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 100px}
#s4 ul.banner li{width: 49%;}
#s4 ul.banner li a{display: inline-block; width: 100%; height: 100%; padding: 40px 40px;color: #fff; text-align: left;}
#s4 ul.banner li.bn1{background: url(/img/main/s4_bn1.jpg)no-repeat right bottom; background-size: cover;}
#s4 ul.banner li.bn2{background: url(/img/main/s4_bn2.jpg)no-repeat right bottom; background-size: cover;}
#s4 ul.banner li a p{font-size: 27px; font-weight: 700; line-height: 1.4}
#s4 ul.banner li a span{font-size: 15px; opacity: 0.7;}
#s4 ul.banner li:hover{opacity: 0.85;}

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


}


@media screen and (max-width:768px) {
#s4 ul.news{margin-top: 40px;}
#s4 ul.news li{width: 32%; background: #fff; padding: 10px;}
.news_cont .news_tit{font-size:18px; }
.news_cont .news_t{font-size: 13px; margin-bottom: 15px;margin-top: 5px; height: 50px; line-height: 1.4; overflow: hidden;}
.news_cont .date{  font-size: 13px;}
.news_cont .more{font-size: 14px; }

#s4 a.bt{margin-top:30px; }

#s4 ul.banner{ margin-top: 70px}
#s4 ul.banner li a{ padding: 30px 20px; }
#s4 ul.banner li a p{font-size: 20px;}
#s4 ul.banner li a span{font-size: 13px; line-height: 1.4; display: inline-block; word-break: keep-all;}
}



@media screen and (max-width:480px) {
#s4 ul.news{margin-top: 25px;}
#s4 ul.news li{width: 100%; background: #fff; padding: 10px; margin-bottom: 12px;}
.news_cont .news_tit{font-size:16px; }
.news_cont .news_t{font-size: 13px; margin-bottom: 15px;margin-top: 5px; height: 38px; line-height: 1.4; overflow: hidden;}
.news_cont .date{  font-size: 13px;}
.news_cont .more{font-size: 12px; }

#s4 a.bt{margin-top:20px; }

#s4 ul.banner{ margin-top: 50px}
#s4 ul.banner li{width: 100%; margin-bottom: 10px;}
#s4 ul.banner li a{ padding: 30px 20px; }
#s4 ul.banner li a p{font-size: 18px;}
#s4 ul.banner li a span{font-size: 13px; line-height: 1.4; display: inline-block; word-break: keep-all;}
}