@import url('https://fonts.googleapis.com/css?family=Didact+Gothic');

/* rest */
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}


/* -----------------------------------------
body
--------------------------------------------*/
html,body{
    height: 100%;
}
html{
    font-size: 62.5%;
}
body {
    margin:0;
    padding:0;
    font-family:  'Ryumin Medium KL', serif;    
    font-size: 16px;
    font-size: 1.6rem;
    color:#202020;
    background: #fff;
    line-height: 1.6;
    letter-spacing: 0.02em;
    -webkit-text-size-adjust: 100%;
 }
body.overlay_open{
  height: 100%;
  overflow: hidden;
}
#bg_white{
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(0,0,0,0.8);
    top:0;
    left:0;
    z-index: 40;
    overflow: auto;
}

#bg_white .space_frame{

    position: absolute;
    top:50%;
    left:50%;
    background: #000;
    transition: all 800ms;

    opacity: 0;
    transform:scale(0.8) translate(-50%,-50%);
    transform-origin: left top;
    margin:0;
    padding: 20px;
    width: 300px;
    height: 170px;

}
#bg_white .space_frame iframe{
    width: 300px;
    height: 170px;
}
#bg_white .space_frame.open{
    transform:scale(1) translate(-50%,-50%);
    opacity: 1;
}
#bg_white .space_frame p{
    margin:0;
    padding: 0;
    cursor: pointer;
    position: absolute;

    text-indent: -1000%;
    overflow: hidden;
    width: 60px;
    height: 60px;
    top:-60px;
    right:0;
    background: #000;
}
#bg_white .space_frame p::before,
#bg_white .space_frame p::after{
    content: '';
    width: 50%;
    height: 2px;
    background: #fff;
    position: absolute;
    display: block;
    top:50%;
    left:50%;
    transform: rotate(45deg) translate(-50%,-50%);
    transform-origin: left center;

}
#bg_white .space_frame p::after{
    transform: rotate(-45deg) translate(-50%,-50%);

}
/* -----------------------------------------
common
--------------------------------------------*/

/* --- clearfix --- */

.cf:before,.cf:after {content:"";display:table;}
.cf:after {clear:both;}
.cf {*zoom:1;}

/* css sprite */
.s{
  background: url(images/common/sprite.png) no-repeat 0 0;
  background-size: 800px 800px;
  text-indent: 100%;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
}
.sb::before{
  content: '';
  background-image: url(images/common/sprite.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 800px 800px;

  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
}
.sa::after{
  content: '';
  background: url(images/common/sprite.png) no-repeat 0 0;
  background-size: 800px 800px;
  text-indent: 100%;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
}

.nobi{
  margin-right: 5px;
  letter-spacing: -5px;
}
/* ----------------- 
reset
----------------- */
.pc,
.tb{
    display: none;
}
em{
    font-style: normal;
}
a{
    text-decoration: none;
    color: inherit;
}
img{
    vertical-align: bottom;
    width: 100%;
    height: auto;
}
ul,ol{
    margin:0;
    padding: 0;
}
li{
    margin:0;
    padding: 0;
    list-style-type: none;
}
p{
    line-height: 1.8;
}
/* ----------------- 




/* ----------------- 
basic frame 
----------------- */
#header{
  padding:10px 70px 10px 70px;
  position: fixed;
  width:100%;
  bottom:0;
  left:0;
  z-index: 20;
  transform:translate(-100%,100%);
  transition: transform 500ms;
  background: rgba(0,0,0,0.9);
  box-sizing: border-box;
}
.menu_open #header{
  transform: translate(0,0);
}

#header .tw,
#header .fb,
#header .eigacheck{
  display: none;
}
#header a,
#header span{
  padding:0.6em 0.4em;
  color: #fff;
  font-size: 14px;
  font-size: 1.4rem;
  display: block;
  font-family: 'Shuei ShogoMincho Sen',serif;
}

#header ul{
  margin:0;
}
#header li{
  border-top:1px solid #999;
}
#header ul li:nth-child(1){
  border-style: none;
}

#menu_sw{
  width: 30px;
  height: 30px;
  position: fixed;
  background: rgba(255,255,255,0.9);
  z-index: 50;
  bottom:20px;
  left:20px;
  border-radius: 2px;
  cursor: pointer;
}
#menu_sw i,
#menu_sw i::before,
#menu_sw i::after{
  display: block;
  position: absolute;
  width: 22px;
  height: 4px;
  background: #666;
  border-radius: 2px;
  top:50%;
  left:50%;
  margin:-2px 0 0 -11px;
  transition: transform 500ms, margin 500ms;
}
#menu_sw i::before,
#menu_sw i::after{
  content: '';
}
#menu_sw i::before{
  margin:-10px 0 0 -11px;
}
#menu_sw i::after{
  margin:6px 0 0 -11px;
}

.menu_open #menu_sw i{
  transform:rotate(45deg);
}
.menu_open #menu_sw i::before,
.menu_open #menu_sw i::after{
  transform:rotate(-90deg);
  margin:-2px 0 0 -11px;
}
#go2pagetop{
  margin:0;
  padding:0;
  width: 30px;
  height: 30px;
  position: fixed;
  right:20px;
  bottom:20px;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  transition:all 500ms;
  transform:translate(0,100px);
  border-radius: 2px;
  z-index: 12;
}
#go2pagetop.open{
 transform:translate(0,0); 
}
#go2pagetop a{
  display: block;
  background: rgba(0,0,0,0.8);
  position: relative;
}
#go2pagetop a::before{
  content: '';
  display: block;
  width: 10px;
  height: 10px;
  border-left:3px solid #fff;
  border-top: 3px solid #fff;

  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-30%) rotate(45deg);
}
footer{
  margin:20px 0 0 0;
    padding:0px 0 0 0;
    background: url(images/common/footer_back_sp.jpg) no-repeat
    center bottom;
    background-size: cover;
  position: relative;
}
footer::after{
  content: '';
  z-index: 1;
  height: 30%;
  width: 100%;
  position: absolute;
  left:0;
  top:-5px;
  background: linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0));
}

footer .date{
  margin:10px auto 0 auto;
  padding:0 60px;
  text-align: center;
  position: relative;
  z-index: 2;
  
}
footer .date img{
  max-width: 349px;
}
footer .banners{
  margin:20px 0;
  position: relative;
  z-index: 2;
}
footer .banners li{
  margin:10px auto;
  width: 298px;
}

footer .banners .filmarks{
  width: 193px;
}

footer .banners .event{
  margin-top:20px;
  margin-bottom: -20px;
}

footer .banners .dvd{
  width: 223px;
}


footer .sns{
  justify-content: center;
  display: flex;
  flex-direction:row;
  flex-wrap: wrap;
}
footer .sns li{
  padding: 0 10px 10px 10px;
}
footer .sns .tw a,
footer .sns .fb a{
  display: block;
  width:40px;
  height: 40px;
  background-position: 0 0;
}
footer .sns .fb a{
 background-position: -50px 0; 
}
footer .sns .eigacheck{
  width: 100%;
  text-align: center;
}
footer .credit{
  margin:0;
  padding:75px 0 10px 0;
  text-align: center;
  font-size: 13px;
  font-size: 1.3rem;
  color: #fff;
}
#tw_popup{
  display: none;
}


/* ----------------- 
list 
----------------- */
.table_dl{
  margin:0 0px;
  display: block;
}
.table_dl table{
  width: 100%;
}
.table_dl tbody,tr{
  display: block;
}
.table_dl th{
  margin-top:0;
  padding:10px 15px 5px 15px;
  display: block;
  font-size:1.4rem;
  line-height: 1;
  text-align: left;
  font-weight: bold;
  border-top:1px solid #999;
}
.table_dl tr:first-child{

}
.table_dl td{
  padding:0 10px 10px 10px;
  font-size: 1.4rem;
  line-height: 1.7;
}
@media screen and (min-width:768px){
  .table_dl table{
    display: table;
  }
  .table_dl thead,
  .table_dl tbody{
      display: table-row-group;
    }
  .table_dl tr{
      display: table-row;
    }
  .table_dl th{
    padding:10px;
    display: table-cell;
    border-bottom:1px solid #999;
    font-size: 1.6rem;
    width: 120px;
  }
  .table_dl td{
    padding:10px;
    border-top:1px solid #999;
    border-bottom:1px solid #999;
    display: table-cell;
    font-size: 1.6rem;
  }
}

/* ----------------- 
color bg_color
----------------- */


/* main */

/* ----------------- 
text
----------------- */
.align_center{
    text-align: center;
}
.align_right{
    text-align: right;
}

