@charset "UTF-8";
/* CSS Document */



/*--------------------------------------------------------------
FV スライダ
--------------------------------------------------------------*/
.fv_slide{
  display: flex;
  justify-content: center;
  align-items: center;
  height: 830px;
  width: 600px;
  position: relative;
  overflow: hidden;
  position: absolute;
  right: -100px;
  top: 0px;
}
@media screen and (max-width: 1024px) {
	.fv_slide{
	    width: 420px;
        height: 500px;
        right: -60px;
        top: -88px;
        overflow: hidden;
	}
}
@media screen and (max-width: 767px) {
	.fv_slide{
	width: 420px;
	 height: 500px;
	 right: -100px;
	 top: 0px;
	overflow: hidden;
	}
}
@media screen and (max-width: 390px) {
	.fv_slide{
	  right: -115px;
	}
}


.fv_slide .swiper{
  height: 100%;
  width: 291px;
  position: absolute!important;
  &.swiper1{
    left: 0;
    top: 0;
  }
  &.swiper2{
    left: calc(50% + 10px);
    top: 0;
  }
}

.swiper{
  height: 100%;
  width: 291px;
  position: absolute!important;
  &.swiper1{
    left: 0;
    top: 0;
  }
  &.swiper2{
    left: calc(50% + 10px);
    top: 0;
  }
}

.swiper{
  height: 100%;
  width: 291px;
  position: absolute!important;
  &.swiper1{
    left: 0;
    top: 0;
  }
  &.swiper2{
    left: calc(50% + 10px);
    top: 0;
  }
}


/* スライドの動き等速 */
.fv_slide .swiper-wrapper {
  transition-timing-function: linear !important;;
}
/* 画像のサイズ調整 */
.fv_slide .swiper-slide {
  img {
    height: 154px;
    width: 291px;
	aspect-ratio: 291 / 154;
	border-radius: 10px
  }
}

/* スライドの動き等速 */
.swiper-wrapper {
  transition-timing-function: linear  !important;;
}
/* 画像のサイズ調整 */
.swiper-slide {
  img {
    height: 154px;
    width: 291px;
	aspect-ratio: 291 / 154;
	border-radius: 10px
  }
}

@media screen and (max-width: 1024px) {
	.fv_slide .swiper{
		width: 291px;
	  height: 100%;
	  position: absolute!important;
	  &.swiper1{
		left: 0;
		top: 0;
	  }
	  &.swiper2{
		left: calc(38% + 10px);
		top: 0;
	  }
	}
	.fv_slide .swiper-slide {
  	img {
      height: 90px;
    width: 160px;
	  border-radius: 6px
  }
}
	
.swiper-container,
.swiper-slide {
   height: 100vh;
}
.swiper-slide > img {
   object-fit: cover; /* IE: not support */
 
}
}






/*--------------------------------------------------------------
What is T&T Group? スライダ
--------------------------------------------------------------*/

/* スライドの動き等速 
.swiper-wrapper {
  transition-timing-function: linear;
}
*/
/*
.swiper3{
    width: 100%;
    overflow:hidden;
    margin: 0 auto
}
*/
.swiper3{
    margin:50px calc(50% - 50vw);
    width: 100vw;
	overflow: hidden
}
@media screen and (max-width: 767px) {
	.swiper3{
	}
}

.swiper3 .swiper-slide{
	width: 291px !important;
	height: 154px;
	display: block;
	overflow: hidden
}
@media screen and (max-width: 767px) {
	.swiper3 .swiper-slide{
		display: contents;
	}
	.swiper3 .swiper-slide img{
		margin-right: 10px;
		width: 172px;
		height: 91px;
	}
}



/*--------------------------------------------------------------
interview スライダ
--------------------------------------------------------------*/

.loop-slider {
  width: 100vw;
margin: 50px calc(50% - 50vw) 50px;
}

.loop-track {
  display: flex;
  width: max-content;
  animation: loop 30s linear infinite;
}
@media screen and (max-width: 1024px) {
	.loop-track {
  animation: loop 30s linear infinite;
}
}

@keyframes loop {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.item {
  flex-shrink: 0;
  margin-right: 15px;
	position: relative;
	text-align: center;
	transition: ease-in-out .5s;
	width: 360px;
}
@media screen and (max-width: 1024px) {
	.loop-slider .item,
	.loop-slider .item img{
		width: 250px
	}
}


.item:hover{
    opacity: .7
}


.item h6{
    text-align: center;
    font-weight: normal;
    line-height: 1.4em;
    margin: 5px 0;
	font-size: 16px
}
@media screen and (max-width: 767px) {
	.item h6{
    font-size: .8rem
}
}

.item > p{
    text-align: center;
	font-size: .9rem
}
@media screen and (max-width: 767px) {
.item > p{
	font-size: .8rem
}	
}

.red_number{
  font-family: "Josefin Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 100;
  font-style: normal;
  position: absolute;
  z-index: 2;
  top: -31px;
  left:10px;
  color: var(--red);
  font-size: 94px
}
@media screen and (max-width: 767px) {
	.red_number{
		font-size: 54px;
		top: -21px;
		z-index: 10
}
}

.red_btn{
    position: absolute;
    bottom:96px;
    right:10px;
    width: 40px !important;
    height: 40px !important;
}
@media screen and (max-width:1024px) {
	.red_btn{
    position: absolute;
    top: 231px;
    right:10px;
    width: 30px !important;
    height: 30px !important;
}
}



/*--------------------------------------------------------------
HOME 横 スライダ
--------------------------------------------------------------*/

.loop-slider_shiru {
  width: 100vw;
margin: 50px calc(50% - 50vw) 50px;
}

.loop-track_shiru {
  display: flex;
  width: max-content;
  animation: loop_shiru 30s linear infinite;
}
.photo {
  flex-shrink: 0;
  margin-right: 10px;
	position: relative;
	text-align: center;
}
.photo img{
		border-radius: 10px !important
				}
@media screen and (max-width: 1024px) {
	.loop-track_shiru {
  				animation: loop_shiru 20s linear infinite;
				}
	.loop-track_shiru .photo,
	.loop-track_shiru .photo img{
					width: 160px;
				}
	
}

@keyframes loop_shiru {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}