@import url('https://cdn.jsdelivr.net/npm/yakuhanjp@3.0.0/dist/css/yakuhanjp_s.min.css');
@import url("colorbox.css");
@charset "UTF-8";


/*---------------------------------------------
	Browser Default Initialization
  ---------------------------------------------*/

body, div, dl, dt, dd, ul, ul li, h1, h2, h3, h4, h5, h6,pre, form, fieldset, input, textarea, p, blockquote, th, td,section, nav, article, aside, header, address,figure, figcaption {
	margin: 0;
	padding: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th {text-align: left;}
q::before ,q::after {content: '';}
object, embed {vertical-align: top;}
hr, legend {display: none;}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
img, abbr, acronym, fieldset {border: 0;}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	-ms-interpolation-mode: bicubic;
}
ul li { list-style-type: none;}
*,
*:before,
*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.clearfix { /zoom:1; }
.clearfix:before, .clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
em {
	font-style:normal;
}
strong {
	font-weight: bold;
}
a {
	color:#000;
	outline: none;
	text-decoration: none;
	transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}
a:active,
a:hover {
	text-decoration: none;
}
a:focus,
*:focus {
	outline:none;
}
a:hover img {
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-webkit-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
}
/*.en {
	font-family: 'Smythe', cursive;
}*/
.min {	font-family: YakuHanJPs, "Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;}
.txhd {
	display:block;
	height:0;
	overflow:hidden;
	font-size:1.0rem;
	line-height:2;
}
.pc {
 display: block;
}
.sp {
 display: none;
}
@-ms-viewport {
 width: auto !important;
 initial-scale: 1;
}
.object-fit {
 object-fit: cover;
 font-family: 'object-fit: cover;';
 min-height: 100%;
}
		@media only screen and (max-width: 767px) {
   .pc {
    display: none;
   }
   .sp {
    display: block;
   }
		}


/* ==========================================================================
   Global
   ========================================================================== */

html {
 font-size: 62.5%;
	overflow-y: scroll;
	height: 100%;
 line-height: 1.15;
 -ms-text-size-adjust: 100%;
 -webkit-text-size-adjust: 100%;
}
html.ofyh {
 height: 100%;
 overflow-y: hidden;
}
body {
 position: relative;
 font-family: YakuHanJPs, "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
 background: #ffffff;
 margin: 0;
 width: 100%;
 -ms-width: calc(100% - (100vw-100%));
 color: #000000;
 font-size: 1.6rem;
 line-height: 1;
 letter-spacing: .04em;
 text-align: left;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
#wrap {
	width: 100%;
 min-height:100vh;
	display:block;
	position:relative;
 overflow:hidden;
}
.ofyh {
	height:100%;
	overflow-y:hidden;
}
.inner {
	*zoom: 1;
	margin: 0 auto;
}
  
  @media screen and (max-width: 767px) {
   body {
    width: 100%;
    font-size: 1.6rem;
    -webkit-text-size-adjust:100%;
    -webkit-overflow-scrolling: touch;
    min-width:inherit;
   }
   #wrap {
    width: 100%;
    min-height:100%;
    height: auto;
    min-width:320px;
   }
  }


/* LOADING
==================================================================================  */
.loadingWrap{
 width: 100%;
 height: 100%;
 position: fixed;
 top: 0;
 left: 0;
	z-index:9999;
	margin:0px;
	padding:0px;
}
.loadingWrapWaku{
 width: 100%;
 height: 100%;
 background: #3c95ce;
 position: relative;
 margin:0px;
 padding:0px;
}
.lds-dual-ring {
	width: 400px;
	height: 400px;
	margin:0px;
	padding:0px;
	position:absolute;
	top: 50%;
	left: 50%;
 transform:translate(-50%, -50%);
 background: url(../img/ts/ts_h1.png) no-repeat 50% 50%;
 background-size:40% auto;
}
.lds-dual-ring div {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: 1px solid #fff;
	box-sizing:border-box;
	border-color: rgba(255,255,255,.5) transparent transparent transparent;
	animation: lds-dual-ring 2s linear infinite;
 -webkit-animation: lds-dual-ring 2s linear infinite;
}
  
  @keyframes lds-dual-ring {
   0% { transform: rotate(0);}
   100% { transform: rotate(360deg);}
  }
  @-webkit-keyframes lds-dual-ring {
   0% { -webkit-transform: rotate(0);transform: rotate(0);}
   100% { -webkit-transform: rotate(360deg); transform: rotate(360deg);}
  }

		@media only screen and (max-width: 767px) {
   .lds-dual-ring {
    width: 106vw;
    height: 106vw;
    background-size: 32% auto;
   }
  }
  


/* header
==================================================================================  */
.hd__inner {
	position: fixed;
	top:0;
	left:0;
 right:0;
 height:48px;
	z-index:1000;
	background: #fff;
}
.hd__logo {
 position: fixed;
 top: -60px;
 left: 40px;
 display: block;
 z-index:1000;
 transition: all 0.5s ease 0s;
 opacity:0;
}
.hd__logo span,
.hd__logo h1 {
 display:block;
 width:280px;
 height:auto;
 transition: 0.3s;
}
.l-header__navi {
 position:absolute;
 top: 18px;
 right: 30px;
 display: block;
 z-index:2;
}
.l-header__navi li {
 display:inline-block;
	margin:0 8px;
}
.l-header__navi li.top,
.l-header__navi li.sp {
 display: none;
}
.l-header__navi li a {
 width:auto;
 margin:0 auto;
 display: block;
 position:relative;
 line-height:48px;
 cursor:pointer;
}
.l-header__navi li a span {
 color:#fff;
 font-size:1.45rem;
 font-style:italic;
 display: block;
}
.l-header__navi li.no a {
	pointer-events: none
}
.l-header__navi li.no a span {
	opacity:.3
}
.hd__menutrigger {
 display: block;
 position: fixed;
 right: 20px;
 top: -100px;
 z-index: 1000;
 cursor: pointer;
 transition: 0.5s;
 opacity:0;
}
.l-gnav__container.is__scroll .hd__menutrigger {
 opacity:1;
 top: 10px;
}
.hd__menutrigger-inner {
 position: relative;
 width: 60px;
 height: 60px;
 background: #f2a5c6;
 border-radius:200%;
}
.hd__menutrigger span {
 transition: 0.3s;
 width: 30px;
 height: 1px;
 background: #fff;
 display: block;
 position: absolute;
 left: 15px;
}
.hd__menutrigger span.hd__menutrigger__line01 {
 top: 19px;
}
.hd__menutrigger span.hd__menutrigger__line02 {
 top: 28px;
}
.hd__menutrigger.is__active .hd__menutrigger-inner {
 background: none;
}
.hd__menutrigger.is__active span.hd__menutrigger__line01 {
 transform: rotate(45deg) translateX(0px);
 left: 15px;
 top: 23px;
}
.hd__menutrigger.is__active span.hd__menutrigger__line02 {
 transform: rotate(-45deg) translateX(0px);
 left: 15px;
 top: 23px;
}
.hd__menutrigger .hd__menutrigger__txt {
 display: block;
 width: auto;
 position: absolute;
 top: 38px;
 left: 0;
 right: 0;
}
.hd__menutrigger .hd__menutrigger__txt em {
 color:#fff;
 font-size:1rem;
 letter-spacing:.02em;
 text-align:center;
 display:block;
 transition: 0.5s;
 position:relative
}
.hd__menutrigger .hd__menutrigger__txt em.menu,
.hd__menutrigger.is__active .hd__menutrigger__txt em.close {
 display: block;
}
.hd__menutrigger .hd__menutrigger__txt em.close,
.hd__menutrigger.is__active .hd__menutrigger__txt em.menu {
 display:none;
}
.hd__menutrigger .hd__menutrigger__txt em.close {
 transition: 0.5s;
}
.backlayer {
 position: fixed;
 overflow-y:auto;
 z-index: 120;
 top: 0;
 left: 0;
 width: 100%;
 height: 0;
 background: #ef8bb6;
 transition: height 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}
