@charset "utf-8";

/*
 *
 *	style:enamel style
 *
 */

body {background: #f4f6f4;}

/*======================================
	pageH
======================================*/
.pageH {
	padding-bottom: 40%;
	background: url(../images/header-bg.png) center bottom no-repeat;
	background: url(../images/header-bg.png), linear-gradient(180deg, #011226 0%, #011226 70%, #f4f6f4 71%, #f4f6f4 100%);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: 100% auto;
}



/*======================================
	sec1
======================================*/
.sec1 {
	margin-top: -13%;
	padding-bottom: 18%;
	background: url(../images/sec1-bg.png) 112% center no-repeat;
	background-size: 60% auto;
}



/*======================================
	movie
======================================*/
.movie {margin: -18% 0 -5%;}



/*======================================
	sec3
======================================*/
.sec3 {
	margin-top: 25px;
	background: url(../images/sec3-bg_sp.png) center repeat-x;
	background-size: cover;
}
.sec3 .wrapper {
	padding: 25px 40px;
	background: url(../images/sec3-bg-watch.png) right 2.5% center no-repeat;
	background-size: 35% auto;
}
.sec3 p {
	float: left;
	width: 65%;
	color: #fff;
}



/*============================================================================

	responsive

============================================================================*/
@media screen and (min-width:640px) {
	/*======================================
		pageH
	======================================*/
	.pageH {
		background: url(../images/header-bg.png), linear-gradient(180deg, #011226 0%, #011226 60%, #f4f6f4 61%, #f4f6f4 100%);
		background-position: center bottom;
		background-repeat: no-repeat;
		background-size: 100% auto;
	}



	/*======================================
		sec1
	======================================*/
	.sec1 {
		padding-bottom: 28%;
		background-position: 95% 85%;
		background-size: 50% auto;
	}



	/*======================================
		movie
	======================================*/
	.movie {margin-bottom: -3%;}



	/*======================================
		sec3
	======================================*/
	.sec3 {
		margin-top: 50px;
		background-image: url(../images/sec3-bg_pc.png);
	}
	.sec3 .wrapper {
		padding: 50px 40px;
		background-position: right 27px center;
		background-size: 23.5% auto;
	}
	.sec3 p {width: 75%;}

}