@charset "utf-8";
/* CSS Document */

/* reset *************************************************************/
body {line-height:1; margin:0; font-family:arial,sans-serif;}
h1, h2, h3, h4, h5, h6, p {margin:0; font-size:100%; font-weight:normal; line-height:1.3;display:block;}
article,footer,header {display:block;}
ul,li {list-style:none; padding:0;margin:0;}
dl,dt,dd {padding:0; margin:0;}
table,tr,td {border:0;padding:0;margin:0;}
a {display:block;color:#ff6699;text-decoration:none;}
img {vertical-align:baseline; border:0; padding:0; margin:0;}
div {margin:0;padding:0;}
button {background: transparent;border: 0; outline: none;}
/* //reset *************************************************************/

*{
  box-sizing: border-box;
}

body {
  background: #333;
  font-family: sans-serif;
}
img {
  max-width: 100%;
  width: auto !important;
  height: auto !important;
  margin:0 auto;
  line-height: 0;
  vertical-align: bottom;
}
body,html {
  height: 100%;
}
#wrapper {
  background:#ff6699;
  position: relative;
}
@media screen and (min-width: 751px) {
  body {font-size:24px;}
  #wrapper {width:750px;margin:auto;}
}
@media screen and (max-width: 750px) {
  body {font-size:14px;}
  #wrapper {width:100%;}
}

/***************************/
#header {
  width: 100%;
  position: relative;
  line-height: 0;
  overflow: hidden;
}
#header img {
  line-height: 0;
}
#header #bg {
  width: 100%;
}
#header #bg img {
  width: 100% !important;
}
#header #logo {
  width: 32%;
  position: absolute;
  top: 2.666666666%;
  left: 2.666666666%;
  z-index: 50;
}
#header #title {
  width: 89.3333333%;
  margin: auto;
  position: absolute;
  top: 45%;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
}
#header #header-btn {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 3%;
  z-index: 100;
}

.btn {
  width: 78.666666%;
  margin: auto;
}
.btn-top {
  width: 86.440677966%;
  margin: 0 auto 2%;
}
.btn-bottom {
  width: 86.27118644%;
  margin: 2% auto 0;
}
#contents {
  width: 89.3333333%;
  margin: 5.970149253% auto;
  background: #fff;
  border-radius: 15px;
}
.c {
  padding: 5.970149253%;
}

#movie-title {
  width: 68.0644067796%;
  margin: auto;
}
#movie-content {
  width: 100%;
  margin: 5% auto 0;
  position: relative;
}
#movie-content video {
  width: 100%;
  display: block;
}


#endopen {
  display: none;
  background: rgba(0,0,0,0.75);
  width: 100%;
  height: 100%;
  position: absolute;
  margin: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 500;
}
#endopen:before {
  position:relative;
}
#endopen a {
  display: inline-block;
  text-align: center;
  background: #f69;
  color: #fff;
  padding: 10px;
  margin: 32.5% 2% auto;
  border-radius: 5px;
}

#footer {
  width: 100%;
  padding: 3.333333333%;
  margin-top: 7%;
  text-align: center;
  color: #999;
  font-size: 80%;
  line-height: 150%;
  background: #fff;
}
#footer p {
  font-size: 100%;
  color: #333;
  padding-top: 3.57142857142%;
}