.backlayer.is__open {
 height: 100vh;
}
.l-gnav__container.is__open .hd__logo {
 top:130px;
 opacity:1;
}
.l-gnav__container.is__open .l-header__navi {
 position: fixed;
 right: 0;
 top: 0;
 margin: 0;
 display: block;
 z-index: 120;
 padding: 120px 100px 60px 0;
 height:100vh;
 overflow-y: auto;
}
.l-gnav__container.is__open .l-header__navi ul {
 display: block;
 text-align: left;
 margin-bottom: 30px;
}
.l-gnav__container.is__open .l-header__navi li {
 display: block;
 margin: 0;
 -webkit-animation: hd__start 0.8s both;
 animation: hd__start 0.8s both;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(2) {
 animation-delay: .05s; -webkit-animation-delay: .05s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(3) {
 animation-delay: .1s; -webkit-animation-delay: .1s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(4) {
 animation-delay: .15s; -webkit-animation-delay: .15s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(5) {
 animation-delay: .2s; -webkit-animation-delay: .2s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(6) {
 animation-delay: .25s; -webkit-animation-delay: .25s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(7) {
 animation-delay: .3s; -webkit-animation-delay: .3s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(8) {
 animation-delay: .35s; -webkit-animation-delay: .35s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(9) {
 animation-delay: .35s; -webkit-animation-delay: .35s;
}
.l-gnav__container.is__open .l-header__navi li:nth-child(10) {
 animation-delay: .4s; -webkit-animation-delay: .4s;
}  
.l-gnav__container.is__open .l-header__navi li.top,
.l-gnav__container.is__open .l-header__navi li.sp {
 display: none;
}
.l-gnav__container.is__open .l-header__navi li a {
 width:auto;
 margin:0 auto;
 display: inline-block;
 position:relative;
 line-height: 1;
 padding: 18px 16px 18px 36px;
 background: none;
 cursor:pointer;
}
.l-gnav__container.is__open .l-header__navi li a::before {
 content:'';
 position:absolute;
 top:16px;
 left:0;
 width:24px;
 height:24px;
 display: block;
 background: url(../img/ball.png) no-repeat 50% 50%;
 background-size: contain;
}
.l-gnav__container.is__open .l-header__navi li a span {
 font-size: 1.8rem;
}

		@-webkit-keyframes hd__start {
   0% {
    opacity: 0;
    transform: translateY(150px);
   }
   100% {
    opacity: 1;
    transform: translateY(0);
   }
  }
  
  @media screen and (max-width: 1169px) {
   .l-header__navi {
    display:none;
   }
   .hd__menutrigger {
			 opacity:1;
 			top: 10px;
   }
  }
  
  @media screen and (min-width: 768px) {
   .hd__menutrigger:hover span.hd__menutrigger__line01 {
    transform:translateX(-6px);
   }
   .hd__menutrigger:hover span.hd__menutrigger__line02 {
    transform:translateX(6px);
   }
   .hd__menutrigger.is__active:hover span.hd__menutrigger__line01 {
    transform: rotate(45deg) translateX(0px);
   }
   .hd__menutrigger.is__active:hover span.hd__menutrigger__line02 {
    transform: rotate(-45deg) translateX(0px);
   }
  }
  
  @media only screen and (max-width: 767px) {
   .l-gnav__container.is__open .l-header__navi li.top,
   .l-gnav__container.is__open .l-header__navi li.pc {
    display: none;
   }
   .l-gnav__container.is__open .l-header__navi li.sp {
    display: block;
   }
  }
  
  @media only screen and (max-width: 415px) {
   .hd__logo {
    left: 15vw;
   }
   .l-gnav__container.is__open .hd__logo {
    top: 20vw;
   }
   .hd__logo span {
    width: 50vw;
			}
   .l-gnav__container.is__open .l-header__navi {
    position: fixed;    
    right: inherit;
    left: 0;
    top: 44vw;
    padding:0 0 0 15%;
    width:100%;
    height:inherit;
   }
   .l-gnav__container.is__open .l-header__navi ul {
    margin-bottom: 30vw;
   }
   .l-gnav__container.is__open .l-header__navi li a {
    padding: 5vw 0 5vw 9vw;
   }
   .l-gnav__container.is__open .l-header__navi li a::before {
    top:5vw;
    width:6vw;
    height:6vw;
   }
   .l-gnav__container.is__open .l-header__navi li a span {
    font-size: 4.8vw;
   }
   .hd__menutrigger {
    top:5px;
    right:5px;
   }
   .l-gnav__container.is__scroll .hd__menutrigger {
    top: 5px;
   }
  }
  
  
  
/* titleArea
==================================================================================*/
.titleArea {
	display: block;
	position: relative;
	width: 100%;
 min-height:100vh;
 display: flex;
 flex-direction: row-reverse;
 align-content:stretch;
}
.main_img {
 width:50%;
	display: block;
 min-height:100vh;
 background: url(../img/ts/main_img.jpg) no-repeat 50% 0;
 background-size: cover;
 position:relative;
}
.ts_cp_02,
.ts_cp_03 {
 position:absolute;
 display:block;
 right:7%;
 top:30%;
 width:32px;
 transform:rotate(4deg);
 z-index:2;
}
.ts_cp_03 {
 right: calc(7% + 50px);
 padding-top:3%;
}
.ts_cp_02_sp,
.ts_cp_03_sp {
 display:none;
}
.titleArea main {
 width:50%;
 display:flex;
 flex-direction: column;
 justify-content: center;
 padding:10.36% 0 1.68%;
 position:relative;
 background: url(../img/ts/bg_main.jpg) no-repeat 100% 0;
 background-size: cover;
}
.main_img::before {
 content:'';
 position:absolute;
 bottom:0;
 left:0;
 right:0;
 height:100%;
 background:#3c95ce;
 z-index:3;
}
.titleArea main::before {
 content:'';
 position:absolute;
 top:0;
 left:0;
 right:0;
 height:100%;
 background:#3c95ce;
 z-index:3;
}
.ts_award {
 position:absolute;
 top:14px;
 left:1.32%;
 width:83.52%;
 z-index:2;
}
.main_inner {
 width:83.23%;
 max-width:556px;
 margin-left: 9.3%;
 margin-right:auto;
 position:relative;
 display:flex;
 flex-direction: column;
 justify-content: flex-end;
}
.ts_cp_01,
.ts_h1,
.ts_director,
.ts_billing,
.ts_date {
 display:block;
 margin-right:auto;
}
.ts_cp_01 {
 width:100%;
}
.ts_h1 {
 margin-top:6%;
	width:98%;
}
.ts_h1 h1 {
 z-index:2;
 position:relative;
}
.ts_date {
	width:79.5%;
 margin-top:9.7%;
}
.ts_cast {
	width:83.4%;
 margin-top:4.4%;
}
.ts_director {
	width:27.04%;
 margin-top:3.4%;
}
.ts_billing {
	width:89.12%;
 margin-top:1%;
}
.top_linkbtn {
 margin-top:2.5%;
 position:relative;
	display: flex;
 align-items: center;
}
.top_linkbtn .sns {
	display: inline-block;
 text-align: center;
}
.top_linkbtn .sns li {
 float:left;
	display: block;
	width: 36px;
	height: 36px;
 margin-left:8px;
 margin-right:8px;
}
.top_linkbtn .sns li a {
	display: block;
	width: 36px;
	height: 36px;
 padding: 9px;
 border-radius:200%;
 fill:#ffffff;
}
.top_linkbtn .sns li.in a {
 padding:7px;
}
.top_linkbtn .sns li.fb a {
 background: #5576b9;
}
.top_linkbtn .sns li.tw a {
 background:#58a8ec;
}
.top_linkbtn .sns li.in a {
 border:1px solid #d5337a;
 padding:7px;
 background: -webkit-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -webkit-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: -moz-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -moz-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: -ms-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -ms-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: -o-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -o-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: radial-gradient(circle farthest-corner at 32% 106%, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), linear-gradient(135deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 -webkit--webkit-animation: animation 3.5s linear infinite;
 -moz-animation: animation 3.5s linear infinite;
 -webkit-animation: animation 3.5s linear infinite;
 -o-animation: animation 3.5s linear infinite;
 animation: animation 3.5s linear infinite;
}
.top_linkbtn .sns li a .icon {
 max-width:100%;
 max-height:100%;
}
.top_linkbtn .top_social {
 display: inline-block;
 margin-left: 16px;
}
.top_linkbtn .top_social span {
 position: relative;
}
.top_linkbtn .top_social > span#filmarks {
 top: -1px;
 margin-right: 10px;
}
.top_linkbtn .top_social > span#filmarks a,
.top_linkbtn .top_social > span#filmarks a img {
 height: 20px;
}
.top_banner {
 margin-top:3.2%;
 position:relative;
	display: flex;
}
.top_banner span {
 width:26%;
 margin-right:2%;
}
a.trailer_btn {
 position: absolute;
 top: 65%;
 left: 44vw;
 display: block;
 width: 10vw;
 max-width: 160px;
 transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
 cursor:pointer;
 transform: rotate(0deg) ;
 z-index:2;
}
a.bcomment_btn {
 position: absolute;
 top: 70%;
 left: 40vw;
 display: block;
 width: 8vw;
 transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
 cursor:pointer;
 transform: rotate(0deg) ;
 z-index:2;
}
a.comment_btn {
 position: absolute;
 top: 70%;
 left: 48.5vw;
 display: block;
 width: 8vw;
 transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
 cursor:pointer;
 transform: rotate(0deg) ;
 z-index:2;
}
a.special_bnr  {
 position: absolute;
 top: calc(70% + 8.5vw);
 left: 40vw;
 display: block;
 width: 17.5vw;
 transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
 cursor:pointer;
 transform: rotate(0deg) ;
 z-index:2;
}
a.dvd_bnr  {
 position: absolute;
 top: 71.4%;
 left: 59vw;
 display: block;
 width: 27vw;
 transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
 cursor:pointer;
 transform: rotate(0deg) ;
 z-index:2;
}
.newslink {
 margin-top:3%;
}
.newslink a {
 color:#1671a7;
 display:inline-block;
 background: rgba(255,255,255,.7);
 padding:10px 20px;
 border-radius:2em;
 font-size:1.2rem;
 text-decoration:underline;
 cursor:pointer;
}
		@media screen and (min-width: 768px) {
   a.trailer_btn:hover,
   a.comment_btn:hover,
   a.bcomment_btn:hover {
    transform: rotate(20deg) ;
   }
   .newslink a:hover {
    text-decoration:none;
   }
  }
  @media screen and (min-width: 1360px) {
   a.trailer_btn {
    top: 70%;
    left: 543px;
    width: 136px;
   }
   a.bcomment_btn {
    top: 70%;
    left: 543px;
    width: 108px;
   }
   a.comment_btn {
    top:70%;
    left: 658px;
    width: 108px;
   }
   a.special_bnr  {
    top: calc(70% + 116px);
    left: 543px;
    width: 237px;
   }
   a.dvd_bnr  {
    top: 71.4%;
    left: 800px;
    width: 366px;
   }
  }
  

/* is__start  */
body.is__start .main_img::before,
body.is__start .titleArea main::before {
	animation-name: miIn;
 animation-duration: .8s;
 animation-timing-function: cubic-bezier(0.9, 0, 0.1, 1);
 animation-delay: .2s;
 animation-fill-mode: both;
 -webkit-animation-name: miIn;
 -webkit-animation-duration: .8s;
 -webkit-animation-timing-function: cubic-bezier(0.9, 0, 0.1, 1);
 -webkit-animation-delay: .2s;
 -webkit-animation-fill-mode: both;
}
body.is__start .titleArea main::before {
 animation-delay: .8s;
 -webkit-animation-delay: .8s;
}
.ts_cp_01,
.ts_h1 {
 opacity:0;
}
body.is__start .ts_cp_01,
body.is__start .ts_h1 {
	animation-name: logoIn;
 animation-duration: .5s;
 animation-timing-function: cubic-bezier(0,.45,.25,1);
 animation-delay: 1.6s;
 animation-fill-mode: both;
 -webkit-animation-name: logoIn;
 -webkit-animation-duration: .5s;
 -webkit-animation-timing-function: cubic-bezier(0,.45,.25,1);
 -webkit-animation-delay: 1.6s;
 -webkit-animation-fill-mode: both;
}
body.is__start .ts_h1 {
 animation-delay: 1.9s;
 -webkit-animation-delay: 1.9s;
}
		@keyframes miIn {
   0% { height:100%;}
			100% { height:0;}
  }
  @-webkit-keyframes miIn {
   0% { height:100%;}
			100% { height:0;}
  }
  @keyframes logoIn {
   0% { opacity:0; transform: scale(1.4,1.4);}
			100% { opacity:1; transform: scale(1,1);}
  }
  @-webkit-keyframes logoIn {
   0% { opacity:0; transform: scale(1.4,1.4);}
			100% { opacity:1; transform: scale(1,1);}
  }
  
  @media screen and (min-width: 768px) {
  }
  
  @media screen and (max-width: 959px) {
   .main_inner {
    width: 88%;
    max-width: 580px;
    margin-left: 6%;
   }
   .top_linkbtn {
    flex-wrap: wrap;
    align-items: center;
			}
   .top_linkbtn .top_social {
    display:block;
    width:100%;
    margin-left:0;
    margin-top:5%;
			}
  }
  
  @media screen and (max-width: 767px) {
   .titleArea {
    flex-wrap: wrap;
   }
   .main_img,
   .ts_cp_02,
   .ts_cp_03 {
    display:none;
   }
   .ts_cp_02_sp,
   .ts_cp_03_sp {
    position:absolute;
    display:block;
    right:9%;
    top:21vw;
    width:5.5vw;
    transform:rotate(4deg);
    z-index:2;
   }
   .ts_cp_03_sp {
    right: 17%;
    padding-top:2%;
   }
   .titleArea main {
    width: 100%;
    display:flex;
    flex-direction: column;
    justify-content: center;
    padding: 110% 0 0;
    position:relative;
    background: #3c95ce url(../img/ts/main_img.jpg) no-repeat 50% 0;
    background-size: 100% auto;
   }
   .main_img::before {
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    height:100%;
    background:#3c95ce;
    z-index:3;
   }
   .titleArea main::before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:100%;
    background:#3c95ce;
    z-index:3;
   }
   .ts_award {
    top:1.5%;
    left: 1.5%;
    width: calc(98.5% - 80px);
   }
   .main_inner {
    width:92.8%;
    max-width: inherit;
    margin-left: 3.6%;
    display: block;
   }
   .ts_h1 {
    width:100%;
    margin-top: 3%;
   }
   .ts_date {
    width:100%;
    margin-top:4%;
   }
   .ts_cast {
    width:100%;
    margin-top:2.6%;
   }
   .ts_director {
    width:34%;
    margin-top:1%;
   }
   .ts_billing {
    width:100%;
    margin-top:2%;
   }
   a.trailer_btn,
   a.comment_btn,
   a.special_bnr {
    display:none;
   }
   a.theater_btn {
    position: relative;
    top: inherit;
    left: inherit;
    display: block;
    text-align:center;
    color: #fff;
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing:0.1em;
    background: #c6bd3c;
    border-radius: 2em;
    width: 160px;
    max-width:inherit;
    margin-top:20px;
    margin-left:auto;
    margin-right:auto;
   }
   a.theater_btn span {
    display: block;
    padding: 20px 30px 20px 30px;
    position: relative;
    z-index: 2;
			}
   .top_banner {
    margin-top:3vw;
    position:relative;
    display: flex;
    justify-content: center;
   }
   .top_banner span {
    width:40%;
    margin-left:2%;
    margin-right:2%;
   }
   .top_linkbtn {
    margin-top:4%;
    position: relative;
    top: inherit;
    right: inherit;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
   }
   .top_linkbtn .sns {
    display: block;
    text-align:center;
    width: 100%;
    margin: 0 auto;
   }
   .top_linkbtn .sns li {
    float: none;
    display: inline-block;
    width: 11vw;
    height: 11vw;
   }
   .top_linkbtn .sns li a {
    display: block;
    width: 11vw;
    height: 11vw;
    padding:3vw;
   }
   .top_linkbtn .sns li.in a {
    padding:2.8vw;
   }
   .top_linkbtn .top_social {
    display: inline-block;
    margin-top:4%;
    text-align:center;
   }
   .top_linkbtn .top_social > span#filmarks {
    margin-left: 20px;
			}
   a.bcomment_btn {
    position: absolute;
    top: 76vw;
    left: 4vw;
    display: block;
    width: 28vw;
    max-width:300px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    cursor:pointer;
    transform: rotate(0deg) ;
    z-index:2;
   }
   .sp_banner {
    display:block;
    margin: 4vw 0 0;
    text-align:center;
   }
   .sp_banner .special_bnr_sp {
    max-width:480px;
    display:block;
    margin: 0 auto;
   }
   a.dvd_bnr {
    display:none;
   }
   .dvd_bnr_sp {
    display:block;
    margin-top: 10%;
    text-align:center;
   }
   .newslink {
    margin-top:4vw;
    text-align:center;
   }
   .newslink a {
    color:#1671a7;
    display: inline-block;
    background: rgba(255,255,255,.9);
    padding:10px 20px;
    font-size:1.2rem;
    text-align:center;
    cursor:pointer;
   }
   
   #yokokuArea {
    position:relative;
    display:block;
    margin: 4vw -3.88% 0;
    color:#fff;
    background: #000000;
    z-index:2;
   }
   #yokokuArea .movie_box {
    width:100%;
    margin: 0;
    text-align:center;
    overflow-y:hidden;
   }
   #yokokuArea .movie_box ul {
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
   }
   #yokokuArea .movie_box ul::-webkit-scrollbar {
     display: none;
   }
   #yokokuArea .movie_box ul li {
    display: block;
    vertical-align: top;
    white-space: normal;
    position:relative;
    width:92.8vw;
    padding:4vw 0;
    margin:0 auto;
   }
   #yokokuArea .movie_box ul li span {
    display:block;
    height:50vw;
    /*border:1px solid #666;*/
   }
   #yokokuArea .movie_box iframe {
    width: calc(92.8vw - 2px);
    height: calc(50vw - 2px);
    line-height:1em;
   }
   #yokokuArea .movie_box ul li p {
    padding:2vw 0;
    font-size: 5vw;
    font-weight: 100;
    line-height:1.3;
    letter-spacing:0.2em;
    text-align:center;
   }
   #yokokuArea .movie_box ul li p em {
    font-size:2.8vw;
    font-weight:normal;
    margin-left:1vw;
   }
   #yokokuArea .movie_box ul li .new {
    position:absolute;
    top:0px;
    left:0px;
    width:11.59vw;
    height:11.59vw;
    display:block;
    background:#efdb2c;
    border-radius:200%;
    color:#000;
    font-size:3.38vw;
    font-weight:bold;
    text-align:center;
    line-height:11.59vw;
    z-index:2;
   }
  }
  


