/* Common */
.onlySp {
display: none;
}
.onlyPc {
display: block;
}
/*.slick-slider {
width: 90%;
margin: 1em auto;
}
.slick-slide img {
aspect-ratio: 16/9;
object-fit: cover;
object-position: center;
}*/
body {
/*background: linear-gradient(#173450, #8394a5);*/
/*background: #fff;*/
background: black url(../img/bg.webp) fixed no-repeat center /100%;
color: white;
line-height: 1.5;
font-size: min(3.75vw, 18px);
scroll-behavior: smooth;
}
img {
vertical-align: bottom;
}
/*
#pan_box {
background: #303d3f;
color: #fff;
margin-bottom: min(2vw, 10px);
}
#pan_box .panlist {
color: #fff;
font-size: 12px;
margin: 0 auto;
padding: 4px 0 4px 1em;
text-align: left;
max-width: 1300px;
}
#pan_box .panlist a{
color: #fff;
}
*/
/*パンくずリスト----------------------------------*/
nav.panlist{
background-color: #303d3f;
color: white;
margin-bottom: min(2vw, 10px);
overflow: hidden;
padding: 4px 0;
width: 100%;
}
nav.panlist a{
color: white;
}
nav.panlist strong{
font-weight:normal;
}
nav.panlist ol {
color: white;
display: flex;
white-space: nowrap;
font-size: min(0.7em,2.4vw);
list-style: none;
line-height:1.5;
margin: 0 auto;
padding: 0;
max-width: 1270px;
width: 98%;
}
nav.panlist li + li::before {
content: ">";
margin: 0 0.5em;
}
.Hiragino_Mincho_W3{
font-family: "hiragino-mincho-pron", sans-serif;
font-weight: 300;
font-style: normal;
}
.Hiragino_Mincho_W6{
font-family: "hiragino-mincho-pron", sans-serif;
font-weight: 600;
font-style: normal;
}
#footer #f_PC,
footer #f_SP {
margin: 0 auto !important;
}

#sns_button {
display: flex;
justify-content: center;
gap: 20px;
margin: 0 auto 5%;
}
#sns_button img{
height: 50px;
width: 50px;
}

/* PC */
main {
display: flex;
font-family: "hiragino-mincho-pron", sans-serif;
font-weight: 600;
font-style: normal;
justify-content: space-between;
margin: 0 auto 40px;
width: min(90%, 1280px);
}
#page_all {}
.top_main {
margin: 0 auto;
width: min(100%, 1280px);
}
.oatime {
background: linear-gradient(314deg, #000000 0%, #9c9c9c 50%, #d7d7d7 50%, #ffffff 100%);
color: #fff;
font-family: "hiragino-mincho-pron", sans-serif;
font-weight: bold;
margin: 0 auto min(4vw, 40px);
padding: 1em 0;
width: min(100%, 1280px);
}
.oatime p {
color: #d00;
font-size: min(6vw, 40px);
font-weight: bold;
line-height: 1;
letter-spacing: 0.05em;
margin: 0.25em auto 0.5em;
paint-order: stroke;
text-align: center;
/*text-stroke: 6px #333;*/
-webkit-text-stroke: 12px #ffffff;
}
.tver {
margin: 0 !important;
}
.img {
margin: 2% auto;
width: 100%;
}
.img img {
height: auto;
width: 100%;
}
.oaDate {
border-top: double 3px white;
background: #231f1f;
border-bottom: double 3px white;
padding: 1% 0;
text-align: center;
}
article {
width: min(90%, calc(1280px - 320px));
}
article section {
background: #303d3f;
margin: 0 auto;
padding: 2em 4em 3em;
border-width: 5px;
border-style: solid;
border-image-source: linear-gradient(45deg, #86837b, #ffffff, #a0a9a9);
border-image-slice: 1;
margin-bottom: min(4vw, 40px);
width: 100%;
}
article section a {
color: white;
}
article section h2 {
color: #d3d158;
font-size: min(5vw, 32px);
font-weight: 900;
margin-bottom: 1em;
text-align: center;
text-shadow: 0 0 0.2em rgba(0,0,0,1);
}
article section h3 {
color: #d3d158;
font-size: min(4vw, 24px);
font-weight: 400;
margin: 1em 0 0.3em;
text-align: left;
text-shadow: 0 0 0.2em rgba(0,0,0,1);
}
section.about p {
line-height: 1.8;
word-break: auto-phrase;
}
.shin_agito_event dl {
color: white;
display: flex;
/*font-size: min(1.5em, 3.8vw);*/
flex-wrap: wrap;
margin: 2% auto 0;
text-align: left;
width: 100%;
word-break: break-word;
}
.shin_agito_event dl dt {
background: #000;
box-sizing: border-box;
font-size: min(0.85em);
margin: 0;
padding: 2%;
/* text-align: justify; */
/* text-align-last: justify; */
text-align: right;
width: min(25%);
}
.shin_agito_event dl dt:nth-of-type(even){
background: #333;
}
.shin_agito_event dl dd {
box-sizing: border-box;
margin: 0;
padding: 2%;
width: calc(74%);
}

section.movie_sp_about ul.cast {
display: flex;
justify-content: center;
gap: 20px;
margin: 0 auto 30px;
}
section.movie_sp_about ul.cast li {
background: #fff;
box-shadow: 0 0 4px #999;
border-radius: 4px;
padding: 16px 16px 0 16px;
text-align: center;
width: 32%;
}
section.movie_sp_about ul.cast li img {
height: auto;
width: 100%;
}
section.movie_sp_about ul.cast li p {
font-weight: bold;
color: black;
text-stroke: 4px #333;
paint-order: stroke;
padding: 1em 0;
}
section.movie_sp_about ul.cast li small {
display: block;
font-size: 0.75em;
}

#episode{
margin: 0 auto 2%;
}
#epiBoxRe {
margin: 0 auto 4%;
}
#episode .flex{
flex-direction: row-reverse;
}
#episode .nextOa {
font-size: min(1.5em, 4.5vw);
margin: 0 auto;
text-align: center;
}
.nextOa:nth-child(2) {
margin: 4% auto 0;
}
#episode .epiTtl{
font-size: min(2.0em, 6.0vw);
letter-spacing: -0.1em;
margin: 0 auto 2%;
text-align: center;
word-break: auto-phrase;
}
/*#episode .imgArea{
flex-basis: 50%;
padding: 0 20px;
}*/
#episode .imgBox {
aspect-ratio: 16 / 9;
margin: 3% auto;
}
#episode .imgBox,
#episode .imgBox img{
height: auto;
max-width: 640px;
width: 100%;
}
#episode .textArea{
font-size: 1.2em;
line-height: 1.5;
flex-basis: 50%;
}
#episode .textArea .guestName{
margin: 0 auto 4%;
text-align: left;
}
#episode .textArea .epiSup{
letter-spacing: -0.1em;
}
#episode .textArea .epiText{}
#episode #log {
background: black;
color: white;
box-sizing: border-box;
/* border: 3px solid; */
font-size: min(1.2em, 4.0vw);
margin: 0 auto;
padding: 1% 0 1.5%;
width: 100%;
}
#episode #log option.logDef{
text-align: center!important;
}
#episode #log option{
font-size: 80%;
text-align: left;
}
/*
#episode #log .logDef{
font-family: "kokuryu", sans-serif;
font-weight: 400;
font-style: normal;
}
*/

