@charset "utf-8";
#story .top_catch {
	font-weight: 200;
  line-height: 1.7;
  text-align: center;
  margin-bottom: 60px;
}


@media screen and (min-width:641px) {
  #story .h2_story {
    /*margin-bottom: 25px;*/
  }
  #story .top_catch {
    font-size: 2vw;
  }
}
@media screen and (min-width:980px) {
  #story .h2_story {
    /*margin-bottom: 40px;*/
  }
  #story .top_catch {
    font-size: 2rem;
  }
}
@media screen and (max-width:640px) {
  #story .h2_catch {font-size: 5.7vw;}
  #story .h2_story {
    font-size: 5vw;
    margin-bottom: 60px;
    /*margin-bottom: 40px;*/
  }
  #story .top_catch {
    font-size: 3.4vw;
    text-align: left;
    margin-bottom: 2em;
  }
}
@media screen and (max-width:480px) {
  #story .top_catch {
    /*font-size: 4.2vw;*/
  }
}

/*content*/
#story .wrap_mvitr {
  background-color: #fff;
	width: min(90%, 1280px);
	margin: 0 auto min(12vw, 60px);
  position: relative;
}
#story .wrap_mvitr::before {
  content: '';
  color: #f1f1f1;
  font-weight: 500;
  
  line-height: 0.62;
  display: block;
  position: absolute;
  top: 0;
  z-index: 1;
}
#story .wrap_mvitr.__01::before {
  content: '01';
}
#story .wrap_mvitr.__02::before {
  content: '02';
}
#story .wrap_mvitr.__03::before {
  content: '03';
}
#story .wrap_mvitr.__04::before {
  content: '04';
}

#story .wrap_item .txt {margin-bottom: 0;}

#story .fig_flex {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 0;
}
#story .fig_flex .wrap_item {
  width: 100%;
}
#story .wrap_item + .wrap_item {
  margin-top: min(6vw, 40px);
}
#story .wrap_item .img {
  margin-bottom: min(2vw, 20px);
}
#story .wrap_item.mb0 {margin-bottom: 0;}
#story .txt.mt {margin-top: min(4vw, 40px);}
#story .wrap_item .txt.mt {margin-top: min(2vw, 20px);}

#story .fig_flex .wrap_item .wp_video {
	margin-top: min(2vw, 20px);
}
#story .wp_video.__share .video._oblong,
#story .fig_flex .video._oblong {
	width: 100%;
	aspect-ratio: 16 / 9;
	position: relative;
	z-index: 1;
}
#story .wp_video {
	width: 100%;
	position: relative;
}
#story .wp_video .thumn_mv {
	position: absolute;
	top: -3px;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	display: block;
}
#story .playActive.thumn_mv {
	opacity: 0;
	z-index: 1;
}
#story .wp_video.__share {
	margin: min(3vw, 30px) auto 0;
}