/* movieModal
==================================================================================*/
#cboxTopCenter {
	height:10px;
}
#cboxClose{
	right: -24px;
	top: -24px;
	width:48px;
	height:48px;
	background:#318ecc url(../img/common/svg_close.svg) no-repeat 50% 50%;
	background-size: auto 20px;
 border-radius:200%;
	z-index:10000;
	transition: transform 0.3s ease-out;
}
#cboxClose:hover{
 background:#318ecc url(../img/common/svg_close.svg) no-repeat 50% 50%;
	background-size: auto 20px;
	transform: rotate(90deg);
}
.moviex{
	padding: 0 0 0px;
	clear:both;
	overflow:hidden;
	height: 100%;
}
.moviex .modal_logo {
 position:fixed;
 top:10px;
 left:10px;
 width:100px;
 opacity:.3;
}
div.player{
	width: 100%;
 height: 100%;
	/*height: calc(100% - 60px);*/
	margin:0 auto 0px;
}
.cs_box {
	width:100%;
	height:100%;
	background:#444;
	position:relative
}
.cs_box p {
	display:block;
	position:absolute;
	top:50%;
	left:0;
	right:0;
	transform: translate(0,-50%);
	color:#FFF;
	font-size:1.5714vw;
	font-family:  Helvetica, Arial, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
	letter-spacing:0.4em;
	text-align:center;
}
.movie_box_tb {
	display:none
}
#nav-trailer{
	display: flex;
	width:100%;
	padding:5px 0;
	text-align:center;
 height:50px;
 background:#000;
}
#nav-trailer div {
	display: inline-block;
	width: 33.33%;
	padding:0 2px;
 height:40px;
}
#nav-trailer div a {
 position:relative;
}
#nav-trailer div a.sin{
	display: block;
	color: #fff231;
	font-size:1.45rem;
 font-weight:700;
	text-align: center;
	text-decoration: none;
	background:#00264c;
 line-height:40px;
	height:40px;
}
#nav-trailer div a.dbl{
	display: block;
	color:#fff231;
	text-align: center;
	text-decoration: none;
	background:#00264c;
	height:40px;
}
#nav-trailer div a em{
 display: inline;
	font-size: 1.2rem;
	font-style:normal;
 line-height:1.3;
 padding:6px 0 0;
}
#nav-trailer div.no a{
	pointer-events: none;
	color:#999;
	background:#333;
}
#nav-trailer div a:hover{
	color:#fff231;
 background:#0065ba;
}
#nav-trailer div.cur a,
#nav-trailer div.cur a:hover {
 color:#fff231;
	background:#0065ba;
	cursor:default;
}



