@charset "UTF-8";

/* swiper design
------------------------------*/

[class*=swiper]:focus {outline: none;}
.swiper{position: relative;border-radius: 30px;overflow:visible;width: 700px;height: 570px;}
.slide-media {
  position: relative;z-index: 5;
  overflow: hidden;border-radius: 25px;
}
.top-slide{position: relative;width: 700px;height: 570px;}
.top-slide::before {
    content: "";
    position: absolute;
	right:-15px;
	bottom:-15px;
    width: 700px;
    height:570px;
    background-image: url('../images/bg-slider.png');
    background-position: top right;
	background-size:contain;
	z-index: 1;
	border-radius: 30px;
}

@media only screen and (max-width: 1680px) {
.swiper{width: 560px;height: 456px;}
.top-slide{position: relative;width: 560px;height: 456px;}
.top-slide::before {
    width: 560px;
    height:456px;
}



}

@media only screen and (max-width: 1366px) {
.swiper{width: 500px;height: 407px;}
.top-slide{position: relative;width: 500px;height: 407px;}
.top-slide::before {
    width: 500px;
    height:407px;
}



}

@media only screen and (max-width: 1200px) {
.swiper{width: 450px;height: 366px;}
.top-slide{position: relative;width: 450px;height: 366px;}
.top-slide::before {
    width: 450px;
    height:366px;
}



}

@media only screen and (max-width: 991px) {
.swiper{width: 450px;height: 366px;}
.top-slide{position: relative;width: 450px;height: 366px;margin: 0 auto;}
.top-slide::before {
    width: 450px;
    height:366px;
}



}

@media only screen and (max-width: 766px) {
.swiper{width: 450px;height: 366px;}
.top-slide{position: relative;width: 450px;height: 366px;margin: 0 auto;}
.top-slide::before {
    width: 450px;
    height:366px;
}



}

@media only screen and (max-width: 600px) {
.swiper{width: 300px;height: 244px;}
.top-slide{position: relative;width: 300px;height: 244px;margin: 0 auto;}
.top-slide::before {
    width: 300px;
    height:244px;
}



}


.swiper-button-prev {position: absolute;left: -25px !important;top:48%;z-index: 200;width: 50px;}
.swiper-button-next {position: absolute;right: -25px !important;top:48%;z-index: 20;width: 50px;}
.swiper-button-next, .swiper-button-prev{
    background-color:#009BD1;
    border-radius: 50%;
    width: 50px;
    height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: .4s;
}
.swiper-button-next:hover, .swiper-button-prev:hover{background-color:#4f819a;cursor: pointer;}
.swiper-button-next::after, .swiper-button-prev::after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    color: #fff;
    font-size: 1rem;
}
.swiper-button-next::after {content: '\f054'; }
.swiper-button-prev::after {content: '\f053';}



.mv02{background:url("../images/bg-main.png");background-position: center bottom;background-size: cover; width: 100%; height:calc(100vh - 100px);position: relative;display: flex;align-items: center;justify-content: center;}
.mv02::before {display: none;
    content: "";
    position: absolute;z-index: 20;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background:rgba(0,0,0,0);
}
.mv02 .swiper-pagination {
  position: absolute;
  z-index: 1;
  top: auto;
  bottom: 4em;
  left: 4em;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  margin: auto;
  display:flex;
}
.mv02 .swiper-pagination-bullet {
  width: 20px;
  height: 1px;
  cursor: pointer;
  margin-right: .5em;
  -webkit-transition: var(--transition);
  transition: var(--transition);
  background-color: rgba(255,255,255,.8);
}
.mv02 .swiper-pagination-bullet:not(:first-child) {}
.mv02 .swiper-pagination-bullet-active {
  width:35px;
  background-color:#0f0;
}
.mv02 .swiper-fade .swiper-slide {
  -webkit-transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, -webkit-transform !important;
  transition-property: opacity, transform !important;
  transition-property: opacity, transform, -webkit-transform !important;
  pointer-events: none;
}
.mv02 .swiper-fade .swiper-slide-active {pointer-events: auto;}
.mv02 .slide {
  display: block;
  place-content: center;
  padding: 0;
  text-align: center;
}



.mv02 .slide-media {
  position: relative;
  z-index: 10;
  top: auto;
  left: auto;
  width: 100%;
  border:5px solid white;
}