.nobashi{
  transform: scale(2,1);
  transform-origin: left center;
  display: inline-block;
  width: 2em;
}
/* ----------------- 
Link 
----------------- */

/* youtube */
#black {
    background: rgba(0,0,0,0.8);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 50;
}
#white{
    background: rgba(255,255,255,1);
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 51;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}
.youtube {
    width: 100%;
    padding:50px 10px;
    box-sizing: border-box;
    max-width: 1100px;
    position: fixed;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
}
.youtube span {
    position: absolute;
    overflow: hidden;
    display: block;
    text-indent: 100%;
    white-space: nowrap;
    width: 40px;
    height: 40px;
    top: 0;
    right: 10px;
    background: #fff;
    z-index: 20;
    cursor: pointer;
}
.youtube span::before,
.youtube span::after{
    content: '';
    width: 30px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 20px;
    left: 5px;
    transform: rotate(-45deg);
}
.youtube span:after {
    transform: rotate(45deg);
}
.youtube .iframe_wrapper{
  width: 100%;
  padding-bottom: 56.25%;
  position: relative;
}
.youtube iframe {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-style: none;
}


.menu a.cloud_funding{
  background:#eebf2d;
  color: #fff;
}

/* background */
.bg_img{
  padding-top:40px;
  position: relative;
}
.bg_img::after{
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 300px;
  z-index: -1;
  top:0;
  left:0;
  background-position: center top;
  background-size:cover;
}
.bg_img::before{
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height:60px;
  left:0;
  top:240px;
  z-index: 2;
}

/* ----------------- 
title 
----------------- */

.title_cross{
  margin:0 auto;
  padding:50px 0;
  text-align: center;
}
.title_cross span{
  padding:15px 30px;
  font-family: 'Shuei Mincho B',serif;
  display: inline-block;
  text-align: center;
  background: rgba(255,255,255,0.9);
  line-height: 1.4;
  position: relative;
}

.title_cross span::before{
  width: 130%;
  height: 100%;
  position: absolute;
  top:0;
  left:-15%;
  content: '';
  display: block;
  border-top:2px solid rgba(255,255,255,0.9);
  border-bottom:2px solid rgba(255,255,255,0.9);
  box-sizing: border-box;
}
.title_cross span::after{
  width: 100%;
  height: 140%;
  position: absolute;
  top:-20%;
  left:0;
  content: '';
  display: block;
  border-left:1px solid rgba(255,255,255,0.9);
  border-right:1px solid rgba(255,255,255,0.9);
  box-sizing: border-box;
}
.title_cross span em{
  display: block;
}
.title_cross span .ja{
  margin-right: -0.1em;
  letter-spacing: 0.1em;

  font-size: 18px;
  font-size: 1.8rem;
}
.title_cross.color_beige span::before,
.title_cross.color_beige span::after{
  border-color:#cac0a3;
}

.title_bold{
  margin:0 auto 30px 0;
  padding:10px 0 15px 0;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: 'Shuei Mincho B',serif;
  text-align:center;
}
.title_bold span{
  margin-right: -0.1em;
  letter-spacing: 0.1em;
  padding:0.2em 0.5em;
  display: inline-block;
  position: relative;

}

.title_bold span::after{
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;

  left:50%;
  bottom:-15px;
  width: 20px;
  height: 5px;
  background:#8e836f;
  transform: translate(-50%,0);
}


.title_frame{
  margin:0 auto 30px 0;
  padding:40px 0 25px 0;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: 'Shuei Mincho B',serif;
  text-align:center;
}
.title_frame span{
  letter-spacing: 0.4em;
  padding:0.4em 0.6em 0.4em 1em;
  display: inline-block;
  position: relative;
  border:2px solid #fff;
  text-shadow:0 0 3px rgba(0,0,0,0.9);
  color: #fff;
  background: rgba(0,0,0,0.4);
}

h3{
  margin:0;
  font-family: 'Shuei ShogoMincho Sen',serif;
  font-size: 21px;
  font-size: 2.1rem;
  text-align: center;
  letter-spacing: 0.2em;
}

h4{
  margin:0.5em 0 0 0;
  font-size: 19px;
  font-size: 1.9rem;
  text-align: center;
}

section{
    padding:40px 0;
    position:relative;

}


article p{
  margin:1em -0.1em 1em 0;
  padding:0;
  letter-spacing: 0.1em;
  line-height: 2.2;
  font-size: 14px;
  font-size: 1.4rem;
  font-family: 'Shuei Mincho M', serif;

}

article p strong{
  font-family: 'Shuei ShogoMincho Sen',serif;
  font-size: 18px;
}

.space_text{
  margin:0 20px;
  padding:10px 15px;
  background: rgba(255,255,255,0.9);
}
.space_lead_1{
  margin:0 20px;
  padding:1px 15px;
  background: #ffe000;
}
.space_lead_1 p{
  margin-left:1px;
  font-size: 18px;
  font-size: 1.8rem;
  font-family: 'Shuei ShogoMincho Sen', serif;
  line-height: 1.6;
  letter-spacing: 1px;
}
.space_lead_2{
  margin:0 20px;
  padding:1px 15px;
  background: rgba(255,255,255,0.9);
}
.space_lead_2 p{
  margin:1em -0.1em 1em 0;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: 'Shuei ShogoMincho Sen', serif;
  line-height: 1.8;
  letter-spacing: 1px;
}
p.space_lead_2{
  margin:0.5em 1px 0.5em 0;
  padding:1px 0;
  background: transparent;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: 'Shuei ShogoMincho Sen', serif;
  line-height: 1.8;
  letter-spacing: 1px;
}

.space_lead_2 + .space_text p:first-child{
  margin-top:-1em;
}
/* #page_home */

#page_home .billing{
  margin:10px 10px 20px 10px;
  text-align: center;
}
#page_home .billing img{
  max-width: 507px;
}

#page_home .copy{
  margin:0 10px;
  text-align: center;
}
#page_home .copy img{
  max-width: 345px;
}

#page_home .group_right{
  display: none;
}

.banner_greetings{
  cursor: pointer;
}

/* about */
#page_about #intro{
  padding:0 0 0 0;
  background: url(about/images/intro_1_sp.jpg) no-repeat center bottom;
  background-size: cover;
}
#page_about #intro section{
  padding-top:0;
}
#page_about #intro .space_text{
  margin-bottom: 150px;
  background: rgba(255,255,255,0.8);
}
#page_about #zeze{
  text-align: right;
}
#page_about #zeze span{
  background-position: -55px -55px;
  width: 122px;
  height: 30px;
}
#page_about #about h2{
  color: #fff;
  text-shadow: 0 0 10px rgba(0,0,0,1);
}

#page_about .bg_img{
  padding-top:130px;
}
#page_about #about::after{
  background: url(about/images/intro_2_sp.jpg) no-repeat center bottom;
  background-size: cover;

}
#page_about #about_para_2{
  padding-top:200px;
  background: url(about/images/intro_4_sp.jpg) no-repeat center top;
  background-size: contain;
}
#page_about #about_para_3{
  padding-top:200px;
  background: url(about/images/intro_5_sp.jpg) no-repeat center top;
  background-size: contain;
}

#page_about #story::after{
  background-image: url(about/images/story_1_sp.jpg);
}


/* history */
#page_history .hs{
  background: url(about/images/history_sprite.png) no-repeat 0 0;
  background-size: 300px 300px;
  text-indent: 100%;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  white-space: nowrap;
}

#page_history #history_text_1{
  position: absolute;
  left:0;
  top:20%;
  width: 27px;
  height: 241px;
  display: block;
  z-index: 2;
}

#page_history::after{
  background: url(about/images/history_back_sp.jpg) no-repeat center bottom;
  background-size: cover;
  overflow: hidden;
}
#page_history .note{
  margin:20px 10px;
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 2;
}
#page_history .space_table{
  margin:0 10px;

    border:1px solid #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);

  background: url(about/images/diagram_back.jpg);
  background-size: 700px 700px;
}
#page_history th,
#page_history td{
  padding:10px;
  line-height: 1.6;
  vertical-align: top;
  position: relative;
}
#page_history th{
  padding:10px 0;
  font-size: 11px;
  font-size: 1.1rem;
}
#page_history thead th{
  color:#fff;
  background:rgba(99,73,66,0.9);
  border-bottom: 2px solid #63615f;

}
#page_history thead th:nth-of-type(2){
  background:rgba(168,89,64,0.9);
  border-right: 3px double #63615f;
  border-left: 3px double #63615f;
}
#page_history thead th:nth-of-type(3){
  background:rgba(75,108,90,0.9);
}