/* Contents
================================================================================== */
.mds{
 position:relative;
 display:block;
 width:3.08%;
 max-width:46px;
 padding-bottom:4%;
 z-index:2;
}
.mds span{
 position: absolute;
 bottom:0;
 left:0;
 right:0;
 width:100%;
 height:0;
 padding-top:100%;
 display:block;
 background:url(../img/ball.png) no-repeat 50% 50%;
 background-size: auto 100%;
}
.en_mds {
 display:inline-block;
 padding-bottom:10px;
 margin-bottom:50px;
 border-bottom:1px solid #ee2e80;
}
.en_mds img {
 width:auto;
 height:18px;
}
.gr_pink {
 box-shadow: 13px 13px 20px 1px rgba(230,65,157,0.2);
}
.gr_green {
 box-shadow: 13px 13px 20px 1px rgba(8,156,143,0.2);
}
.parallax-debug {
 display:none;
}
  
  @media only screen and (max-width: 767px) {
   .mds{
    width:6%;
    max-width: inherit;
    padding-bottom:8%;
   }
   .mds span{
    padding-top:100%;
    background:url(../img/ball.png) no-repeat 50% 50%;
    background-size: auto 100%;
   }
   .en_mds {
    margin-bottom:30px;
   }
   .gr_pink {
    box-shadow: 10px 10px 14px 1px rgba(230,65,157,0.2);
   }
   .gr_green {
    box-shadow: 10px 10px 14px 1px rgba(8,156,143,0.2);
   }
  }