.mv02 .slide-media .slide-text {
position: absolute;
right: 20px;
bottom:30px;
text-align: right;
  -webkit-animation-name: mv02-fadeIn;
  animation-name: mv02-fadeIn;
}
.mv02 .slide-media .slide-text span{background: white;font-weight: 500;font-size: 1.2em;color: #009ED6;padding: .7em 1em;margin-bottom: .5em;display: inline-block;line-height: 1;}
.mv02 .slide-media .slide-text span:last-child{margin-bottom: 0}

.mv02 .slide-media img {
opacity:1;
  -webkit-transition: 5s 1s linear;
  transition: 5s 1s linear;
  -webkit-transform: translateX(-1.5%) scale(1.1);
          transform: translateX(-1.5%) scale(1.1);
}
.mv02 .swiper-slide[class*=-active] .slide-media img {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
  -webkit-transform: translateX(1.5%) scale(1.05);
          transform: translateX(1.5%) scale(1.05);
}
.mv02 .swiper-slide.anm-started .slide-title,
.mv02 .swiper-slide.anm-started .slide-text,
.mv02 .swiper-slide.anm-started .slide-link {
  -webkit-animation-name: mv02-fadeIn;
          animation-name: mv02-fadeIn;
}
.mv02 .swiper-slide.anm-finished .slide-title,
.mv02 .swiper-slide.anm-finished .slide-text,
.mv02 .swiper-slide.anm-finished .slide-link {
  -webkit-animation-name: mv02-fadeOut;
          animation-name: mv02-fadeOut;
}




@media only screen and (max-width: 991px) {
.mv02{ height:auto;position: relative;display:block;}
.swiper-button-prev {position: absolute;left: -17px !important;top:48%;z-index: 200;width: 35px;}
.swiper-button-next {position: absolute;right: -17px !important;top:48%;z-index: 20;width: 35px;}
.swiper-button-next, .swiper-button-prev{
    background-color:#009BD1;
    border-radius: 50%;
    width: 35px;
    height: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: .4s;
}

}

@media only screen and (max-width: 600px) {
.mv02 .slide-media .slide-text {
position: absolute;
right: 15px;
bottom:15px;
text-align: right;
  -webkit-animation-name: mv02-fadeIn;
  animation-name: mv02-fadeIn;
}
.mv02 .slide-media .slide-text span{background: white;font-weight: 500;font-size: 1em;color: #009ED6;padding: .5em .5em;margin-bottom: .5em;display: inline-block;line-height: 1;}

}

@media print {
.mv02{background:url("../images/bg-main.png");background-position: center bottom;background-size: cover; width: 100%; height:500px;position: relative;display: flex;align-items: center;justify-content: center;}
.main-h2{width: 50%; padding-right: 0px;margin: 0;}
.main-h2 h2.mv-h2{width: 80%;}
.swiper{width: 450px!important;height: 366px!important;}
.top-slide{position: relative;width: 450px;height: 366px;margin: 0 auto;}
.top-slide::before {
    width: 450px;
    height:366px;
}
.mv02 .slide-media {width: 450px;height:366px;}

.mv02 .slide-media img {display: block; width: 450px;
    height:366px;
	margin-left: 0!important;
opacity:1;
  -webkit-transition:0;
  transition:0;
  -webkit-transform: translateX(0) scale(1);
          transform: translateX(0) scale(1);
}
.mv02 .swiper-slide[class*=-active] .slide-media img {	margin-left: 0!important;
  -webkit-transition-delay: 0;
          transition-delay: 0;
  -webkit-transform: translateX(0) scale(1);
          transform: translateX(0) scale(1);
}
.mv02 .slide-media .slide-text {display: none;
position: absolute;
right: 10px;
bottom:20px;
text-align: right;
}
.mv02 .slide-media .slide-text span{background: white;font-weight: 500;font-size:14px;color: #009ED6;padding: .5em .8em;margin-bottom: .5em;display: inline-block;line-height: 1;}
.mv02 .slide-media .slide-text span:last-child{margin-bottom: 0}
.swiper-button-prev {position: absolute;left: -17px !important;top:48%;z-index: 200;width: 35px;}
.swiper-button-next {position: absolute;right: -17px !important;top:48%;z-index: 20;width: 35px;}
.swiper-button-next, .swiper-button-prev{
    background-color:#009BD1;
    border-radius: 50%;
    width: 35px;
    height: 35px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: .4s;
}


}