@charset "UTF-8";


/***************************************************

	TOP

***************************************************/

.kv_wrapper{
	margin-bottom: 16px;
	overflow: hidden;
}

.kv_area{
	width: 806px;
	height: 797px;
	margin: 0 auto;
	position: relative;
}

.kv_area .item{
	position: absolute;
	opacity: 0;
	transition: all 0.4s linear;
}

.kv_area .item.view{
	opacity: 1;
}

.kv_area .item.kv_title{
	width: 684px;
	top: 0;
    left: 76px;
}

.kv_area .item.kv_back{
	width: 806px;
	top: 251px;
    left: 0;
	transform: translateY(50px) scale(0.8);
	transform-origin: center bottom;
	transition: all 0.6s ease-out;
}

.kv_area .item.kv_back.view{
	transform: translateY(0) scale(1);
}

.kv_area .item.kv_character{
	width: 529px;
	top: 275px;
    left: 143px;
    transition: all 0.2s linear;
}

.kv_area .item.kv_char_name{
	width: 500px;
    top: 650px;
    left: 168px;
    transform: translateY(-30px);
    transition: all 0.6s ease-out;
}

.kv_area .item.kv_char_name.view{
	transform: translateY(0);
}

.kv_area .item.kv_back_copy{
	font-size: 109px;
	color: var(--text2);
	font-weight: 900;
	font-family: "Montserrat", sans-serif;
	white-space: nowrap;
	line-height: 1;
    top: 703px;
    left: -108px;
    z-index: -1;
	transform: translateX(50px);
	transform-origin: center bottom;
	transition: all 0.6s ease-out;
}

.kv_area .item.kv_back_copy.view{
	transform: translateX(0);
}


.story_anchor{
	width: 1000px;
	margin: 0 auto 16px;
	opacity: 0;
	transform: translateY(30px);
	transition: all 0.8s ease-out;
}

.story_anchor.view {
	opacity: 1;
	transform: translateY(0);
}

.story_anchor ul{
	display: flex;
	flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
}

.story_anchor ul li{
	width: 296px;
	margin: 0 11px;
}

.story_anchor ul li:nth-child(5),
.story_anchor ul li:nth-child(4){
	transform: translateY(-20px);
}

.story_anchor ul li a{
	display: block;
	position: relative;
}

.story_anchor ul li a .flash{
	width: 31px;
    position: absolute;
    top: 25px;
    left: 51px;
	opacity: 0;
	transform: scale(0.5) rotate(20deg);
}

@keyframes flashShine {
	0%   { opacity: 0; transform: scale(0.5) rotate(20deg); }
	30%  { opacity: 1; transform: scale(1.2) rotate(0deg); filter: brightness(1.8); }
	60%  { opacity: 1; transform: scale(1) rotate(-10deg); filter: brightness(1.2); }
	100% { opacity: 1; transform: scale(1) rotate(0deg); filter: brightness(1); }
}

.story_anchor ul li a .flash.show {
	animation: flashShine 0.7s forwards;
}

.kv_bottom_other{
	width: 960px;
	margin: 0 auto 143px;
}

.kv_bottom_other ul{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-end;
}

.kv_bottom_other ul li{
	width: 472px;
}

.fv_bottom_copy{
	width: 1105px;
	margin: 0 auto 170px;
	position: relative;
}

.fv_bottom_copy .anchor_btn{
	width: 30px;
	position: absolute;
    top: -100px;
    left: 49.5%;
    z-index: 2;
    animation: upDown 3s ease-in-out infinite;
}

@keyframes upDown {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(10px);
	}
}

.section_cont{
	padding: 200px 0 260px;
	position: relative;
}

.section_cont:last-of-type{
	padding-bottom: 680px;
}

.section_cont::before{
	content: 'MEDICAL HEROES';
	display: inline-block;
	font-size: 114px;
	font-weight: 900;
	color: var(--bgcolor1);
	line-height: 1;
	font-family: "Montserrat", sans-serif;
	white-space: nowrap;
	position: absolute;
	top: -56px;
	left: 50%;
	transform: translate(-50%, 0);
}

.section_cont:first-of-type::before{
	top: -20px;
}

.section_cont h2{
	width: 644px;
	margin: 0 auto 50px;
}

.section_cont .image_block{
	width: 566px;
	margin: 0 auto 55px;
}

.section_cont .movie_cont{
	width: 888px;
	margin: 0 auto 50px;
	aspect-ratio: 16 / 9;
}