/* ta_img
================================================================================== */
.ta_img {
 width: 100%;
 height: 250px;
 position: relative;
 z-index:2;
}
.ta_img::before {
 content:'';
 position:absolute;
 top:0;
 right:0;
 left:0;
 bottom:0;
 background: -moz-linear-gradient(left,  rgba(242,165,198,0.7) 0%, rgba(243,190,186,0) 25%, rgba(244,215,174,0) 75%, rgba(245,240,162,0.7) 100%);
 background: -webkit-linear-gradient(left,  rgba(242,165,198,0.7) 0%,rgba(243,190,186,0) 25%,rgba(244,215,174,0) 75%,rgba(245,240,162,0.7) 100%);
 background: linear-gradient(to right,  rgba(242,165,198,0.7) 0%,rgba(243,190,186,0) 25%,rgba(244,215,174,0) 75%,rgba(245,240,162,0.7) 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3f2a5c6', endColorstr='#b3f5f0a2',GradientType=1 );
 z-index:3;
}
.ta_img .images {
 -webkit-animation: images 300s linear 0s infinite;
 animation: images 300s linear 0s infinite;
 background: url(../img/ta_img.jpg) left top repeat-x;
 background-size: 2000px 250px;
 -webkit-backface-visibility: hidden;
 backface-visibility: hidden;
 height: 250px;
 width: 100%;
}
		@-webkit-keyframes images {
  	0% { background-position: 0 0; }
  	100% { background-position: -2000px 0; }
		}
  @keyframes images {
  	0% { background-position: 0 0; }
  	100% { background-position: -2000px 0; }
		}
  
  @media only screen and (max-width: 767px) {
   .ta_img {
    height: 125px;
   }
   .ta_img .images {
    -webkit-animation: images 50s linear 0s infinite;
    animation: images 50s linear 0s infinite;
    background: url(../img/ta_img.jpg) left top repeat-x;
    background-size: 1000px 125px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    height: 125px;
    width: 100%;
   }
     @-webkit-keyframes images {
      0% { background-position: 0 0; }
      100% { background-position: -1000px 0; }
     }
     @keyframes images {
      0% { background-position: 0 0; }
      100% { background-position: -1000px 0; }
     }
  }
  
  

/* comment
================================================================================== */
#comment{
	width:100%;
	position:relative;
	background: #384e8a url(../img/comment_bg.jpg) no-repeat 50% 100%;
 background-size: cover;
 background-attachment:fixed;
}
.comment_body {
 position:relative;
}
#comment .contbox {
 position: relative;
 width: 88%;
 max-width: 1360px;
 margin-left: auto;
 margin-right: auto;
 padding-top: 140px;
 padding-bottom: 140px;
}
#comment .mds {
 width:230px;
 max-width:inherit;
 margin-left:auto;
 margin-right:auto;
 position: relative;
 display: block;
 padding-bottom: 0;
 padding-right:50px;
 z-index: 2;
}
#comment .mds span {
 bottom: inherit;
 left: inherit;
 top:0;
 right: 0;
 width: 40px; 
 height: 40px;
 padding-top: 0; 
 display: block;
 background: url(../img/ball.png) no-repeat 100% 50%;
 background-size: 40px 40px;
}
.p-comment {
 width: auto;
 margin-top: 30px;
 margin-left: auto;
 margin-right: auto;
 position: relative;
}
.comment_box {
 width: auto;
 max-width:1360px;
 margin: 30px auto 0;
 display:flex;
 flex-wrap: wrap;
}
#comment .comment {
 width:31%;
 display: block;
 margin: 0 1.15% 2.33%;
 padding:25px 25px 20px;
 background:#ac94dd;
 border-radius:3px;
 position:relative;
}
#comment .comment:nth-child(2n) {
 background: #eb9ebf;
}
.comment p {
 color:#fff;
 font-size: 1.45rem;
 font-weight: 500;
 line-height: 1.6em;
 letter-spacing:0.05em;
 padding: 0 0 10px;
	text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
}
.comment p.name {
 font-size: 1.4rem;
 line-height:1.4;
 display:block;
 padding: 0;
 margin-bottom:10px;
 padding-left:26px;
 background:url(../img/ball.png) no-repeat 0 4px;
 background-size: auto 20px;
}
#comment .comment p.name em {
 font-size: 2.0rem;
 font-weight:bold;
 display: inline-block;
 margin-right:6px;
}
#comment .comment p.name .job {
 display: inline-block;
}
#comment .biko {
 color:rgba(255,255,255,.8);
 font-size: 1.2rem;
 text-align: center;
 margin: 0 auto 20px;
}

		@media only screen and (max-width: 1049px) {
   #comment .comment {
    width:47%;
   }
   #comment .comment:nth-child(4n-2),
   #comment .comment:nth-child(4n-1) {
    background: #eb9ebf;
   }
   #comment .comment:nth-child(4n) {
    background:#ac94dd;
   }
  }
  
  @media only screen and (max-width: 767px) {
   #comment{
    width:100%;
    position:relative;
    background: #384e8a url(../img/comment_bg.jpg) no-repeat 50% 0%;
    background-size: cover;
    background-attachment: inherit;
   }
   #comment .contbox {
    width: 96%;
    max-width: inherit;
    padding-top: 60px;
    padding-bottom: 40px;
   }
   .p-comment {
    width: auto;
   }
   .comment_box {
    max-width: inherit;
    margin: 10px auto 0;
   }
   #comment .comment {
    margin: 0 0.75% 1.5%;
    padding:15px 15px 10px;
    width:48.5%;
   }
   .comment p {
    font-size: 1.25rem;
    line-height:1.5;
    padding: 0 0 5px;
   }
   .comment p.name {
    font-size: 1.25rem;
    margin-bottom:2px;
    padding-left: 24px;
    background: url(../img/ball.png) no-repeat 0 2px;
    background-size: auto 18px;
   }
   #comment .comment p.name em {
    font-size: 1.5rem;
    margin-right:6px;
   }
   #comment .biko {
    font-size: 1.1rem;
    width:96%;
    max-width: inherit;
   }
  }
  
  @media only screen and (max-width: 519px) {
   #comment .contbox {
    padding-top: 30px;
    padding-bottom: 10px;
   }
   
   #comment .mds {
    width:40vw;
    padding-right:10vw;
   }
   #comment .mds span {
    width: 7vw; 
    height: 7vw;
    background: url(../img/ball.png) no-repeat 50% 50%;
    background-size: 6.8vw 6.8vw;
   }
   .p-comment {
    margin-top: 10px;
			}
   /*.comment_box {
    height:80vw;
    overflow:hidden;
    position:relative;
   }
   .comment_box::before {
    content:'';
    position: absolute;
    bottom:0;
    left:0;
    right:0;
    display:block;
    height:40vw;
    background: -moz-linear-gradient(top,  rgba(58,84,159,0) 0%, rgba(58,84,159,0.01) 1%, rgba(58,84,159,0.7) 73%, rgba(58,84,159,0.7) 100%);
				background: -webkit-linear-gradient(top,  rgba(58,84,159,0) 0%,rgba(58,84,159,0.01) 1%,rgba(58,84,159,0.7) 73%,rgba(58,84,159,0.7) 100%);
				background: linear-gradient(to bottom,  rgba(58,84,159,0) 0%,rgba(58,84,159,0.01) 1%,rgba(58,84,159,0.7) 73%,rgba(58,84,159,0.7) 100%);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b3000000',GradientType=0 );
    z-index:2;
   }*/
   #comment .comment {
    margin: 0 0 1.5%;
    width:100%;
   }
   #comment .comment:nth-child(2n-1) {
    background: #eb9ebf;
   }
   #comment .comment:nth-child(2n) {
    background:#ac94dd;
   }
   .comment p {
    line-height:1.33;
   }
  }


/* intro
================================================================================== */
#intro{
	width:100%;
	position:relative;
}
.intro_header {
 position:relative;
 background:#fffbee;
}
.intro_header .images {
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0;
 width:100%;
 height:100%;
 display: block;
 background-repeat:no-repeat;
 background-position:center;
 background-size:cover;
 background-image: url(../img/intro_photo_01.jpg);
}
.intro_header .inner {
 position:relative;
 max-width:1500px;
 margin:0 auto;
 height: 0;
 padding-top:58.82%;
}
.intro_header .cp1 {
 position: absolute;
 display: flex;
 flex-flow: row-reverse nowrap;
 left:40.44%;
 top:0;
 width:17.67%;
 margin-top:13.97%;
 border-left:1px #000 solid;
 z-index:2;
}
.intro_header .cp1 .ih_01 {
 top:-10%;
 width:34.58%;
 margin-left:8.33%;
 position:relative;
}
.intro_header .cp1 .ih_02 {
 top:-10%;
 width:34.58%;
 margin-top:45.8%;
 position:relative;
}
.intro_header .cp2 {
 position: absolute;
 display: flex;
 flex-flow: row-reverse nowrap;
 left:19.41%;
 top:0;
 width:15.44%;
 margin-top:27.2%;
 z-index:2;
}
.intro_header .cp2 .ih_03 {
 width:18.58%;
 margin-left:9.5%;
}
.intro_header .cp2 .ih_04 {
 width:18.58%;
 margin-top:15.23%;
 margin-left:9.5%;
}
.intro_header .cp2 .ih_05 {
 width:18.58%;
 margin-top:30.47%;
 margin-left:9.5%;
}
.intro_header .cp2 .ih_06 {
 width:18.58%;
 margin-top:45.69%;
}
.intro_body {
 position:relative;
}
#intro .mds {
 position: absolute;
 top:0;
 right:4%;
 margin-top:-11%;
}
#intro .contbox {
 position:relative;
 width:100%;
 max-width:1500px;
 margin-left:auto;
 margin-right:auto;
 padding-top: 170px;
}
.p-intro {
 display:flex;
 justify-content: space-between;
 flex-flow: row-reverse nowrap;
 width: 89.70%;
 margin-right:auto;
}
.p-intro_box {
 width: 44%;
 margin-left: auto;
 padding-bottom:160px;
}
.p-intro_box h3 {
 color:#f1338a;
 font-size:2.6rem;
 font-weight:300;
 font-style:italic;
 letter-spacing: -0.04em;
 line-height:1.4;
 margin-bottom:30px;
}
.p-intro_box h3 span {
 color:#b26abb;
 font-size:3.0rem;
}
.p-intro_box p {
 font-size:1.4rem;
 font-weight:400;
 letter-spacing:0.08em;
 line-height:180%;
}
.p-intro_box p em {
 letter-spacing:-0.05em;
}
.p-intro_img {
 width: 44.4%;
 position:relative;
}
.p-intro_img figure {
 position: absolute;
 left:0;
 right:0;
 bottom: 150px;
 z-index:2;
}
  
		@media only screen and (max-width: 1219px) {
   .p-intro_box h3 br {
    display:none;
   }
  }
  
  @media only screen and (max-width: 767px) {
   .intro_header .images {
    background-position: 82% 0;
   }
   .intro_header .inner {
    max-width: inherit;
    padding-top:100%;
   }
   .intro_header .cp1 {
    width:26%;
    margin-top:40%;
   }
   .intro_header .cp1 .ih_01,
   .intro_header .cp1 .ih_02 {
    top:0;
   }
   .intro_header .cp2 {
    left:7%;
    width: 28%;
    margin-top: 66%;
   }
   #intro .mds {
    right:5%;
    margin-top:-16%;
   }
   #intro .contbox {
    width:80%;
    max-width: inherit;
    padding-top: 40%;
   }
   .p-intro {
    width: 100%;
    flex-wrap: wrap;
   }
   .p-intro_box {
    width: 100%;
    margin-left:0;
    padding-bottom: 100vw;
   }
   .p-intro_box h3 {
    font-size:1.8rem;
    margin-bottom:20px;
   }
   .p-intro_box h3 span {
    font-size:2.1rem;
   }
   .p-intro_box p {
    font-size:1.3rem;
    font-weight:400;
   }
   .p-intro_box p em {
    letter-spacing:-0.05em;
   }
   .p-intro_img {
    width: 100%;
   }
   .p-intro_img figure {
    position: absolute;
    left: -10vw;
    right: 20vw;
    bottom: -10vw;
   }
  }
  
  

