@charset "utf-8";

.section#section0{position: relative; width:100%; height:100vh; }
.section#section0 .container{position:relative; width:100%;height:100vh;  }

.section#section0 .container.pc {display:block;}
.section#section0 .container.mobile{display:none;}

.section02{position: relative; background: #444; height:100svh; background-image: url('/file/img/s_img/section02_bg.jpg'); background-repeat: no-repeat; background-position: center center; background-size: cover;}
.section02 .main_tit{top: 16%;}
.section02 .main_tit h2{font-weight: bold;}

.mySwiper {overflow: hidden; position:relative; height: 100vh;}
.font-weight-normal{font-weight: 400 !important; }

.mySwiper .swiper-wrapper {}
.mySwiper .swiper-wrapper .swiper-slide {position: relative;}
.main_tit {position: absolute; top: 60%; left:0%; text-align:center;}
.main_tit h2 {display:inline-block; width:1520px; margin:0 auto; text-align:left; font-size:46px; font-weight: 300; color : #fff; margin-bottom:20px; margin-top: 6px; line-height: 1.19;}
.main_tit p {display:inline-block; width:1520px; margin:0 auto; text-align:left;font-size:16px;  color :#fff; padding-left: 3px; font-weight:500;}
.mySwiper .swiper-wrapper .swiper-slide img {width: 100%; 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;}

.main_tit h2 a.m_btn{margin-top:20px;display:inline-block; }
.main_tit h2 a.m_btn span{display:inline-block; text-align:center; color:#fff; padding:6px;font-size:15px; width:148px; border:1px solid #fff; border-radius:25px;}
.main_tit h2 a.m_btn span:hover{display:inline-block; text-align:center; color:#111; padding:6px;font-size:15px; width:148px; font-weight:500;background:#fff; border:1px solid #fff; border-radius:25px;}

.mySwiper .paging_outer {display:block;position: absolute; top:82%; width:100%; left: 0; text-align:center; }

.mySwiper .paging_wrap {width:1520px; margin:0 auto; text-align:left; padding-left:0%;}

.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:#bbb; width : auto; bottom:41px; left:0; right:0;}
.mySwiper .swiper-progress-bar .slide_progress-bar:after {position:absolute; top:0; left:0; background: #fff; 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:#fff;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%;}
} 



/* ****************** scroll down ********************** */

.main-scroll-icon{z-index: 999999 !important; display: block; position: absolute; display:flex; z-index: 1;
 /* top:85%; */bottom:74px; right:100px; transform: translateY(-50%); -webkit-transform: translateY(-50%); transition: all 0.3s; -webkit-transition: all 0.3s;}
.main-scroll-icon .circle {display:block; position:relative; width:38px; height:38px; border:1px solid rgba(255,255,255,0.5); border-radius:50%; margin-right:13px; overflow:hidden;}
.main-scroll-icon .circle:before {content:""; width:4px; height:4px; background-color:#fff; border-radius:50%; position:absolute; top:50%; left:50%; margin:-2px 0 0 -2px;}
.main-scroll-icon .txt {margin-top:12px;font-size:12px; display:block; color:#fff; font-weight:700; letter-spacing: 0; font-family: 'Josefin Sans';}
body.active .main-scroll-icon {bottom:74px; opacity:1; }
body.active .main-scroll-icon .circle:before {animation: upDown 1.2s ease-in-out infinite;}
.main-scroll-icon.black .circle {border-color:rgba(51,51,51,0.5);}
.main-scroll-icon.black .circle:before {background-color:#333;}
.main-scroll-icon.black .txt {color:#fff;}
body.active .main-scroll-icon.hide {bottom: 652px; transition: bottom 0.8s ease;}

@keyframes upDown {  
0% {opacity: 0.1; transform:  translateY(-30px);}
50% {opacity: 1; transform: translateY(50%);}
100% { opacity: 0.1; transform:  translateY(30px);}
} /* end*/



@media (max-width :1520px){


  .main_tit h2 {width:100%; }
  .main_tit p {width:100%; margin:0 auto;}
  
.mySwiper .paging_wrap {width:100%; margin:0 auto; text-align:left; padding-left:5%;}

.main_tit {
    left: 5%;
}



} /* end */






@media (max-width:1420px) {

.section#section0 .container {
    position: relative;
    width: 100%;
    height: auto;
  }
.main_tit {}
.main_tit h2 {font-size:34px; margin-bottom:10px;}
.section03 .main_tit_other h2{font-size: 34px;}
.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%;

}

.mySwiper .paging_wrap {padding-left:5%; }
.mySwiper .paging_outer {
    display: block;
    position: absolute;
    top: 76%;
    left: calc(5% + 0px);
left:0%;
}


} /* end */


@media (max-width:1199px) {
.mySwiper {height: auto}
.main-scroll-icon{display:none;}
.mySwiper {overflow: hidden;  position:relative;}

.mySwiper .swiper-wrapper {}
.mySwiper .swiper-wrapper .swiper-slide {position: relative; height:700px;}
.main_tit {position: absolute; color: #fff; top: 54%; left:5%; }
.section03 .main_tit_other h2{font-size: 28px;}
.main_tit h2 {font-size:28px;}
.main_tit p {font-size:16px;}
.mySwiper .swiper-wrapper .swiper-slide img {width: 100%; vertical-align: middle;}

.mySwiper .paging_wrap {
  position: absolute;
  top: 70%;}

  .section03 .card h3{font-size: 25px; margin-bottom: 16px;}



}/* 1199px End*/



@media (max-width: 991px) {

/*991px section0 */

/* .main_tit { width:100%; position: absolute; text-align:center; color: #fff;  top: 40%; left:0%; margin-left:0px;}
.main_tit h2 {  font-size: 32px;}
.main_tit p {  font-size:16px;}

.mySwiper .swiper-button-next {  top: 0;  left: 317px;  background-image: url('../img/right.png');  width: 10px;  height: 18px;  background-size: 10px 18px;}
.mySwiper .swiper-button-prev {  top: 0px;  left: 107px;  background-image: url('../img/left.png');  width: 10px;  height: 18px;  background-size: 10px 18px;}
.mySwiper .swiper-pagination {  top: -24px;  left: 130px;  width: 175px;  bottom: auto;  color: #fff;}

.mySwiper .paging_wrap {display:none; position: absolute;  top: 77%; left:0%; }
.mySwiper .swiper-progress-bar {  position: absolute;  top: 30px;  left: 170px;  width: 90px;  display: block;  z-index: 1;  height: 2px;} */

.section02{height: 70vh;}
.main_tit{top: 35%;}
.main_tit h2 { font-size: 24px;}
.section03 .main_tit_other h2{font-size: 24px;}
.mySwiper .swiper-wrapper .swiper-slide { position: relative;  height:100%;}
.mySwiper .paging_wrap {display:none;}
.section03 .card{flex-direction: column; align-items: center;}
.section03{padding : 60px 0;}
.section03 .main_tit_other{margin-bottom: 46px;}
.section03 .card{gap: 28px;}
.section03 .card p {padding : 0 10px; font-size: 15px; word-break: keep-all;}
.section03 .card p br{display : none;}
.section03 .card img{display: none;}

}/* 991px End*/





@media (max-width:768px) {

/*991px section0 */

.section02{background-image: url('/file/img/s_img/section02_bg_m.jpg'); background-size: cover;}

.main_tit {  position: absolute;  color: #fff;  top: 40%;  }
.section02 .main_tit{top: 50%; transform: translateY(-50%);}


.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;}

.main_tit h2 { font-size:34px;}
  .main_tit p { font-size: 16px;}

.main_tit { padding-left: 0%;}

.mySwiper .swiper-wrapper .swiper-slide { position: relative;  height:100vh;}

.font-weight-normal br{display : none;}
.main_tit .font-weight-normal{ word-break: keep-all; width :100%; margin : 0; padding-right: 20px; box-sizing: border-box;}
.section02 .main_tit h2{line-height: 1.4;}

.section03 .main_tit_other h2{font-size: 4.9vw;}


}/*768px End*/

@media (max-width: 576px) {

  .main_tit{left: 0;}

  .main_tit h2 {font-size: 7vw;text-align:center;}
  .main_tit p {font-size: clamp(14px, 3.5vw, 16px);text-align:center; }
  .section03 .main_tit_other p{font-size : clamp(14px, 3.5vw, 16px); margin-bottom: 10px; font-weight: 500;}
  .main_tit .font-weight-normal{padding-right: 0; width : 94%; margin : 0 auto;}


}