#page_history tbody td{

  font-size: 12px;
  font-size: 1.2rem;
  width: 43%;
  background:rgba(222,217,206,0.4);
}
#page_history td:nth-of-type(1){
  border-right: 3px double #63615f;
  border-left: 3px double #63615f;
  background:rgba(229,224,210,0.5);
}
#page_history tbody th{
  padding:10px 0;
  width: 18%;
  background:rgba(255,255,255,0.8);
}

#page_history tbody tr:nth-of-type(2n) th{
  background:rgba(255,255,255,0.4);
}
#page_history tbody tr:nth-of-type(2n) td{
  background:rgba(255,255,255,0.2);
}
#page_history tbody tr:nth-of-type(2n) td:nth-of-type(1){
  background:rgba(239,237,232,0.6);
}

#page_history .guillo_start{
  border-top:4px solid #e53946;
  border-left:4px solid #e53946;
  border-right:4px solid #e53946;
}
#page_history .guillo_end{
  border-bottom:4px solid #e53946;
  border-left:4px solid #e53946;
  border-right:4px solid #e53946;
}
#page_history .img_group{
  padding:10px 0;
  text-align: center;
}
#page_history .img_group img{
  margin-bottom: 5px;
  display: block;
}
#page_history .img_group span{
  font-size: 11px;
  font-size: 1.1rem;
  display: inline-block;
  text-align: left;
}
#page_history #history_img_5{
  margin:10px 0 0 0;
  padding:10px;
  position: relative;
  left:0;
  top:0;
  width: 180%;
  background: #fff;
  z-index: 10;
  box-sizing: border-box;
}

/* diagram */
#page_diagram{
  padding-bottom: 100px;
  position: relative;
  background: url(about/images/diagram_back.jpg);
  background-size: 700px 700px;
}
#page_diagram::after{
  content: '';
  width: 100%;
  height:100px;
  display: block;
 background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 position: absolute;
 left:0;
 bottom: 0;
}

#page_diagram section{
  margin:0 auto;
  height: 500px;
  width: 330px;
}
#page_diagram .wrapper{
  transform:scale(0.3);
  transform-origin: left top;
  position: relative;
  z-index: 10;
}

#page_diagram .title_cross{
  margin:0 auto 0 0;
  padding:30px 0 20px 0;
  text-align: left;
}
#page_diagram .title_cross span{
  background: rgba(255,255,255,0.5);
}
#page_diagram .title_cross span::before{
  border-style: none;
  height:2px;
  width: 140%;
  background: rgba(203,192,164,0.9);
  left:-10%;
  top:0;
}
#page_diagram .title_cross span::after{
  background: rgba(203,192,164,0.9);
  border-style: none;
  height:2px;
  width: 120%;
  left:-10%;
  top:auto;

  bottom:0;
}
#page_diagram .title_cross em::before,
#page_diagram .title_cross em::after{
  content: '';
  display: block;
  position: absolute;
  width: 1px;
  height:300%;
  left:0;
  top:-30%;
  background: rgba(203,192,164,0.9);
  z-index: 10;
}
#page_diagram .title_cross em::after{
  left:auto;
  right:0;
  height:170%;
}

#page_diagram .da::after,
#page_diagram .db::before{
  content: '';
  background-image: url(about/images/diagram_sprite.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 800px 800px;
  overflow: hidden;
  display: block;
  vertical-align: middle;

  position: absolute;
  z-index: 5;
}

#page_diagram .space_text{
  padding-top:50px;
  background: transparent;
}
#page_diagram .wrapper{
  width: 1100px;
}
#page_diagram .layout_col2,
#page_diagram .layout_col3,
#page_diagram .layout_col4
{
  display: flex;
  justify-content: space-between;
  position: relative;
}

#page_diagram .layout_col4 .col{
  width: 530px;
}
#page_diagram .layout_col2 .col{
  width: auto;
}
#page_diagram .layout_col2 .col.wide{
  width: 270px;
}


#page_diagram dl{
  margin:0 0 20px auto;
  background: #fff;
  width: 100%;
  position: relative;
}
#page_diagram dt{
  margin:0 0 -5px 0;
  padding: 10px 0 0 0;
  color: #4c3c27;
  font-family: 'Shuei ShogoMincho Sen', serif;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: normal;
}
#page_diagram dd{
  padding:0 0 15px 0;
}
#page_diagram .col_right dt{
  text-align: right;
}

#page_diagram .balloon,
#page_diagram p.person span.balloon
{
  position: absolute;
  width: 380px;

  width: 150px;
  padding: 10px;
  z-index: 6;
  background: rgba(76,60,39,0.95);
  color: #fff;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.7;
  top:50%;
  left:0%;
  transform:translate(0,50%);
  border:1px solid #fff;
  box-shadow: 0 0 10px rgba(0,0,0,0.8);
  z-index: -5;
  opacity: 0;
  transition: opacity 500ms;

  display: none;
}
#page_diagram .col_right .balloon,
#page_diagram .col_right p.person span.balloon{
  left:auto;
  right:0%;
}
#page_diagram p.person:hover .balloon,
#page_diagram .people li:hover .balloon{
  z-index: 20;
  opacity: 1;
  display: block;
}
#page_diagram .balloon::before{
  content: '';
  background-image: url(about/images/diagram_sprite.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 800px 800px;
  overflow: hidden;
  display: block;
  position: absolute;
  width:  51px;
  height: 22px;
  top:-21px;
  left:13px;
  background-position:0 -390px;
}
#page_diagram .col_right .balloon::before{
  left:auto;
  right:13px;
}

#page_diagram .people{
  display: flex;
  margin:0 0 0 0;
  padding:0 0 0 10px;
  flex-wrap: wrap;
  justify-content: flex-start;
}


#page_diagram .people li{
  margin:15px 10px 0 0;
  padding: 0 0 0 0;
  line-height: 1;
  width: 120px;
  position: relative;
  cursor: pointer;
}

#page_diagram div.person{
  background: #fff;
  width: 140px;
  margin:0;
  padding:10px 0;
  position: relative;
}

#page_diagram div.person .name{
  line-height: 1;
  margin:5px 10px;
}


#page_diagram p.person{
  margin:0 10px 20px 0;
  padding: 10px;
  line-height: 1;
  width: 120px;
  background: #fff;
  position: relative;
  cursor: pointer;
}
#page_diagram .people .col_2{
  width: 250px;
}
#page_diagram .person img,
#page_diagram .people img{
  display: block;
}
#page_diagram .person em,
#page_diagram .people em{
  margin:5px 0 0 0;
  font-size: 15px;
  font-size: 1.5rem;
  display: block;
  position: relative;
}
#page_diagram .person em span,
#page_diagram .people em span{
  display: inline-block;
  font-size: 12px;
  font-size: 1.2rem;
}
#page_diagram .person span,
#page_diagram .people span{
  margin:5px 0 0 0;
  font-size: 12px;
  font-size: 1.2rem;
  display: block;
}
#page_diagram .comment{
  margin:10px 10px 0 10px;
  color: #4c3c27;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.7;
}

#page_diagram .star{
  font-size: 15px;
  font-size: 1.5rem;
  color:#c30;
}
#page_diagram .exist::before{
  content: '★';
  font-size: 14px;
  font-size: 1.4rem;
  color:#c30;
  position: absolute;
  right:5px;
  top:0;
}

#page_diagram #block_1{
  margin:0 0 20px auto;
  width: 400px;
}
#page_diagram #block_1::before{
  width: 199px;
  height: 216px;
  background-position: 0 -420px;
  top:20px;
  right:140px;
}
#page_diagram #block_2{
  margin-left:auto;
  width: 400px;
  position: relative;
}

#page_diagram #block_2::before{
  width: 45px;
  height: 76px;
  background-position: -150px 0;
  left:30px;
  bottom:140px;
}
#page_diagram #block_2::after{
  width: 34px;
  height: 213px;
  background-position: -200px 0;
  right:-34px;
  top:20px;
}
#page_diagram #block_3{
  margin:0 0 20px 0;
  position: relative;
}
#page_diagram #block_3::before{
  width: 50px;
  height: 745px;
  background-position: -240px 0;
  left:-43px;
  top:190px;
}
#page_diagram #block_3::after{
  width: 39px;
  height: 199px;
  background-position: -300px 0;
  right:-39px;
  top:165px;
}