/* story
================================================================================== */
#story{
	width:100%;
	position:relative;
 background:#f9f7e8;
}
.story_header {
 width:100%;
 height:0;
 padding-top: 58.82%;
 position:relative;
}
.story_header .images {
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0;
 width:100%;
 height:100%;
 display: block;
 background-repeat:no-repeat;
 background-position:center;
 background-size:cover;
 background-image: url(../img/story_photo_01.jpg);
}
.story_body {
 position:relative;
}
#story .mds {
 position: absolute;
 top:0;
 left:3.97%;
 margin-top:-9.55%;
}
#story .contbox {
 position:relative;
 width:100%;
 max-width:1500px;
 margin-left:auto;
 margin-right:auto;
 padding-top: 90px;
 padding-bottom:15%;
}
.p-story {
 display:flex;
 justify-content: space-between;
 flex-flow: row nowrap;
 width: 82.35%;
 margin-left:auto; 
 margin-right:3.97%;
}
.p-story_box {
 width: 50%;
 margin-right: auto;
}
.p-story_box p {
 font-size:1.4rem;
 font-weight:400;
 letter-spacing:0.08em;
 line-height:180%;
}
.p-story_img {
 width: 41.42%;
 padding-top:79px;
 position:relative;
}
.p-story_img figure {
 position: relative;
 z-index:2;
}
.p-story.photo-2 {
 margin-top:9.5%;
}
.p-story.photo-2 .p-story_img:nth-child(1) {
 width: 33.92%;
 padding-top:0;
}
.p-story_img figure.story_photo_03 {
 left: -50%;
 top: -15%;
}
.p-story.photo-2 .p-story_img:nth-child(2) {
 width: 53.57%;
 padding-top:0;
 margin-right:1.33%;
}
.p-story.photo-3 {
 margin-top:5.8%;
}
.p-story.photo-3 .p-story_img:nth-child(1) {
 width: 40.17%;
 padding-top:0;
}
.p-story_img figure.story_photo_05 {
 position:absolute;
 left: -11%;
 right:11%;
 top: 50%;
}
.p-story.photo-3 .p-story_img:nth-child(2) {
 width: 39.64%;
 padding-top:0;
 margin-right:16.96%;
}

		@media only screen and (min-width: 1500px) {
   #story .contbox {
    padding-bottom:225px;
   }
  }
  
  @media only screen and (max-width: 767px) {
   .story_header {
    height:100vw;
    min-height: inherit;
   }
   #story .mds {
    left: inherit;
    right:5%;
   }
   #story .contbox {
    max-width: inherit;
    padding-top:20%;
    padding-bottom:25%;
   }
   .p-story {
    flex-flow: row wrap;
    width: 80%; 
    margin-right: auto;
    position:relative;
   }
   .p-story_box {
    width: 100%;
    margin-right: auto;
   }
   .p-story_box p {
    font-size:1.3rem;
   }
   .p-story_img {
    width: 100%;
    padding-top:10%;
    position:relative;
   }
   .p-story_img figure {
    position: relative;
    z-index:2;
   }
   .p-story_img figure.story_photo_02 {
    margin-top:0%;
    left:-30%;
    width: 120%;
   }
   .p-story.photo-2 {
    margin-top:20%;
    margin-right:0;
    width:100%;
   }
   .p-story.photo-2 .p-story_img:nth-child(1) {
    width:46%;
    padding-top:0;
   }
   .p-story.photo-2 .p-story_img:nth-child(2) {
    width: 54%;
    padding-top:0;
    margin-right:0;
   }
   .p-story_img figure.story_photo_03 {
    left: -15%;
    top: -20%;
    width: 120%;
   }
   .p-story_img figure.story_photo_04 {
    left: -15%;
    width: 120%;
   }
   .p-story.photo-3 {
    margin-top:20%;
    width: 100%;
   }
   .p-story.photo-3 .p-story_img:nth-child(1) {
    width: 50%;
    padding-top:0;
   }
   .p-story_img figure.story_photo_05 {
    position:absolute;
    left: -11%;
    right:11%;
    top: -40%;
   }
   .p-story.photo-3 .p-story_img:nth-child(2) {
    width: 48%;
    margin-right: 0;
   }
  }
 


