@charset "UTF-8";


/* -------------------------------------------------------------------------- **
**  FEATURE
** -------------------------------------------------------------------------- */
.feature .content1 {
	position: relative;
	width: 880px;
	height: 1050px;
	padding-bottom: 95px;
	background: transparent url(../images/feature/content1.jpg) center top no-repeat;
	text-align: center;
	}
	.feature .content1 .character1 {
		position: absolute;
		left: -40px;
		bottom: 0px;
		width: 475px;
		height: 605px;
		background: transparent url(../images/feature/sousou.png) -50px 0px no-repeat;
		}

.content1 .playerarea {
	position: relative;
	width: 630px;
	margin: 0 auto;
	padding: 0;
	padding-top: 90px;
	padding-bottom: 50px;
	text-align: center;
	}
	.content1 .playerarea #video {
		width: 556px;
		height: 312px;
		margin: 0 auto;
		}
	.content1 .playerarea .frame {
		position: absolute;
		background: transparent url(../images/feature/frame.png) center top no-repeat;
		z-index: 10;
		}
	.content1 .playerarea .frame.tl,
	.content1 .playerarea .frame.tr,
	.content1 .playerarea .frame.bl,
	.content1 .playerarea .frame.br {
		width: 76px;
		height: 76px;
		}
	.content1 .playerarea .frame.t,
	.content1 .playerarea .frame.b {
		left: 76px;
		width: 478px;
		height: 37px;
		}
	.content1 .playerarea .frame.tl { background-position: 0px 0px; }
	.content1 .playerarea .frame.tr { background-position: -554px 0px; }
	.content1 .playerarea .frame.bl { background-position: 0px -312px; }
	.content1 .playerarea .frame.br { background-position: -554px -312px; }
	.content1 .playerarea .frame.t { background-position: center top; }
	.content1 .playerarea .frame.b { background-position: center bottom; }
	
	.content1 .playerarea .frame.tl,
	.content1 .playerarea .frame.tr,
	.content1 .playerarea .frame.t {
		top: 43px;
		}
	.content1 .playerarea .frame.bl,
	.content1 .playerarea .frame.br,
	.content1 .playerarea .frame.b {
		bottom: 0;
		}
	.content1 .playerarea .frame.tl,
	.content1 .playerarea .frame.bl {
		left: 0;
		}
	.content1 .playerarea .frame.tr,
	.content1 .playerarea .frame.br {
		right: 0;
		}

/* MEDIAELEMENT */
.mejs-controls { visibility: hidden !important; }

/* -------------------------------------------------------------------------- **
**  FEATURE RETINA
** -------------------------------------------------------------------------- */
@media only screen and (min-device-pixel-ratio:1.5),
	only screen and (-o-min-device-pixel-ratio:3/2),
	only screen and (-ms-min-device-pixel-ratio:1.5),
	only screen and (min--moz-device-pixel-ratio:1.5),
	only screen and (-webkit-min-device-pixel-ratio:1.5) {
		.feature .content1 {
			background-image: url(../images/feature/content1_2x.jpg);
			background-size: 880px auto;
			}
		.feature .content1 .character1 {
			background-image: url(../images/feature/sousou_2x.png);
			background-size: 525px auto;
			}
		.content1 .playerarea .frame {
			background-image: url(../images/feature/frame_2x.png);
			background-size: 630px auto;
			}
	}