#page_diagram #person_1{
  margin-top:20px;
}
#page_diagram #block_4{
  z-index: 6;
}
#page_diagram #block_4::before{
  width: 9px;
  height: 20px;
  background-position: 0 -120px;
  left:36px;
  top:-21px;
}
#page_diagram #block_4::after{
  width: 139px;
  height: 75px;
  background-position: 0 -160px;
  right:-36px;
  bottom:-66px;
}

#page_diagram #block_5{
  margin:0 0 40px 0;
}
#page_diagram #block_5::before{
  width: 78px;
  height: 40px;
  background-position: 0 -300px;
  right:125px;
  bottom:-40px;
}
#page_diagram #block_5::after{
  width: 67px;
  height: 40px;
  background-position: -100px -300px;
  right:-39px;
  bottom:-40px;
}

#page_diagram #block_6{
  margin:0 0 40px 0;
}
#page_diagram #block_6::before{
  width: 49px;
  height: 40px;
  background-position: 0 -250px;
  left:65px;
  top:-40px;
}

#page_diagram #block_8::before{
  width: 372px;
  height: 375px;
  background-position: -350px 0;
  left:-372px;
  top:-280px;
}
#page_diagram #block_8::after{
  width: 41px;
  height: 669px;
  background-position: -730px 0;
  right:-41px;
  top:-580px;
}

#page_diagram #person_2{
  margin-top:30px;
  position: relative;
}
#page_diagram #person_2::before{
  width: 112px;
  height: 35px;
  background-position: 0 -350px;
  left:-112px;
  top:110px;
}


/* cast */
#page_cast h1{
  margin-bottom: 100px;
}
#page_cast #space_intro{
  position: relative;

}
#page_cast::after{
  background: url(about/images/cast_back_sp.jpg) no-repeat center top;
  background-size: cover;
  overflow: hidden;
}
#page_cast::before{
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
}
#page_cast #section_3{
  padding-bottom: 0;
}
#page_cast #section_4,
#page_cast #section_5,
#page_cast #section_6,
#page_cast #section_7,
#page_cast #section_8{
  padding:0;
}

#page_cast .cast{
  margin:0 20px;
  padding:10px 15px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#page_cast .cast li{
  margin-bottom: 10px;
  width: 48%;
}
#page_cast .cast li[data-cast_id="41"]
{
  width: 100%;
  text-align: center;
}
#page_cast p.img{
  margin:0;
  padding: 0;
}
#page_cast .name{
  margin:10px 0;
  font-family: 'Shuei ShogoMincho Sen',serif;
  line-height: 1.5;
}


#page_cast .role{
  margin:0 0 8px 0;
  display: block;
  letter-spacing: 0;
  line-height: 1;
}
#page_cast .role .kanji{
  margin-right: 5px;
  font-size: 12px;
  font-size: 1.2rem;
}
#page_cast .role .kana{
  font-size: 12px;
  font-size: 1rem;
  display: inline-block;
}
#page_cast .cast em{
  display: block;
  letter-spacing: 0;
  line-height: 1;
}
#page_cast .cast em .kanji{
  margin-right: 5px;
  font-size: 15px;
  font-size: 1.5rem;
}
#page_cast .cast em span{
  font-size: 10px;
  font-size: 0.9rem;
  letter-spacing: 0;
  display: inline-block;
}


#page_cast .go2detail .cast li{
  cursor:pointer;
}


#page_cast .main .cast li{
  width: auto;
}
#page_cast .main .name{
  margin:15px 0;
}]
#page_cast .main .role{
  margin-bottom: 10px;
}
#page_cast .main .role .kanji{
  margin-right: 10px;
  font-size: 18px;
  font-size: 1.8rem;
}
#page_cast .main .role .kana{
  font-size: 15px;
  font-size: 1.5rem;
}
#page_cast .main em{
  display: block;
}
#page_cast .main em .kanji{
  margin-right: 10px;
  font-size: 30px;
  font-size: 3rem;
}
#page_cast .main em .kana{
  font-size: 16px;
  font-size: 1.6rem;
}

#page_cast #section_7 li{
  margin:10px 0;
  font-family: 'Shuei ShogoMincho Sen',serif;
  line-height: 1.5;
  text-align: center;
}
#page_cast #section_7 .role{
  margin-right: 5px;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.2;
}
#page_cast #section_7 em{
  margin-right: 5px;
  font-size: 15px;
  font-size: 1.5rem;
}

#page_cast #section_8 li{
  margin:10px 0;
  font-size: 14px;
  font-size: 1.4rem;
  font-family: 'Shuei ShogoMincho Sen',serif;
  line-height: 1.5;
  text-align: center;
  width: 33%;
}
#page_cast #section_8 li.col_3{
  width: 100%;
}
#page_cast #section_8 li.col_2{
  width: 48%;
}
#page_cast #section_2::after{
  background: url(about/images/cast_s2_back_sp.jpg) no-repeat center bottom;
  background-size: cover;
}
#page_cast #section_3::after{
  background: url(about/images/cast_s3_back_sp.jpg) no-repeat center bottom;
  background-size: cover;
}

/* cast detail */

#cast_detail{
  padding: 0 0 50px 0;
}

#cast_detail nav li{
  position: fixed;
  left:0;
  bottom:0;
  width: 50px;
  height: 50px;
  background:rgba(255,255,255,0.8);
  z-index: 10;
}
#cast_detail nav li.off{
  display: none;
}

#cast_detail nav li.next{
  left:auto;
  right:0;
}
#cast_detail nav li span{
  text-indent: -100%;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  cursor: pointer;
}
#cast_detail nav li span::after{
  content: '';
  width: 20px;
  height: 20px;
  transform: translate(75%,-50%) rotate(-45deg);
  display: block;
  border-top:2px solid #000;
  border-left:2px solid #000;
}
#cast_detail nav li.next span::after{
  transform: translate(25%,-50%) rotate(135deg);
}
#cast_detail div.space_img{
  margin:0;
  padding: 75% 0 0 0;
  position: relative;

  overflow: hidden;
}

#cast_detail div.space_img img{
  position: absolute;
  left:0;
  top:0;
}
#cast_detail div.space_img img.comment{
  display: none;
}
#cast_detail .name{
  margin:0 20px;
  padding:20px 15px 0 15px;
  font-family: 'Shuei ShogoMincho Sen',serif;
  letter-spacing: 0;
  text-align: center; 
}
#cast_detail .role{
  line-height: 1.4;
}
#cast_detail .role .kanji{
  margin-right: 10px;
  font-size: 18px;
  font-size: 1.8rem;
  display: inline-block;
  vertical-align: top;
}
#cast_detail .role .kana{
  margin-bottom: 10px;
  font-size: 13px;
  font-size: 1.3rem;
  display: inline-block;
  vertical-align: bottom;
}
#cast_detail em{
  line-height: 1.4;
}
#cast_detail em .kanji{
  display: block;
  font-size: 30px;
  font-size: 3rem;
}
#cast_detail em .kana{
  font-size: 16px;
  font-size: 1.6rem;
  display: block;
}


#cast_detail .space_text .comment{
  margin-top:30px;
  padding-top:30px;
  border-top:1px dotted #999;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0;
}
#cast_detail .author{
  margin-top:0;
  padding-top:0;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 0;
  text-align: right;
  font-weight: bold;
}

#cast_detail.off .space_img,
#cast_detail.off .space_text{
  opacity: 0;
}

#cast_detail .space_img,
#cast_detail .space_text{
  transition:opacity 500ms;
}
/* page_staff */

#page_staff::after{
  background: url(about/images/staff_back_sp.jpg) no-repeat center bottom;
  background-size: cover;
  overflow: hidden;
}

#page_staff dl{
  margin-bottom: 30px;
}
#page_staff dt{
  margin:10px 0;
  font-family: 'Shuei ShogoMincho Sen',serif;
  line-height: 1.5;
}


#page_staff dt .role{
  margin:0 0 8px 0;
  display: block;
  letter-spacing: 0;
  line-height: 1;
  margin-right: 5px;
  font-size: 16px;
  font-size: 1.6rem;
}

#page_staff dt em{
  letter-spacing: 0;
  line-height: 1;
}
#page_staff dt em .kanji{
  margin: 0 5px 8px 0;
  font-size: 26px;
  font-size: 2.6rem;
  display: block;
}
#page_staff dt em .kana{
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 0;
  display: block;
}


#page_staff #section_1{
  padding-top:120px;
  padding-bottom: 0;
}
#page_staff #section_1 .space_img{
  margin:20px;
}

#page_staff #section_2{
  padding:20px 0;
}
#page_staff #section_2 dl{
  margin-right:35px;
  margin-left:35px;

}
#page_staff #section_3{
  padding-top:0;
}
#page_staff #section_3 dl{
  margin:2em 35px;
}