/* cast
================================================================================== */
#cast{
	width:100%;
	position:relative;
}
.cast_body {
 position:relative;
}
#cast .mds {
 position: absolute;
 top:0;
 right: 9%;
 margin-top: -3%;
}
#cast .contbox {
 position:relative;
 width:100%;
 max-width:1250px;
 margin-left:auto;
 margin-right:auto;
 padding-top: 180px;
 padding-left:7.2%;
 padding-right:7.2%;
 padding-bottom:150px;
}
.profile {
 width:100%;
 position:relative;
}
.profile .photo {
 position:relative;
}
.profile .name {
 position:absolute;
 top:0;
 left:-10%;
 display:block;
 width: 20%;
 padding: 8% 6%;
 background:#FFF;
 z-index:3;
}
.profile .name span {
 display:block;
}
.profile .job {
 font-size:1.8rem;
 color:#ee2e80;
 font-weight:500;
 letter-spacing:-0.08em;
}
.profile .job em {
 display: inline-block;
 margin-right:20px;
 margin-bottom:5px;
}
.profile .job span {
 display: inline-block;
 font-size:2.6rem;
 margin-bottom:5px;
}
.profile p {
 margin-top:30px;
	font-size:1.3rem;
 font-weight:500;
 line-height:1.8;
 padding:0;
}
.p-castbox_01 {
 margin-top:10%;
}
.profile_01 .photo {
 position:absolute;
 width:52.14%;
 bottom:0;
 right:0;
}
.profile_01 .detail {
 position:relative;
 width:58.1%;
 padding:6.5% 6.98% 0%;
 background:#FFF;
 z-index:2;
}
.p-castbox_01 .profile .name {
 width: 8.9%;
 padding: 2.6% 2.6%;
 left: -3%;
 top: -110px;
}
.p-castbox_02 {
 margin-top:12.66%;
 display:flex;
 justify-content: space-between;
 flex-flow: row nowrap;
}
.p-castbox_02 .profile {
 width:47%;
}
.p-castbox_02 .detail {
 position:relative;
 width:88%;
 margin-top:-80px;
 margin-right:auto;
 padding-top:60px;
 padding-left: 15%;
 background:#FFF;
}
.p-castbox_02 .profile .name {
 width: 19.2%;
 left: -9.6%;
}
.p-castbox_02 .profile .job {
 font-size:1.5rem;
}
.p-castbox_02 .profile .job em {
 display: block;
 margin-right:0;
 margin-bottom:10px;
}
.p-castbox_02 .profile .job span {
 display: block;
 font-size:2.4rem;
 margin-bottom:0;
}
.p-castbox_03 {
 margin-top:10.61%;
 display:flex;
 justify-content: space-between;
 flex-flow: row nowrap;
}
.p-castbox_03 .profile {
 width:30%;
}
.p-castbox_03 .detail {
 position:relative;
 padding-top:30px;
 padding-left: 23%;
}
.p-castbox_03 .profile .name {
 top:-90px;
 left:-10%;
}
.p-castbox_03 .profile .job {
 font-size:1.5rem;
}
.p-castbox_03 .profile .job em {
 display: block;
 margin-right:0;
 margin-bottom:10px;
}
.p-castbox_03 .profile .job span {
 display: block;
 font-size:2.2rem;
 margin-bottom:0;
}
.p-castbox_03 p {
	font-size:1.25rem;
 line-height:1.8;
}
  
  @media only screen and (max-width: 1099px) {
   .p-castbox_01 {
    margin-top: 0;
			}
   .p-castbox_01 .profile .name {
    top: 0px;
			}
  }
  
  @media only screen and (max-width: 767px) {
   #cast .mds {
    position: absolute;
    top:0;
    right: 9%;
    margin-top: -3%;
   }
   #cast .contbox {
    width:80%;
    max-width: inherit;
    padding-top: 30%;
    padding-bottom:10%;
    padding-left:0;
    padding-right:0;
   }
   .profile .name {
    position:absolute;
    top:0;
    left:-10%;
    display:block;
    width: 20%;
    padding: 8% 6%;
    background:#FFF;
    z-index:3;
   }
   .profile .name span {
    display:block;
   }
   .profile .job {
    font-size:1.25rem;
   }
   .profile .job em {
    display: block;
    margin-right:0;
    margin-bottom:5px;
   }
   .profile .job span {
    display:block;
    font-size:2.2rem;
    margin-bottom:5px;
   }
   .profile p {
    margin-top:20px;
    font-size:1.3rem;
    font-weight:400;
   }
   .p-castbox_01 {
    margin-top:0;
    margin-bottom:-30px;
   }
   .profile_01 .photo {
    position: relative;
    width: 125%;
    bottom:inherit;
    left:-12.5%;
    right:-12.5%;
   }
   .profile_01 .detail {
    width: 110%;
    padding: 10% 0 0 12.5%;
    top: -30px;
    left: -12.5%;
   }
   .p-castbox_01 .profile .name {
    width: 20%;
    max-width: 100px;
    padding: 8% 6%;
    left: -12.5%;
    top: 0%;
   }
   .p-castbox_02 {
    margin-top:0;
    flex-flow: row wrap;
   }
   .p-castbox_02 .profile {
    width:100%;
    margin-top:40px;
   }
   .p-castbox_02 .detail {
    position:relative;
    width:100%;
    margin-top:0;
    margin-right:0;
    margin-left:auto;
    padding-top: 10%;
    padding-left: 15%;
    background:#FFF;
   }
   .p-castbox_02 .profile .name {
    width: 20%;
    max-width: 100px;
    top: -90px;
    left: -10%;
   }
   .p-castbox_02 .profile .job {
    font-size:1.3rem;
   }
   .p-castbox_02 .profile .job em {
    margin-bottom: 5px;
   }
   .p-castbox_02 .profile .job span {
    display: block;
    font-size:2.0rem;
    margin-bottom:0;
   }
   .p-castbox_02 p {
    font-size:1.2rem;
    line-height:1.8;
   }
   .p-castbox_03 {
    margin-top:0;
    flex-flow: row wrap;
   }
   .p-castbox_03 .profile {
    width:100%;
    margin-top:40px;
   }
   .p-castbox_03 .photo {
    width:80%;
    margin-left: 15%;
   }
   .p-castbox_03 .detail {
    position:relative;
    padding-top:30px;
    padding-left: 15%;
    margin-top:-30px;
    background:#FFF;
    z-index:2;
   }
   .p-castbox_03 .profile .name {
    width: 20%;
    max-width: 100px;
    top:-48vw;
    left:-10%;
   }
   .p-castbox_03 .profile .job {
    font-size:1.2rem;
   }
   .p-castbox_03 .profile .job em {
    margin-bottom:5px;
   }
   .p-castbox_03 .profile .job span {
    display: block;
    font-size:1.8rem;
    margin-bottom:0;
   }
   .p-castbox_03 p {
    margin-top:10px;
    font-size:1.2rem;
    line-height:1.8;
   }
  }



/* staff
================================================================================== */
#staff{
	width:100%;
	position:relative;
}
.staff_header {
 width:100%;
 height:22vw;
 display:flex;
}
.staff_header .images {
 width:50%;
 height:22vw;
 display: block;
 background-repeat:no-repeat;
 background-position:center;
 background-size:cover;
 z-index:0;
}
.staff_header .images:nth-child(1) {
 background-image: url(../img/staff_photo_01.jpg);
}
.staff_header .images:nth-child(2) {
 background-image: url(../img/staff_photo_02.jpg);
}
#staff .mds {
 position: absolute;
 top:0;
 left:3.97%;
 padding-top:23%;
}
#staff .contbox {
 position:relative;
 width:100%;
 max-width:1250px;
 margin-left:auto;
 margin-right:auto;
 padding-top: 180px;
 padding-left:7.2%;
 padding-right:7.2%;
 padding-bottom:150px;
}
.p-staffbox_01 {
 width:75%;
 margin-left:auto;
 margin-right:auto;
}
.p-staffbox_01 .profile {
 margin-top:2%;
 margin-bottom: 14%;
 position:relative;
}
.p-staffbox_01 .photo {
 width:62%;
 margin-left:auto;
 margin-right:3%;
}
.p-staffbox_01 .photo span {
 display: block;
 position: absolute;
 width: 64%;
 bottom: -20%;
 right: -31.5%;
 z-index: 3;
}
.p-staffbox_01 .detail {
 position: absolute;
 bottom:0;
 left:-6%;
 width:55%;
 padding:4% 6% 10%;
 background:#FFF;
 z-index:2;
}
.p-staffbox_01 .profile .name {
 position:absolute;
 top: 0;
 left: -16%;
 display:block;
 width: 13%;
 padding: 0% 4%;
 background:#FFF;
 z-index:3;
}
.p-staffbox_01 .profile .name span {
 display:block;
}
.p-staffbox_01 .profile .job span {
 display: block;
 color:#ee2e80;
 font-size:2.2rem;
 font-weight:500;
 letter-spacing:-0.08em;
}
.p-staffbox_01 .profile p {
 margin-top:30px;
	font-size:1.3rem;
 font-weight:500;
 line-height:1.8;
 padding:0;
}

		@media only screen and (max-width: 767px) {
   .staff_header {
    height:40vw;
   }
   .staff_header .images {
    height:40vw;
   }
   .staff_header .images:nth-child(1) {
    background-position: 15% 0;
			}
   #staff .mds {
    top: 0;
    left: inherit;
    right: 5%;
    padding-top:35%;
   }
   #staff .contbox {
    width: 80%;
    max-width: inherit;
    padding-top: 20%;
    padding-bottom: 10%;
    padding-left: 0;
    padding-right: 0;
   }
   .p-staffbox_01 {
    width:100%;
    margin-top: 30px;
   }
   .p-staffbox_01 .profile {
    margin-top:2%;
    margin-bottom: 14%;
    position:relative;
   }
   .p-staffbox_01 .photo {
    width:90%;
    margin-left:0;
    margin-right: auto;
   }
   .p-staffbox_01 .photo span {
    width: 60%;
    bottom: -20%;
    right: -25%;
   }
   .p-staffbox_01 .detail {
    position: relative;
    bottom: inherit;
    left: inherit;
    width:100%;
    padding:50px 0 0;
   }
   .p-staffbox_01 .profile .name {
    width: 20%;
    max-width: 100px;
    left: inherit;
    top:-10%;
    right: -5%;
    padding: 8% 6%;
   }
   .p-staffbox_01 .profile .job span {
    font-size:2.0rem;
   }
   .p-staffbox_01 .profile p {
    margin-top:20px;
    font-size:1.25rem;
    font-weight:400;
   }
  }