@media screen and (min-width:641px) {
  #story .wrap_mvitr {
		padding: 60px 8%;
  }
  #story .wrap_mvitr::before {
    font-size: calc(min(20.84vw, 16rem) * .8);
    left: -8px;
  }
  /*#story .fig_flex .wrap_item {
    width: min(46%, 380px);
    margin: 0 min(2%, 20px);
  }*/
	#story .fig_flex {
		width: min(95%, 950px);
		margin: auto;
		justify-content: space-between;
	}
	#story .fig_flex.center {
		justify-content: center;
	}
  #story .fig_flex .wrap_item {
    width: min(47.5%, 450px);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		margin: 0;
  }
	#story .fig_flex .wrap_item .img + .txt,
  #story .fig_flex .wrap_item .img {
    width: min(88%, 380px);
  }
	#story .fig_flex.__single {
		align-items: center;
	}
	#story .fig_flex.__single .wrap_item {
		margin-right: 0;
		margin-left: 0;
	}
	#story .fig_flex.__single .wrap_item {
    width: min(43%, 380px);
	}
	
	#story .fig_flex.__single .wp_video {
		width: min(55%, 530px);
	}
	#story .fig_flex.__single .wrap_item .img + .txt {line-height: 0;}
	#story .fig_flex.__single .txt.mt {
		width: 100%;
		margin-top: min(2vw, 20px);
	}
	#story .fig_flex.__single.mt {
		margin-top: min(2vw, 20px);
	}
	#story .wp_video.__share {
		width: min(60%, 450px) ;
	}
}
@media screen and (min-width:768px) {
  #story .wrap_mvitr::before {
    font-size: calc(min(20.84vw, 16rem) * .6);
  }
}
@media screen and (min-width:1280px) {
  #story .wrap_mvitr {
		padding: 60px 140px;
    margin-bottom: 60px;
  }
  #story .wrap_mvitr::before {
    font-size: 15rem;
  }
	#story .fig_flex.__single .wrap_item .img {width: 100%;}
}
@media screen and (min-width:1920px) {
	#story .fig_flex {
		width: min(95vw, 950px);
	}

  #story .fig_flex .wrap_item {
    width: min(45vw, 450px);
	}
	#story .fig_flex.__single .wrap_item,
	#story .fig_flex .wrap_item .img + .txt,
  #story .fig_flex .wrap_item .img {
    width: min(38vw, 380px);
  }
	#story .fig_flex.__single .wp_video {
		width: min(53vw, 530px);
	}

	#story .wp_video.__share {
    width: min(45vw, 450px);
	}
	#story .fig_flex.__single .wp_video {
		width: min(53vw, 530px);
	}
}

@media screen and (max-width:640px) {
	#story .wrap_mvitr {
		width: 100%;
		padding: min(6vw, 40px) 5%;
	}
  #story .wrap_mvitr::before {
    font-size: min(23.45vw, 18rem);
    right: -0.9vw;
  }
	#story .wp_video.__share,
	#story .fig_flex.__single .wp_video {
		width: min(100%, 530px);
	}
}
@media screen and (max-width:480px) {
}

/*h3*/
#story .h3_mvitr {
  font-weight: 400;
  margin-left: 10px;
  display: flex;
  position: relative;
  z-index: 2;
}
#story .h3_mvitr .type {
  padding: 1vw 3vw 2.2vw 5vw;
  background-color: #333;
  position: relative;
}
#story .h3_mvitr .type .wp {
  color: #fff;
  display: flex;
  align-items: center;
  height: 100%;
}
#story .h3_mvitr .type::before,
#story .h3_mvitr .type::after {
  content: '';
  display: block;
  height: 2px;
  position: absolute;
  top: calc(50% - 1px);
}
#story .h3_mvitr .type::before {
  background-color: #333;
  z-index: 2;
  left: -10px;
}
#story .h3_mvitr .type::after {
  background-color: #fff;
  left: 0;
  z-index: 3;
}

#story .h3_mvitr .ttl {
  color: #333;
  background-color: #d7d7d7;
  width: 100%;
  padding: 1.5vw 3vw 2.5vw;
}


@media screen and (min-width:641px) {
  #story .h3_mvitr {
    font-size: min(2.25vw, 2.6rem);
    align-items: stretch;
    margin-bottom: 30px;
  }
  #story .h3_mvitr .type{
    padding: 8px 16px 10px 40px;
    padding: .6em 1.2em .8em 2.5em;
  }
  #story .h3_mvitr .ttl {
    padding: 8px 30px 10px;
    padding: .6em .8em .8em;
  }
  #story .h3_mvitr .type::before,
  #story .h3_mvitr .type::after {width: min(4vw, 30px);}
}
@media screen and (min-width:980px) {
  #story .h3_mvitr {
    font-size: 2.2rem;
  }
  #story .h3_mvitr .type{
    padding: 8px 16px 10px 40px;
  }
  #story .h3_mvitr .ttl {
    padding: 8px 30px 10px;
  }
}
@media screen and (min-width:1280px) {
}
@media screen and (max-width:640px) {
  #story .h3_mvitr {
    font-size: 5vw;
    flex-wrap: wrap;
    margin-bottom: 40px;
  }
  #story .h3_mvitr .type::before,
  #story .h3_mvitr .type::after {width: min(4vw, 40px);}
}
@media screen and (max-width:480px) {
  #story .h3_mvitr {
    margin-bottom: 20px;
    margin-left: 1.5vw;
  }
}

