@charset "Shift_JIS";
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@500;700;900&display=swap');
img {
	image-rendering: optimize-contrast;
	image-rendering: -webkit-optimize-contrast;
	max-width: 100%;
	border: 0;
}

.himekko_saikyo .lead2 span {
	color: #dd0606;
}
.btn_box {
	padding: 50px 0;
	text-align: center;
	background: #F5EB67;
}
.caution {
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 700;
	font-style: normal;
}
.top2line {
	max-width: 1000px;
	width:90%;
	text-align: center;
	margin: 0 auto;
}
.top2line img {
	margin: 0 auto;
}

.clearText {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    color: transparent;
}
.btn_apply_text {
	display: block;
	background-image: url(../images/btn_text.svg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.btn_wrap {
	border-radius: 100vh;
	position: relative;
	color: #fff;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3);
	display: block;
	max-width: 450px;
	width: 90%;
	margin: 0 auto;
	background-color: #dd0606;
	border: 4px solid #dd0606;
	display: inline-block;
	padding: 1rem 4rem;
	text-align: center;
	cursor: pointer;
	transition: all .5s;
	box-sizing: border-box;
}
.btn_wrap:hover .btn_apply_text  {	
	background-image: url(../images/btn_text_hover.svg);
}
.movie_title {
	display: block;
	background-image: url(../images/movie_title.svg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.movie_title_wrap {
	padding: 18px 0;
	margin: 30px auto;
	border-top: solid 2px #ffffff;
	border-bottom: solid 2px #ffffff;
	width: 100%;
}

@keyframes jumpAnimation {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-40px); /* ジャンプの高さ */
  }
}
@keyframes shadowAnimation {
  0%, 100% {
    transform: translateX(-50%) scaleX(1);
    opacity: 0.2;
  }
  50% {
    transform: translateX(-50%) scaleX(0.6);
    opacity: 0.1;
  }
}

/*======================================================
	PCサイズ（641px以上）ここから
======================================================*/

@media screen and (min-width:641px), print{
	body{
		padding-top:60px;
		font-size: 15px;
		min-width: unset;
		background-color:#fff;
	}
	#container{
		margin: 0 auto;
	}
	.wrapper{
		max-width: 1000px;
		width: 90%;
	}
	.Movie{
		width:100%;
		padding: 30px 0 50px;
		align-items: center;
		background-color: #57b7e1;
	}

	.pc { display: block !important; }
	.sp { display: none !important; }

	#himekko_top .content {
		padding-bottom: 30px;
		background-image: repeating-linear-gradient(-45deg, currentColor 0, currentColor 1px, transparent 0, transparent 50%);
		background-size: 10px 10px;
		color: #F5EB67 !important;
		background-color: #fff;
		text-align: center;
	}

	#himekko_top .title {
		width: 80%;
		max-width: 765px;
		padding-bottom: 30px;
		padding-top: 30px;
		text-align: center;
		margin-right: auto;
		margin-left: auto;
	}
	.lead1 {
		display: block;
		height: 66px;
		background-image: url(../images/lead_pc.svg);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
	.caution {
		margin-top: 10px;
		font-size: 21px;
	}
	.himekko_saikyo .lead2 {
		margin: 30px auto;
		font-size: calc(28px + .1vw);
		font-family: "Zen Kaku Gothic New", sans-serif;
		font-weight: 900;
		font-style: normal;
		color: #000;
		line-height: 1.8;
	}
	.btn_apply_text {
		height: 35px;
		margin-top: 3px;
	}
	.btn_wrap:hover {
		background-color: #fff;
		border: 4px solid #dd0606;
	}	
	.header-2 {
		position: absolute;
		box-sizing: border-box;
		width: 100%;
		display: block;
		background-color:black;
		opacity:0.7;
		z-index: 10000;
		position: fixed;
		top: 0;
		left: 0;
	}
	.header-inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		max-width: 1024px;
		height: 60px;
		padding: 0 0.8em;
		margin: 0 auto;
		font-size: 1.2em;
	}
	.logo img {
		width: 180px;
	}
.movie_title {
	height: 40px;
}
	.youtube_wrap{
		display: flex;
		flex-wrap: wrap;
	}	
	.youtube{
		width: calc(33.333% - 60px / 3);
		margin-right: 30px;
		margin-bottom:20px;
	}
	.youtube:nth-of-type(3n) {
		margin-right: 0;
	}
	.youtube .inner{
		overflow: hidden;
		background-color: #fff;
		border-radius: 14px;    
	}
	.youtube .thumb{
		position: relative;  
		display: block;
		padding-top: 56.1%;  
		width: 100%;
		height: 0;
		overflow: hidden;
	}
	.youtube .thumb iframe{
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}
	.youtube .box_text{
		height:60px;
		background-color:#ffffff;
		margin:10px 10px 13px 10px;  
	}
	.youtube .box_text p{
		font-family: "Zen Kaku Gothic New", sans-serif;
		font-style: normal;
		font-weight:700;
		letter-spacing: 0.01em;
		color:#00294D;
		line-height: 1.3;
		font-size:calc(16px + .1vw);
	}
	.youtube .box_text .entry_title {
		text-align: center;
	}
	footer{
		min-width: unset;
		width:100%;
		background-color: #000000;
		bottom: 0;
	}
	footer #footer{
		padding: 18px 0 25px;
	}
	footer #footer div{
		clear: both;
		margin-top: 35px;
		text-align: center;
		font-size: 12px;
		color: #FFFFFF;
	}
	.jump-wrapper {
		position: relative;
		width: 300px;
		height: 220px;
		margin: 0 auto 10px;
	}
	.jump { 
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		color: transparent;
		display: block; 
		background-image: url(../images/nawatobi.png); 
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
		height: 200px;
		width: 300px;
		position: absolute;
		bottom: 20px;
		animation: jumpAnimation 1s infinite ease-in-out;
	}
	.shadow {
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
		width: 200px;
		height: 20px;
		background: rgba(0, 0, 0, 0.2);
		border-radius: 50%;
		animation: shadowAnimation 1s infinite ease-in-out;
	}

}

