@charset "utf-8";


#wrap_yukata{
	background: rgb(205,232,237);
	background: -moz-linear-gradient(180deg, rgba(205,232,237,1) 50%, rgba(175,214,241,1) 100%);
	background: -webkit-linear-gradient(180deg, rgba(205,232,237,1) 50%, rgba(175,214,241,1) 100%);
	background: linear-gradient(180deg, rgba(205,232,237,1) 50%, rgba(175,214,241,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cde8ed",endColorstr="#afd6f1",GradientType=1);
}

#wrap_movie{
	background: url("../img/bg_hanabi_sp.png") no-repeat top center;
	background-size: 100% auto;
}

#wrap_movie::after{
	background: url("../img/bg_mountain_pc.png") no-repeat center;
	background-size: auto 100%;
	content: "";
	display: block;
	width: 100%;
	height: 140px;
}

#wrap_movie > div{
	width: 80%;
	margin:2em auto 0;
}

#wrap_movie h2{
	margin: 20px 0 0;
}

#wrap_movie h2,
#wrap_movie h3{
	text-align: center;
}

#wrap_movie h2 img,
#wrap_movie h3 img{
	display: inline;
	width: auto;
	max-width: 80%;
	height: auto;
}

.movie_wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
	margin: 1em 0 0;
}
 
.movie_wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
#wrap_movie{
	background: url("../img/bg_hanabi_pc.png") no-repeat top center;
	display: flex;
	flex-wrap: wrap;
}

#wrap_movie::after{
	background: url("../img/bg_mountain_pc.png") no-repeat center bottom;
	background-size: 100% auto;
	content: "";
	display: block;
	width: 100%;
	height: 170px;
}	

#wrap_movie > div{
	box-sizing: border-box;
	width:50%;
	margin:2em auto 40px;
}
	
	#wrap_movie > div:nth-of-type(1){
		padding: 0 20px 0 10%;
	}	

	#wrap_movie > div:nth-of-type(2){
		padding: 0 10% 0 20px;
	}
	
.movie_wrap {
	margin: 1.75em 0 0;
}

#wrap_movie h2{
	margin: 40px 0 0;
	width: 100%;
}

}

/* PC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px){

#wrap_movie > div{
	margin:50px auto 80px;
}	
	#wrap_movie > div:nth-of-type(1){
		padding: 0 20px 0 100px;
	}	

	#wrap_movie > div:nth-of-type(2){
		padding: 0 100px 0 20px;
	}
	
}




/* PC用1600px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1600px){

}