.section_cont .movie_cont iframe {
	width: 100%;
	height: 100%;
}

.section_cont .link_btn{
	width: 389px;
	margin: 0 auto;
}


.what_block{
	width: 1100px;
	margin: -500px auto 148px;
	position: relative;
    z-index: 5;
}

.what_block .anchor_btn{
	width: 31px;
	position: absolute;
	top: -97px;
	left: 50%;
	transform: translate(-50%, 0);
	z-index: 2;
	animation: upDown2 3s ease-in-out infinite;
}

@keyframes upDown2 {
	0%, 100% {
		transform: translateX(-50%) translateY(0);
	}
	50% {
		transform: translateX(-50%) translateY(10px);
	}
}


.download_block{
	margin: -120px 0 116px;
	padding-top: 120px;
	text-align: center;
}

.download_block .title{
	width: 441px;
	margin: 0 auto 50px;
}

.download_block .caption{
	font-size: 26px;
	font-weight: 900;
	line-height: 1.53;
	margin-bottom: 65px;
}

.download_block .image_block01{
	width: 609px;
	margin: 0 auto 128px;
}

.download_block .image_block02{
	width: 600px;
	margin: 0 auto;
}

.download_block .image_block01 .ul_wrapp{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
}

.download_block .image_block01 .ul_wrapp li{
	width: 279px;
}












/********************************************************************************
	リッキド用 CSS
********************************************************************************/

@media(max-width:1280px){

.kv_wrapper{
	margin-bottom: 1.25vw;
}

.kv_area{
	width: 62.96875vw;
	height: 62.265625vw;
}

.kv_area .item.kv_title{
	width: 53.4375vw;
    left: 5.9375vw;
}

.kv_area .item.kv_back{
	width: 62.96875vw;
	top: 19.609375vw;
	transform: translateY(3.90625vw) scale(0.8);
}

.kv_area .item.kv_character{
	width: 41.328125vw;
	top: 21.484375vw;
    left: 11.171875vw;
}

.kv_area .item.kv_char_name{
	width: 39.0625vw;
    top: 50.78125vw;
    left: 13.125vw;
    transform: translateY(-2.34375vw);
}

.kv_area .item.kv_back_copy{
	font-size: 8.515625vw;
    top: 54.921875vw;
    left: -8.4375vw;
	transform: translateX(3.90625vw);
}

.story_anchor{
	width: 78.125vw;
	margin: 0 auto 1.25vw;
	transform: translateY(2.34375vw);
}

.story_anchor ul li{
	width: 23.125vw;
	margin: 0 0.859375vw;
}

.story_anchor ul li:nth-child(5),
.story_anchor ul li:nth-child(4){
	transform: translateY(-1.5625vw);
}

.story_anchor ul li a .flash{
	width: 2.421875vw;
    top: 1.953125vw;
    left: 3.984375vw;
}

.kv_bottom_other{
	width: 75vw;
	margin: 0 auto 11.171875vw;
}

.kv_bottom_other ul li{
	width: 36.875vw;
}

.fv_bottom_copy{
	width: 86.328125vw;
	margin: 0 auto 13.28125vw;
}

.fv_bottom_copy .anchor_btn{
	width: 2.34375vw;
    top: -7.8125vw;
}

@keyframes upDown {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(0.78125vw);
	}
}


.section_cont{
	padding: 15.625vw 0 20.3125vw;
}

.section_cont:last-of-type{
	padding-bottom: 53.125vw;
}

.section_cont::before{
	font-size: 8.90625vw;
	top: -4.375vw;
}

.section_cont:first-of-type::before{
	top: -1.5625vw;
}

.section_cont h2{
	width: 50vw;
	margin: 0 auto 3.90625vw;
}

.section_cont .image_block{
	width: 44.21875vw;
	margin: 0 auto 4.296875vw;
}

.section_cont .movie_cont{
	width: 69.375vw;
	margin: 0 auto 3.90625vw;
}

.section_cont .link_btn{
	width: 30.390625vw;
}


.what_block{
	width: 85.9375vw;
	margin: -39.0625vw auto 11.5625vw;
}

.what_block .anchor_btn{
	width: 2.421875vw;
	top: -7.578125vw;
}

@keyframes upDown2 {
	0%, 100% {
		transform: translateX(-50%) translateY(0);
	}
	50% {
		transform: translateX(-50%) translateY(2.666667vw);
	}
}


.download_block{
	margin: -9.375vw 0 9.0625vw;
	padding-top: 9.375vw;
}