/*======================================================
	SPサイズ（640px以下）ここから
======================================================*/

@media screen and (max-width:640px){
	.pc { display: none !important; }
	.sp { 
		display: block !important;
	}
	body{
		padding-top:45px;
		font-size: 13px;
		line-height: 1.5;
		background-color: #efecec;
	}
	.wrapper{
		width: calc(100% - 50px);
	}
	.header-2 {
		box-sizing: border-box;
		width: 100%;
		display: block;
		background-color:black;
		opacity:0.7;
		position: absolute;
		top: 0;
		z-index: 10000;
		position: fixed;
		top: 0;
		left: 0; 
	}
	.header-inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 45px;
		padding: 0 0.5em;
		margin: 0 auto;
		font-size: 1.2em;
	}
	.logo img {
		width: 120px;
	}
	#himekko_top .content {
		padding-bottom: 0;
		background-image: repeating-linear-gradient(-45deg, currentColor 0, currentColor 1px, transparent 0, transparent 50%);
		background-size: 10px 10px;
		color: #F5EB67 !important;
		background-color: #fff;
		text-align: center;
	}
	#himekko_top .title {
		width: 90%;
		padding-bottom: 30px;
		padding-top: 30px;
		text-align: center;
		margin-right: auto;
		margin-left: auto;
		max-width: 530px;
	}
	.lead1 {
		display: block;
		height: 115px;
		background-image: url(../images/lead_sp.svg);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
	}
	.himekko_saikyo .lead2 {
		margin: 0 auto;
		font-size: calc(23px + .1vw);
		font-family: "Zen Kaku Gothic New", sans-serif;
		font-weight: 900;
		font-style: normal;
		color: #000;
		line-height: 1.65;
		padding-bottom: 30px;
		padding-top: 10px;
	}
	.btn_apply_text {
		height: 25px;
		margin-top: 3px;
	}
	.btn_wrap:hover {
		background-color: #fff;
		border: 2px solid #dd0606;
	}
	.caution {
		margin-top: 10px;
		font-size: calc(19px + .1vw);
	}
	.Movie{
		width:100%;
		padding: 10px 0 10px;
		align-items: center;
		background-color: #57b7e1;
	}
	.movie_title {
		height: 30px;
	}
	.backnumber{
	   width:100%;
	   text-align: center;
	}
	.youtube{
	  margin-bottom:30px;
	}
	.youtube .inner{
		overflow: hidden;
		background-color: #fff;
		border-radius: 14px; 
	}
	.youtube .thumb{
	  position: relative;  
	  display: block;
	  padding-top: 56.1%;  
	  width: 100%;
	  height: 0;
	  overflow: hidden;
	}
	.youtube .thumb iframe{
	  display: block;
	  position: absolute;
	  width: 100%;
	  height: 100%;
		top: 0;
		left: 0;
	}
	.youtube .box_text{
	  height:50px;
	  text-align: left;
	  background-color:#ffffff;
	  margin:10px 15px 10px 15px;  
	}
	.youtube .box_text p {
		font-family: "Zen Kaku Gothic New", sans-serif;
		font-style: normal;
		font-weight:700;
	  letter-spacing: 0.05em;
	  font-size:calc(16px + .1vw);
	  color:#00294D;
	  line-height: 1.2;
	}

	.youtube .btn_past{
	  position: absolute;
	  right:4%;
	  top: 50%;
	  transform: translateY(-50%);
	}
	footer{
		width:100%;
		background-color: #000000;
		bottom: 0;
	}
	footer #footer{
		padding: 18px 0 25px;
	}
	footer #footer div{
		clear: both;
		margin-top: 15px;
		text-align: center;
		font-size: 12px;
		color: #FFFFFF;
	}
	.jump-wrapper {
		position: relative;
		width: 300px;
		height: 220px;
		margin: 0 auto 10px;
	}
	.jump { 
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		color: transparent;
		display: block; 
		background-image: url(../images/nawatobi.png); 
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
		height: 200px;
		width: 300px;
		position: absolute;
		bottom: 20px;
		animation: jumpAnimation 1s infinite ease-in-out;
	}
	.shadow {
		position: absolute;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
		width: 200px;
		height: 20px;
		background: rgba(0, 0, 0, 0.2);
		border-radius: 50%;
		animation: shadowAnimation 1s infinite ease-in-out;
	}
}

@media screen and (max-width:450px){
	.himekko_saikyo .lead2 {
		letter-spacing: -1px;
	}
}

@media screen and (max-width:425px){
	.sp {
		display: none !important;
	}
	.lead2 br {
		display: none !important;
	}
	.himekko_saikyo .lead2 {
		font-size: calc(22px + .1vw);
	}
}