#story .wrap_about_spr {
  padding: min(4vw, 35px) min(3vw, 30px) 1px;
  margin-bottom: 0;
  border: 1px solid #333;
}
#story .wrap_about_spr .wrap_fig {
  width: min(45vw, 310px);
  margin: 0 auto min(5vw, 30px);
} 

@media screen and (min-width:641px) {
  #story .wrap_about_spr {
    padding: min(4vw, 40px);
    padding-bottom: 0;
    width: min(100%, 1000px);
    margin: auto;
    display: grid;
    grid-template-columns: "1fr" "1fr" ;
    /*grid-template-columns: "min(57.7%, 577px)" "min(40%, 310px)" ;*/
  }
  /*#story .wrap_about_spr .wrap_txt_spr {
    width: min(57.7%, 577px);
  }*/
  #story .wrap_about_spr .h5_story {
    width: min(40vw, 577px);
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }
  #story .wrap_about_spr .txt_01 {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
  }
  #story .wrap_about_spr .txt_02 {
    grid-column: 1 / 2;
    grid-row: 3 / 4;
  }
  #story .wrap_about_spr .wrap_fig {
    width: min(22vw, 310px);
    padding-left: min(2vw, 30px);
    grid-column: 2 / 3;
    grid-row: 1 / 4;
  }
}
@media screen and (min-width:1280px) {
}
@media screen and (max-width:640px) {
  #story .wrap_about_spr .txt_02 {text-align: center;}
}


/*video slide*/
.slide_video {
	width: min(90vw, 1000px);
	margin: 0 auto 40px;
	position: absolute;
}
.slide_video {display: none;}
.slide_video.slick-initialized {display: block;}

.slide_video .slick-track {
	display: flex;
	align-items: center;
}
.video_li {
	margin: 0 min(0.5vw, 20px);
}
.video_li .video_vertical {
	/*width: min(22vw, 225px);*/
	width: 255px;
	aspect-ratio: 9 / 16;
}
.video_li .video_oblong {
	/*width: min(44vw, 400px);*/
	width: 400px;
	aspect-ratio: 16 / 9;
}

.slide_video .slick-arrow {
	width: 30px;
	height: 30px;
	cursor: pointer;
	border-top: 2px solid #d7d7d7;
	border-right: 2px solid #d7d7d7;
	border-left: none;
	border-bottom: none;
	position: absolute;
	z-index: 10;
	top: 44.5%;
}
.slide_video .slick-arrow.next {
	transform: rotate(45deg);
	right: min(-2vw, -20px);
	}
.slide_video .slick-arrow.prev {
	transform: rotate(-135deg);
	left:  min(-2vw, -20px);
}

.slide_video + .txt {
	max-width: 630px;
	margin: auto;
}

@media screen and (min-width:980px) {
	.slide_video .slick-arrow.next {
		right: -30px;
	}
	.slide_video .slick-arrow.prev {
		left: -30px;
	}
}

@media screen and (min-width:1920px) {
	.video_li .video_vertical {
	}
}

@media screen and (max-width:640px) {
}

/*knowledge_list*/
#main #knowledge_list {
	background-color: #f7f7f7;
}

@media screen and (min-width:641px) {
	#main #knowledge_list {
		padding: 100px 10px;
	}
}
@media screen and (min-width:980px) {
	#main #knowledge_list {
		padding: 130px 10px;
	}
}
@media screen and (min-width:1280px) {
	#main #knowledge_list {
		padding: 100px 0 ;
	}
}

@media screen and (max-width:640px) {
	#main #knowledge_list {
		padding: 100px 25px 120px;
	}
}
@media screen and (max-width:480px) {
	#main #knowledge_list {
		padding: 85px 25px 95px;
	}
}