#page_staff #section_3 dt{
  margin:0 auto 5px auto;

  font-family: 'Shuei ShogoMincho Sen',serif;
  font-size: 18px;
}
#page_staff #section_3 dd{

  font-size: 15px;
  font-size: 1.5rem;
  margin:5px 0;
  line-height: 1.8;
}
#page_staff #section_3 dd ul{
  margin:0 0;
  display: flex;
  flex-direction:row;
  flex-wrap: wrap;
  justify-content: flex-start;
}

#page_staff #section_3 .song ul{
  margin:-5px auto 0 auto;
  display: block;
}
#page_staff #section_3 dd li{
  margin:5px 15px 0 0;
  line-height: 1.5;
}

#page_theaters::after{
  background: url(theaters/images/img_1_sp.jpg) no-repeat center bottom;
  background-size: cover;
}

#page_theaters .banner{
  margin:10px 20px;
  text-align: center;
}
#page_theaters .banner img{
  max-width: 355px;
}
#page_theaters .space_table{
  margin:0 5px;

  background: #fff;
}

#page_theaters table{
  margin:30px 0 0 0;
  width: 100%;
  border-collapse: collapse;
}
#page_theaters th,
#page_theaters td{
  padding:0.8em 3px;
  font-weight: 400;
  font-family: 'Shuei Mincho M', serif;
  line-height: 1;
  text-align: left;
}
#page_theaters thead th,
#page_theaters thead td{
  border-top:2px solid #999;
  border-bottom:2px solid #999;

  font-size: 11px;
  font-size: 1.1rem;
  font-weight: normal;
}

#page_theaters tbody th,
#page_theaters tbody td{
  font-size: 11px;
  font-size: 1.1rem;
  border-top:1px solid #999;
  border-bottom:1px solid #999;
}
#page_theaters tbody th{
  font-size: 10px;
  font-size: 1rem;
}
#page_theaters tbody td:nth-of-type(2){
  padding-right: 2px;
  font-size: 10px;
  font-size: 1rem;
}
#news_close{
  width: 50px;
  height: 50px;
  cursor: pointer;
  position: fixed;
  top:0;
  right:0;
  background:rgba(202,192,163,0.6);;
}
#news_close::after,
#news_close::before{
  content: '';
  position: absolute;
  width: 40px;
  height: 2px;
  background: #000;
  top:50%;
  left:50%;
  margin:-1px 0 0 -20px;
  transform:rotate(45deg);
}
#news_close::before{
 transform:rotate(-45deg); 
}


#white article.overlay{
  overflow: auto;
  height: 110%;
  -webkit-overflow-scrolling: touch;
}
#page_news .item{
  margin:0 15px;
  padding: 10px 0;
  border-top:1px dotted #ccc;
}
#page_news .img img{
  max-width: 500px;
}
#page_news .banner img{
  max-width: 355px;
}
#page_news .date{
  margin:0.5em 0;
  font-size: 14px;
  font-size: 1.4rem;
}
#page_news h2{
  margin-top:2em;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.6;
  font-weight: bold;
  font-family: serif;
}
#page_news h2:nth-of-type(1){
  margin-top:0;
}
#page_news .note{
  font-size: 0.9em;
}
#page_news a{
  border-bottom: 1px solid #111;
}

#page_news .content p{
  line-height: 1.8;
  font-family: serif;
}

#page_news .group{
  margin:20px 0;
  border:2px solid #ccc;
}
#page_news .group dt{
  padding:10px 10px;
  border-bottom: 2px solid #ccc;
}
#page_news .group dd p{
  margin:0.8em 0;
  padding:0 10px;
}

#page_news .event_item{
  margin:30px 0;
}
#page_news .event_item dt{
  padding:0.4em 10px;
  border-top: 1px dashed #ccc;
  border-bottom: 1px dashed #ccc;
  font-size: 17px;
  font-size: 1.7rem;
}
#page_news .event_item dd{
  margin-bottom: 30px;
}
#page_news .event_item dd p{
  margin:0.8em 0;
  padding:0 10px;
}
#page_news dl{
  font-size: 1.4rem;
}
#page_news dt{
  margin:20px 0 0 0;
  padding:0.4em 0.6em;
  font-weight: bold;
  border:1px solid #ccc;
  line-height: 1;
}
#page_news dd{
  margin-bottom: 5px;
  padding:0.4em 0.6em;
  border-right:1px solid #ccc;
  border-bottom:1px solid #ccc;
  border-left:1px solid #ccc;
}
#page_news b{
  font-weight: bold;
  font-family: リュウミン EH-KL
}
#page_news .note{
  margin-top:5px;
  font-size: 1.3rem;
}

#page_supporters h2 em{
  margin:8px 0 0 0;
  padding:0.2em 1em ;
  display: inline-block;
  background: #eee;
  font-size: 14px;
  font-size: 1.4rem;
  border-radius: 50px;
}

#page_supporters ul{
  margin:-10px 0 0 0;
  display: flex;
  flex-wrap: wrap;
  font-size: 15px;
  font-size: 1.5rem;
}
#page_supporters ul li{
  padding:7px 0;
  width: 33%;
}
#page_supporters ul li.col_2{
  width: 66%;
}
#page_supporters ul li.col_3{
  width: 100%;
}
#page_supporters .banner{
  margin:10px auto 40px auto;
  padding: 0;
  width: 298px;
}

#page_comments::after{
  background: url(images/comments/back_sp.jpg) no-repeat center top;
  background-size: cover;
}


#page_comments li{
  margin:3em 0;
  position: relative;
}

#page_comments  li:first-child{
  margin-top:0;
}
#page_comments dl,
#page_comments dd{
  position: relative;
}
#page_comments dl::before,
#page_comments dl::after,
#page_comments dd::before,
#page_comments dd::after{
  content: '';
  position: absolute;
  width: 15px;
  height: 15px;
  bottom:0;
  left:0;

}
#page_comments  dl{
  margin:0 ;
  display: flex;
  flex-direction: column-reverse;
}
#page_comments  dt{
  text-align: right;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: 'Shuei ShogoMincho Sen', serif;
}
#page_comments  dt::before{
    content: '─';
    margin: 0 5px 0 0;
    display: inline-block;
    transform: scale(2,1);
    transform-origin: right top;
    width: 2em;
}
#page_comments  dt span{
  font-size: 12px;
  font-size: 1.2rem;
}
#page_comments  dd{
  margin-bottom: -0.3em;
}

#page_awards::after{
  background: url(images/awards/img_1_sp.jpg) no-repeat center bottom;
  background-size: cover;
  overflow: hidden;

}

#page_awards section{
  padding-top:0;
  padding-bottom: 0px;
}
#page_awards section:nth-of-type(1){
  padding-top:100px;
}
#page_awards section:last-of-type{
  padding-bottom:100px;
}
#page_awards .list_awards{
  margin:0 20px;
  padding:0 15px;
}
#page_awards .list_awards dt{
  font-family: 'Shuei ShogoMincho Sen', serif;
  line-height: 1.4;
}
#page_awards .list_awards dd{
  margin-top:0.3em;
  margin-bottom: 1.5em;
  font-size: 13px;
  font-size: 1.3rem;
}
#page_awards .list_awards a{
	text-decoration: underline;
}
#page_awards .note{
  margin:0 20px;
  padding:0 15px;
  text-align:right;
}
#page_awards .title_frame{
  margin-bottom: 15px;
}
#page_awards .title_frame span{
  background: rgba(76,60,39,0.7);
}

@media screen and (min-width: 500px)
{
  #page_diagram section{
    height: 600px;
    width: 440px;
  }
  #page_diagram .wrapper{
    transform:scale(0.4);
  }
}

@media screen and (min-width: 600px)
{
  #page_diagram section{
    height: 800px;
    width: 550px;
  }
  #page_diagram .wrapper{
    transform:scale(0.5);
  }
}

