@charset "shift_jis";

body#movie {
	position: relative;
	background: url(../images/bg_footer.jpg) left top repeat;
}

/* ========================================
	bg
======================================== */
#wrapper01 {
	background-image: url(../movie/images/bg01.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	position: relative;
}

#wrapper02 {
	background-image: url(../movie/images/bg02.jpg);
	background-position: center 300px;
	background-repeat: no-repeat;
}

#wrapper03 {
	background-image: url(../movie/images/bg03.jpg);
	background-position: center 600px;
	background-repeat: no-repeat;
}

#wrapper04 {
	background-image: url(../movie/images/bg04.jpg);
	background-position: center 900px;
	background-repeat: no-repeat;
}


/* ========================================
	#main
======================================== */
#main {
	position: relative;
	padding: 135px 0 0;
	background: url(../common/bg_main_top.png) no-repeat center top;
}

#main h1 {
	position: absolute;
		top: 17px;
		left: -174px;
	z-index: 100;
}

#main .inner {
	background: url(../common/bg_main_body.png) repeat-y center top;
}

#main .chara {
	position: absolute;
		top: 40px;
		left: 745px;
}

/* --------------------------------
	#movie
-------------------------------- */
#movie-wrap {
	height: 800px;
	padding-top: 10px
}

#movie-wrap .movie-area {
	width: 880px;
	margin: 0 auto;
	padding-top: 53px;
}

#movie-wrap .movie-btn {
	margin-top: 45px;
	margin-left: 75px;
}

#movie-wrap .movie-btn ul li {
	float: left;
	padding-right: 25px;
	position: relative;
}

#movie-wrap .movie-btn ul li a .thumb {
	display: block;
	width: 240px;
	height: 135px;
	padding: 5px;
	background: url(../movie/images/bg_thumb_off.png) no-repeat left top;
}

#movie-wrap .movie-btn ul li.btn-tvcm a:hover .thumb,
#movie-wrap .movie-btn ul li.btn-tvcm a.cr .thumb {
	background: url(../movie/images/bg_thumb_tvcm.png) no-repeat left top;
}

#movie-wrap .movie-btn ul li.btn-shoukai a:hover .thumb,
#movie-wrap .movie-btn ul li.btn-shoukai a.cr .thumb {
	background: url(../movie/images/bg_thumb_shoukai.png) no-repeat left top;
}

#movie-wrap .movie-btn ul li .btn {
	position: absolute;
	bottom: -18px;
	left: 35px;
}

#movie-wrap .movie-btn ul li .layer {
	position: absolute;
		top: 5px;
		left: 5px;
	display: block;
	background: #000;
	width: 240px;
	height: 135px;
	opacity: 0.4;
	-moz-opacity: 0.4; /* Firefox */
	filter: alpha(opacity=40); /* IE6/7 */
	-ms-filter: "alpha(opacity=40)"; /* IE8 */
}

#movie-wrap .movie-btn ul li .cr .layer {
	display: none;
}


/* ========================================
	iframe
======================================== */
html, body {
	background-color: transparent;
}

#moviePop {
	width: 880px;
	height: 551px;
	padding-top: 50px;
	text-align: center;
	background: url(../movie/images/bg_movie-area.png) no-repeat center top;
}

#moviePop h1 {
	margin-bottom: 10px;
}

#movie-area {
	position: relative;
	width: 800px;
	height: 450px;
	margin: 0 auto;
}

#note {
	position: absolute;
		top: 0;
		left: 0;
}