.download_block .title{
	width: 34.453125vw;
	margin: 0 auto 3.90625vw;
}

.download_block .caption{
	font-size: 2.03125vw;
	margin-bottom: 5.078125vw;
}

.download_block .image_block01{
	width: 47.578125vw;
	margin: 0 auto 10vw;
}

.download_block .image_block02{
	width: 46.875vw;
}






}


/********************************************************************************
	スマートフォン用 CSS
********************************************************************************/

@media(max-width:750px){

.kv_wrapper{
	margin-bottom: 8vw;
}

.kv_area{
	width: 100%;
	height: 230.666667vw;
}

.kv_area .item.kv_title{
	width: 88.8vw;
	top: 0.533333vw;
	left: 5.6vw;
}

.kv_area .item.kv_back{
	width: 116.8vw;
	top: 89.066667vw;
	left: -6.4vw;
	transform: translateY(8vw) scale(0.8);
}

.kv_area .item.kv_character{
	width: 93.066667vw;
	top: 92.266667vw;
	left: 3.466667vw;
}

.kv_area .item.kv_char_name{
	width: 94.133333vw;
	top: 192.533333vw;
	left: 2.666667vw;
    transform: translateY(-4vw);
}

.kv_area .item.kv_back_copy{
	font-size: 10.666667vw;
	top: 221.333333vw;
	left: -1.333333vw;
	transform: translateX(8vw);
}

.story_anchor{
	width: auto;
	margin: 0 4.8vw 12vw;
	transform: translateY(4vw);
}

.story_anchor ul{
	display: block;
}

.story_anchor ul li{
	width: auto;
	margin: 0 0 4vw;
}

.story_anchor ul li img{
	width: 100%;
}

.story_anchor ul li:nth-child(5),
.story_anchor ul li:nth-child(4){
	transform: translateY(0);
}

.story_anchor ul li:last-child{
	margin-bottom: 0;
}

.story_anchor ul li a .flash{
	width: 8.266667vw;
    top: unset;
    bottom: 29.066667vw;
    left: 5.866667vw;
}

.story_anchor ul li:nth-child(even) a .flash{
    left: unset;
    right: 5.866667vw;
}

.kv_bottom_other{
	width: auto;
	margin: 0 4.8vw 37.333333vw;
}

.kv_bottom_other ul{
	display: block;
}

.kv_bottom_other ul li{
	width: auto;
	margin-bottom: 1.066667vw;
}

.kv_bottom_other ul li:last-child{
	margin-bottom: 0;
}

.fv_bottom_copy{
	width: auto;
	margin: 0 auto 20vw;
}

.fv_bottom_copy .anchor_btn{
	width: 8vw;
    top: -29.866667vw;
}

@keyframes upDown {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(1.333333vw);
	}
}


.section_cont{
	padding: 20.533333vw 0 25.333333vw;
}

.section_cont:last-of-type{
	padding-bottom: 10.133333vw;
}

.section_cont::before{
	font-size: 10.4vw;
	top: -5.333333vw;
}

.section_cont:first-of-type::before{
	top: -2.133333vw;
}

.section_cont h2{
	width: 85.333333vw;
	margin: 0 auto 4.8vw;
}

.section_cont .image_block{
	width: 64.8vw;
	margin: 0 auto 3.733333vw;
}

.section_cont .movie_cont{
	width: 94.666667vw;
	margin: 0 auto 2.666667vw;
}

.section_cont .link_btn{
	width: 51.733333vw;
}


.what_block{
	width: 100%;
	margin: 10.666667vw auto 16vw;
}

.what_block .anchor_btn{
	width: 3.733333vw;
	top: -17.866667vw;
}

@keyframes upDown2 {
	0%, 100% {
		transform: translateX(-50%) translateY(0);
	}
	50% {
		transform: translateX(-50%) translateY(1.333333vw);
	}
}


.download_block{
	margin: 21.333333vw 0 43.2vw;
	padding-top: 21.333333vw;
}

.download_block .title{
	width: 72vw;
	margin: 0 auto 4.266667vw;
}

.download_block .caption{
	font-size: 3.466667vw;
	margin-bottom: 6.4vw;
}

.download_block .image_block01{
	width: 81.066667vw;
	margin: 0 auto 20.8vw;
}

.download_block .image_block02{
	width: 80.266667vw;
}

.download_block .image_block01 .ul_wrapp li{
	width: 37.333333vw;
}






}