/* tablet or pc devices*/
@media screen and (min-width:768px){
  /*　768px以上はここを読み込む　*/

  .sp{
      display: none;
  }
  .pc{
      display: inline;
  }
  .wrapper{
      margin:0 auto;
      max-width: 1100px;
      position: relative;
  }

  footer{
    margin:0 0 0 0;
    padding-top:30px;
    background: url(images/common/footer_back_pc.jpg) no-repeat center bottom;
    background-size: cover;

    padding-top:0;
  }
  footer::after{
    height: 80px;
    background: linear-gradient(rgba(255,255,255,1) 50%, rgba(255,255,255,0));
  }

  footer .date{
    padding:30px 0;
    padding:0 0 50px 0;
    text-align: center;
  }


  footer .banners{
    margin:0 0;
    width: auto;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: center;


  }
  footer .banners li{
    width: 30%;
    padding-bottom:5px;
  }
  footer .banners .event{
    display: none;
  }
  footer .banners .dvd{
    display: none;
  }
  footer .banners li:first-child{
    padding-bottom: 0;
  }

  footer .sns{
    align-items: center;
  }
  footer .sns .eigacheck{
    width: auto;
  }


  #menu_sw{
    width: 40px;
    height: 40px;
  }
  #go2pagetop{
    width: 40px;
    height: 40px;
  }
  #go2pagetop a{
    width: 40px;
    height: 40px;
  }

  .youtube{
    padding:60px 20px;
  }
  .youtube span{
    right:20px;
  }



  .menu li.ticket{
    width: 100%;
  }

  /* ----------------- 
  title 
  ----------------- */
  .title_cross{
    padding:100px 0;
  }
  .title_cross span{
    padding:20px 70px;
  }
  .title_cross span .ja{
    font-size: 36px;
    font-size: 3.6rem;
  }
  .title_cross span .eng{
    font-size: 21px;
    font-size: 2.1rem;
  }

  .title_bold{
    padding:20px 0 25px 0;
    font-size: 28px;
    font-size: 2.8rem;
  }



  .bg_img::after{
    height: 480px;
  }
  .bg_img::before{
    top:420px;
  }
  .title_bold span::after{
    width: 30px;
    height: 8px;
  }
  .title_frame{
    padding:100px 0 55px 0;
    font-size: 28px;
    font-size: 2.8rem;
  }

  article p{
    font-size: 15px;
    font-size: 1.5rem;
  }

  .space_lead_1 p{
    font-size: 32px;
    font-size: 3.2rem;
  }
  .space_lead_2 p{
    font-size: 24px;
    font-size: 2.4rem;
  }
  p.space_lead_2{
    font-size: 24px;
    font-size: 2.4rem;
  }
  /* home */
  #page_home #space_main{
    padding:380px 0 0 0;
    position:relative;

  }
  #page_home #space_main::after{
    content: '';
    position: absolute;
    top:-30px;
    left:50%;
    width: 100%;
    height: 900px;
    background: url(images/home/main_pc.jpg) no-repeat center top;
    background-size:cover;
    z-index: -1;
    transform:translate(-50%,0);

  }
  #page_home #space_main::before{
    content: '';
    position: absolute;
    left:0;
    top:700px;
    display: block;
    width: 100%;
    height: 200px;
    background: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,1));
    z-index: 0;
  }

  #page_home .wrapper{
    position: relative;
  }

  #page_home .copy3 img{
    display: none;
  }
  #page_home .copy3{
    margin:0;
    padding: 0;
    position: absolute;
    right:0px;
    top:145px;
    z-index: 3;
  }
  #page_home .copy3 img:nth-of-type(1){
    display: inline;
    width: 191px;
  }


  #page_home .copy2{
    margin:0;
    width: 66px;
    position: absolute;
    top:5vw;
    right:31vw;
    transform: translate(50%,0);
  }
  #page_home p,
  #page_home h1{
    margin:0;
    padding: 0;
    position: relative;
    z-index: 2;
    text-align: center;
  }
  /*
  #page_home h1{
    margin:0 auto;
    top:380px;
    left:50%;
    position: absolute;
    transform: translate(-50%,0);
    width: 100%;
    text-align: center;
  }
  */
  #page_home h1{
    margin:-10px 20px;
    text-align: center;
  }
  #page_home h1 img{
    max-width: 844px;
  }

  #page_home .copy2{
    position: absolute;
    left:50%;
    top:-100px;
    margin:0;
    padding: 0;
    transform:translate(-300px,0);
  }
  #page_home .copy2 img{
    display: block;
    width: 300px;
  }


  #page_home .copy{
    margin:40px 20px;
  }
  #page_home .copy img{
    max-width: 1022px;
  }

  #page_home .banners.pc{
    display: block;
    height: 0;
    width: 100%;
    position: absolute;
    left:0;
    top:50%;
    transform:translate(10px,-20px);
    z-index: 10;
  }
  #page_home .banners.pc img{
    width: 160px;
  }
  #page_home .banners.pc .dvd img{
    width:160px;
    right:20px;
    left:auto;
    top:-10px;
    position: absolute;

  }
  #page_home .banners.pc .event{
    top:20px;
    left:0;
  }
  #page_home .banners.pc .event img{
    width: 200px;
  }

  #page_home .group_right{
    display: none;
  }




  /* about */
  #page_about #intro{
    padding:0 0 0 0;
    background-image: url(about/images/intro_1_pc.jpg);
  }

  #page_about #intro .space_text{

    margin-bottom: 250px;
  }
  #page_about .bg_img{
    padding-top:210px;
  }
  #page_about #about::after{
    background-image: url(about/images/intro_2_pc.jpg);
    background-position: center top;

  }
  #page_about #about_para_2{
    background-image:url(about/images/intro_4_pc.jpg);
  }
  #page_about #about_para_3{
    padding-top:0;
    background-image: none;
  }


  #page_about #story::after{
    background-image: url(about/images/story_1_pc.jpg);
    background-position: center bottom;
  }

  #page_diagram section{
    height: 1000px;
    width: 688px;
  }
  #page_diagram .wrapper{
    transform:scale(0.6);
  }
  #page_diagram .balloon,
  #page_diagram p.person span.balloon
  {
    width: 380px;
  }

  #page_cast::after{
    background-image: url(about/images/cast_back_pc.jpg);
    background-position: center top;
  }
  #page_cast .main .cast li{
    width: 48%;
  }


  #page_cast section .title_cross{
    font-size: 30px;
    font-size: 3rem;
  }
  #page_cast #section_4 .title_cross,
  #page_cast #section_5 .title_cross,
  #page_cast #section_6 .title_cross,
  #page_cast #section_7 .title_cross,
  #page_cast #section_8 .title_cross{
    padding:50px 0;
  }


  #page_cast .cast{
    justify-content: flex-start;
  }
  #page_cast .cast li{
    margin-right: 1%;
    width: 24%;
  }

  #page_cast .role .kanji{
    font-size: 14px;
    font-size: 1.4rem;
  }
  #page_cast .cast em .kanji{
    font-size: 18px;
    font-size: 1.8rem;
  }


  #page_cast .main .cast{
    justify-content:space-between;
  }
  #page_cast .main .cast li{
    margin-right: 0;
    width: 48%;
  }
  #page_cast .main .role .kana{
    font-size: 16px;
    font-size: 1.6rem;
  }
  #page_cast .main em .kanji{
    font-size: 30px;
    font-size: 3rem;
  }

  #page_cast #section_1{
    padding-top:80px;
  }

  #page_cast #section_7 .cast{
    justify-content: center;
    margin:0 auto;
  }
  #page_cast #section_7 li{
    width: 24%;
  }
  #page_cast #section_8 .cast{
    justify-content: center;
    margin:0 auto;
  }
  #page_cast #section_8 li{
    width: 24%;
  }
  #page_cast #section_8 li.col_3{
    width: 100%;
  }
  #page_cast #section_8 li.col_2{
    width: 30%;
  }


  #cast_detail{
    margin:100px auto;
    width: 350px;
  }
  #cast_detail div.space_img{
    margin-left:auto;
    margin-right:auto;
    width: 350px;
  }
  #cast_detail div.space_text{
    margin-left:auto;
    margin-right:auto;
    padding-left:0;
    padding-right: 0;
  }
  #cast_detail nav li{
    top:50%;
    transform:translateY(-50%);
  }


  #page_staff::after{
    background-image: url(about/images/staff_back_pc.jpg);

  }

  #page_staff #section_1 .space_img{
    margin-right:35px;
    float:right;
    width: 40%;
  }

  #page_staff #section_3 .layout{
    margin:0 25px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  #page_staff #section_3 dl{
    margin:0 1% 20px 1%;
    width: 30%;
  }
  #page_staff #section_3 dl.col_3{
    width: 100%;
  }
  #page_staff #section_3 dl.col_50{
    width: 48%;
  }
  #page_staff #section_3 dl.col_2{
    width: 60%;
  }

  /* #page_history */


  #page_history::after{
    background-image: url(about/images/history_back_pc.jpg);
    background-position: center top;
  }
  #page_history #history_text_1{
    top:20%;
  }
  #page_history .note{
    margin:10px 20px;
    font-size: 14px;
    font-size: 1.4rem;
  }
  #page_history .space_table{
    margin:0 20px;
  }
  #page_history th,
  #page_history td{
    font-size: 15px;
    font-size: 1.5rem;
  }
  #page_history tbody th{
    width: 20%;
  }
  #page_history tbody td{
    font-size: 15px;
    font-size: 1.5rem;
  }
  #page_history .img_group span{
    font-size: 14px;
    font-size: 1.4rem;
  }
  #page_history .img_group img{
    margin: 0 auto;
    max-width: 160px;
  }

  #page_history #history_img_5{
    width: 190%;
  }
  #page_history #history_img_5 img{
    max-width: 830px;
    width: 100%;
  }

  #page_theaters::after{
    background-image: url(theaters/images/img_1_pc.jpg);
  }
  #page_theaters .space_table{
    margin:0 20px;
    padding:10px 15px;
  }
  #page_theaters thead th,
  #page_theaters thead td{
    padding: 0.8em 0.8em;
    font-size: 14px;
    font-size: 1.4rem;
  }
  #page_theaters tbody th,
  #page_theaters tbody td{
    padding: 1em 0.8em;
    font-size: 16px;
    font-size: 1.6rem;
  }

  #page_theaters tbody td:nth-of-type(2){
      font-size: 16px;
      font-size: 1.6rem;
  }
  #page_news{
    padding-top:0;
  }
  #page_news #title_cross{
    padding: 50px 0;
  }

  #page_news .table_dl{

  }

  #page_supporters p{
    text-align:center;
  }
  #page_supporters h2 br.sp{
    display: inline;
  }
  #page_supporters ul li{
    text-align: center;
    font-size: 16px;
    font-size: 1.6rem;
  }
  #page_supporters ul li.col_2{
    width: 33%;
  }
  #page_supporters ul li.col_3{
    width: 100%;
  }

  #page_comments::after{
    background-image: url(images/comments/back_pc.jpg);
  }

  #page_comments ul{

  }
  #page_comments li{
    padding:0 100px;
    position: relative;
    transform: translate(-80px,0);


  }
  #page_comments li:nth-of-type(2n)
  {
    transform: translate(80px,0);
  }
  #page_comments li p{
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.8;
  }
  #page_comments dt{
    font-size: 18px;
    font-size: 1.8rem;
  }
  #page_comments dt span{
    font-size: 14px;
    font-size: 1.4rem;
  }




  #page_awards p.note{
  	margin-left:auto;
  	margin-right: auto;
  	max-width: 700px;
  }
	#page_awards .list_awards dt{

	  	margin-left:auto;
	  	margin-right: auto;
	  	max-width: 700px;
		font-size: 18px;
		font-size: 1.8rem;
	}
	#page_awards .list_awards dd{
  	margin-left:auto;
  	margin-right: auto;
  	margin-bottom: 2em;
  	max-width: 700px;
		margin-top:0.4em;
		font-size: 16px;
		font-size: 1.6rem;
	}
}

