@charset "utf-8";
#main-contents{width: 100%; overflow: hidden;}
.body-contents {position: relative; z-index: 2;}
.solution{width: 100%; height: 300px;bottom: calc(100% + 100px); position: absolute;}
.solution .inner{width: 1280px; margin: 0 auto;}
.solution .inner .title {font-size: 28px;font-weight: bold; margin-bottom: 30px; color: #fff; }
.solution .inner .title span{font-size: 28px;font-weight:100;}
.solution ul{width: 100%; height: 280px; display: flex; margin: 0 40px 40px 0;}
.solution ul li{ width: calc(100% / 4);
    height: 230px;
    display: inline-block;
    margin: 0 40px 40px 0;
 margin-left: 0; padding: 20px 30px; border-radius: 30px; overflow: hidden; box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);
    -webkit-box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);    -moz-box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);  background: rgba(000, 000, 000, 0.7);}
.solution ul li:last-child{margin: 0 0px 40px 0;} 
.solution ul li em{display: block; font-size: 16px; font-weight: 700; color: #fff; text-align: center;white-space:nowrap; overflow: hidden;}
.solution ul li p.img{display: block; text-align: center;height: 51%; vertical-align: middle;} 
.solution ul li p.img img{width: 64px; padding-top: 22px;}
.solution ul li p.img2{display: block; text-align: center;height: 51%; vertical-align: middle;} 
.solution ul li p.img2 img{width: 64px; padding-top: 29px;} 
.solution ul li p.img3{display: block; text-align: center;height: 51%; vertical-align: middle;} 
.solution ul li p.img3 img{width: 64px; padding-top: 20px;} 
.solution ul li p.img4{display: block; text-align: center;height: 51%; vertical-align: middle;} 
.solution ul li p.img4 img{width: 64px; padding-top: 41px;} 
.solution ul li p.text{display: block; font-size: 0.75rem; font-weight: 300; color: #fff; }

.vision{width: 100%; bottom: calc(100% + 100px); position: relative;display: inline-block;}
.vision .inner{width: 1280px;  margin: 0 auto;}
.vision .inner .title {font-size: 28px;font-weight: bold; margin-bottom: 30px; color: #000; padding-top: 150px; padding-bottom: 13px; border-bottom: 1px solid#000;}
.vision .inner .title span{font-size: 28px;font-weight:100;}
.vision .inner ul li{float:left; position: relative; padding: 40px 0px; display: inline-block;}
.vision .inner .vision_list {float:left; position: relative; padding: 40px 0px; }
.vision .inner .vision_list .cont_info {float: right; width: 47%;padding-top: 3%;}
.vision .inner .vision_list .cont_info .tit{ font-size: 4rem; color: #1d4b87; font-weight: 700; letter-spacing: -1px; line-height: 4rem;}
.vision .inner .vision_list .cont_info .tit span{ font-size: 4rem; color: #a4aeb3; font-weight: 700; letter-spacing: -1px; line-height: 4rem;}
.vision .inner .vision_list .cont_info .text{display: block; font-size: 1.5rem; font-weight: 500; padding-top: 20px}
.vision .inner .vision_list .thumb_img {float: left; margin-right: 5%; width: 47%;}
.vision .inner .vision_list .cont_info2 {float: left; width: 47%;padding-top: 3%;text-align: right;}
.vision .inner .vision_list .cont_info2 .tit{ font-size: 4rem; color: #1d4b87; font-weight: 700; letter-spacing: -1px; line-height: 4rem;}
.vision .inner .vision_list .cont_info2 .tit span{ font-size: 4rem; color: #a4aeb3; font-weight: 700; letter-spacing: -1px; line-height: 4rem;}
.vision .inner .vision_list .cont_info2 .text{display: block; font-size: 1.25rem; font-weight: 500; padding-top: 20px}
.vision .inner .vision_list .thumb_img2 {float:right ; margin-left: 5%; width: 47%;}

.btn-link { background-image: url("../images/common/arrow-right-long.svg"); background-position: 100%; background-repeat: no-repeat; background-size: 16px 16px; color: #222; font-size: 14px; font-weight: 600; padding-right: 26px;  margin-bottom: 13px;}
.btn-link.more {background-image: url("../images/common/arrow-right-long.svg");}
.news { padding: 80px 0 40px;}
.news .inner{width: 1280px; margin: 0 auto;}
.news .inner .news__title {-webkit-box-align: end; -ms-flex-align: end; -webkit-box-pack: justify; -ms-flex-pack: justify; align-items: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between;}
.news .inner .title {font-size: 30px;font-weight: bold;  color: #000; }
.news .inner .news_wrap {padding-top: 30px;}
.news .inner .news_wrap .news_list { width: 100%;}
.news_wrap .news_list {position: relative;}
.news_wrap .news_list:after {content: ''; display: block;  clear: both;}
.news_wrap .news_list li {float: left; width: 140px; margin: 0 40px 35px 0; letter-spacing: -0.35px;}
.news_wrap .news_list li:last-child {float: left; margin: 0 0px 35px 0; letter-spacing: -0.35px;}
.news_wrap .news_list li .cate {display: block; margin-bottom: 8px; font-size: 15px; color: #231f20; font-weight: 700;}
.news_wrap .news_list li .cate .icon_arrow {display: inline-block; width: 8px; height: 9px; margin-left: 4px; background-position: 0 0; vertical-align: 1px;}
.news_wrap .news_list li .cate:hover {color: #231f20 !important;}
.news_wrap .news_list li .thumb_img {}
.news_wrap .news_list li .thumb_img a {position: relative; display: block; overflow: hidden; border-top-right-radius: 15px; border-bottom-left-radius: 15px; width: 289px; height: 176px; min-height: 176px; background: #999 url("../images/common/h_logo_white2.png") center center no-repeat;}
.news_wrap .news_list li .thumb_img img {display: block;}
.news_wrap .news_list li .cont_info {margin: 11px 0 0 0;}
.news_wrap .news_list li .cont_info a {display: block;}
.news_wrap .news_list li .cont_info a:hover .tit {text-decoration: underline;}
.news_wrap .news_list li .cont_info a:hover .desc {text-decoration: underline;}
.news_wrap .news_list li .cont_info a .tit {
    display: block;
    margin-bottom: 5px;
    font-size: 15px;
    color: #231f20;
    font-weight: 700;
    line-height: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
.news_wrap .news_list li .cont_info a .date {font-size: 14px; font-weight: 400; color: #666; margin-top: 20px;}
.news_wrap .news_list li .cont_info a .desc {
    display: block;
    max-height: 44px;
    min-height: 44px;
    font-size: 15px;
    color: #231f20;
    font-weight: 400;
    line-height: 22px;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.news_wrap .list3 li {
    width: 260px;
}
.news_wrap .list3 li .cont_info a .tit {
    overflow: hidden;
    max-height: 44px;
    min-height: 44px;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    font-size: 16px;
    color: #191919;
}

.news_wrap .list3 li .cont_info a .desc {
    max-height: 42px;
    min-height: 42px;
    font-size: 13px;
    line-height: 19px;
    color: #727272;
}

.news_wrap .list3 li .cont_info a:hover .desc {
    text-decoration: none;
}

.news_wrap .list4 li {
   width: 22.6%;
}

.news_wrap .list4 li .cont_info a .tit {
    min-height: 43px;
    max-height: 43px;
    white-space: normal;
    text-overflow: ellipsis;
    word-wrap: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.news_wrap .list4 li .cont_info a .desc {
    max-height: 57px;
    min-height: 57px;
    -webkit-line-clamp: 3;
    font-size: 13px;
    color: #727272;
    line-height: 19px;
}

.news_wrap .list4 li .cont_info a:hover .desc {
    text-decoration: none;
}

.notice { padding: 40px 0 80px 0;}
.notice .inner{width: 1280px; margin: 0 auto;display: flex;}
.notice .inner .announce{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column;  flex-direction: column; width: 50%; margin-right: 60px;}
.notice .inner .announce .title {font-size: 30px;font-weight: bold;  color: #000; }
.notice .inner .announce .notice__title {-webkit-box-align: end; -ms-flex-align: end; -webkit-box-pack: justify; -ms-flex-pack: justify; align-items: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; margin-bottom: 30px;}
.notice .announce>ul {
    -webkit-box-flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
}
.notice .announce>ul>li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
} 

.notice .announce>ul>li>div {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.notice .announce>ul>li>div>a {
    display: inline;
    font-size: 16px;
    font-weight: 600;
}
.notice .announce>ul>li .date {
    -webkit-box-flex: 0;
    color: #666;
    -ms-flex: none;
    flex: none;
    font-size: 14px;
    margin-left: 62px;
}
.notice .inner .announce2{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column;  flex-direction: column; width: 50%;}
.notice .inner .announce2 .title {font-size: 30px;font-weight: bold;  color: #000; }
.notice .inner .announce2 .notice__title {-webkit-box-align: end; -ms-flex-align: end; -webkit-box-pack: justify; -ms-flex-pack: justify; align-items: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; margin-bottom: 30px;}
.notice .announce2>ul {
    -webkit-box-flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
}
.notice .announce2>ul>li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
} 

.notice .announce2>ul>li>div {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.notice .announce2>ul>li>div>a {
    display: inline;
    font-size: 16px;
    font-weight: 600;
}
.notice .announce2>ul>li .date {
    -webkit-box-flex: 0;
    color: #666;
    -ms-flex: none;
    flex: none;
    font-size: 14px;
    margin-left: 62px;
}


@media screen and (max-width: 1480px){
  .main-page{padding-top: 70px; padding-bottom: 70px;}
  .solution ul li p.text{display: block; font-size: 0.9rem; font-weight: 300; color: #fff;  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;  -webkit-line-clamp: 3;  -webkit-box-orient: vertical;}	
}
@media screen and (max-width: 1200px){
 .main-page{padding-top: 12vw; padding-bottom: 12vw;} 
.solution { width: 100%; height: 260px; bottom: calc(100% + 100px); position: absolute;}	
  .solution ul li p.text{display: block; font-size: 0.8rem; font-weight: 300; color: #fff;  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;  -webkit-line-clamp: 3;  -webkit-box-orient: vertical;}	
	
}
 
@media screen and (max-width: 840px){
 .solution .inner{width: 90%;  margin: 0 auto;}	
 .vision .inner{width: 90%;    margin: 0 auto;}	
 .main-page{padding-top: 70px; padding-bottom: 12vw;} 
  .solution ul li p.text{display: block; font-size: 16px; font-weight: 300; color: #fff;  overflow: hidden; text-overflow: ellipsis; display: -webkit-box;  -webkit-line-clamp: 3;  -webkit-box-orient: vertical;}	
  .vision{width: 100%; bottom: calc(100% + 100px); position: relative;display: inline-block; margin-top: 850px}	
  .vision .inner .vision_list .thumb_img {float: left; width: 100%;}	
  .vision .inner .vision_list .cont_info {float: left; width: 100%; padding-top: 9%;}	
  .vision .inner .vision_list .cont_info .tit{font-size: 40px;color: #1d4b87;font-weight: 700;letter-spacing: -1px;line-height: 4rem;}
  .vision .inner .vision_list .cont_info .tit span{font-size: 40px;color: #a4aeb3;font-weight: 700;letter-spacing: -1px;line-height: 4rem;}	
  .vision .inner .vision_list .thumb_img2 {float: left; width: 100%; margin-left: 0%;}	
  .vision .inner .vision_list .cont_info2 {float: left; width: 100%; padding-top: 9%;text-align: left;}	
  .vision .inner .vision_list .cont_info2 .tit{font-size: 40px;color: #1d4b87;font-weight: 700;letter-spacing: -1px;line-height: 4rem;}
  .vision .inner .vision_list .cont_info2 .tit span{font-size: 40px;color: #a4aeb3;font-weight: 700;letter-spacing: -1px;line-height: 4rem;}
	
  .news .inner{width: 90%;  margin: 0 auto;}
  .news .inner .news_wrap .list4 li {width: 100%; height: 100%;}	
  .news_wrap .news_list li .thumb_img a {position: relative; display: block; overflow: hidden; border-top-right-radius: 15px; border-bottom-left-radius: 15px; width: 100%; height: 100%; background: #999 url("../images/common/h_logo_white2.png") center center no-repeat;}	
  .news_wrap .news_list li .thumb_img {width: 100%; height: 216px;}	
	
  .notice .inner{width: 90%;  margin: 0 auto; display: block;}
  .notice .inner .announce{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column;  flex-direction: column; width: 100%; margin-right: 0px; margin-bottom: 40px;}	
  .notice .inner .announce2{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column;  flex-direction: column; width: 100%; margin-right: 0px;}		
 
}

.h1_main{text-align: center; font-weight: 800; font-size: 60px; line-height: 1.2; margin-bottom: 60px;}
@media screen and (max-width: 840px){
  .h1_main{font-size: 9vw; margin: 0 0 8vw; }
}

.btn_main2{ padding: 20px 40px; font-size: 20px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; border-radius: 20px 0 20px 0; border: 1px solid #8a8a8a; color: #222; -webkit-transition: all 100ms ease-in; -moz-transition: all 100ms ease-in; -ms-transition: all 100ms ease-in; -o-transition: all 100ms ease-in; transition: all 100ms ease-in; }
.btn_main2 i{margin-left: 10px;}
@media (hover: hover) {
  .btn_main2:hover{background-color: #8a8a8a; color: #fff;}    
}

@media screen and (max-width: 840px){
  .btn_main2{padding: 4vw 8vw;font-size: 4vw;border-radius: 5vw 0 5vw 0;}
  .btn_main2 i{margin-left: 4vw;}
}

.btn_main2:hover{background-color: #8a8a8a; color: #fff;}

.wrap_news_main{width: 1400px;margin: 0 auto;display: flex;margin-top: 45px;justify-content: space-between;}
.wrap_news_main .swiper-container{padding-bottom: 20px;}
.wrap_news_main .item{width: 335px;margin-left: 0;border-radius: 30px;overflow: hidden;font-size: 0;box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);-webkit-box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);-moz-box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);}

.wrap_news_main .item:first-child{margin-left: 0;}

@media screen and (max-width: 1480px){
  .wrap_news_main{width: auto;margin: 0 10vw 5vw;}
}

@media screen and (max-width: 840px){
  .wrap_news_main{ margin: 0; }
  .wrap_news_main .swiper-container{ padding:0 10vw 5vw;  }
}



.re_banner{width: 100%;/* overflow: hidden; */background-color: #fff;position: relative;}
.re_banner .inner{margin: 0 auto 0 110px;position: relative;}
.re_banner .inner > .txt{position:absolute;left:0;top:0;width: 420px;border-top: 2px #000 solid;padding-top: 40px;}
.re_banner .inner > .txt .h_1{ font-size: 35px; color: #222; font-weight: 800; }
.re_banner .inner > .txt .t_1{color: #7a7979;margin-top: 30px;max-width: 370px;}
.re_banner .inner > .cont{ margin-left:520px; overflow: hidden;}
.re_banner .tab{
    display: flex;
    align-items: flex-start;
    margin-top: 49px;
}
.re_banner .tab a{
    display: inline-flex;
    background: transparent;
    color: #000;
    padding: 5px 30px;
    border-radius: 90px;
    margin-right: 10px;
    font-size:20px;
    font-weight: 600;
    min-width: 22px;
    text-align: center;
    justify-content: center;
    -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -ms-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}
.re_banner .tab a.active{
    background: #000;
    color: #fff;
}
.re_banner .bg1{
  position: absolute;left: 330px;top: -70px;z-index: 0;
    -webkit-animation: rotate-in-center 12s linear infinite backwards;
            animation: rotate-in-center 12s linear infinite backwards;
            -webkit-transition: all 600ms ease-in-out;
-moz-transition: all 600ms ease-in-out;
-ms-transition: all 600ms ease-in-out;
-o-transition: all 600ms ease-in-out;
transition: all 600ms ease-in-out;

}
.re_banner .bg2{
  position: absolute;left: 940px;top: 210px;z-index: 0;
  -webkit-animation: rotate-in-center 16s linear infinite backwards;
            animation: rotate-in-center 16s linear infinite backwards;
            -webkit-transition: all 600ms ease-in-out;
-moz-transition: all 600ms ease-in-out;
-ms-transition: all 600ms ease-in-out;
-o-transition: all 600ms ease-in-out;
transition: all 600ms ease-in-out;

}
.re_banner .bg1 img,
.re_banner .bg2 img{ max-width:none;}

.banner_main1_1{display: flex; width: 3300px; align-items:flex-start;
-webkit-transition: all 600ms ease-in-out;
-moz-transition: all 600ms ease-in-out;
-ms-transition: all 600ms ease-in-out;
-o-transition: all 600ms ease-in-out;
transition: all 600ms ease-in-out;

}
.banner_main1_1 > *{margin-left: 110px;
  -webkit-transition: all 600ms ease-in-out;
  -moz-transition: all 600ms ease-in-out;
  -ms-transition: all 600ms ease-in-out;
  -o-transition: all 600ms ease-in-out;
  transition: all 600ms ease-in-out;
  position: relative;
  font-size: 0;
}
.banner_main1_1 > *:first-child{margin-left: 0;}

.re_banner .active_2 .bg1{top: 0px;}
.re_banner .active_3 .bg1{top: -30px;}

.re_banner .active_2 .bg2{top: 170px;}
.re_banner .active_3 .bg2{top: 220px;}

.active_1 .banner_main1_1 > .n2,
.active_1 .banner_main1_1 > .n3{margin-top: 100px;}
.active_2 .banner_main1_1 > .n1,
.active_2 .banner_main1_1 > .n3{margin-top: 100px;}
.active_3 .banner_main1_1 > .n1,
.active_3 .banner_main1_1 > .n2{margin-top: 100px;}

.active_2 .banner_main1_1{ margin-left: -964px; }
.active_3 .banner_main1_1{ margin-left: -1930px; }
@media screen and (max-width: 840px){

  .re_banner .inner{margin: 0;position: relative;}
  .re_banner .inner > .txt{position: relative;left: 10vw;top:0;width: auto;padding-top: 5vw;width: 80vw;}
  .re_banner .inner > .txt .h_1{font-size: 7vw;}
  .re_banner .inner > .txt .t_1{color: #7a7979;margin-top: 4vw;max-width: none;font-size: 4vw;}
  .re_banner .inner > .cont{margin-left: 0;/* overflow: hidden; */margin: 10vw 0;}
  .re_banner .tab{
      display: flex;
      align-items: flex-start;
      margin-top: 7vw;
  }
  .re_banner .tab a{
      padding: 2vw 4vw;
      border-radius: 50vw;
      margin-right: 2vw;
      font-size:4vw;
      min-width: 10vw;
  }
  
  .re_banner .bg1 img{width: 80vw;height: auto;}
  .re_banner .bg2 img{width: 95vw;height: auto;}

  .banner_main1_1{display: flex; width: 300vw;}
  .banner_main1_1 > *{width: 100vw;margin: 0;box-sizing: border-box;padding: 0 5vw;}
  .banner_main1_1 > *:first-child{margin-left: 0;}

  .re_banner .active_1 .bg1,
  .re_banner .active_2 .bg1,
  .re_banner .active_3 .bg1{top: 55vw;left: -29vw;}

  .re_banner .active_1 .bg2,
  .re_banner .active_2 .bg2,
  .re_banner .active_3 .bg2{top: 125vw;left: 51vw;z-index: 0;}

  .active_1 .banner_main1_1 img{ max-width:100%;}
  .active_1 .banner_main1_1 > .n2,
  .active_1 .banner_main1_1 > .n3{margin-top: 0;}
  .active_2 .banner_main1_1 > .n1,
  .active_2 .banner_main1_1 > .n3{margin-top: 0;}
  .active_3 .banner_main1_1 > .n1,
  .active_3 .banner_main1_1 > .n2{margin-top: 0;}

  .active_2 .banner_main1_1{ margin-left: -100vw; }
  .active_3 .banner_main1_1{ margin-left: -200vw; }


}



.banner_main1_1 .bx_txt{position: absolute;right: 0;bottom: 0;background:#1ca7e1;width: 430px;min-height: 330px;box-sizing: border-box;padding: 50px 45px 35px;}
.banner_main1_1 .bx_txt .h_1{font-size: 40px;font-weight: 600;color: #ffffff;}
.banner_main1_1 .bx_txt .t_1{font-size:16px;color: #fff;line-height: 1.7; margin-top: 15px;}
.banner_main1_1 .bx_txt .more{ margin-top: 53px; }
.banner_main1_1 .bx_txt .more a{font-size: 18px;color: #fff;}
.banner_main1_1 .bx_txt .btn_more{position: absolute;right: 0;bottom: 0;width: 92px;height: 92px;background: #49b9e7;display: flex;justify-content: center;align-items: center;font-size: 28px;color: #fff; -webkit-transition: all 300ms ease-in;
-moz-transition: all 300ms ease-in; -ms-transition: all 300ms ease-in; -o-transition: all 300ms ease-in; transition: all 300ms ease-in;}
.banner_main1_1 .bx_txt .btn_more i{-moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
@media (hover: hover) {
  .banner_main1_1 .bx_txt .more a:hover{ opacity: 0.7;  }
  .banner_main1_1 .bx_txt .btn_more:hover{background-color: #1699d0;}
}

@media screen and (max-width: 840px){
  .banner_main1_1 .bx_txt{position: relative;right: 0;bottom: 0;background:#1ca7e1;width: 80vw;min-height: 79vw;box-sizing: border-box;padding: 10vw 5vw;margin-top: -10vw;margin-left: 5vw;}
  .banner_main1_1 .bx_txt .h_1{font-size: 7vw;}
  .banner_main1_1 .bx_txt .t_1{font-size: 4vw;margin-top: 2vw;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient:vertical;}
  .banner_main1_1 .bx_txt .more{ margin-top: 16.4vw; }
  .banner_main1_1 .bx_txt .more a{font-size: 4vw;color: #fff;}
  .banner_main1_1 .bx_txt .btn_more{ width: 23vw; height: 23vw; font-size: 7vw; }
  
}





@-webkit-keyframes rotate-in-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes rotate-in-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}





.wrap-spot-main {
  background-color: #fff;
  height: 100vh;
  overflow: hidden;
  position: relative;
}
.wrap-spot-main .item{width: 100%; height: 100vh; position: relative;}

.wrap-spot-main .item .bg {
  position: absolute;
  left: 0; top: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  -webkit-background-size: cover;
  background-size: cover;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  color: #fff;
  z-index: 0;
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
  -webkit-transition: all 10000ms ease-in-out;
  -moz-transition: all 10000ms ease-in-out;
  -ms-transition: all 10000ms ease-in-out;
  -o-transition: all 10000ms ease-in-out;
  transition: all 10000ms ease-in-out;
}
.wrap-spot-main .item.swiper-slide-active .bg{
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.wrap-spot-main .item .vam {
  position: relative;
  width: 100%; height: 100vh;
  display: flex; align-items: center; justify-content: center;
}
.wrap-spot-main .item .vam > .inner{
  vertical-align: middle;
  display: inline-block;
  margin-top: -20%;
  width: 90%;
}
.wrap-spot-main .item .vam:after{
  width: 0; height: 100%; content:""; display: inline-block; vertical-align: middle; font-size: 0; line-height: 0; visibility: hidden;
}
.wrap-spot-main .item .h1 {
  font-size: 60px;
  color: #fff;
  line-height: 1.27;
  font-weight: 700;
  text-align: center;
}
.wrap-spot-main .item .t1 {
  color: #fff;
  font-size: 23px;
  line-height: 1.5333;
  margin-top: 40px;
  font-family: 'Nanum Myeongjo', serif; 
  font-weight: 400;
  text-align: center;
}
.wrap-spot-main .item .btns{text-align:center;margin-top: 70px;}
.wrap-spot-main .item .btns a .ff-en,
.wrap-spot-main .item .btns a{color:#fff;border-color:#fff;font-size:20px;font-weight: 600;opacity: 1;}
.wrap-spot-main .item .btns a{ min-width:200px;}
.wrap-spot-main .item .btns a:hover{background:#fff; color:#222;}
.wrap-spot-main .item .btns a:hover .ff-en{color:#222;}

/*.wrap-spot-main .controller{width: 780px; padding: 22px; position: absolute; left: 0; bottom: 0; background-color: #101f4a; z-index: 5; color: #fff; text-align: center;  box-sizing: border-box;}*/

/*.wrap-spot-main .controller .pageing{display: inline-block; position: relative; }*/
.wrap-spot-main .controller .pageing *{display: inline-block; vertical-align: middle;}

.wrap-spot-main .controller .pageing .prev,
.wrap-spot-main .controller .pageing .next,
.wrap-spot-main .controller .pageing .num{display: inline-block;}

.wrap-spot-main .controller .pageing .prev,
.wrap-spot-main .controller .pageing .next{width: 51px;height: 98px;display: inline-block;overflow: hidden;text-align: left;text-indent:-9999px;background: url(../images/main/arr_rgh.png) no-repeat transparent;vertical-align: middle;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;position: absolute;top: calc(50vh - 45px);z-index: 10; opacity: 0.5;}
.wrap-spot-main .controller .pageing .prev{background-image: url(../images/main/arr_lft.png); }

.wrap-spot-main .controller .pageing .next:hover,
.wrap-spot-main .controller .pageing .prev:hover{ opacity: 1;}

.wrap-spot-main .controller .pageing .prev{margin-right: 34px; left: 70px;}
.wrap-spot-main .controller .pageing .next{margin-left: 34px; right: 70px;}


.wrap-spot-main .controller .pageing .num *{display: inline-block; vertical-align: bottom; margin: 0 0;}
.wrap-spot-main .controller .pageing .num{font-size: 1.875em;}
.wrap-spot-main .controller .pageing .num .c{font-size: 1.3333em;}
.wrap-spot-main .controller .pageing .num .t{font-weight: 700; margin-left: 5px;}

.wrap-spot-main .controller .scrolldown{position: absolute;left: calc(50% - 45px);bottom: 0;font-size: 13px;font-weight: 400;z-index: 10;font-size: 0;
   -webkit-animation: updonwFn 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)  infinite alternate-reverse ;
    animation: updonwFn 1s cubic-bezier(0.390, 0.575, 0.565, 1.000)  infinite alternate-reverse ;
}


@-webkit-keyframes updonwFn {
  0% {
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -moz-transform: translateY(40px);
    -webkit-transform: translateY(40px);
    -o-transform: translateY(40px);
    -ms-transform: translateY(40px);
    transform: translateY(40px);
  }
}
@keyframes updonwFn {
   0% {
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -moz-transform: translateY(40px);
    -webkit-transform: translateY(40px);
    -o-transform: translateY(40px);
    -ms-transform: translateY(40px);
    transform: translateY(40px);
  }
}

@media screen and (max-width: 1480px){
  .wrap-spot-main .item .vam > .inner{ margin-top: -20%; }
  .wrap-spot-main .item .h1{ font-size: 60px; }
  .wrap-spot-main .controller .pageing .prev, .wrap-spot-main .controller .pageing .next{width: 40px;background-size: 100%;}
}

@media screen and (max-width: 840px){
  .wrap-spot-main .item,
  .wrap-spot-main .item .vam,
  .wrap-spot-main{ min-height: 170vw; }
  .wrap-spot-main .item .vam > .inner{ margin-top: -80vw; width: 100%; }
  .wrap-spot-main .item .h1 { font-size: 9.2vw; line-height: 1.3; }
  .wrap-spot-main .item .t1 { font-size: 5.2vw; margin-top: 10vw; }
  .wrap-spot-main .item .btns{text-align:center;margin-top: 15vw;}
  .wrap-spot-main .item .btns a .ff-en,
  .wrap-spot-main .item .btns a{color:#fff;border-color:#fff;font-size:4vw;font-weight: 600;opacity: 1;}
  .wrap-spot-main .item .btns a{ min-width:40vw;}
  .wrap-spot-main .controller .pageing *{display: inline-block; vertical-align: middle;}
  .wrap-spot-main .controller .pageing .prev,
  .wrap-spot-main .controller .pageing .next,
  .wrap-spot-main .controller .pageing .num{display: none;}
  .wrap-spot-main .controller .scrolldown{position: absolute; left: calc(50% - 10vw); font-size: 0; }  
  .wrap-spot-main .controller .scrolldown img{ width:20vw; height:auto;}

.solution ul{width: 100%;height: 280px;display: block;margin: 0 40px 40px 0;}
.solution ul li{
    width: calc(83% / 1);
    height: 230px;
    display: inline-block;
    margin: 0 40px 40px 0;
    margin-left: 0;
    padding: 20px 30px;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);
    -webkit-box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);
    -moz-box-shadow: 10px 10px 20px -13px rgba(0,0,0,0.10);
    background: rgba(000, 000, 000, 0.7);
    }
	
  @-webkit-keyframes updonwFn {
    0% {
      -moz-transform: translateY(0);
      -webkit-transform: translateY(0);
      -o-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0);
    }
    100% {
      -moz-transform: translateY(9vw);
      -webkit-transform: translateY(9vw);
      -o-transform: translateY(9vw);
      -ms-transform: translateY(9vw);
      transform: translateY(9vw);
    }
  }
  @keyframes updonwFn {
     0% {
      -moz-transform: translateY(0);
      -webkit-transform: translateY(0);
      -o-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0);
    }
    100% {
      -moz-transform: translateY(9vw);
      -webkit-transform: translateY(9vw);
      -o-transform: translateY(9vw);
      -ms-transform: translateY(9vw);
      transform: translateY(9vw);
    }
  }

}


.wrap_card_type1{ background-color: #fff; border-radius: 30px; overflow: hidden; cursor:pointer; }

.wrap_card_type1 > .thumb{}
.wrap_card_type1 > .cont{ min-height: 270px; padding: 30px 38px;  box-sizing: border-box; }
.wrap_card_type1 .cate{ font-size: 16px; color: #296ae1; font-weight: 600; }
.wrap_card_type1 .h_1{ font-size: 22px; color: #222; font-weight: 700; line-height: 1.3; margin-top: 20px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient:vertical; height: 84px; }
.wrap_card_type1 .date{ font-size: 16px; margin-top: 40px; }
@media screen and (max-width: 840px){
  .wrap_card_type1{ border-radius: 5vw;}
  .wrap_card_type1 > .cont{ min-height: 55vw; padding: 8vw 7vw;}
  .wrap_card_type1 .cate{ font-size: 3.6vw;}
  .wrap_card_type1 .h_1{ font-size: 4.6vw; margin-top: 4vw; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient:vertical; height: 12vw; }
  .wrap_card_type1 .date{ font-size: 3.6vw; margin-top: 12vw; }
}


.banner_main_bot{height: 520px;position: relative;color: #fff;display: flex;align-items: center;width: 100%;overflow: hidden;}
.banner_main_bot > .inr-c{ position:relative; min-width:1400px; }
.banner_main_bot .cate{font-size: 20px;line-height: 1.2;display:flex;align-items: center; }
.banner_main_bot .cate:before{ margin-right:14px; width:73px; height:1px; background:#fff; content:"";}
.banner_main_bot .h_1{ margin-top: 23px; font-size: 46px; line-height: 1.413; font-weight: 800; }
.banner_main_bot .btns{margin-top: 64px;}
.banner_main_bot .btn_main2{ border-color:#fff; color:#fff;}

@media screen and (max-width: 840px){
  .banner_main_bot{height: auto; display: block; padding:20vw 0;}
  .banner_main_bot .bg-pos{background-position: 59% 0;}
  .banner_main_bot > .inr-c{ min-width:auto; }
  .banner_main_bot .cate{font-size: 4.2vw; }
  .banner_main_bot .cate:before{ margin-right:3vw; width:15vw;}
  .banner_main_bot .h_1{ margin-top: 5vw; font-size: 7vw; }
  .banner_main_bot .btns{margin-top: 15vw;}
  .banner_main_bot .btn_main2{ border-color:#fff; color:#fff;}

}