/* credit
================================================================================== */
#credit{
 width:100%;
 position:relative;
 background:#4ea3dc url(../img/credit_bg.jpg) repeat-x 50% 0;
 background-size: auto 100%;
}
#credit .contbox {
 padding: 320px 0 90px;
}
.cd__logo {
 width:340px;
 display:block;
 margin:0 auto;
}
.cd_date {
 width:450px;
 margin-left:auto;
 margin-right:auto;
 margin-top: 30px;
}
#credit .top_linkbtn {
 margin-top: 20px;
 position: relative;
 display: block;
 text-align: center;
}
#credit #pageTop {
 position:fixed;
 display:block;
 bottom: -90px;
 right: 20px;
 width: 60px;
 height: 60px;
 z-index: 90;
 transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
}
#credit #pageTop.show {
 bottom: 20px;
}
#credit #pageTop a {
 display: block;
 height: 0;
 overflow: hidden;
 width: 60px;
 padding: 60px 0 0;
 background: rgba(255,255,255,0);
 border: 1px solid #f2a5c6;
 border-radius:200%;
}
#credit #pageTop a:after {
 position: absolute;
 top: 50%;
 left: 50%;
 margin-top: -2px;
 margin-left: -5px;
 content: "";
 display: block;
 width: 10px;
 height: 10px;
 border: solid 0 #f2a5c6;
 border-width: 2px 0 0 2px;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}

		@media only screen and (max-width: 767px) {
   #credit .contbox {
    padding: 40vw 10% 15vw;
   }
   .cd__logo {
    width:60%;
   }
   .cd_date {
    width:80%;
    margin-top: 5%;
   }
   #credit .top_linkbtn {
    margin-top: 5%;
   }
   #credit #pageTop {
    bottom: -60px;
    right: 20px;
    width: 40px;
    height: 40px;
   }
   #credit #pageTop.show {
    bottom: 20px;
   }
   #credit #pageTop a {
    width: 40px;
    padding: 40px 0 0;
   }
  }
  
  
  

/* [Show Animate] 出現アニメーション
================================================================================== */
.p-show-elem {
 opacity: 0;
 -webkit-transform: translateY(200px);
         transform: translateY(200px);
 transition: opacity .7s cubic-bezier(0,.45,.25,1), -webkit-transform .7s cubic-bezier(0,.45,.25,1);
 transition: transform .7s cubic-bezier(0,.45,.25,1), opacity .7s cubic-bezier(0,.45,.25,1);
 transition: transform .7s cubic-bezier(0,.45,.25,1), opacity .7s cubic-bezier(0,.45,.25,1), -webkit-transform .7s cubic-bezier(0,.45,.25,1);
 transition-delay: .3s;
}
.p-show-elem.is-show {
 opacity: 1;
 -webkit-transform: translateY(0px);
         transform: translateY(0px);
}
.p-show-elem.rev {
 opacity: 0;
 -webkit-transform: translateY(-150px);
         transform: translateY(-150px);
 transition: opacity .4s cubic-bezier(0,.45,.25,1), -webkit-transform .4s cubic-bezier(0,.45,.25,1);
 transition: transform .4s cubic-bezier(0,.45,.25,1), opacity .4s cubic-bezier(0,.45,.25,1);
 transition: transform .4s cubic-bezier(0,.45,.25,1), opacity .4s cubic-bezier(0,.45,.25,1), -webkit-transform .4s cubic-bezier(0,.45,.25,1);
 transition-delay: .2s;
}
.p-show-elem.rev.is-show {
 opacity: 1;
 -webkit-transform: translateY(0px);
         transform: translateY(0px);
}


.comment.p-show-item {
 opacity: 0;
 -webkit-transform: translateY(150px);
         transform: translateY(150px);
 transition: opacity 1.2s cubic-bezier(0,.45,.25,1), -webkit-transform 1.2s cubic-bezier(0,.45,.25,1);
 transition: transform 1.2s cubic-bezier(0,.45,.25,1), opacity 1.2s cubic-bezier(0,.45,.25,1);
 transition: transform 1.2s cubic-bezier(0,.45,.25,1), opacity 1.2s cubic-bezier(0,.45,.25,1), -webkit-transform 1.2s cubic-bezier(0,.45,.25,1);
 transition-delay: .3s;
}
.comment.p-show-item:nth-child(3n-1) {
 transition-delay: .4s;
}
.comment.p-show-item:nth-child(3n) {
 transition-delay: .5s;
}
.comment.p-show-item.is-show {
 opacity: 1;
 -webkit-transform: translateY(0px);
         transform: translateY(0px);
}
		@media only screen and (max-width: 767px) {
   .comment.p-show-item:nth-child(3n-1),
   .comment.p-show-item:nth-child(3n) {
    transition-delay: .3s;
   }
  }


.ih_01.p-show-item,
.ih_02.p-show-item,
.ih_03.p-show-item,
.ih_04.p-show-item,
.ih_05.p-show-item,
.ih_06.p-show-item {
 opacity: 0;
 -webkit-transform: translateY(-150px);
         transform: translateY(-150px);
 transition: opacity 1.2s cubic-bezier(0,.45,.25,1), -webkit-transform 1.2s cubic-bezier(0,.45,.25,1);
 transition: transform 1.2s cubic-bezier(0,.45,.25,1), opacity 1.2s cubic-bezier(0,.45,.25,1);
 transition: transform 1.2s cubic-bezier(0,.45,.25,1), opacity 1.2s cubic-bezier(0,.45,.25,1), -webkit-transform 1.2s cubic-bezier(0,.45,.25,1);
 transition-delay: .5s;
}
.ih_02.p-show-item {
 transition-delay: .8s;
}
.ih_03.p-show-item {
 transition-delay: 1.8s;
}
.ih_04.p-show-item {
 transition-delay: 1.9s;
}
.ih_05.p-show-item {
 transition-delay: 2.0s;
}
.ih_06.p-show-item {
 transition-delay: 2.1s;
}
.ih_01.p-show-item.is-show,
.ih_02.p-show-item.is-show,
.ih_03.p-show-item.is-show,
.ih_04.p-show-item.is-show,
.ih_05.p-show-item.is-show,
.ih_06.p-show-item.is-show {
 opacity: 1;
 -webkit-transform: translateY(0px);
         transform: translateY(0px);
}

.mds.p-show-elem h2 span {
 opacity: 0;
}
.mds.p-show-elem.is-show h2 span{
	animation-name: ballIn;
 animation-duration: .3s;
 animation-timing-function: cubic-bezier(.64,0,1,1);
 animation-delay: .7s;
 animation-fill-mode: both;
 -webkit-animation-name: ballIn;
 -webkit-animation-duration: .3s;
 -webkit-animation-timing-function: cubic-bezier(.64,0,1,1);
 -webkit-animation-delay: .7s;
 -webkit-animation-fill-mode: both;
}
  @keyframes ballIn {
   0% { opacity:0; transform: rotate(-60deg) scale(8,8);}
			100% { opacity:1; transform: rotate(0deg) scale(1,1);}
  }
  @-webkit-keyframes ballIn {
   0% { opacity:0; transform: rotate(-60deg) scale(8,8);}
			100% { opacity:1; transform: rotate(0deg) scale(1,1);}
  }
 
.profile.p-show-item,
.profile.p-show-item .photo span,
.p-staff .staff.p-show-item {
 opacity: 0;
}
.profile.p-show-item.is-show,
.profile.p-show-item.is-show .photo span,
.p-staff .staff.p-show-item.is-show {
	animation-name: profileitemIn;
 animation-duration: .7s;
 animation-timing-function: cubic-bezier(0,.45,.25,1);
 animation-delay: .1s;
 animation-fill-mode: both;
 -webkit-animation-name: profileitemIn;
 -webkit-animation-duration: .7s;
 -webkit-animation-timing-function: cubic-bezier(0,.45,.25,1);
 -webkit-animation-delay: .1s;
 -webkit-animation-fill-mode: both;
}
.profile.p-show-item.psi2.is-show {
 animation-delay: .4s;
 -webkit-animation-delay: .4s;
}
.profile.p-show-item.psi3.is-show {
 animation-delay: .7s;
 -webkit-animation-delay: .7s;
}
.profile.p-show-item.is-show .photo span {
 animation-delay: .7s;
 -webkit-animation-delay: .7s;
}
  @keyframes profileitemIn {
   0% { opacity:0; transform: translate(0,150px);}
			100% { opacity:1; transform: translate(0,0);}
  }
  @-webkit-keyframes profileitemIn {
   0% { opacity:0; transform: translate(0,150px);}
			100% { opacity:1; transform: translate(0,0);}
  }