/*AOS관련 -> 모바일에서는 애니메이션 효과가 안나타나게 선언 후, 그로인해 화면이 안나오는 문제 해결을 위한 css 추가*/
@media screen and (max-width: 767px) { 
  [data-aos] {
    pointer-events: auto !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* 메인 슬라이드 */
.idx_vis{ width: 100%; position: relative;}
.slider-wrap {  width: 100%; position: relative;}
.slider-wrap .mvisual { width: 100%;  height: 700px; background-position: center top;  background-repeat: no-repeat;  background-size: cover; position: relative;}
.slider-wrap .mvisual01 {  background-image: url(../img/main/visual01.jpg); background-position: left top;}
.slider-wrap .mvisual02 {  background-image: url(../img/main/visual02.jpg);}
.slider-wrap .mvisual03 {  background-image: url(../img/main/visual03.jpg);} 
.slider-wrap .mvisual02::after, .slider-wrap .mvisual03::after{ display: block; content: ""; width: 100%; height: 100%; background-color: rgba(0,0,0,.2);
position: absolute; top: 0px; left: 0px; z-index: 1;} 
/*페이지 전환시 깜빡거림 현상 방지*/
.slick-slider .slick-track,
.slick-slider .slick-list{
 	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	-o-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	transition-delay: 10ms;
}

.idx_vis .main_text{ width: 100%; position: absolute; top: 50%; left: 12%; margin-top: -150px; z-index: 2;}
.idx_vis .main_text h1{ font-weight: 600; font-size: 40px; color: #fff;}
.idx_vis .main_text h2{ font-weight: 800; font-size: 55px; color: #fff; margin: 15px 0 30px 0;}
.idx_vis .main_text p{ font-weight: 300; font-size: 22px; color:rgba(255,255,255,.7); line-height: 1.6;}
.idx_vis .slick-dots {  position: absolute;  bottom: 200px;  left: 12%; display: flex; z-index: 2 !important; }
.idx_vis .slick-dots li { margin-right: 15px;}
.idx_vis .slick-dots li > button {  width: 12px;  height: 12px;  border-radius: 50%;  border: 0;  text-indent: -9999px;  background-color: transparent; border: 1px solid #fff;}
.idx_vis .slick-dots li.slick-active > button { background-color: #fff;}
@media screen and (max-width: 1279px) {  
  .idx_vis .main_text{ left: 8%;}
  .idx_vis .slick-dots { left: 8%; }
}
@media screen and (max-width: 1023px) {
  .slider-wrap .mvisual { height: 500px;}
  .idx_vis .main_text{ left: 5%;}
  .idx_vis .slick-dots { left: 5%; }
  .idx_vis .main_text h1{ font-size: 25px;}
  .idx_vis .main_text h2{ font-size: 40px;}
  .idx_vis .main_text p{ font-size: 18px;}
  .idx_vis .slick-dots { bottom: 150px;}
}
@media screen and (max-width: 767px) {
  .slider-wrap .mvisual { height: 400px;}
  .idx_vis .main_text{ width: 95%; margin-top: -100px;}
  .idx_vis .main_text h1{ font-size: 20px; line-height: 1.2;}
  .idx_vis .main_text h2{ font-size: 25px; line-height: 1.2; margin: 15px 0 10px 0;}
  .idx_vis .main_text p{ font-size: 15px; line-height: 1.5;}
  .idx_vis .slick-dots { bottom: 100px;}
  .idx_vis .slick-dots li { margin: 0 5px;}
}

.cont01{ margin-top: 100px;}
.cont01 .txt{ width: 1200px; margin: 0 auto;}
.cont01 .txt h1{ font-size: 45px; font-weight: 500; text-transform: uppercase;}
.cont01 .txt h2{ font-size: 30px; font-weight: 800; color: #bbb; margin: 20px 0 40px 0;}
.cont01 .txt h2 > strong{ color: #3D90D7; font-weight: 800;}
.cont01 .txt p{ font-size: 22px; line-height: 1.8; color: #555;}
.dong_wrap{ padding: 70px 0 100px;}
.dong{ width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.dong dt{ border-radius: 50%; overflow: hidden; margin-bottom: 20px; box-shadow: 0px 0px 10px rgba(0,0,0,.1);}
.dong dd{ font-size: 22px; font-weight: 600; text-align: center;}
.dong a{ color: #333;}
@media screen and (max-width: 1279px) {  
  .cont01 .txt{ width: 90%;}
  .dong{ width: 90%; justify-content: center;}
  .dong dl{ margin: 0 20px 40px 20px;}
}
@media screen and (max-width: 1023px) {
  .cont01{ margin-top: 70px;}
  .cont01 .txt h1{ font-size: 35px;}
  .cont01 .txt h2{ font-size: 25px;}
  .cont01 .txt p{ font-size: 18px; line-height: 1.6;}
  .cont01 .txt p br{ display: none;}
  .dong_wrap{ padding: 50px 0 70px;}
  .dong dl{ width: 33%; margin: 0 0 20px 0;}
  .dong dt{ width: 180px; margin: 0 auto 20px auto;}
  .dong dt img{ width: 100%;}
  .dong dd{ font-size: 18px; width: 180px; margin: 0 auto;}
}
@media screen and (max-width: 767px) {
  .cont01{ margin-top: 50px;}
  .cont01 .txt h1{ font-size: 30px;}
  .cont01 .txt h2{ font-size: 22px;}
  .cont01 .txt p{ font-size: 16px;}
  .dong_wrap{ padding: 30px 0 50px;}
  .dong dl{ width: 50%;}
  .dong dt{ width: 130px; margin: 0 auto 10px auto;}
  .dong dd{ font-size: 16px; width: 130px; }
}

.cont02{ width: 100%; height: 350px; background: url(../img/main/cont02_img01.jpg) no-repeat right top #5be1ec;}
.cont02 .txt{ padding: 80px 0 0 15%;}
.cont02 h2{ font-size: 16px; font-weight: 800; color: #3A59D1; letter-spacing: 0.5px; text-transform: uppercase;}
.cont02 h1{ font-size: 40px; font-weight: 400; margin: 7px 0 15px 0;}
.cont02 p{ font-size: 20px; color: #777;}
.cont02 h3{ font-size: 20px; font-weight: 500; color: #fff; display: inline-block; background-color: #3A59D1; padding: 10px 30px; border-radius: 30px; margin-top: 30px;}
@media screen and (max-width: 1279px) {  
  .cont02{ background-position: 40% top;}
  .cont02 .txt{ padding: 80px 0 0 5%;}
}
@media screen and (max-width: 1023px) {
  .cont02{ height: 250px;}
  .cont02 .txt{ padding: 50px 0 0 5%;}
  .cont02 h2{ font-size: 15px;}
  .cont02 h1{ font-size: 30px;}
  .cont02 p{ font-size: 17px;}
  .cont02 h3{ font-size: 17px; padding: 10px 30px; margin-top: 20px;}
}
@media screen and (max-width: 767px) {
  .cont02{ height: 250px; background-position: 45% top;}
  .cont02 h2{ font-size: 14px;}
  .cont02 h1{ font-size: 25px;}
  .cont02 p{ font-size: 16px;}
  .cont02 h3{ font-size: 16px; padding: 10px 20px;}
}

.cont03{ width: 1400px; margin: 0 auto; padding: 100px 0;}
.cont03 .tit{ text-align: center; margin-bottom: 80px;}
.cont03 .tit p{ font-size: 15px; font-weight: 800; text-transform: uppercase; color: #3d90d7; letter-spacing: 2px;}
.cont03 .tit h1{ font-size: 40px; font-weight: 400; margin: 10px 0 20px 0;}
.cont03 .tit h1 strong{ color: #3d90d7; font-weight: 400;}
.cont03 .tit h2{ font-size: 20px; font-weight: 300; color: #999; line-height: 1.5;}
.btn_port{ width: 250px; margin:0 auto;}
.btn_port a{ display: block; background-color: #3A59D1; font-size: 20px; color: #fff; text-align: center; padding: 13px 0;}
.btn_port a:hover{ background-color: #1b2449;}
@media screen and (max-width: 1279px) {  
  .cont03{ width: 95%;}
}
@media screen and (max-width: 1023px) {
  .cont03{ padding: 60px 0;}
  .cont03 .tit{ margin-bottom: 50px;}
  .cont03 .tit p{ font-size: 13px;}
  .cont03 .tit h1{ font-size: 30px;}
  .cont03 .tit h2{ font-size: 18px;}
  .btn_port{ width: 200px;}
  .btn_port a{ font-size: 18px;}
}
@media screen and (max-width: 767px) {
  .cont03{ padding: 50px 0;}
  .cont03 .tit{ margin-bottom: 40px;}
  .cont03 .tit h1{ font-size: 25px;}
  .cont03 .tit h2{ font-size: 16px; line-height: 1.2;}
  .btn_port{ width: 170px;}
  .btn_port a{ font-size: 16px; padding: 10px 0;}
}

.cont04{ width: 1400px; margin: 0 auto; padding-bottom: 100px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.cont04 .ct4_box{ width: 32%; height: 225px; border-radius: 15px; overflow: hidden; background-image: url(../img/main/bg_img.png); background-position: right top;
padding: 50px 50px; position: relative;}
.cont04 .ct4_box:nth-of-type(1){ background-color: #eee;}
.cont04 .ct4_box:nth-of-type(2){ background-color: #292F46;}
.cont04 .ct4_box:nth-of-type(3){ background-color: #3A59D1;}
.cont04 .ct4_box h1{ font-size: 27px; font-weight: 600; color: #fff;}
.cont04 .ct4_box h2{ position: absolute; top: 40px; right: 50px;}
.cont04 .ct4_box p{ font-size: 16px; color: rgba(255,255,255,.5); text-align: right; padding-top: 70px;}
.cont04 .ct4_box:nth-of-type(1) h1{ color: #222;}
.cont04 .ct4_box:nth-of-type(1) p{ color: rgba(0,0,0,.5);}
@media screen and (max-width: 1279px) {  
  .cont04{ width: 95%;}
  .cont04 .ct4_box{ padding: 50px 30px;}
  .cont04 .ct4_box h2{ right: 30px;}
}
@media screen and (max-width: 1023px) {
  .cont04{ width: 100%; padding: 0;}
  .cont04 .ct4_box{ width: 33%; height: 180px; border-radius: 0px; padding: 40px 20px;}
  .cont04 .ct4_box:nth-of-type(2){ width: 34%;}
  .cont04 .ct4_box h1{ font-size: 22px;}
  .cont04 .ct4_box h2{ top: 20px; right: 20px;}
  .cont04 .ct4_box h2 img{ width: 40px;}
  .cont04 .ct4_box p{ font-size: 15px; padding-top: 70px;}
}
@media screen and (max-width: 767px) {
  .cont04 .ct4_box{ width: 100%; height: 150px; padding: 30px 20px;}
  .cont04 .ct4_box:nth-of-type(2){ width: 100%;}
  .cont04 .ct4_box p{ padding-top: 40px;}
}

.cont05{ width: 100%; margin-bottom: 150px;}
.ct5_tit{ font-size: 45px; text-align: center; margin-bottom: 60px;}
.ct5_tit p{ font-size: 20px; color: #999; margin-top: 10px;}

.slider-cont05 .slick-track { display: flex; align-items: center;}
.slider-cont05 .slick-slide { margin: 0 10px;   /* 슬라이드 사이 간격 */ transition: all 0.4s ease; opacity: 0.7; transform: scale(0.9);}
/* 가운데 활성 슬라이드 */
.slider-cont05 .slick-center {opacity: 1; transform: scale(1);}

@media (max-width: 1279px) {
  .slider-cont05 .slick-slide img { width: 100%; display: block;}
}
@media (max-width: 1023px) {
  .cont05{ margin-bottom: 100px;}
  .ct5_tit{ font-size: 35px; margin-bottom: 40px;}
  .ct5_tit p{ font-size: 18px;}
  .slider-cont05 .slick-list { overflow: hidden;   /* 양옆 숨김 */ }
  .slider-cont05 .slick-slide { margin: 0; opacity: 1; transform: scale(1); }
}
@media (max-width: 767px) {
  .cont05{ margin-bottom: 0px;}
  .ct5_tit{ font-size: 26px; margin-bottom: 20px;}
  .ct5_tit p{ font-size: 16px; margin-top: 5px;}
}