@media screen and (min-width:900px){
  #page_diagram section{
    height: 1200px;
    width: 825px;
  }
  #page_diagram .wrapper{
    transform:scale(0.75);
  }
  #page_history #history_text_1{
    top:30%;
  }


  #page_home p.billing{
    position: relative;
    z-index: 0;
  }
  #page_home .banners.pc{
    position: absolute;
    margin-left: -450px;
    left:50%;
    top:320px;
    z-index: 2;

  }
  #page_home .banners.pc li.event img{
    left:0;

  }
  #page_home .banners.pc li.dvd img{
    top:130px;
    left:0;
  }

  #page_home #space_main .group_right{
    display: block;
    position: absolute;
    margin-right: -450px;
    right:50%;
    top:330px;
    width: 180px;
    z-index: 2;
  }
  #page_home #space_main .group_right li{
    margin-bottom: 15px;
  }
  #page_home #space_main .filmarks{
    position: relative;
  }
  #page_home #space_main .crowdf,
  #page_home #space_main .supporters{
    position: relative;
    width: 0;
  }
  #page_home #space_main .crowdf img,
  #page_home #space_main .supporters img{
    margin-left:-20px;
    width: 220px;
  }

  #page_awards::after{
    background-image:url(images/awards/img_1_pc.jpg);
    background-position: center top;
  }

  #page_awards .list_awards dt{

  }
  #page_awards .list_awards dd{
  	font-size:16px;
  	font-size:1.6rem;
  }
}

