@charset "utf-8";

.section#section0{position: relative; width:100%; height:100%; }
.section#section0 .container{position:relative; width:100%;height:100%;  }

.section#section0 .container.pc {display:block;}
.section#section0 .container.mobile{display:none;}

.mySwiper {overflow: hidden; position:relative; height: 100%;}

.mySwiper .swiper-wrapper {}
.mySwiper .swiper-wrapper .swiper-slide {position: relative;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit {position: absolute; top: 45%; left:0%; width:100%; padding-left:5%; text-align:center;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 {display:inline-block; width:1520px; margin:0 auto; text-align:left; font-size:34px; font-weight: 300; color : #fff; margin-bottom:10px; line-height: 1.34;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit p {display:inline-block; width:1520px; margin:0 auto; text-align:left;font-size:20px; font-weight: 300; color :#fff; padding-left: 3px; font-weight:600;}
.mySwiper .swiper-wrapper .swiper-slide img {width: calc(100% + 17px); height: 100%; vertical-align: middle;}
.mySwiper .swiper-wrapper .swiper-slide img.pc{display:block; object-fit: cover;}
.mySwiper .swiper-wrapper .swiper-slide img.mobile{display:none;}

.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 a.m_btn{margin-top:20px;display:inline-block; }
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 a.m_btn span{display:inline-block; text-align:center; color:#fff; padding:6px;font-size:15px; width:280px; border:1px solid #fff; border-radius:25px;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 a.m_btn span:hover{display:inline-block; text-align:center; color:#111; padding:6px;font-size:15px; width:280px; font-weight:500;background:#fff; border:1px solid #fff; border-radius:25px;}


.mySwiper .paging_wrap {display:none;position: absolute; top:54%; left: calc(10% + 3px);  }

.mySwiper .swiper-progress-bar {position:relative; top: 53px; left: 36px; width: 90px; display: block; z-index: 1; height: 2px;}
.mySwiper .swiper-progress-bar .slide_progress-bar {position:absolute; height:2px; background:#aaa; width : auto; bottom:41px; left:0; right:0;}
.mySwiper .swiper-progress-bar .slide_progress-bar:after {position:absolute; top:0; left:0; background: #707070; height: 100%; width: 0px; content: "";}
.mySwiper .swiper-progress-bar.active .slide_progress-bar { opacity: 1;}
/* .mySwiper .swiper-progress-bar.animate .slide_progress-bar:after { transition:width ease-in-out; transition-delay: unset; width:100%; transition-duration: 4s; } */
.mySwiper .swiper-progress-bar.animate .slide_progress-bar:after { animation-name: bar01; animation-duration: 4s; animation-timing-function: ease-in-out;}

.mySwiper .swiper-button-next {top:0 !important;  left:507px !important; background-image:url('../img/s_img/icon-arrow-right-fff.svg') !important; width:21px !important; height:21px !important; background-size:21px 21px !important;}
.mySwiper .swiper-button-prev { top: 0px !important; left:470px !important; background-image: url('../img/s_img/icon-arrow-left-fff.svg') !important; width:21px !important; height:21px !important;  background-size:21px 21px !important;}
.mySwiper .swiper-pagination {top: 0 !important; left: 0 !important;  width:175px !important; bottom: auto !important; color: #fff !important;}
.mySwiper .swiper-pagination-current {position: absolute !important; left: 0 !important; font-weight:700; color:#000;background:none; font-size: 16px; font-weight: bold;}
.mySwiper .swiper-pagination-total { position: absolute !important;  right: 15px !important;  font-weight:500; color:#aaa;}
.swiper-pagination{position: relative;}
@keyframes bar01 {
  0%{width:0;}
  100%{width:100%;}
} 



@media (max-width :1520px){


  .mySwiper .swiper-wrapper .swiper-slide .main_tit h2 {width:100%; margin:0 auto; }
  .mySwiper .swiper-wrapper .swiper-slide .main_tit p {width:100%; margin:0 auto;}
  



} /* end */






@media (max-width:1400px) {

.section#section0 .container {
    position: relative;
    width: 100%;
    height: auto;
  }
.mySwiper .swiper-wrapper .swiper-slide .main_tit { top: 44%; left:5%;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 {font-size:30px; margin-bottom:10px;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit p {font-size:18px;}
.mySwiper .paging_wrap {
  position: absolute;
  top: 77%;
  left: 0%;
z-index: 1000;}

  .section#section0 {
    position: relative;
    width: 100%;
    height: auto !important;}

.section#section0 .container {
  position: relative;
  width: 100%;

}


} /* end */


@media (max-width:1199px) {


.mySwiper {overflow: hidden;  position:relative;}

.mySwiper .swiper-wrapper {}
.mySwiper .swiper-wrapper .swiper-slide {position: relative; height:700px;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit {position: absolute; color: #fff; top: 40%; left:5%; }
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 {font-size:24px;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit p {font-size:16px;}
.mySwiper .swiper-wrapper .swiper-slide img {width: 100%; vertical-align: middle;}

.mySwiper .paging_wrap {
  position: absolute;
  top: 70%;}





}/* 1199px End*/



@media (max-width: 991px) {


.mySwiper .swiper-wrapper .swiper-slide .main_tit{top:42%; left:0; padding-left:0;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 { font-size:20px; text-align:center;}
.mySwiper .swiper-wrapper .swiper-slide { position: relative;  height:100vh;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 a.m_btn span {
  font-size: 14px;width: 250px;}
.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 a.m_btn span:hover{font-size:14px; width:250px; }

.mySwiper .swiper-wrapper .swiper-slide .main_tit p {text-align:center; font-size:16px;}

.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 b{display:block;}

.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 br{display:none;}

}/* 991px End*/





@media (max-width:768px) {

/*991px section0 */

.mySwiper .swiper-wrapper .swiper-slide .main_tit {  position: absolute;  color: #fff;  top: 40%;  left:0px;}


.mySwiper .swiper-button-next {  top: 0;  left: 217px;  background-image: url('../img/right.png');  width: 10px;  height: 18px;  background-size: 10px 18px;}
.mySwiper .swiper-button-prev {  top: 0px;  left: 7px;  background-image: url('../img/left.png');  width: 10px;  height: 18px;  background-size: 10px 18px;}
.mySwiper .swiper-pagination {  top: -24px;  left: 30px;  width: 175px;  bottom: auto;  color: #fff;}

.mySwiper .paging_wrap {display:none;  position: absolute;  top: 77%;}

.mySwiper .swiper-progress-bar {  position: absolute;  top: 30px;  left:70px;  width: 90px;  display: block;  z-index: 1;  height: 2px;}

.main_tit span.m_cut{display:block;}

.mySwiper .swiper-wrapper .swiper-slide img.pc{display:none;}
.mySwiper .swiper-wrapper .swiper-slide img.mobile{display:block; object-fit: cover;}

.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 {text-align:center; font-size:16px;}
  .mySwiper .swiper-wrapper .swiper-slide .main_tit p {text-align:center; font-size: 15px;}

.mySwiper .swiper-wrapper .swiper-slide .main_tit { padding-left: 0%;}

.mySwiper .swiper-wrapper .swiper-slide { position: relative;  height:100vh;}

.mySwiper .swiper-wrapper .swiper-slide .main_tit h2 span.m_cut{display:block;
    font-size: 16px;
    text-align: center;
}



}/*768px End*/