.splide{
margin: 5% auto 0;
}
.splide img {
height: auto;
width: 100%;
}
.copyright{
color: white;
font-family: "hiragino-mincho-pron", sans-serif;
font-weight: 600;
font-style: normal;
margin: 0 auto 2%;
text-align: center;
}

/* SP */

@media screen and (max-width:1300px) {
    body{
    background: black url(../img/bg.webp) fixed no-repeat top center;
    }
    #right_side {
    display: none !important;
    }
    article {
    width: 100%;
    }
    #pan_box {
    margin: 0;
    }
}
@media screen and (max-width:800px) {
    .onlySp {
    display: block;
    }
    .onlyPc {
    display: none;
    }
    #header {
    min-height: auto;
    }
    #page_all {
    overflow-x: hidden;
    }
    #pan_box {
    overflow-x: scroll;
    }
    .oatime p {
    line-height: 1.2;
    text-shadow: 0 0 0.2em rgba(255, 255, 255, 1),0 0 0.2em rgba(255, 255, 255, 1);
    -webkit-text-stroke: unset;
    }
    article section {
    padding: 2em 1em;
    }
    article section h2 {
    word-break: auto-phrase;
    }
    section ul.cast {
    flex-direction: column;
    }
    section ul.cast li {
    margin: 0 auto;
    width: min(100%, 420px);
    }
/*    article section a {
    display: block;
    }*/
    .shin_agito_event dl {
    display: block;
    }
    .shin_agito_event dl dt,
    .shin_agito_event dl dd{
    text-align: left;
    width: 100%;
    }
    .shin_agito_event dl dt:nth-of-type(even){
    background: black;
    }
    section.movie_sp_about ul.cast li{
    width: 90%;
    }
    .tver {
    margin: 0 auto !important;
    width: 80%;
    }
    .tver img{
    height: auto;
    width: 100%;
    }
}

/* loader */
#loader {
background: black url(../img/bg.webp) fixed no-repeat center /100%;
position: fixed;
width: 100%;
height: 100%;
z-index: 100;
}
/*背景*/
.loader,
.loader:before,
.loader:after {
background: #aaa;
-webkit-animation: load1 1s infinite ease-in-out;
animation: load1 1s infinite ease-in-out;
height: 4em;
width: 1em;
top: 50%;
}
.loader {
color: #fff;
text-indent: -9999em;
margin: auto;
position: relative;
font-size: 11px;
-webkit-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.loader:before,
.loader:after {
position: absolute;
top: 0;
content: '';
}
.loader:before {
left: -1.5em;
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s;
}
.loader:after {
left: 1.5em;
}
@-webkit-keyframes load1 {
    0%,
    80%,
    100% {
    box-shadow: 0 0;
    height: 4em;
    }
    40% {
    box-shadow: 0 -2em;
    height: 5em;
    }
}
@keyframes load1 {
    0%,
    80%,
    100% {
    box-shadow: 0 0;
    height: 4em;
    }
    40% {
    box-shadow: 0 -2em;
    height: 5em;
    }
}
/* End loader */