@charset "utf-8";

.header {
}

.header #lead-box p span,
.header #lead-box h3 {
	color: #c221d0;
}

@media screen and (max-width: 640px) {
	.header {
		background: url(../images/bg01.png) repeat center top;
		background-size: 64% auto;
		-webkit-background-size: 64% auto;
		-moz-background-size: 64% auto;
		width: 100%;
		padding: 0 0 13.2%;
		position: relative;
	}
	.header-inner {
	}
	.header h1 {
		display: block;
		background: url(../images/header-sp.png) no-repeat center top;
		font-size: 0;
		line-height: 0;
		text-indent: -9999px;
		padding: 132.65625% 0 0;
		background-size: contain;
		-webkit-background-size: contain;
		-moz-background-size: contain;
		margin: 0 auto 6.4%;
	}

	.header #cbc-tv65th {
		width: 88.4375%;
		position: absolute;
		top: 1.875vw;
		left: 5.78125%;
	}
	.header #detail-box h3 {
		display: block;
		background: url(../images/header-lead-sp.png) no-repeat center top;
		font-size: 0;
		line-height: 0;
		text-indent: -9999px;
		padding: 78.90625% 0 0;
		background-size: contain;
		-webkit-background-size: contain;
		-moz-background-size: contain;
		margin: 0 auto 6.4%;
	}
	.header #lead-box {
		width: 93.75%;
		line-height: 1.9;
		letter-spacing: -0.1em;
		margin: 0 auto;
	}
	.header #lead-box p,
	.header #lead-box h3 {
		font-size: 5.0vw; /* 32px */
	}
	.header #lead-box h3 span {
		font-size: 5.625vw; /* 36px */
	}
	.header #lead-box p:nth-of-type(2) {
		margin: 0 0 4.2%;
	}
	.header #lead-box p:last-of-type {
		margin: 0 0 9.6%;
	}
	.header #lead-box figure {
		margin: 0 0 4.2%;
	}
}

@media screen and (min-width: 641px) {
	.header {
		background: url(../images/bg01.png) repeat center top;
		width: 100%;
		padding: 0 0 120px;
	}
	.header-inner {
		width: 980px;
		margin: 0 auto;
		position: relative;
	}
	.header h1 {
		display: block;
		background: url(../images/header-pc.png) no-repeat center top;
		font-size: 0;
		line-height: 0;
		text-indent: -9999px;
		list-style-type: none;
		height: 745px;
	}

	.header #cbc-tv65th {
		width: 278px;
		position: absolute;
		top: -720px;
		left: 556px;
	}
	.header #detail-box h3 {
		display: none;
		overflow: hidden;
		height: 0px;
	}
	.header #lead-box {
		width: 100%;
		line-height: 2.1;
		letter-spacing: -0.08em;
		margin: -20px auto 0;
	}
	.header #lead-box p,
	.header #lead-box h3 {
		width: 890px;
		font-size: 2.8rem;
		margin: 0 auto 24px;
	}
	.header #lead-box p:first-of-type {
		margin: 0 auto;
	}
	.header #lead-box p:nth-of-type(2) {
		margin: 0 auto 36px;
	}
	.header #lead-box p:last-of-type {
		margin: 0 auto 46px;
	}
	.header #lead-box h3 {
		margin: 0 auto 16px;
	}
	.header #lead-box h3 span {
		font-size: 3.6rem;
	}
	.header #lead-box figure {
		width: 890px;
		margin: 0 auto 40px;
	}
	.header #lead-box h4 {
		width: 956px;
		margin: 0 auto;
	}
}


/*** #movie-group ***/
#home #movie-group .video-frame {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	margin: 0 auto;
}
#home #movie-group .video-frame iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 640px) {
	#home #locipo-box {
		width: 93.75%;
		padding: 3.2% 0 9.6%;
		margin: 0 auto;
	}
	#home #movie-group {
		width: 100%;
		padding: 3.2% 0 9.6%;
	}
	#home #movie-group .video-box {
		width: 93.75%;
		margin: 0 auto;
	}
}

@media screen and (min-width: 641px) {
	#home #locipo-box {
		width: 540px;
		padding: 24px 0 96px;
		margin: -20px auto 0;
	}
	#home #movie-group {
		width: 100%;
		padding: 24px 0 96px;
		margin: -20px 0 0;
	}
	#home #movie-group .video-box {
		width: 890px;
		margin: 0 auto;
	}
}