@media screen and (min-width:1100px){

  .sp{
    display: none;
  }
  .pc{
    display: inline-block;
  }

  #menu_sw{
    display: none;
  }
  #header{
    padding: 0;
    bottom:auto;
    top:0;
    left:0;
    width: 100%;
    transform:translate(0,0);
    transition:none 0s;
  }
  #header nav{
    margin:0 auto;
    width: 1200px;
  }
  #header ul{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    line-height: 17px;
  }
  #header li{
    padding: 0 5px;
    border-style: none;
  }
  #header a,
  #header span{
    padding:1em 5px;
    font-size: 17px;
    font-size: 1.7rem;
    color: #fff;
    cursor:pointer;
  }

  #header .tw,
  #header .fb,
  #header .eigacheck{
    display: list-item;
  }
  #header .tw .s,
  #header .fb .s{
    padding: 0;
    width: 30px;
    height: 30px;
    background-position: -100px 0;
  }
  #header .fb .s{
   background-position: -130px 0; 
  }
  #header .tw{
    margin:0 0 0 auto;
  }

  footer{
    padding:27vw 0 70px 0;
  }
  footer .date{
    padding: 10px 0;
    position: fixed;
    width: 100%;
    bottom:0;
    z-index: 10;
    background: #fff;
  }
  footer .banners,
  footer .sns{
    display: none;
  }
  #tw_popup{
      display: block;
      transform: translateX(-240px);
      transition: transform 500ms;
      width: 230px;
      height: 450px;
      position: fixed;
      top:200px;
      left:0;
      background: #fff;
      border:5px solid #28a7df;
      z-index: 10;
      box-shadow: 1px 1px 5px rgba(0,0,0,0.4);
  }
  #tw_popup.open{
    transform: translateX(0);
  }

  #timeline{
    width: 230px;
    height: 430px;
    overflow: auto;

  }
  #timeline #display_timeline{
    margin:0;
    padding:0;
    width: 55px;
    height: 196px;
    background-position: 0 -55px;
    position: absolute;
    top:0;
    right:-60px;
    cursor: pointer;
  }
  #timeline iframe{
    height: 180px;
    overflow: auto;
  }




  /* layout */
  .layout_1{
    display: flex;
    flex-wrap: nowrap;
  }
  .layout_1 .space_text{
    width: 470px;
  }
  .layout_1 .space_img{
    flex:1;
  }
  .layout_2{
    display: flex;
    flex-wrap: nowrap;
  }
  .layout_2 .space_text{
    width: 730px;
  }
  article{
    padding:50px 0 0 0;
    overflow: hidden;
  }

  section{
      padding:50px 0;
  }
  article p{
    font-size: 16px;
    font-size: 1.6rem;
  }
  .space_lead_1{
    padding:1px 30px;
  }
  .space_lead_2{
    padding: 1px 30px;
  }
  .space_text{
    padding: 10px 30px;
  }

  .bg_img{
    padding-top:150px;
  }
  .bg_img::after{
    height:600px;
  }

  .title_frame{
    padding-bottom: 75px;
  }
  #page_home #space_main{
    padding-top:30vw; 
  }
  #page_home #space_main::after{
    top:0;
  }
 #page_home h1{
    margin:-30px 0;
  }
  #page_home .billing{
    padding: 0 0 10px 0;

  }

  #page_home .copy3{
    margin:0;
    padding: 0;
    position: absolute;
    right:3vw;
    top:30px;
  }
  #page_home .copy3 img:nth-of-type(1){
    display: none;
  }
  #page_home .copy3 img:nth-of-type(2){
    display: inline;
    width: 165px;
  }

  #page_home .copy2{
    transform:translate(-350px,50px);
  }
  #page_home .copy2 img{
    width: 352px;
  }


  #page_home #space_main .banners.pc{
    top:300px;

    margin-left: -480px;
    width: 298px;

  }
  #page_home #space_main .banners.pc img{
    margin-bottom: 15px;
    width: 193px;
  }
  #page_home #space_main .banners.pc .dvd img{
    /* width: 223px; */
  }

  #page_home #space_main .group_right{
    margin-top:130px;
    margin-top:20px;
    top:50%;
    width: 180px;
  }

  #page_about #intro{
    background-image: url(about/images/intro_1_pc.jpg);
    background-attachment: fixed;
  }
  #page_about #about{
    padding-top:300px;
  }

  #page_about .layout_1{
    flex-direction: row-reverse;
    position: relative;
  }
  #page_about .layout_1 .space_img img{
    position: absolute;
    width: 660px;
    top:80px;
    left:550px;
  }

  #page_about #about_para_2{
    padding-top:400px;
  }


  #page_about #about_para_3 img{
    position: absolute;
    width: 660px;
    top:80px;
    left:550px;
  }

  #page_about #story{
    padding-top:330px;
  }

  #page_about #img_story_2{
    top:35px;
  }

  #page_about #story .layout_1{
    flex-direction: column;
  }

  #page_diagram section{
    height: auto;
    width: 100%;
  }
  #page_diagram .wrapper{
    transform:scale(1);
  }


  /* #page_cast */
  #page_cast::after{
    background-position: center top;
  }
  #page_cast::before{
    top:540px;
  }

  #page_cast #section_4 .title_cross,
  #page_cast #section_5 .title_cross,
  #page_cast #section_6 .title_cross,
  #page_cast #section_7 .title_cross,
  #page_cast #section_8 .title_cross{
    padding:65px 0;
  }

  #page_cast .cast{
    margin-left:auto;
    margin-right:auto;
    padding:0;
    max-width: 940px;
  }
  #page_cast .cast li{
    margin:0 20px 25px 0;
    width: 220px;
  }
  #page_cast .cast li:nth-of-type(4n-4){
    margin-right: 0;
  }
  #page_cast .cast em .kanji{
    font-size: 20px;
    font-size: 2rem;
  }

  #page_cast #section_1{
    padding-top:160px;
  }

  #page_cast .main .cast{
    justify-content:space-between;
  }
  #page_cast .main .cast li{
    margin-right: 0;
    width: 48%;
  }
  #page_cast .main .role .kana{
    font-size: 16px;
    font-size: 1.6rem;
  }
  #page_cast .main em .kanji{
    font-size: 30px;
    font-size: 3rem;
  }

  #page_cast .main .cast li{
    margin-bottom: 30px;
    width: 450px;
  }
  #page_cast #section_2::after{
    background: url(about/images/cast_s2_back_pc.jpg) no-repeat center bottom;
    background-size: cover;
  }
  #page_cast #section_3::after{
    background: url(about/images/cast_s3_back_pc.jpg) no-repeat center bottom;
    background-size: cover;
  }

  #page_cast #section_5 .cast{
    justify-content: center;
  }

  #page_cast #section_7 li{
    width: 20%;
    margin-bottom: 40px;
  }
  #page_cast #section_7 span{
    font-size: 14px;
    font-size: 1.4rem;
  }
  #page_cast #section_7 em{
    font-size: 20px;
    font-size: 2rem;
  }
  #page_cast #section_8 li{
    width: 16%;
    margin-bottom: 40px;
    font-size: 20px;
    font-size: 2rem;
  }

  /* #cast_detail 
  #white.pc_black{
    background: rgba(0,0,0,0.8);
  }*/
  #white.pc_black #news_close{
    margin:-350px 0 0 500px;
    top:50%;
    left:50%;
  }
  #cast_detail{
    margin:-350px 0 0 -550px;
    padding:0;
    position: fixed;
    top:50%;
    left:50%;
    width: 1100px;
    height: 700px;
    background: #fff;
  }
  #cast_detail .layout{
    display: flex;
    height: 700px;
  }
  #cast_detail .layout .space_img{
    margin:0;
    padding:0;
    width: 50%;
    height: 700px;
    overflow: hidden;
    position: relative;
  }
  #cast_detail .layout .space_img img{
    display: block;
  }
  #cast_detail .layout .space_img img.comment{
    position: absolute;
    width: auto;
    height: auto;
    z-index: 2;
    top:auto;
    left:auto;
    bottom:auto;
    right:auto;
    display: block;
  }
  #cast_detail .layout #cast_detail_img_1 .comment{
    left:20px;
    bottom:20px;
  }
  #cast_detail .layout #cast_detail_img_2 .comment{
    right:20px;
    bottom:20px;
  }
  #cast_detail .layout #cast_detail_img_3 .comment{
    left:20px;
    bottom:20px;
  }
  #cast_detail .layout #cast_detail_img_4 .comment{
    left:50%;
    bottom:0;

    transform:translateX(-50%);
  }
  #cast_detail .layout .space_text{
    margin:0;
    padding:40px 20px 40px 40px;
    width: 50%;
    box-sizing: border-box;
  }
  #cast_detail #cast_detail_text_41{
    margin:0 auto;
  }
  #cast_detail .space_scroll{
    height: 100%;
    padding-right: 20px;
    overflow-y:scroll;
    overflow: auto;
  }

  #cast_detail .space_scroll::-webkit-scrollbar{
    width:5px;
    border-radius: 10px;
  }/*バーの太さ*/
  #cast_detail .space_scroll::-webkit-scrollbar-track{background:#fff;}/*バーの背景色*/
  #cast_detail .space_scroll::-webkit-scrollbar-thumb{background:#ddd;}/*バーの色*/

  #cast_detail p.comment,
  #cast_detail p.author{
    display: none;
  }

  #page_staff #section_2 .layout{
    margin-left: 50px;
    margin-right: 50px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  /*

*/
  #page_staff #section_2 dl{
    margin-left:0;
    margin-right: 0;
    width: 48%;
  }
  #page_staff #section_3 .layout{
    margin:0 40px;

  }
  #page_staff #section_3 dl{
    width: 23%;
  }
  #page_staff #section_3 dt{
    margin-bottom: 0;
  }
  #page_staff #section_3 dd{
    margin-top:0;
    font-size: 16px;
    font-size: 1.6rem;
  }


  #page_history .space_table{
    margin:0;
    border:2px solid #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.7);
  }

  #page_history #cel_1{
    text-align: center;
  }

  #page_history #history_text_1{
    left:10px;
    top:35%;
    width: 18px;
    height: 290px;
    background-position: -50px 0;
  }

  #page_history #history_img_1{
    display: inline-block;
    margin-right: 10px;
    
  }
  #page_history #history_img_2{
    display: inline-block;
  }

  #page_comments li{
    margin:3em auto 0 50px;
    width: 750px;
  }


  #page_comments li:nth-of-type(2n){
    margin:3em 50px 0 auto;

  }

  #page_comments li.narrow
  {
    width: 620px;
  }
  #page_comments li.wide
  {
    width: 850px;
  }
}


@media screen and (min-width:1200px){
  #page_home #space_main::after{
    height: 760px;
  }
  #page_home #space_main::before{
    content: '';
    position: absolute;
    left:0;
    top:560px;
    display: block;
    width: 100%;
    height: 200px;
    background: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,1));
  }

  #page_home #space_main .banners.pc{
    margin-left: -580px;
    left:50%;
    top:160px;
  }

  #page_home #space_main .banners.pc .event img{
    position: absolute;
    top:80px;
    width: 250px;
    /* width: 293px; */

  }
  #page_home #space_main .banners.pc .dvd img{
    top:240px;
    left:10px;
    width: 223px;
  }

  #page_home #space_main .group_right{
    margin-top:40px;

    margin-top:20px;
    margin-right: -520px;
    width: 240px;
  }
  #page_home #space_main .group_right li{
    width: auto;
    text-align: center;
  }
   #page_home #space_main .group_right .filmarks img{
    width: 193px;
   }
  #page_home #space_main .group_right .crowdf img,
  #page_home #space_main .group_right .supporters img{
    margin-left:0;
    width: 240px;
  }


}
@media screen and (min-width:1400px){
  /*
  #page_home #space_main{
    height: 675px;
  }
  #page_home .billing{
    top:54.5vw;
  }
  */

  #page_home #space_main .banners.pc .event img{
    top:60px;
    left:-50px;
    width: 293px;
  }
  #page_home #space_main .banners.pc .dvd img{
    top:240px;
    left:-10px;
  }

  #page_home #space_main .group_right{

    margin-right: -520px;

  }


}

@media screen and (min-width:1500px){
  #page_awards::after{
  	background-position: center bottom;
  }
}
/*

@media screen and (min-width:1600px){
  #page_home #space_main{
    height: 725px;
  }
  #page_home .billing{
    top:51vw;
  }
}
@media screen and (min-width:1700px){
  #page_home #space_main{
    height: 770px;
  }
  #page_home .billing{
    top:49vw;
  }
}
*/