@charset "utf-8";
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 

 ■■■  ■                    ■                   
■     ■                    ■                   
■    ■■■■ ■ ■ ■   ■   ■■■ ■■■■ ■   ■  ■ ■  ■■■ 
 ■■   ■   ■■  ■   ■  ■■ ■  ■   ■   ■  ■■  ■  ■ 
  ■■■ ■   ■   ■   ■  ■     ■   ■   ■  ■   ■   ■
    ■ ■   ■   ■   ■  ■     ■   ■   ■  ■   ■■■■■
■   ■ ■   ■   ■  ■■  ■■    ■   ■  ■■  ■   ■    
■■■■  ■■  ■    ■■ ■   ■■■  ■■   ■■ ■  ■    ■■■ 

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{ color: #656464; background:#FFF; } 

header,article,section,footer{ position: relative; width: 100%; display: block; }
.lo-part,.lo-cont{ position: relative; width: 100%; display: block; }

.part-background{ position: absolute; width: 100%; min-height:100%; overflow: hidden; }
.part-foreground{ position: absolute; width: 100%; min-height:100%; overflow: hidden; z-index: 999; pointer-events: none; }
.part-header{ position: relative; z-index: 50; pointer-events: none; }
.part-subheader{ position: absolute; top:0; z-index: 49; pointer-events: none; }
.part-body{ position: relative; z-index: 10; }
.part-footer{ position: relative; z-index: 10; }


/* background */
#Background > div{ position: absolute; top:0; width: 100%; min-height:100%; }
#Background .bgline > div{ width: 1px; min-height: 100%; position: absolute; }
#Background .bgline .l1{ left:calc( 100vw/9*1 - 100vw/18 ); background-color: rgba(155,214,228,.4);/*#9bd6e4*/ }
#Background .bgline .l2{ left:calc( 100vw/9*2 - 100vw/18 ); background-color: rgba(165,137,190,.4);/*#a589be*/ }
#Background .bgline .l3{ left:calc( 100vw/9*3 - 100vw/18 ); background-color: rgba(174,211,120,.4);/*#aed378*/ }
#Background .bgline .l4{ left:calc( 100vw/9*4 - 100vw/18 ); background-color: rgba(89,113,182,.4);/*#5971b6*/ }
#Background .bgline .l5{ left:calc( 100vw/9*5 - 100vw/18 ); background-color: rgba(234,87,80,.4);/*#ea5750*/ }
#Background .bgline .l6{ left:calc( 100vw/9*6 - 100vw/18 ); background-color: rgba(97,186,120,.4);/*#61ba78*/ }
#Background .bgline .l7{ left:calc( 100vw/9*7 - 100vw/18 ); background-color: rgba(244,181,209,.4);/*#f4b5d1*/ }
#Background .bgline .l8{ left:calc( 100vw/9*8 - 100vw/18 ); background-color: rgba(255,239,121,.4);/*#ffef79*/ }
#Background .bgline .l9{ left:calc( 100vw/9*9 - 100vw/18 ); background-color: rgba(242,151,80,.4);/*#f29750*/ }

/* foreground */
#ptcCanvas{ width: 100vw; height: 100vh; position: fixed; pointer-events: none; }

/* header */
.part-header{ }
.cont-global-navi{ width: 100%; min-height: calc(270/3000*100vw); position: relative; }
.global-logo{ position: absolute; width:calc( 506/3000*100vw ); top:calc(50/3000*100vw); left: calc(60/3000*100vw); pointer-events: all; z-index: 2; }
.global-about{ position: absolute; width:calc( 360/3000*100vw ); top:calc(80/3000*100vw); right: calc(60/3000*100vw); pointer-events: all; z-index: 2; display: none; }
.global-navi{ width:100%; display: flex; flex-wrap: wrap; justify-content: center; position: relative; margin: 0 auto; z-index: 1; }
.global-navi > ul{ display: flex; flex-wrap: nowrap; justify-content: center; list-style-type: none; padding: 0; margin: 0 auto; }
.global-navi > ul > li{ display: block; margin: 0; padding: 0; line-height: 1; pointer-events: all; }

.global-navi > ul.l1{ width: 100%; order: 2; }
.global-navi > ul.l1 > li{ margin-right: 3.2em; }
.global-navi > ul.l1 > li:last-child{ margin-right: 0; }
.global-navi > ul.l1 > li a{ color: #656464;}
.global-navi > ul.l1 > li a span{ font-size: 1.25em; letter-spacing: .3em; font-family: 'Lato', sans-serif; }
.global-navi > ul.l1 > li a:hover{ color:#9bd6e4; text-decoration: none; transition: .2s color ease-in-out 0s;  }
.global-navi > ul.l1 > li.cs a{ color: #999; pointer-events: none; }

.global-navi > ul.l2{ background-color: #9bd6e4; padding: .7em 1.6em .8em 1.6em; order: 1; line-height: 1; margin-bottom: 1.6em; }
.global-navi > ul.l2 > li{ margin-right: 1.6em; }
.global-navi > ul.l2 > li:last-child{ margin-right: 0; }
.global-navi > ul.l2 > li a{ color: #fff;}
.global-navi > ul.l2 > li a span{ font-size: .8em; letter-spacing: .2em; font-family: 'Lato', sans-serif; }
.global-navi > ul.l2 > li a:hover{ color:#000; text-decoration: none; transition: .2s color ease-in-out 0s;  }
.global-navi > ul.l2 > li.cs a{ opacity: .6; pointer-events: none; }


.cont-sp-btn{ display: none; }

/* subheader */
.part-subheader{  }
.subheader-banner{ width: 14em; position: relative; margin:1em 1em 0 auto; pointer-events: auto;  }
.subheader-banner a{ display: block; text-decoration: none; position: relative; }
.subheader-banner a:hover{ transform: scale(1.05); }


/* body */
.part-body{ min-height: calc(100vh - 20em); }
.cont-upper{ position: relative; }
.cont-middle{ position: relative; }
.cont-w800{ width: 100%; max-width: 800px; margin: 0 auto; position: relative; }
.cont-w1055{ width: 100%; max-width: 1055px; margin: 0 auto; position: relative; }
.cont-w1200{ width: 100%; max-width: 1200px; margin: 0 auto; position: relative; }
.cont-w1400{ width: 100%; max-width: 1400px; margin: 0 auto; position: relative; }
#gNavScr{ line-height: 0; height: 0; position: absolute; top: -50em; }

.cont-global-header{ overflow: hidden; padding: 0 0 4em 0; }
.cont-header-logo{ display: none; }
.cont-page-title{ width: 100%; position: relative; padding: 0; text-align: center; background-color: #656565; color: #FFF; }
.cont-page-title h2{ font-size: 1em; width: .001%; background-color: #9bd6e4; padding: .3em 0; margin: 0; position: relative; overflow: hidden;}
.cont-page-title h2 span{ font-size: 1.6em; opacity: 0; letter-spacing: .9em; font-family: 'Lato',"Noto Sans JP", sans-serif; font-style: italic; }
.cont-page-title.inview-act-start h2{ width: 100%; transition: .5s all ease-in-out 0s;  }
.cont-page-title.inview-act-start h2 span{ opacity: 1; transition: .3s all ease-in-out .7s;  }

.cont-title{ font-size: 1em; color: #9bd6e4; text-align: center; margin:0 auto 2.5em auto; padding: 0; }
.cont-title > span{ font-size: 1.6em; letter-spacing: .9em; font-family: 'Lato',"Noto Sans JP", sans-serif; font-style: italic;  }
.cont-title-sep{ line-height: 0; border-bottom: #9bd6e4 dashed 1px; margin:-1.5em auto 2.5em auto; }

.cont-top-content{  }
.cont-top-content > .inner{ margin: 0 auto; }

.cont-sub-content{  }
.cont-sub-content > .inner{ margin: 0 auto; }


/* footer */
.part-footer{  }
.footer-pagetop{  width: calc( 182/30 * 1em ); position: fixed;  bottom:2em;  right:1em; z-index: 10; }
.cont-global-footer{ margin: 0 auto; padding: 0 ; position: relative; text-align: center; overflow: hidden; }

.footer-logo{ width: calc( 625 / 3000 * 100vw ); margin: 0 auto 1.5em auto; }
.footer-copyrihgt{ text-align: center; padding: 4em 0; }
.footer-copyrihgt p{ font-size: 0.66em; letter-spacing: .2em; margin-bottom: 0; }
.footer-share{ width: 100%; position: relative; order: 1; }
.footer-share > ul{ display: flex; flex-wrap: nowrap; justify-content: center; list-style-type: none; padding: 0; margin: 0 auto; }
.footer-share > ul > li{ display: block; height: calc(85/30*1em); padding: .5em ; margin: 0 1.5em; line-height: 1; }
.footer-share > ul > li:nth-child(1) a{ display: inline-block; height: 100%; color: #55acee; }
.footer-share > ul > li:nth-child(2) a{ display: inline-block; height: 100%; color: #3b5998; }
.footer-share > ul > li:nth-child(3) a{ display: inline-block; height: 100%; color: #00c300; }
.footer-share > ul > li a:hover{ text-decoration: none; transform: scale(1.2,1.2); transform-origin: center center; }
.footer-share > ul > li svg{ width: auto; height: 100%; }
.footer-eyecatch{ width: 100%; height:calc(625/3000*100vw); margin: 0 auto; background: url(../images/common/footer-eyecatch.png) no-repeat center bottom; background-size: cover; }



/* content */
.inview{ animation:inview 0.4s .2s ease-out both paused; }
.inview-start{ animation:inview-start 0.4s .2s ease-out both running; }

.ptn-star{ background-image: url(../images/common/pattern-star.png); }

.bg-web-pnk::before{ content:""; display: block; width:100%; height: 100%; background:url(../images/common/web-pnk.svg) no-repeat center center; background-size: 100%; transform-origin: center center; position: relative; }
.inview-bg-web::before{ transform: scale(0.01,0.01);}
.inview-bg-web.inview-bg-start::before{ transform: scale(1,1);transition-duration:.4s; transition-property:all; transition-timing-function:ease-in-out; }

.bg-bar-pnk::before{ content:""; display: block; width:100%; height: 100%; background-color: #ff3ba3; transform-origin: right center; position: relative; }
.bg-bar-ppl::before{ content:""; display: block; width:100%; height: 100%; background-color: #ba73c3; transform-origin: left center; position: relative; }
.bg-bar-ylw::before{ content:""; display: block; width:100%; height: 100%; background-color: #ffee00; transform-origin: left center; position: relative; }
.bg-bar-ygl::before{ content:""; display: block; width:100%; height: 100%; background-color: #aeff00; transform-origin: right center; position: relative; }
.inview-bg-bar::before{ transform: scale(0.01,1);}
.inview-bg-bar.inview-bg-start::before{ transform: scale(1,1);transition-duration:1s; transition-property:all; transition-timing-function:ease-in-out; }

.fnt-color-0{ color: #656464;}
.fnt-color-1{ color: #ea5750;}
.fnt-color-2{ color: #5971b6;}
.fnt-color-3{ color: #f5e14e;} /*  #ffef79から読みやすく調整 */
.fnt-color-4{ color: #61ba78;}
.fnt-color-5{ color: #a589be;}
.fnt-color-6{ color: #9bd6e4;}
.fnt-color-7{ color: #f4b5d1;}
.fnt-color-8{ color: #aed378;}
.fnt-color-9{ color: #f29750;}
.fnt-color-10{ color: #656464;}
.fnt-color-11{ color: #94c1ff;}
.fnt-color-12{ color: #29262e;}

.frame-a{ background-color: #FFF; border: #f1f1f1 solid 1em; }

.table-a{ border-collapse: separate; border-spacing: 2px;}
.table-a th{ padding:0.5em; background-color:rgba(120,120,120,.1); font-weight: normal; text-align: inherit; vertical-align: top; text-align: left; }
.table-a td{ padding:0.5em; background-color:rgba(120,120,120,.05); vertical-align: top; }

.sep{ height: 2em; background: url(../images/common-sep.png) no-repeat center center; background-size: 70%;  }

.cont-entries{ margin: 0 auto; padding-bottom: 4em; }
.content-entry{ background-color:rgba(255,255,255,.9) ; border: #9bd6e4 solid 1px; margin-bottom: 4em; position: relative; }
.content-entry:last-child{margin-bottom: 0;}
.content-entry .entry-date{ padding: 3em 3em 0 3em ; position: relative; line-height: 1; }
.content-entry .entry-date span{ display: inline-block; background-color: #9bd6e4; font-size: 1.2em; color:#fff; font-family: 'Lato', sans-serif; letter-spacing: 0.3em; padding: .2em .4em;}
.content-entry .entry-title{ font-size: 1em; padding: 3em 3em 0 3em ; letter-spacing: .2em; margin: 0; }
.content-entry .entry-title::after{ content:""; display: block; position: relative; width:100%; border-bottom:#9bd6e4 dashed 1px;  }
.content-entry .entry-title > span{ font-size: 2em; margin-bottom: .5em; display: block; position: relative; }
.content-entry .entry-body{ font-size: 1.2em; padding: 2.4em ; line-height: 1.8; letter-spacing: .2em; position: relative; overflow-wrap: break-word;word-wrap: break-word;}

.content-single{ background-color:rgba(255,255,255,.9) ; border: #9bd6e4 solid 1.2em; margin: 0 auto; margin-bottom: 4em; position: relative; }
.content-single .single-body{ font-size: 1.2em; padding: 2.4em ; line-height: 1.8; letter-spacing: .2em; position: relative;}

.content-accordion .acd-check{ display: none;}
.content-accordion .acd-head{ position: relative; }
.content-accordion .acd-head::after{ content:"＋"; display: inline-block; font-size:1.5em; padding: .5em 0 .6em 0; width: 2em; text-align: center; line-height: 1; background-color: #9bd6e4; font-weight: bold; color: #FFF; position: absolute; top:1.5em; left:-0.75em; pointer-events: none;}
.content-accordion .acd-body{ display: none; height: 0; overflow: hidden; transition: 0.5s all ease 0.5s; }
.content-accordion .acd-check:checked ~ .acd-body{ display: inherit; height: inherit; transition: 0.5s all ease 0s;}
.content-accordion .acd-check:checked ~ .acd-head::after{ content:"−";}

.cont-flex{ display: flex; flex-wrap: wrap; position: relative; margin: 0 auto; }
.cont-block{ display: block; position: relative; margin: 0 auto; }

.modal-data{ display: none; }
.cont-modal{ width: 100%; width: 64em; margin: 0 auto; }
.frame-modal{ background-color: #FFF; border: #fde100 solid .2666em; box-shadow:0px 0px 0px .1333em #000000,0px 0px 0px .0888em #000 inset; box-sizing: border-box; margin-bottom: 3em; padding: 2.5em; }

/* colorbox customize */
#colorbox{}
#cboxOverlay{ background:rgba(0,0,0,.8) ; }
#cboxTitle{ visibility: hidden; }
#cboxContent{/*  margin:3.61em 2.22em 0 2.22em; */ background:rgba(255,255,255,0); position: relative;}
#cboxLoadedContent{ padding:3.61em 2.22em 0 2.22em; border:none; background:rgba(255,255,255,0); }

#cboxClose{top: 0 /* -3.61em */ ; right: 0 /* 0.27em */ ; display:block; background:url(../images/lib/colorbox/close.png) no-repeat top center; background-size: contain; width:3.34em ; height:3.34em ; }
#cboxClose:hover{ background-position: top center; }
#cboxPrevious{top:60%; left: 0.27em /* -2.22em */; display:block; background:url(../images/lib/colorbox/prev.png) no-repeat top center; background-size: contain; width:1.667em ; height: 5em ; }
#cboxPrevious:hover{ background-position: top center; }
#cboxNext{top:60%; left:inherit; right: 0.27em /* -2.22em */; display:block; background:url(../images/lib/colorbox/next.png) no-repeat top center; background-size: contain; width:1.667em ; height: 5em ; }
#cboxNext:hover{ background-position: top center; }
#cboxCurrent{ display: none !important; }
#cboxLoadingGraphic{ background-image: url(../images/lib/colorbox/loading-custom.gif); }
/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 

              ■                 ■                
■             ■  ■       ■      ■               ■
■             ■                 ■               ■
■  ■■■■    ■■■■  ■ ■   ■ ■   ■■■■  ■   ■  ■■■   ■
■  ■■  ■  ■■ ■■  ■  ■  ■ ■  ■■ ■■  ■   ■  ■  ■  ■
■  ■   ■  ■   ■  ■  ■ ■  ■  ■   ■  ■   ■   ■■■  ■
■  ■   ■  ■   ■  ■  ■ ■  ■  ■   ■  ■   ■ ■■  ■  ■
■  ■   ■  ■■ ■■  ■   ■■  ■  ■■ ■■  ■  ■■ ■   ■  ■
■  ■   ■   ■■■■  ■   ■   ■   ■■■■   ■■ ■  ■■■■  ■

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* Modal */
#Modal_data{ display: none; }

/* TOP-PAGE */

.top-page .cont-upper{ overflow: hidden; }
.top-page .cont-global-header{ padding: 0 0 4em 0; }
/* main */

.cont-top-visual{ position: relative; width: 100%; min-height: 30vw; margin-top: 1vw; }
.cont-top-visual .grp{ width: 100%;  position: relative; display: none;}
.cont-top-visual .grp.on{ display: block; }

.cont-top-visual .oa-copy{ width: calc(2000/3000*100vw*1.0); position: absolute; top:-5.2vw; left: 0; right: 0; margin: 0 auto; transform: scale(1.2); opacity: 0; }
.g0 .cont-top-visual .oa-copy{ transform: scale(1); opacity: 1; transition: .8s all ease-out 0s; }

.cont-top-visual .badge{ width: 19em; position: absolute; top:-4.8vw; left: 113.2em;  }
.cont-top-visual .badge a.banner{ display: block; text-decoration: none; position: relative; }
.cont-top-visual .badge a.banner:hover{ transform: scale(1.05); }

/* grp8 */
.grp8 .spc{ position: relative; }
.grp8 .vis{ position: absolute; top:0; }
.grp8 .effct{ position: absolute; top:0; width: 100%; min-height: 100%; background-color: transparent; }
.grp8 .catch{ width: calc(1626/3000*100vw); position: absolute; top:2vw; left:0; right: 0; margin: 0 auto; }
.grp8 .vis{ opacity: 0; transform: scale(1.2,1.2); }
.grp8 .catch{ opacity: 0; top:5vw; transform: scale(1.3,1.3); } 
.s2 .grp8 .effct{ opacity: 0; transition: 2s all ease-out 0s;} 
.s2 .grp8 .catch{ opacity: 1; top:15vw; transform: scale(1.3,1.3); transition: .5s all ease-out 0s; } 
.s2 .grp8 .vis{ opacity: 1; transform: scale(1.2,1.2); transition: 1.5s all ease-out .5s; } 
.s3 .grp8 .catch{ top: 2vw; transform: scale(1,1); transition: .8s all ease-out 0s; } 
.s3 .grp8 .vis{ opacity: 1; transform: scale(1,1) rotateY(0deg); transition: .9s all ease-out 0s; } 

/* grp7 */
.grp7 .spc{ position: relative; }
.grp7 .vis{ position: absolute; top:0; }
.grp7 .effct{ position: absolute; top:0; width: 100%; min-height: 100%; background-color: transparent; }
.grp7 .catch{ width: calc(2223/3000*100vw); position: absolute; top:23vw; left:0; right: 0; margin: 0 auto; }
.grp7 .vis{ opacity: 0; transform: scale(1.2,1.2); }
.grp7 .catch{ opacity: 0; top:5vw; transform: scale(1.3,1.3); } 
.s2 .grp7 .effct{ opacity: 0; transition: 2s all ease-out 0s;} 
.s2 .grp7 .catch{ opacity: 1; top:15vw; transform: scale(1.3,1.3); transition: .5s all ease-out 0s; } 
.s2 .grp7 .vis{ opacity: 1; transform: scale(1.2,1.2); transition: 1.5s all ease-out .5s; } 
.s3 .grp7 .catch{ top: 23vw; transform: scale(1,1); transition: .8s all ease-out 0s; } 
.s3 .grp7 .vis{ opacity: 1; transform: scale(1,1) rotateY(0deg); transition: .9s all ease-out 0s; } 

/* grp6 */
.grp6 .spc{ position: relative; }
.grp6 .vis{ position: absolute; top:0; }
.grp6 .effct{ position: absolute; top:0; width: 100%; min-height: 100%; background-color: transparent; }
.grp6 .catch{ width: calc(3000/3000*100vw); position: absolute; top:26vw; left:0; right: 0; margin: 0 auto; }
.grp6 .vis{ opacity: 0; transform: scale(1.2,1.2) rotateY(1080deg); }
.grp6 .catch{ opacity: 0; top:15vw; transform: scale(1.0,0.01) rotate(-20deg); } 
.s2 .grp6 .effct{ opacity: 0; transition: 2s all ease-out 0s;} 
.s2 .grp6 .catch{ opacity: 1; transform: scale(1.0,1.0) rotate(0deg); transition: .5s all ease-out 0s; } 
.s2 .grp6 .vis{ opacity: 1; transform: scale(1.2,1.2) rotateY(0deg); transition: 1.5s all ease-out .5s; } 
.s3 .grp6 .catch{ top: 5vw; transform: scale(1,1); transition: .8s all ease-out 0s; } 
.s3 .grp6 .vis{ opacity: 1; transform: scale(1,1) rotateY(0deg); transition: .9s all ease-out 0s; } 

/* grp5 */
.grp5 .spc{ position: relative; }
.grp5 .vis{ position: absolute; top:0; }
.grp5 .effct{ position: absolute; top:0; width: 100%; min-height: 100%; background-color: #ffd616; }
.grp5 .catch{ width: calc(2550/3000*100vw); position: absolute; top:26vw; left:0; right: 0; margin: 0 auto; }
.grp5 .vis{ opacity: 0; transform: scale(1.2,1.2); }
.grp5 .catch{ opacity: 0; top:15vw; transform: scale(1.8,1.8) rotate(180deg); } 
.s2 .grp5 .effct{ background-color: #ffffb7; transition: 2s all ease-out 0s;} 
.s2 .grp5 .catch{ opacity: 1; transform: scale(1.2,1.2) rotate(0deg); transition: .5s all ease-out .9s; } 
.s3 .grp5 .effct{ opacity: 0; transition: .9s all ease-out 0s;} 
.s3 .grp5 .vis{ opacity: 1; transform: scale(1,1); transition: .9s all ease-out 0s; } 
.s3 .grp5 .catch{ top: 5vw; transform: scale(1,1); transition: .8s all ease-out 0s; } 

/* grp4 */
.grp4 .spc{ position: relative; }
.grp4 .vis{ position: absolute; top:0; }
.grp4 .effct{ position: absolute; top:0; width: 100%; min-height: 100%; background-color: #e4caf1; }
.grp4 .catch{ width: calc(523/3000*100vw); position: absolute; top:26vw; left:0; right: 0; margin: 0 auto; }
.grp4 .vis{ opacity: 0; transform: scale(1.2,1.2); }
.grp4 .catch{ opacity: 0; top:6vw; transform: scale(1.8,1.8); } 
.s2 .grp4 .effct{ background-color: #251776; transition: 2s all ease-out 0s;} 
.s2 .grp4 .catch{ opacity: 1; transform: scale(1.2,1.2); transition: .5s all ease-out .9s; } 
.s3 .grp4 .effct{ opacity: 0; transition: .9s all ease-out 0s;} 
.s3 .grp4 .vis{ opacity: 1; transform: scale(1,1); transition: .9s all ease-out 0s; } 
.s3 .grp4 .catch{ top: 10vw; right:1vw; transform: scale(1,1); transition: .8s all ease-out 0s; } 

/* grp3 */
.grp3 .spc{ position: relative; }
.grp3 .vis{ position: absolute; top:0; }
.grp3 .effct{ position: absolute; top:25vw; transform: scale(1.5,1.5); }
.grp3 .catch{ width: calc(1822/3000*100vw); position: absolute; top:106vw; right: 1vw; }
.grp3 .vis{ opacity: 0; transform: scale(1.2,1.2); }
.grp3 .effct{ opacity: 0; transform: scale(.2,.2); }
.grp3 .catch{ opacity: 0; top:12vw; right:18vw; transform: scale(1.2,1.2) rotate(-30deg); } 
.s2 .grp3 .effct{ animation:2s ease-out 1 vis-effct-anm;} 
@keyframes vis-effct-anm{ 
0%{ opacity: 0; transform: scale(.2,.2);} 
25%{ opacity: 0; transform: scale(.1,.1); } 
50%{  } 
75%{ opacity: 1; } 
100%{ opacity: 0; transform: scale(2.5,2.5);}
}
.s2 .grp3 .catch{ opacity: 1; transform: scale(1.2,1.2) rotate(0deg); transition: .5s all ease-out .9s; } 
.s3 .grp3 .vis{ opacity: 1; transform: scale(1,1); transition: .9s all ease-out 0s; } 
.s3 .grp3 .catch{ top: 106vw; right:1vw; transform: scale(1,1); transition: .8s all ease-out 0s; } 

/* grp2 */
.grp2 .spc{ position: relative; background-color: #FFF; padding-bottom: 5vw; }
.grp2 .vis{ position: absolute; top:0; }
.grp2 .catch{ width: calc(1752/3000*100vw); height: calc(101/3000*100vw); margin: 0 auto; position: absolute; top:20vw; left: 0; right: 0;  }
.grp2 .catch img{ position: relative; }
.grp2 .catch:after{ content:""; width: 100%; height: calc(101/3000*100vw); background-color: #FFF; position: absolute; top:0; right: 0; transform-origin: right center; }
.grp2 .vis{ opacity: 0; }
.grp2 .catch{ transform: rotate(1deg); } 
.grp2 .catch:after{ transform: scale(1,1); }
.s2 .grp2 .catch:after{ transform: scale(0,1); transition: .8s all ease-out .0s; }
.s2 .grp2 .catch{ top:56.5vw; transform: scale(1,1); transition: .9s all ease-out 2.0s; }
.s3 .grp2 .vis{ opacity: 1;  transition: .8s all ease-out .1s; }

/* grp1 */
.grp1 .spc{ position: relative; background-color:#dfdfdf; }
.grp1 .vis{ position: absolute; top:0; }
.grp1 .catch1{ width: calc( 280/3000*100vw ); height: calc( 1055/3000*100vw ); position: absolute; top:4em; left: calc(50vw);  }
.grp1 .catch2{ width: calc( 280/3000*100vw ); height: calc( 1300/3000*100vw ); position: absolute; top:4em; left: calc(50vw - ( 280/3000*100vw ));  }
.grp1 .light{ width: calc( 1735/3000*100vw ); height: calc( 1735/3000*100vw ); position: absolute; top:3em; left: calc(50vw - ( 1735/3000*100vw )/2);  }
.grp1 .vis{ opacity: 0; transform: scale(1.1,1.1); }
.grp1 .catch1{ opacity: 0; transform: translate(0,-2em); }
.grp1 .catch2{ opacity: 0; transform: translate(0,2em);}
.grp1 .light{ opacity: .5; transform: scale(.5,.5); }
.s2 .grp1 .catch1{ opacity: 1; transform: translate(0,0); transition: 1.2s all ease-out 0s; }
.s2 .grp1 .catch2{ opacity: 1; transform: translate(0,0); transition: 1.2s all ease-out 0s; }
.s2 .grp1 .light{ opacity: 1; transform: scale(1.5,1.5); transition: .9s all ease-in 1.5s; }
.s3 .grp1 .catch1{ opacity: 0; transition: .6s all ease-out 0s; } 
.s3 .grp1 .catch2{ opacity: 0; transition: .6s all ease-out 0s; } 
.s3 .grp1 .light{ opacity: 0; transition: .9s all ease-out .3s; } 
.s3 .grp1 .vis{ opacity: 1; transform: scale(1,1); transition: .5s all ease-out .8s; } 

/* vis-switch */
.vis-switch{ display: flex; flex-wrap: wrap; justify-content: center; margin: -5em auto 3em auto; }
.vis-switch > div{ width: 8em; margin: .5em; line-height: 0; border:#CCC solid 3px; filter: drop-shadow( 0 0 .2em rgba(0,0,0,.5)); }
.vis-switch > div.crt{ border-color:#ff64a9; }

/* yell-btn */
.yell-btn{ position: relative; padding: 3em 0 2em 0; margin-bottom: 2em; background: url(../images/yell-btn-bg.png?v2) no-repeat center top; background-size: 100% 100%;}
.yell-btn .label{ width: 100%; position: absolute; bottom:-1.5em; text-align: center; }
.yell-btn .label span{display: inline-block; padding: .06em .5em; color:#FFF; background-color: #000; animation: yell-btn-label-bg-anm 5s infinite; font-size:1.8em; letter-spacing: .6em; }
@keyframes yell-btn-label-bg-anm {
  0% { background-color:#ff64a9;}
  10% { background-color:#f4b5d1;}
  20% { background-color:#ea5750;}
  30% { background-color:#a589be;}
  40% { background-color:#5971b6;}
  50% { background-color:#9bd6e4;}
  60% { background-color:#61ba78;}
  70% { background-color:#aed378;}
  80% { background-color:#f5e14e;}
  90% { background-color:#f29750;}
  100% { background-color:#ff64a9;}
}
.yell-btn .btn-list{ position: relative; width: 100%; display: flex; flex-wrap: nowrap; justify-content: center; }
.yell-btn .btn-list > div{ margin: .2em; position: relative; filter: drop-shadow( .3em .3em 0 rgba(0,0,0,.2));  }
.yell-btn .btn-list > div .ic{ width: 4em; display: block; position: absolute; top:-3.5em; left:0; right:0; margin: 0 auto; pointer-events: none; animation: bounce 2s infinite;}


.vis-detail-list{ width: 100%; height: 100%; padding: 0; position: absolute; top:0; background: rgba(255,255,255,.9); z-index: 9999; pointer-events: all;  }
.vis-detail-list .close{ width: 3vw; position: absolute; top:1vw; right: 1vw; z-index: 10;}

.vis-detail{ width: 100%; position: absolute; top:0; left: 0; right: 0; margin: 0 auto; } 
.vis-detail .bgline{ position: absolute; width: 100%; height:.5em; background:url(../images/vis-focus-bg.png?v2) no-repeat center top; background-size: 100% 100%;  pointer-events: none; transform: skewY(-10deg); }
.vis-detail .bgline.line1{ height: 20em; top:-18em; }
.vis-detail .bgline.line2{ height: .5em; top:25em; }
.vis-detail .bgline.line3{ height: 20em; top:55em; }
.vis-detail-container{ display: flex; flex-wrap: wrap; justify-content: center; position: relative; }
.vis-detail-container .left{ width: 45%; padding-right: 5%; order: 1;position: relative; }
.vis-detail-container .right{ width: 45%; order: 2;position: relative; }
.vis-detail-container .left .fig{ border:#FFF solid 4px; }

.vis-detail-container .cmt{ position: relative; margin-bottom: 2em;}
.vis-detail-container .count{ position: relative; margin: 0 auto; text-align: center; }
.vis-detail-container .count-cheer{ width: calc(416/3000*100vw); height: calc(41/3000*100vw); background: url(../assets/top/detail_v3/ic-cheer.png) no-repeat center center; background-size: contain; margin: 0 auto .5em auto; animation:flash 3s .2s infinite ease-out both running; }
.vis-detail-container .count-msg{ min-height: 1em; margin-bottom: .5em; color: #000; }
.vis-detail-container .count-att{ position: relative; margin: 0 auto; text-align: center; font-size:0.8em; }
/* .vis-detail-container .count-att:before{white-space: pre;content:"※エールは1日に1回までカウントされます。\A※ご利用のインターネット環境によってはIPの重複などにより、\A送信が制限される場合がございます。";} */
.vis-detail-container .count-ui{ color:#656464; position: relative; margin: 0 auto .5em auto; }

.vis-detail-container .count-ui .count-heart{ width: calc(652/3000*100vw); height: calc(549/3000*100vw); margin: 0 auto; position: relative; }
.vis-detail-container .count-ui .count-heart:before{ content:""; display: block; width: calc(652/3000*100vw); height: calc(549/3000*100vw); background: url(../assets/top/detail_v3/bg-counter-anm.png) no-repeat center center; background-size: contain; position: absolute; top:0;opacity:0; }
.vis-detail-container .count-ui .count-heart:after{ content:""; display: block; width: calc(652/3000*100vw); height: calc(549/3000*100vw); background: url(../assets/top/detail_v3/bg-counter.png) no-repeat center center; background-size: contain; position: absolute; top:0; }
.vis-detail-container .count-ui .count-number{ text-align: center; padding: 0; position: absolute; top:5vw; left:0; right:0; margin: 0 auto; }
.vis-detail-container .count-ui .count-number span{ font-size:2.4em; letter-spacing: .2em; font-weight: bold; }
.vis-detail-container .count-ui .count-label{ text-align: center; padding: 0; position: absolute; top:8vw; left:0; right:0; margin: 0 auto; }
.vis-detail-container .count-ui .count-label span{ font-size:1em; letter-spacing: .2em; font-weight: bold; }
.vis-detail-container .count-ui .count-btn{ color: #fff; width: 6em; padding: .9em .5em .2em 0; border-radius: .9em; text-align: center; background: none; border:#656464 solid 1px; background-color: #656464; font-size:1.2em; font-family: 'Lato',"Noto Sans JP", sans-serif; position: absolute; top:11vw; left:0; right:0; margin: 0 auto; }
.vis-detail-container .count-ui .count-btn:focus{ outline: none;}
.vis-detail-container .count-ui .count-btn:before{ content:"> " }
.vis-detail-container .count-ui .count-btn:hover{ color: #656464; background-color: #fff; }

.vis-detail-container .count-ui .count-nolngr{ text-align: center; font-weight: bold; padding: 0; position: absolute; top:5vw; left:0; right:0; margin: 0 auto; }
.vis-detail-container .count-ui .count-thanks{ text-align: center; padding: 0; position: absolute; top:7.5vw; left:0; right:0; margin: 0 auto;  }
.vis-detail-container .count-ui .count-thanks span{ font-size: 1.9em; font-weight: bold; }

.vis-detail.inview-start .left{ animation:fadeIn 0.9s .5s ease-out both running; }
.vis-detail-container .count.clicked .count-ui .count-heart:after{ animation: heartBeat 2s 2; }

.vis-detail-container .count.posted .count-ui .count-heart:after{ animation: count-heart-anm-bef 2s 1; }
@keyframes count-heart-anm-bef {
  0% {transform:scale(.9,.9) rotateY(0);}
  100% {transform:scale(1.1,1.1) rotateY(720deg) translateY(0);}
}
.vis-detail-container .count.posted .count-ui .count-heart:before{ animation: count-heart-anm 2s 1; }
@keyframes count-heart-anm {
  0% {opacity:0; transform:scale(.9,.9) rotateY(0) translateY(0em);}
  30% {opacity:1; transform:scale(.7,.7) rotateY(0) translateY(2em);}
  95% {opacity:1; transform:scale(.3,.3) rotateY(720deg) translateY(-190vw);}
  100% {opacity:0; transform:scale(.3,.3) rotateY(720deg) translateY(-190vw);}
}

#VC1 .count-ui,
#VC1 .count-ui .count-btn:hover{ color: #ea5750; }
#VC1 .count-ui .count-btn{ background-color: #ea5750; border-color: #ea5750; }
#VC1 .count-ui .count-btn:hover{ background-color: #fff; }
#VC2 .count-ui,
#VC2 .count-ui .count-btn:hover{ color: #7d93d3; }
#VC2 .count-ui .count-btn{ background-color: #7d93d3; border-color: #7d93d3; }
#VC2 .count-ui .count-btn:hover{ background-color: #fff; }
#VC3 .count-ui,
#VC3 .count-ui .count-btn:hover{ color: #f4d700; }
#VC3 .count-ui .count-btn{ background-color: #f4d700; border-color: #f4d700; }
#VC3 .count-ui .count-btn:hover{ background-color: #fff; }
#VC4 .count-ui,
#VC4 .count-ui .count-btn:hover{ color: #61ba78; }
#VC4 .count-ui .count-btn{ background-color: #61ba78; border-color: #61ba78; }
#VC4 .count-ui .count-btn:hover{ background-color: #fff; }
#VC5 .count-ui,
#VC5 .count-ui .count-btn:hover{ color: #a589be; }
#VC5 .count-ui .count-btn{ background-color: #a589be; border-color: #a589be; }
#VC5 .count-ui .count-btn:hover{ background-color: #fff; }
#VC6 .count-ui,
#VC6 .count-ui .count-btn:hover{ color: #77cce0; }
#VC6 .count-ui .count-btn{ background-color: #77cce0; border-color: #77cce0; }
#VC6 .count-ui .count-btn:hover{ background-color: #fff; }
#VC7 .count-ui,
#VC7 .count-ui .count-btn:hover{ color: #fa9ec7; }
#VC7 .count-ui .count-btn{ background-color: #fa9ec7; border-color: #fa9ec7; }
#VC7 .count-ui .count-btn:hover{ background-color: #fff; }
#VC8 .count-ui,
#VC8 .count-ui .count-btn:hover{ color: #a2d853; }
#VC8 .count-ui .count-btn{ background-color: #a2d853; border-color: #a2d853; }
#VC8 .count-ui .count-btn:hover{ background-color: #fff; }
#VC9 .count-ui,
#VC9 .count-ui .count-btn:hover{ color: #f29750; }
#VC9 .count-ui .count-btn{ background-color: #f29750; border-color: #f29750; }
#VC9 .count-ui .count-btn:hover{ background-color: #fff; }
.clicked .count-ui .count-btn{ pointer-events: none; opacity: .5;}

.top-cont-link{ width: 15em; position: absolute; bottom:-1em; left: 0; right: 0; margin: 0 auto;  }
.top-cont-link .ilink{ width: 100%; text-align: center; background-color: #FFF; }




/* news twitter */
.cont-top-news-twitter{ background: #eeeeee url(../images/common/pattern-star.png); margin-bottom: 3em; }
.cont-top-news-twitter > .inner{ padding: 5em 0; display: flex; flex-wrap: wrap; justify-content: center; align-items:stretch;  }
/* .cont-top-news,
.cont-top-twitter{ width: calc(1000/3000*100vw); background-color: rgba(255,255,255,1); position:relative; } */
.cont-top-news,
.cont-top-twitter,
.cont-top-tiktok{ width: calc(320px + 2em ); background-color: rgba(255,255,255,1); position:relative; }
.cont-top-news .cont-title,
.cont-top-twitter .cont-title,
.cont-top-tiktok .cont-title{ position: absolute; color: #656565; top:-3em; left: 0; right: 0; margin: 0 auto; }

.cont-top-news-twitter .top-cont-link .ilink{ letter-spacing: .1em; border-color: #656565; color: #656565; }
.cont-top-news-twitter .top-cont-link .ilink:hover{ background-color: #656565; color: #fff; }

/* news */
.cont-top-news{ margin-right: calc(50/3000*100vw); }
.news-container{ padding: 1em; }
.news-container dl{ font-size: 1.0em; margin: 0 0 .5em 0;}
.news-container dl:last-child{ margin: 0;}
.news-container dl dt{ font-size: 0.66em; padding: .2em; font-weight: bold; color: #FFF; margin: 0 0 .5em 0; letter-spacing: 0.05em; display: inline-block; background-color: #ccc; line-height: 1; }
.news-container dl dd{ padding: .2em; background-color: rgba( 0,0,0,.03); line-height: 1.4; }
.news-container dl dd a,
.news-container dl dd a:visited{ text-decoration: none; color: #656464; }
.news-container dl dd a:hover{ text-decoration: underline; color: #9bd6e4; }

/* twitter */
.cont-top-twitter{ margin-right: calc(50/3000*100vw); }
.twitter-widget-container{ padding: 1em; height: 100%; position: relative; overflow: hidden; }
.twitter-widget-container iframe{ min-height: 100%; }

/* tiktok */
.cont-top-tiktok{  }
.tiktok-widget-container{ padding: 0 1em 1em 1em; height: 100%; position: relative; }
.tiktok-widget-container iframe{ min-height: 100%; }

/* about */
.cont-top-about{ margin-bottom: 5em; }
.cont-top-about.cont-top-content > .inner{ }
.cont-top-about .cont-title{  color: #ea5750; margin: 0 auto 2em auto; }
.cont-top-about .cont-title span{ display: inline-block; border:#ea5750 solid 2px; padding: .2em 0 .2em .7em; }
.cont-top-about .banner{ width: calc(1997/3000*100vw); margin: 0 auto; }

/* story */
.cont-top-story{ width: calc(2400/3000*100vw); padding: 2.5em; margin: 0 auto; margin-bottom: 5em;background: linear-gradient(45deg, #ffef7a 1%,#f4b5d1 100%); }
.cont-top-story.cont-top-content > .inner{ background-color: #FFF; }
.cont-top-story .cont-title{ position: absolute; color: #fff; top:-2em; left: 0; right: 0; margin: 0 auto; }
.cont-top-story .story-container{ padding: 1em; text-align: center; position: relative; overflow: hidden; }
.cont-top-story .story-container .bg-sil{ position: absolute; bottom:0; transform-origin: center center; opacity: 0; transform: scale(1.5,1.5); }
.cont-top-story .story-container .bg-sil.inview-act-start{ opacity: 1; transform: scale(1,1); transition: .8s all ease-in-out 1.1s; }
.cont-top-story .story-container > p{ font-size: 1.2em; letter-spacing:.2em ; line-height: 2; }
.cont-top-story .story-container > p [data-ruby]::before { top: -1.7em; }

.cont-top-story .top-cont-link{  bottom:-3.5em;  }
.cont-top-story .top-cont-link .ilink{ border-color: #f4b5d1; color: #f4b5d1; }
.cont-top-story .top-cont-link .ilink:hover{ background-color: #f4b5d1; color: #fff; }

/* profile */
.cont-top-profile{ margin-bottom: 3em; }
.cont-top-profile.cont-top-content > .inner{ }
.cont-top-profile .profile-container{ width: 100%; position: relative; padding: 7vw 0; overflow: hidden; }
.cont-top-profile .bg-grad{ width: 120vw; min-height: 25vw; transform-origin: center center; transform:rotate(-5deg); background: linear-gradient(to right, #d7eff4 0%,#dbd0e6 14%,#dfedc9 28%,#bdc8e2 39%,#f7bcb9 50%,#c1e3cc 61%,#fae1ed 73%,#fff7c7 86%,#fad5b9 100%); position: absolute; top:5vw; left:-10vw }
.cont-top-profile .profile-list{ display: flex; flex-wrap: nowrap; position: relative; }
.cont-top-profile .profile-list > div{ padding:.2em; }
.cont-top-profile .profile-list > div a{ display: block; border:#656565 solid 1px; background: #FFF; overflow: hidden; }
.cont-top-profile .profile-list > div a span{ display: block; transform-origin: center left; transition: .2s all ease-in-out 0s; }
.cont-top-profile .profile-list > div a:hover span{  transform: scale(1.2,1.2); }
.cont-top-profile .profile-list .c1 a{ border-color:#ea5750; background: linear-gradient(0deg, #ea5750 1%,#fff 100%); }
.cont-top-profile .profile-list .c2 a{ border-color: #5971b6; background: linear-gradient(0deg, #5971b6 1%,#fff 100%); }
.cont-top-profile .profile-list .c3 a{ border-color: #ffef79; background: linear-gradient(0deg, #ffef79 1%,#fff 100%); }
.cont-top-profile .profile-list .c4 a{ border-color: #61ba78; background: linear-gradient(0deg, #61ba78 1%,#fff 100%); }
.cont-top-profile .profile-list .c5 a{ border-color: #a589be; background: linear-gradient(0deg, #a589be 1%,#fff 100%); }
.cont-top-profile .profile-list .c6 a{ border-color: #9bd6e4; background: linear-gradient(0deg, #9bd6e4 1%,#fff 100%); }
.cont-top-profile .profile-list .c7 a{ border-color: #f4b5d1; background: linear-gradient(0deg, #f4b5d1 1%,#fff 100%); }
.cont-top-profile .profile-list .c8 a{ border-color: #aed378; background: linear-gradient(0deg, #aed378 1%,#fff 100%); }
.cont-top-profile .profile-list .c9 a{ border-color: #f29750; background: linear-gradient(0deg, #f29750 1%,#fff 100%); }

.cont-top-profile .top-cont-link{  bottom:3em;  }
.cont-top-profile .top-cont-link .ilink{ border-color: #ea5750; color: #ea5750; }
.cont-top-profile .top-cont-link .ilink:hover{ background-color: #ea5750; color: #fff; }

/* intro */
.cont-top-intro{ width: calc(2400/3000*100vw); padding: 0 ; margin: 0 auto; margin-bottom: 0em;background: #fff; }
.cont-top-intro.cont-top-content > .inner{ position: relative; padding: 2em 0 ; }
.cont-top-intro .ur{ width: 15vw; height: 15vw; border-top:#5971b6 solid 1px; border-right:#5971b6 solid 1px; position: absolute; top:0; right: 0; pointer-events: none; }
.cont-top-intro .bl{ width: 15vw; height: 15vw; border-bottom:#5971b6 solid 1px; border-left:#5971b6 solid 1px; position: absolute; bottom:0; left: 0; pointer-events: none; }
.cont-top-intro .cont-title{  color: #fff; position: absolute; top:-1.3em; left: 0; right: 0; margin: 0 auto ; }
.cont-top-intro .cont-title span{ display: inline-block; background:#5971b6 ; padding: .2em 0 .2em .7em; }
.cont-top-intro .intro-container{ padding: 1em; color:#5971b6 ; text-align: center; position: relative; overflow: hidden; }
.cont-top-intro .intro-container > p{ font-size: 1.2em; letter-spacing:.2em ; line-height: 2; }
.cont-top-intro .intro-container > p [data-ruby]::before { top: -1.7em; }

/* movie */
.cont-top-movie{ width: 100%; margin-bottom: 6em;  }
.cont-top-movie.cont-top-content > .inner{ padding:5em 0 2em 0; position: relative; background-color: #FFF; overflow: hidden; }
.cont-top-movie.cont-top-content > .inner:before{ content:""; display: block; width: 100%; height: 5vw; position: absolute; top:0; background: linear-gradient(0deg, rgba(255,255,255,0) 1%,rgba(255,255,255,1) 100%);; z-index: 1; }
.cont-top-movie .bg{ width: 100vw; min-height: 100%; background-repeat: no-repeat; background-position: center center; background-size: 110%; position: absolute; top:0; pointer-events: none; z-index: 0;filter: blur(.5vw); opacity: .5; }
.cont-top-movie .movie-container{ position: relative; }

.cont-top-movie .movie-container .main{ width: calc(1600/3000*100vw); padding: 0 ; margin: 0 auto 3em auto; filter: drop-shadow( 0 0 .3em rgba(0,0,0,.5)); }
.cont-top-movie .movie-container .main a{ position: relative; display: block; background-color: #fff; }
.cont-top-movie .movie-container .main a::after{ content:""; position: absolute; display: block; width:calc(246/3000*100vw); height:calc(284/3000*100vw); background: url(../images/top-movie-playbtn.png) no-repeat center center; background-size: 100%;transform-origin: center center; pointer-events: none; top:11vw; left: 0; right: 0; margin: 0 auto; opacity: .5; }
.cont-top-movie .movie-container .main a:hover::after{ opacity: 1; }

/* .cont-top-movie .movie-container .thumb{ display: flex; flex-wrap: nowrap; }
.cont-top-movie .movie-container .thumb > div{ margin-right: 1em; }
.cont-top-movie .movie-container .thumb > div:last-child{ margin-right: 0;  } */

.cont-top-movie .movie-container .thumb .th{ padding: .5em; position: relative;}
.cont-top-movie .movie-container .thumb .th img:hover{ transform: translateY(-1em); cursor: pointer; }
.cont-top-movie .top-cont-link{  bottom:inherit;  }
.cont-top-movie .top-cont-link .ilink{ border-color: #9bd6e4; color: #9bd6e4; }
.cont-top-movie .top-cont-link .ilink:hover{ background-color: #9bd6e4; color: #fff; }

/* SUB-PAGE */

 
/* news */
#Page_News .cont-page-title h2{ background-color: #9bd6e4;}
.cont-entries-news{ max-width: calc(2200/3000*100vw); }

/* event */
#Page_Event .cont-page-title h2{ background-color: #f29750;}
.cont-entries-event{ max-width: calc(2200/3000*100vw); }
#Page_Event .cont-title{ color:#f29750; }
#Page_Event .cont-title.bar-top{ color: #fff; background-color:#f29750; margin: -.5em auto 1em auto; padding-bottom: 1em;  }
#Page_Event .cont-title-sep{ border-color:#f29750; }
#Page_Event .ttl1{ background-color: #f29750; }
#Page_Event .ttl2{ border-color:#f29750; }
#Page_Event .ttl3{ color: #f29750;border-color:#f29750; }
#Page_Event .content-entry{ border-color: #f29750 ;  }
#Page_Event .content-entry .entry-date span{ background-color: #f29750;}
#Page_Event .content-entry .entry-title::after{ border-color:#f29750; display: none;  }
#Page_Event .content-entry .acd-check:checked ~ .acd-head .entry-title::after{ display: block; }
#Page_Event .content-accordion .acd-head::after{ background-color: #f29750; }

.content-single-event{ max-width: calc(2200/3000*100vw); border-color:#f29750; }

/* onair */
#Page_Onair .cont-page-title h2{ background-color: #a589be;}
.content-single-onair{ max-width: calc(2200/3000*100vw); border-color:#a589be; }
#Page_Onair .cont-title{ color:#a589be; }
#Page_Onair .cont-title.bar-top{ color: #fff; background-color:#a589be; margin: -.5em auto 0 auto; padding-bottom: 1em;  }
#Page_Onair .cont-title-sep{ border-color:#a589be; }

.content-single-onair .single-body{background: #f4f4f4 url(../images/common/pattern-star.png);}

.onair-catch1{ font-size: 2.666em; letter-spacing: .3em; text-align: center; margin-bottom: 1em; }
.onair-catch2{ font-size: 2.666em; letter-spacing: .3em; text-align: center; margin-bottom: 1em; }

.onair-list{ margin: 0 auto 1em auto; max-width: 45em; }
.onair-list{ display: flex; flex-wrap: wrap; justify-content: center; text-align: left; padding: .5em; color: #a589be; background-color: #FFF; border: #a589be solid .3em; border-radius:1em; }
.onair-list{ 　}
.onair-list.first{  }
.onair-list .col-a{ width: 25%; }
.onair-list .col-b{ width: 75%; }
.onair-list .col-c{ width: 100%; }
.onair-list .col-d{ width: 75%; margin-left: 25%; }
.onair-list .name{ font-size: 1.2em; font-weight: bold; margin-bottom: 0; letter-spacing: .2em;}
.onair-list .schd{ font-size: 1.2em; font-weight: bold; margin-bottom: 0; letter-spacing: .2em; }
.onair-list .time{ font-size: 1.2em; margin-bottom: 0; letter-spacing: .2em; }
.onair-list .extr{ font-size: .9em; margin: .3em 0 0.1em 0; letter-spacing: .2em;}
a.onair-list { text-decoration: none; color: #FFF; pointer-events: all; }
a.onair-list:hover{ color: #fff; background-color: #a589be; }

.onair-list-il-container{ max-width: 45em; margin: 0 auto; }
.onair-list-ilttl{ text-align: center; font-weight: bold; letter-spacing: .15em; line-height: 1; padding: .5em 0; margin: 0 auto .5em auto; color: #a589be; border-bottom:#a589be dotted .3em; }
.onair-list-ilttl span{ font-size: 1.133em; }
.onair-list-il{ margin: 0 auto; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.onair-list-il > a{ width: 49%; margin: 0.5%; display: block; padding: .5em; color: #a589be; background-color: #FFF; border: #a589be solid .3em; border-radius:1em; text-decoration: none; font-weight: 600; }
.onair-list-il > a:hover{ background-color: #a589be; color: #FFF;}

/* staffcast */
#Page_Staffcast .cont-page-title h2{ background-color: #aed378;}
.content-single-staffcast{ max-width: calc(2200/3000*100vw); border-color:#aed378; }
#Page_Staffcast .cont-title{ color:#aed378; }
#Page_Staffcast .cont-title-sep{ border-color:#aed378; }

.cont-flex-staffcast{ max-width: 100%; margin: 0 auto; justify-content: space-between; }
.cont-flex-staffcast > div{ width: 47.5%; }

.staffcast-list{ max-width: 100%; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; line-height: 1; padding: .3em; margin-bottom: .8em; letter-spacing: .2em; background-color: rgba(0,0,0,.03); }
.staffcast-list .post{ width: inherit; font-size: 1em; text-align: left; color:#aed378; }
.staffcast-list .name{ width: inherit; font-size: 1em; text-align: right; }

/* about */
#Page_About .cont-page-title h2{ background-color: #ea5750;}
.content-single-about{ max-width: calc(2200/3000*100vw); border-color:#ea5750; }
#Page_About .cont-title{ color:#ea5750; }
#Page_About .cont-title.bar-top{ color: #fff; background-color:#ea5750; margin: -.5em auto 1em auto; padding-bottom: 1em;  }
#Page_About .cont-title-sep{ border-color:#ea5750; }
.about-catch{ position: relative; }
.about-catch .logo{ width: calc(1330/3000*100vw); display: block; padding-left: 0; margin: 0 auto; margin-bottom: 3em; }
.about-catch .catch1{ font-size: 2.666em; letter-spacing: .3em; text-align: center; margin-bottom: 1em; }
.about-catch .catch2{ font-size: 1.333em; letter-spacing: .2em; line-height: 2; font-weight: bold; text-align: center; margin-bottom: 3em; }
.cont-flex-about{ max-width: 100%; margin: 0 auto; }
.cont-flex-about > div{ width: 100%; margin-bottom: 3em; }
.about-block{ position: relative; }
.about-block .text{ font-size: 1.2em; padding: 1em; border-radius: 1.5em; letter-spacing: .3em; line-height: 2; background-color: #FFF; text-align: center; position: relative; overflow: hidden; }
.about-block .text p{ position: relative; z-index: 2; }
.about-block .text .text-bg{ position: absolute; line-height: 1; top:0; left:0; right: 0; margin: 0 auto; color: #ffebf1; font-family: 'Lato',"Noto Sans JP", sans-serif; font-style: italic; transform-origin: center center; z-index: 1; }
.about-block.a2 .frame-grad{ padding: 2em; border-radius: 2em; background: url(../images/common/pattern-star.png),linear-gradient(45deg, #f4f4f4 1%,#def9ff 100%);　}
.about-block.a3 .frame-grad{ padding: 2em; border-radius: 2em; background: url(../images/common/pattern-star.png),linear-gradient(45deg, #f4f4f4 1%,#f9ecff 100%);　}
.about-block.a4 .frame-grad{ padding: 2em; border-radius: 2em; background: url(../images/common/pattern-star.png),linear-gradient(45deg, #fff5f5 1%,#ffccca 100%);　}
.about-block.a3 .frame-grad .text-bg{ font-size:16em; letter-spacing: .9em; transform: rotate(5deg); top:-4vw; left:18vw;  }
.about-block.a4 .frame-grad .text-bg{ font-size:11.2em; letter-spacing: .1em; transform: rotate(5deg); top:-0.5vw; left:-0.7vw;  }
.about-block.a4 .kirakira{ font-size:1.2em; margin-bottom: 0; padding: .3em 0; background: url(../assets/about/kira.png) no-repeat center center; background-size: contain; }
.about-block .fig3{ width: calc(433/3000*100vw); position: absolute; top:16em; left: -1em; z-index: 2; }

/* story */
.cont-sub-story{ width: 100%;  }

#Page_Story .cont-page-title h2{ background: linear-gradient(45deg, #ffef7a 1%,#f4b5d1 100%); }
#Page_Story .cont-global-header{ padding-bottom: 2em; }

#StoryCont{ position: relative; overflow: hidden; }
#StoryCont:before{ content:""; display: block; width: 120vw; height: 5em; transform-origin: right bottom; transform: rotate(-5deg); position: absolute; right:-10vw; top:-2vw; background: linear-gradient(to right, #d7eff4 0%,#dbd0e6 14%,#dfedc9 28%,#bdc8e2 39%,#f7bcb9 50%,#c1e3cc 61%,#fae1ed 73%,#fff7c7 86%,#fad5b9 100%); }
#StoryCont:after{ content:""; display: block; width: 120vw; height: 19em; transform-origin: right bottom; transform: rotate(-5deg); position: absolute; right:-10vw; top:90vw; background: linear-gradient(to right, #d7eff4 0%,#dbd0e6 14%,#dfedc9 28%,#bdc8e2 39%,#f7bcb9 50%,#c1e3cc 61%,#fae1ed 73%,#fff7c7 86%,#fad5b9 100%); z-index: 1; }

#StoryCont .story-bg-line{ content:""; display: block; width: 120vw; height: 5em; transform-origin: right bottom; transform: rotate(-5deg); position: absolute; right:-10vw; top:-2vw; background: #ea5750;  }
#StoryCont .story-bg-line.line-a{  height: 5em; top:15vw; }
#StoryCont .story-bg-line.line-b{  height: 10em; top:60vw; }

.cont-story-navi{ position: relative; margin: 0 auto 2em auto; padding: .3em 0; z-index: 5; background-color: #ea5750; }
.story-navi{ margin: 0 auto; }
.story-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; position: relative; }
.story-navi ul li{  display: block; margin: 0; padding: .3em .3em; position: relative;}
.story-navi ul li.spc-sp{ display: none; }
.story-navi ul li a{ display: block; width: 7.0em; height: 7.0em; padding:0; background-color: #ea5750; color: #fff; border:#FFF solid 0px; text-align: center; transform-origin: center center; position: relative; overflow: hidden; }
.story-navi ul li a:before{ content:""; display: block; position: relative; width: 100%; min-height: 100%; background: url(../assets/story/cs.png) no-repeat center center; background-size: cover; }
.story-navi ul li a span{ display: block; font-size: 1.0em; font-weight: 900; line-height: 1; background-color: #ea5750; padding:1em 3em .25em 3em; text-align: center; position: absolute; top:-0.5em; right: -3em; transform: rotate(45deg);}
.story-navi ul li a:hover{ background-color: #ea5750; color: #fff; border-color: #ea5750; text-decoration: none; }
.story-navi ul li.crt a{ background-color: #ea5750; color: #fff; border-color: #fff; pointer-events: none; }
.story-navi ul li.cs a{ background-color: #eee; color: #fff; border-color: #FFF; pointer-events: none; }
.story-navi ul li.cs a span{ background-color: #fff; color: #cecece;  }

.cont-story-data{ width:100%; min-height: 65vw; position: relative; }
.story-data{ position: relative; display: none; pointer-events:none; text-align: center; z-index: 2; }
.story-data .story-block{ position: relative; padding: 2em 0 0 0; }
.story-data .ep-title{ font-size: 1em; margin-bottom: 1.5em; font-weight: 600; letter-spacing: .1em; filter: drop-shadow(.2em .2em 0 #e6e6e6); position: relative; z-index: 2; color:#ea5750;}
.story-data .ep-title .no{ font-size: 4em; }
.story-data .ep-title .sbt{ font-size: 4em;}
.story-data .ep-slider-sceneImage{ max-width: 100%; margin:0 auto .9em auto; position: relative; z-index: 2; background-color: #ea5750; pointer-events: all; }
.story-data .ep-slider-sceneImage .sld{ padding: 1.5em .75em; text-align: center; }
.story-data .ep-slider-thumb{ width: 100%; margin: 0 auto 2.5em auto; display: flex; justify-content: center; position: relative; z-index: 2; }
.story-data .ep-slider-thumb > div{ width: 8em; padding: 0 .5em; transform-origin: center center; pointer-events: all; }
.story-data .ep-slider-thumb > div > a{ display: block; line-height: 1; overflow: hidden; filter: drop-shadow(.4em .4em 0 #ea5750); }
.story-data .ep-slider-thumb > div:hover{ transform: scale(1.2,1.2); cursor: pointer; }
.story-data .ep-text{ margin-bottom: 2em; position: relative; z-index: 2; }
.story-data .ep-text p{ font-size: 1.666em; line-height: 1.8; letter-spacing: .1em; background-color: rgba(255,255,255,1); display: inline; filter: drop-shadow(-.2em 0 0 #fff); }
.story-data .ep-staff{ margin-bottom: 2em; position: relative; z-index: 2; }
.story-data .ep-staff p{ font-size: .888em; line-height: 1.8; letter-spacing: .1em; background-color: rgba(255,255,255,1); display: inline; filter: drop-shadow(-.2em 0 0 #fff); }
.story-data .ep-trailer{ width: 40em; padding: 1em; margin: 0 auto; position: relative; z-index: 2; pointer-events: all; background: linear-gradient(45deg, #ffef7a 1%,#f4b5d1 100%); }
.story-data .ep-trailer p{ line-height: 1; background-color: rgba(255,255,255,.8); margin-bottom: .5em; padding: .25em 0; }
.story-data.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }

/* character */
#Page_Character .cont-page-title h2{ background: linear-gradient(to right, #d7eff4 0%,#dbd0e6 14%,#dfedc9 28%,#bdc8e2 39%,#f7bcb9 50%,#c1e3cc 61%,#fae1ed 73%,#fff7c7 86%,#fad5b9 100%); }
#Page_Character .cont-global-header{ padding-bottom: 2em; }
.content-single-character{ max-width: calc(2200/3000*100vw); border-color:#ea5750; }
.cont-block-character{ width: 100%; }

.cont-character-navi{ width: 100%; margin: 0 auto; }
.character-navi-label{ background-color:#ea5750;  width: 40%; padding: .2em 0; margin: 0 auto; text-align: center; }
.character-navi-label > span{ color: #FFF;  font-family: 'Lato',"Noto Sans JP", sans-serif; letter-spacing: .3em; }
.character-navi{ width: 100%; margin: 0 auto; padding: .3em; background-color:#ea5750; }
.character-navi ul{ display: flex; flex-wrap: nowrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; }
.character-navi ul li{ width: calc(1/10*100%); display: block; margin: 0; padding: .3em; }
.character-navi ul li a{ width: 100%; display: block; line-height: 0; background-color: #FFF; position: relative; background-repeat: no-repeat; background-size: 31vw;  }
.character-navi ul li a:after{ content:""; display: block; width: calc(100% - 4px); min-height: calc(100% - 4px); border:#656565 solid 2px; position:absolute; top:2px; left: 2px; transform-origin: center center; transition: .2s all ease-in-out 0s; }
.character-navi ul li a:hover{  }
.character-navi ul li a:hover:after{ transform: scale(.8,.8); border-width: 6px; }
.character-navi ul li:nth-child(1) a{ background-image: url(../assets/character/c1.png); background-position: -14vw -3vw; }
.character-navi ul li:nth-child(1) a:after{ border-color: #ea5750; }
.character-navi ul li:nth-child(2) a{ background-image: url(../assets/character/c2.png); background-position: -13vw -3.5vw; }
.character-navi ul li:nth-child(2) a:after{ border-color: #5971b6; }
.character-navi ul li:nth-child(3) a{ background-image: url(../assets/character/c3.png); background-position: -13vw -3.5vw; }
.character-navi ul li:nth-child(3) a:after{ border-color: #ffef79; }
.character-navi ul li:nth-child(4) a{ background-image: url(../assets/character/c4.png); background-position: -14vw -3vw; }
.character-navi ul li:nth-child(4) a:after{ border-color: #61ba78; }
.character-navi ul li:nth-child(5) a{ background-image: url(../assets/character/c5.png); background-position: -13vw -3.5vw; }
.character-navi ul li:nth-child(5) a:after{ border-color: #a589be; }
.character-navi ul li:nth-child(6) a{ background-image: url(../assets/character/c6.png); background-position: -14vw -3vw; }
.character-navi ul li:nth-child(6) a:after{ border-color: #9bd6e4; }
.character-navi ul li:nth-child(7) a{ background-image: url(../assets/character/c7.png); background-position: -12.5vw -5.5vw; }
.character-navi ul li:nth-child(7) a:after{ border-color: #f4b5d1; }
.character-navi ul li:nth-child(8) a{ background-image: url(../assets/character/c8.png); background-position: -15.5vw -3vw; }
.character-navi ul li:nth-child(8) a:after{ border-color: #aed378; }
.character-navi ul li:nth-child(9) a{ background-image: url(../assets/character/c9.png); background-position: -12vw -2vw; }
.character-navi ul li:nth-child(9) a:after{ border-color: #f29750; }
.character-navi ul li.n10 a{ background-image: url(../assets/character/c10.png); background-position: -4vw -3vw; background-size: 16vw;  }
.character-navi ul li.n10 a:after{ border-color: #656565; }
.character-navi ul li.n11 a{ background-image: url(../assets/character/c11.png); background-position: -12.5vw -2vw;   }
.character-navi ul li.n11 a:after{ border-color: #deecff; }
.character-navi ul li.n12 a{ background-image: url(../assets/character/c12.png); background-position: -14.5vw -2vw;   }
.character-navi ul li.n12 a:after{ border-color: #29262e; }
/* .character-navi ul li.crt a{ background-color: #ffee00; pointer-events: none; } */

.cont-character-data{ width:100%; min-height: 70vw; margin-bottom: 2em; }
.character-data{ position: relative; pointer-events:none; overflow: hidden; border-bottom: #656565 solid 2px; }
.character-data{ display: none; }
.character-data:before{ content:""; display: block; width: 120vw; height: 5em; background: #656565; transform-origin: right bottom; transform: rotate(-5deg); position: absolute; right:-10vw; bottom:0vw; }

.character-data .chr-line{ display: block; width: 120vw; height: 16em; padding: .45em 0; border-top:#656565 dashed 1px;  border-bottom:#656565 dashed 1px;
transform-origin: left top; transform: rotate(-5deg); position: absolute; left:-10vw; top:calc(26vw + 3vw); line-height: 0; z-index: 1; }
.character-data .chr-line:before{ content:""; display: block; width: 100%; height: 15em; background: linear-gradient(to right, #d7eff4 0%,#dbd0e6 14%,#dfedc9 28%,#bdc8e2 39%,#f7bcb9 50%,#c1e3cc 61%,#fae1ed 73%,#fff7c7 86%,#fad5b9 100%); }

.character-data .chr-msg{ width: 120vw; height: 12em; background: linear-gradient(to right, #d7eff4 0%,#dbd0e6 14%,#dfedc9 28%,#bdc8e2 39%,#f7bcb9 50%,#c1e3cc 61%,#fae1ed 73%,#fff7c7 86%,#fad5b9 100%); transform-origin: left top; transform: rotate(-5deg); position: absolute; left:-10vw; top:1vw;z-index: 2; }
.character-data .chr-msg .msg{ position: absolute; width: 100%; height: 5vw; bottom:0; left:0; background-color: #656565; margin: 0; }
.character-data .chr-msg .msg span{ display: block; width: calc(2500/3000*100vw); margin-left: 10vw; }

.character-data .chr-prof{ position: absolute; z-index: 3; width: calc(1600/3000*100vw); top:10vw; left:0; right: 0; margin: 0 auto; text-align: center; pointer-events: none; }
.character-data .chr-prof .name-alp{ font-size: 1.333em; letter-spacing: .5em; font-family: a-otf-jun-pro, sans-serif; font-weight: 300; font-style: normal; margin-bottom: .5em; }
.character-data .chr-prof .name-alp span.ic{ display: inline-block; width: .8em; }
.character-data .chr-prof .name-alp span.text{ display: inline-block; margin: 0 .2em 0 .5em; }
.character-data .chr-prof .name{  margin:0 0 4em 1.5em; line-height: 1;}
.character-data .chr-prof .name > span{ font-size: 6em; letter-spacing: .2em; font-family: a-otf-jun-pro, sans-serif; font-weight: 300; font-style: normal; }
.character-data .chr-prof .name .t6-itaiji{ display: inline-block; width: .95em; height: .95em; position: relative; }
.character-data .chr-prof .name .t6-itaiji img{ position: absolute; top:0.1em; left: -0.08em; }
.character-data .chr-prof .cv{ font-weight: bold; margin: -2em auto 2em auto; text-align: center; }
.character-data .chr-prof .cv > span{ font-size: 1.4em; letter-spacing: .1em; }
.character-data .chr-prof .post{ width: 30%; background-color: #656565; padding: .2em 0; margin: 0 auto 2em auto; text-align: center; }
.character-data .chr-prof .post > span{ color: #FFF; }
.character-data .chr-prof .data-list{ width: 70%; margin: 0 auto 4em auto; display: flex; flex-wrap: wrap; justify-content: center; }
.character-data .chr-prof .data-list .data-list-l{ margin-right: .5em; }
.character-data .chr-prof .data-list .data{ display: flex; flex-wrap: nowrap; padding: .5em; margin-bottom: .5em; line-height: 1; background-color: rgba(255,255,255,.8);}
.character-data .chr-prof .data-list .data .hd{ color: #656565; letter-spacing: .2em; padding-right: 1em; }
.character-data .chr-prof .data-list .data .bd{ color: #656565; letter-spacing: .2em;}

.character-data .chr-prof .profile{ width: 86%; font-size: 1.333em; margin: 0 auto 2em auto; letter-spacing: .1em; text-align: left; background-color: rgba(255,255,255,.9);}
.character-data .chr-prof .face{ width: 70%; margin: 0 auto;}
.character-data .chr-img{ position: relative; z-index: 3; width: calc(1120/3000*100vw); margin: 0 0 0 auto; }
.character-data .chr-halfface{ position: absolute; z-index: 1; width: calc(990/3000*100vw); bottom: 0; left: 0; }

.character-data#C1,
.character-data#C1 .chr-line{ border-color: #ea5750; }
[data-character="c1"] .character-navi-label,
[data-character="c1"] .character-navi,
.character-data#C1:before,
.character-data#C1 .chr-msg .msg,
.character-data#C1 .chr-prof .post{ background-color: #ea5750; }
.character-data#C1 .chr-prof,
.character-data#C1 .chr-prof .data-list .data .hd{ color: #ea5750; }

.character-data#C2,
.character-data#C2 .chr-line{ border-color: #5971b6; }
[data-character="c2"] .character-navi-label,
[data-character="c2"] .character-navi,
.character-data#C2:before,
.character-data#C2 .chr-msg .msg,
.character-data#C2 .chr-prof .post{ background-color: #5971b6; }
.character-data#C2 .chr-prof,
.character-data#C2 .chr-prof .data-list .data .hd{ color: #5971b6; }

.character-data#C3,
.character-data#C3 .chr-line{ border-color: #eeda4b; }/* #ffef79 */
[data-character="c3"] .character-navi-label,
[data-character="c3"] .character-navi,
.character-data#C3:before,
.character-data#C3 .chr-msg .msg,
.character-data#C3 .chr-prof .post{ background-color: #eeda4b; }
.character-data#C3 .chr-prof,
.character-data#C3 .chr-prof .data-list .data .hd{ color: #eeda4b; }

.character-data#C4,
.character-data#C4 .chr-line{ border-color: #61ba78; }
[data-character="c4"] .character-navi-label,
[data-character="c4"] .character-navi,
.character-data#C4:before,
.character-data#C4 .chr-msg .msg,
.character-data#C4 .chr-prof .post{ background-color: #61ba78; }
.character-data#C4 .chr-prof,
.character-data#C4 .chr-prof .data-list .data .hd{ color: #61ba78; }

.character-data#C5,
.character-data#C5 .chr-line{ border-color: #a589be; }
[data-character="c5"] .character-navi-label,
[data-character="c5"] .character-navi,
.character-data#C5:before,
.character-data#C5 .chr-msg .msg,
.character-data#C5 .chr-prof .post{ background-color: #a589be; }
.character-data#C5 .chr-prof,
.character-data#C5 .chr-prof .data-list .data .hd{ color: #a589be; }

.character-data#C6,
.character-data#C6 .chr-line{ border-color: #9bd6e4; }
[data-character="c6"] .character-navi-label,
[data-character="c6"] .character-navi,
.character-data#C6:before,
.character-data#C6 .chr-msg .msg,
.character-data#C6 .chr-prof .post{ background-color: #9bd6e4; }
.character-data#C6 .chr-prof,
.character-data#C6 .chr-prof .data-list .data .hd{ color: #9bd6e4; }

.character-data#C7,
.character-data#C7 .chr-line{ border-color: #f4b5d1; }
[data-character="c7"] .character-navi-label,
[data-character="c7"] .character-navi,
.character-data#C7:before,
.character-data#C7 .chr-msg .msg,
.character-data#C7 .chr-prof .post{ background-color: #f4b5d1; }
.character-data#C7 .chr-prof,
.character-data#C7 .chr-prof .data-list .data .hd{ color: #f4b5d1; }

.character-data#C8,
.character-data#C8 .chr-line{ border-color: #aed378; }
[data-character="c8"] .character-navi-label,
[data-character="c8"] .character-navi,
.character-data#C8:before,
.character-data#C8 .chr-msg .msg,
.character-data#C8 .chr-prof .post{ background-color: #aed378; }
.character-data#C8 .chr-prof,
.character-data#C8 .chr-prof .data-list .data .hd{ color: #aed378; }

.character-data#C9,
.character-data#C9 .chr-line{ border-color: #f29750; }
[data-character="c9"] .character-navi-label,
[data-character="c9"] .character-navi,
.character-data#C9:before,
.character-data#C9 .chr-msg .msg,
.character-data#C9 .chr-prof .post{ background-color: #f29750; }
.character-data#C9 .chr-prof,
.character-data#C9 .chr-prof .data-list .data .hd{ color: #f29750; }

.character-data#C10,
.character-data#C10 .chr-line{ border-color: #656565; }
[data-character="c10"] .character-navi-label,
[data-character="c10"] .character-navi,
.character-data#C10:before,
.character-data#C10 .chr-msg .msg,
.character-data#C10 .chr-prof .post{ background-color: #656565; }
.character-data#C10 .chr-prof,
.character-data#C10 .chr-prof .data-list .data .hd{ color: #656565; }

.character-data#C11,
.character-data#C11 .chr-line{ border-color: #94c1ff; }
[data-character="c11"] .character-navi-label,
[data-character="c11"] .character-navi,
.character-data#C11:before,
.character-data#C11 .chr-msg .msg,
.character-data#C11 .chr-prof .post{ background-color: #94c1ff; }
.character-data#C11 .chr-prof,
.character-data#C11 .chr-prof .data-list .data .hd{ color: #94c1ff; }

.character-data#C12,
.character-data#C12 .chr-line{ border-color: #29262e; }
[data-character="c12"] .character-navi-label,
[data-character="c12"] .character-navi,
.character-data#C12:before,
.character-data#C12 .chr-msg .msg,
.character-data#C12 .chr-prof .post{ background-color: #29262e; }
.character-data#C12 .chr-prof,
.character-data#C12 .chr-prof .data-list .data .hd{ color: #29262e; }

.character-data.crt{ display: block; /* animation: fadeIn 1.5s 0s ease-out both; */ }
.character-data.crt .chr-name { animation: fadeInUp .5s .5s ease-out both; }
.character-data.crt .chr-prof{ animation: fadeIn .5s 0s ease-out both; }
.character-data.crt .chr-img{ animation: fadeIn .5s .5s ease-out both; }
.character-data.crt .chr-halfface{ animation: fadeIn .5s .5s ease-out both; }

.cont-character-cursor{ position: absolute; top:20vw; width: 100%; pointer-events: none; z-index: 50; }
.character-cursor{ display: block; padding: 0 .5%; position: relative; }
.character-cursor ul{ display: flex; justify-content: space-between; margin: 0; padding: 0; list-style-type: none; }
.character-cursor ul li{ display: block; width:calc(85/3000*100vw); height: calc(197/3000*100vw); position: relative; pointer-events: all; cursor: pointer; }
.character-cursor ul li a{ display: block; width:100%; height: 100%; background: url(../images/top-movie-pplaybtn.png) no-repeat center center; background-size: 100%; transform-origin: center center; }
.character-cursor ul li.right a{ transform: scale(-1,1); }
.character-cursor ul li.off{ opacity: .3; }


/* bddvd */
#Page_Bddvd .cont-page-title h2{ background-color: #5971b6;}
.content-single-bddvd{ max-width: calc(2200/3000*100vw); border-color:#5971b6; }
#Page_Bddvd .cont-title{ color:#5971b6; }
#Page_Bddvd .cont-title-sep{ border-color:#5971b6; }

#Page_Bddvd .ttl2 > span{ color: #5971b6; border-color: #5971b6 ;}

.bnf-list{ display: flex; flex-wrap: wrap; margin-bottom: 1em; align-items: flex-start; }
.bnf-list > div{ border: #fff solid 2px; background-color: #fff; }
.bnf-list > .item-x1{ width: 100%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x2{ width: 50%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x3{ width: 33.33%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x3x2{ width: 66.66%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x4{ width: 25%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list > .item-x1.x1-dbl{ width: 50%; margin: 0 ; padding: .5em .25em; display: flex; flex-wrap: wrap; align-items: top; }
.bnf-list .item-col{ width: 100%; }
.bnf-list .item-col-x2{ width: calc((100% - (0.5em * 1)) / 2); margin-right: .5em; }
.bnf-list .item-col-x2:nth-of-type(2n){ margin-right: 0;}
.bnf-list .item-col-x2:last-child{ margin: 0; }
.bnf-list .item-col-x3{ width: calc((100% - (0.5em * 2)) / 3); margin-right: .5em; }
.bnf-list .item-col-x3:nth-of-type(3n){ margin-right: 0;}
.bnf-list .item-col-x3:last-child{ margin: 0; }
.bnf-list .item-col-x4{ width: calc((100% - (0.5em * 3)) / 4); margin-right: .5em; }
.bnf-list .item-col-x4:nth-of-type(4n){ margin-right: 0;}
.bnf-list .item-col-x4:last-child{ margin: 0; }

.bnf-list .shop{ width: 100%; font-size: 0.777em; color: #5971b6; padding: 0; margin-bottom: .5em; background-color: rgba(0,0,0,.05); }
.bnf-list .shop::before{ content:"■ "; }
.bnf-list .thumb{ padding:1em 1em; text-align: center; margin: .5em auto ; }
.bnf-list .thumb{ display: flex; align-items: center; justify-content: center; vertical-align: middle; }
.bnf-list .thumb .inner{ /*height: 21em;*/ }
.bnf-list .thumb .inner a{ display: block; /*height: 21em;*/ position: relative; }
.bnf-list .thumb .inner img.vt{ max-width: auto; height: 100%; width: auto\9;}
.bnf-list .thumb.np{ pointer-events: none; display: none; }
.bnf-list .data{ width: 100%; }
.bnf-list .excond{ font-size: 0.666em; color: #5971b6; margin-bottom: .3em; }
.bnf-list .name{ font-size: .8em; letter-spacing: -0.05em; margin-bottom: .3em; font-weight: 700; }
.bnf-list .cond{ font-size: 0.666em; font-weight: bold; margin-bottom: .3em; border:#5971b6 solid 2px; display: inline-block; padding: .1em .2em; color: #5971b6; }
.bnf-list .start{ font-size: 0.666em;  }
.bnf-list .shop-link{ width: 100%; font-size: 0.666em; padding: .5em 0 0 0; text-align: left;  }


/* music */
#Page_Music .cont-page-title h2{ background-color: #f4b5d1;}
.content-single-music{ max-width: calc(2200/3000*100vw); border-color:#f4b5d1; }
#Page_Music .cont-title{ color:#f4b5d1; }
#Page_Music .cont-title-sep{ border-color:#f4b5d1; }

#Page_Music .ttl2 > span{ color: #f4b5d1; border-color: #f4b5d1 ;}


/* special */
#Page_Special .cont-page-title h2{ background-color: #61ba78;}
.content-single-special{ max-width: calc(2200/3000*100vw); border-color:#61ba78; }
#Page_Special .cont-title{ color:#61ba78; }
#Page_Special .cont-title.bar-top{ color: #fff; background-color:#61ba78; margin: -.5em auto 1em auto; padding-bottom: 1em;  }
#Page_Special .cont-title-sep{ border-color:#61ba78; }
#Page_Special .ttl1{ background-color: #61ba78; }
#Page_Special .ttl3{ color: #61ba78; border-color:; }

.content-single-special-thm{ max-width: calc(2200/3000*100vw); margin: 0 auto; }
.cont-flex-special{ max-width: 100%; margin: 0 auto; }
.cont-flex-special > div{ width: 100%; }

.spwp-frame{ padding: .5em; background: #FFF; border: #aaa solid 1px; text-decoration: none;filter: drop-shadow( .3em .3em 0 rgba(0,0,0,.2)); }
.spwp-frame:hover{text-decoration: none; }
.spwp-frame .th{ margin-bottom: .5em; }
.spwp-frame .tx{ font-size: .888em; margin-bottom: 0; color: #656464;}

/* goods */
#Page_Goods .cont-page-title h2{ background-color: #f5e14e;}
.cont-entries-goods{ max-width: calc(2200/3000*100vw); }
.cont-entries-goods .content-entry{ border-color: #f5e14e ; }
.cont-entries-goods .content-entry .entry-title::after{ border-color: #f5e14e ; }

#Page_Goods .cont-title{ color:#f5e14e; }
#Page_Goods .cont-title.bar-top{ color: #fff; background-color:#f5e14e; margin: -.5em auto 1em auto; padding-bottom: 1em;  }
#Page_Goods .cont-title-sep{ border-color:#f5e14e; }

#Page_Goods .ttl1{ background-color: #f5e14e; }
#Page_Goods .ttl3{ color: #f5e14e; border-color:; }

.cont-sub-goods .cont-tiles{ max-width: 95em; margin: 0 auto;  }

.goods-list{ display: flex; flex-wrap: wrap; width: 100%; margin: 0 auto; align-items: stretch;  }
.goods-list .goods-data{ width: calc((100% - 3em)/4); margin: 0 1em 1em 0 ; padding: 0; background-color: #FFF; border:#f5e14e solid 1px; position: relative; overflow: hidden; }
.goods-list .goods-data:nth-of-type(4n){ margin-right: 0;}
.goods-list .goods-data-img{ width: 100%; height: 17vw; padding: .5em; display: table-cell; text-align: center; vertical-align: middle; }
.goods-list .goods-data-name{ padding: .5em 1em; font-size: 1em; color: #fff; background-color: #f5e14e; font-weight: bold; }
.goods-list .goods-data-ic{ padding: 1.4em 1.4em 0 1.4em ; margin-bottom: 0; padding-bottom: 0; font-size: .6em;}
.goods-list .goods-data-ic > span{ display: inline-block; padding: .5em; border: #f5e14e dashed 1px; color: #f5e14e; line-height: 1; }
.goods-list .goods-data-detail{ padding: 1.4em; margin-bottom: 0; padding-bottom: 0; font-size: .6em;}
.goods-list .goods-data-data{ padding: 1em; padding-bottom: 0; font-size: .888em; /*color: #1ea728;*/ }
.goods-list .goods-data-table{ border-collapse:separate; border-spacing: 2px; }
.goods-list .goods-data-table th{ color: #999; background-color: rgba(0,0,0,0.04); font-weight: 500; font-size: .8em; padding: 0 .2em; }
.goods-list .goods-data-table td{ padding: 0 .2em; font-size: .8em; background-color: rgba(0,0,0,0.02); }
.goods-list .goods-data-link{ padding: 1em; font-size: .8em; margin-bottom: 0; }




/*
■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■      

                     ■                                                     
 ■■    ■■            ■  ■             ■■■                     ■            
 ■■    ■■            ■               ■   ■                                 
 ■■■  ■ ■   ■■■   ■■■■  ■  ■■■      ■     ■  ■   ■   ■■■  ■ ■ ■   ■■■  ■■■ 
 ■ ■  ■ ■  ■  ■  ■■ ■■  ■  ■  ■     ■     ■  ■   ■  ■  ■  ■■  ■  ■  ■  ■   
 ■ ■  ■ ■  ■   ■ ■   ■  ■   ■■■     ■     ■  ■   ■  ■   ■ ■   ■  ■   ■ ■■  
 ■  ■■  ■  ■■■■■ ■   ■  ■ ■■  ■     ■     ■  ■   ■  ■■■■■ ■   ■  ■■■■■   ■■
 ■  ■■  ■  ■     ■■ ■■  ■ ■   ■      ■  ■■   ■  ■■  ■     ■   ■  ■        ■
 ■      ■   ■■■   ■■■■  ■  ■■■■       ■■■■■   ■■ ■   ■■■  ■   ■   ■■■  ■■■ 

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* Custom 1920 ----------------------------------------------------------------------------- */
@media (max-width: 1919px) {
}
/* Custom 1400 ----------------------------------------------------------------------------- */
@media (max-width: 1399px) {

}
/* LG ----------------------------------------------------------------------------- */
@media (max-width: 1199px) {

}
/* MD ----------------------------------------------------------------------------- */
@media (max-width: 991px) {
}
/* SM ----------------------------------------------------------------------------- */
@media (max-width: 767px) {
/* ---- Structure ---- */


/* header */
.part-header{ width: 100%; position: fixed; top: 0; left: 0; }
.cont-global-navi{ background-color: rgba(0,0,0,0); transition: .2s background-color ease-in-out 0s;}

.global-logo{ position: relative; display: block; width: calc( 506 / 1000 * 100vw*0.8 ); top:inherit; left: inherit; margin: 0 auto 1.5em auto; padding: 1.5em 0 .5em 0; transform-origin: center center; visibility: hidden; }

.global-about{ position: relative; width:calc( 360/1000*100vw ); margin: 0 auto; top:inherit; right: inherit; visibility: hidden;  }
.global-navi{ position: relative; margin: 0 auto; visibility: hidden; }
.global-navi > ul{ display: flex; flex-wrap: wrap; justify-content: center; list-style-type: none; padding: 0; margin: 0 auto; }

.global-navi > ul.l1{ order: 1; text-align: center; margin-bottom: 1.8em;  }
.global-navi > ul.l1 > li{ width: 100%; margin-right: inherit; margin-bottom: 1.8em }
.global-navi > ul.l1 > li:last-child{ margin-bottom: 0; }
.global-navi > ul.l1 > li a span{ font-size: 1.8em; letter-spacing: .3em;  }

.global-navi > ul.l2{ padding: 1.8em 0; order: 2; text-align: center; line-height: 1; }
.global-navi > ul.l2 > li{ width: 100%; margin-right: inherit; margin-bottom: 1.8em; }
.global-navi > ul.l2 > li:last-child{ margin-bottom: 0; }
.global-navi > ul.l2 > li a span{ font-size: 1.6em; }

.cont-sp-btn{ display: block; color:#000; width: 3.0em; position: absolute; top:1.2em; right: 1em; z-index: 2; pointer-events: auto; }
.cont-sp-btn a{ color: #000; }
.sub-page .cont-sp-btn{ color:#000; }
.sub-page .cont-sp-btn a{ color: #000; }

.cont-sp-btn svg{ fill: currentColor; }
.cont-sp-btn .sp-navi-open{ display: block; }
.cont-sp-btn .sp-navi-close{ display: none; }

.part-header.on{ height: 100vh; }
.part-header.on .cont-global-navi{ min-height: 100%; background-color: rgba(255,255,255,1); background:rgba(255,255,255,1) url(../images/common/header-bg-sp.png) no-repeat center 5em; background-size: 100%;  pointer-events: auto; }
.part-header.on .global-logo{ visibility: visible; transform: scale(1.3,1.3); transition: .2s all ease-in-out 0s; }
.part-header.on .global-about{ visibility: visible; }
.part-header.on .global-navi{ visibility: visible; pointer-events: auto; }
.part-header.on .cont-sp-btn{ color:#000; }
.part-header.on .cont-sp-btn a{ color: #000; }
.part-header.on .cont-sp-btn .sp-navi-open{ display: none; }
.part-header.on .cont-sp-btn .sp-navi-close{ display: block; }


/* subheader */
.part-subheader{  }
.subheader-banner{ width: 8.5em; margin:.5em auto 0 .5em;   }


/* body */
.part-body{ min-height: calc(100vh - 6em); }
.cont-header-logo{ display: block; width: calc( 506 / 1000 * 100vw ); margin: 0 auto; padding: .5em 1.5em .5em 1.5em; }
.cont-global-header{ overflow: hidden; padding: 0 0 2em 0; }

.cont-page-title h2 span{ font-size: 1.4em; }
.cont-title > span{ font-size: 1.4em; }

.cont-top-content > .inner{ width: 90%; }
.cont-top-title{ font-size: 1em; margin-bottom: 2.5em; padding: 0; box-sizing: border-box; }
.cont-sub-content > .inner{ width: 90%; }
.cont-sub-title{ font-size: 1em; margin-bottom: 2.5em; padding: 0; box-sizing: border-box; }
.cont-sub-title > div{ width: calc( 1230 / 3000 * 100vw*1.2 );  }

/* footer */
.part-footer{  }
.footer-pagetop{ width: calc( 242/30 * 1em * 0.7 ); right:.3em; }
.footer-eyecatch{ background-image: url(../images/common/footer-eyecatch-sp.png); }


/* content */
.cont-entries{ width: 100%; padding-bottom: 3em; }
.content-entry{ margin-bottom: 3em; }
.content-entry:last-child{ margin-bottom: 0;}
.content-entry .entry-date{ padding: 2em 2em 0 2em ; }
.content-entry .entry-title{ padding: 2em 2em 0 2em ; }
.content-entry .entry-title > span{ font-size: 1.6em; }
.content-entry .entry-body{ padding: 1.6em ; }

.content-single{ border-width: .8em; margin-bottom: 3em; }
.content-single .single-body{ padding: 1.6em ; }

.content-accordion .acd-head::after{  font-size:1.0em; padding: .5em 0 .6em 0; width: 2em; top:1.75em; left:-1em; }

.cont-modal{ width: 100%; margin: 0 auto; }

/* TOP-PAGE */
.top-page .cont-global-header{ padding: 0 0 2em 0; }
/* main */
.cont-top-visual .oa-copy{ width: 80%; position: absolute; top:-5.5vw; left: 0; right: 0; margin: 0 auto; }
.cont-top-visual .badge{ width: 12em; top:-23.9vw; left: .3em; }
/* grp3 */
.grp3 .catch{ top:40vw;  } 
.s3 .grp3 .catch{ top: 106vw; right:1vw; } 
/* grp2 */
.grp2 .catch{ width: calc(876/1000*100vw); height: calc(51/1000*100vw);  }
.grp2 .catch:after{ height: calc(51/1000*100vw); }
.s2 .grp2 .catch{ top:56.5vw; }
/* vis-switch */
.vis-switch{ margin: -2em auto 2em auto; }
.vis-switch > div{ width: 6em; margin: .5em; line-height: 0; border-width: :2px;  }
/* yell-btn */
.yell-btn{ position: relative; padding: 2em 0 2em 0; margin-bottom: 2em; }
.yell-btn .label{ bottom:-1.1em; }
.yell-btn .label span{font-size:1.2em;}
.yell-btn .btn-list{ position: relative; width: 100%; display: flex; flex-wrap: nowrap; justify-content: center; }
.yell-btn .btn-list > div{ margin: .1em; filter: drop-shadow( .2em .2em 0 rgba(0,0,0,.2));  }
.yell-btn .btn-list > div .ic{ width: 2em; top:-2.0em; }







.vis-detail-list .close{ width: 8vw; position: absolute; top:2vw; right: 2vw;}
.vis-detail .bgline.line1{ height: 20em; top:-22em; }
.vis-detail .bgline.line2{ height: .3em; top:15em; }
.vis-detail .bgline.line3{ height: 25em; top:35em; }
.vis-detail-container{ display: flex; flex-wrap: wrap; justify-content: center; position: relative; }
.vis-detail-container .left{ width: 100%; padding: 0 10vw; order: 2; }
.vis-detail-container .right{ width: 100%; padding: 0 10vw 10vw 10vw; order: 1;}

.vis-detail-container .cmt{ margin-bottom: 1em;}
.vis-detail-container .count-cheer{ width: calc(416/3000*100vw*2.5); height: calc(41/3000*100vw*2.5); }
.vis-detail-container .count-msg{ }

.vis-detail-container .count-ui .count-heart{ width: calc(652/3000*100vw*2.0); height: calc(549/3000*100vw*2.0); }
.vis-detail-container .count-ui .count-heart:before{ width: calc(652/3000*100vw*2.0); height: calc(549/3000*100vw*2.0);  }
.vis-detail-container .count-ui .count-heart:after{ width: calc(652/3000*100vw*2.0); height: calc(549/3000*100vw*2.0);  }
.vis-detail-container .count-ui .count-number{ top:8vw;  }
.vis-detail-container .count-ui .count-number span{ font-size:2.2em;}
.vis-detail-container .count-ui .count-label{ top:15.5vw; }
.vis-detail-container .count-ui .count-label span{ font-size:1em; letter-spacing: .2em; font-weight: bold; }
.vis-detail-container .count-ui .count-btn{ width: 5em; padding: .9em .5em .2em 0; font-size:1.2em; top:21vw; }

.vis-detail-container .count-ui .count-nolngr{ top:9vw;  }
.vis-detail-container .count-ui .count-thanks{ top:13.5vw; }

@keyframes count-heart-anm {
  0% {opacity:0; transform:scale(.9,.9) rotateY(0) translateY(0em);}
  30% {opacity:1; transform:scale(.7,.7) rotateY(0) translateY(2em);}
  95% {opacity:1; transform:scale(.3,.3) rotateY(720deg) translateY(-390vw);}
  100% {opacity:0; transform:scale(.3,.3) rotateY(720deg) translateY(-390vw);}
}


/* news twitter */
.cont-top-news-twitter{ margin-bottom: 3em; }
.cont-top-news-twitter > .inner{ padding: 5em 0; }
.cont-top-news,
.cont-top-twitter,
.cont-top-tiktok{ width: 100%; }

/* news */
.cont-top-news{ margin-right: inherit; margin-bottom: 7em; }
.news-container{ padding: 1em; }
.news-container dl{ font-size: 1.2em;}

/* twitter */
.cont-top-twitter{ margin-right: inherit; margin-bottom: 7em; }

/* tiktok */
.cont-top-tiktok{  }



/* story */
.cont-top-story{ width: 100%; padding: 2.5em; margin-bottom: 5em; }
.cont-top-story.cont-top-content > .inner{ width: inherit; }
.cont-top-story .story-container{ padding: 1em; text-align: center; position: relative; overflow: hidden; }
.cont-top-story .story-container .bg-sil{ position: absolute; bottom:15vw; transform-origin: center center; opacity: 0; transform: scale(1.1,1.1); }
.cont-top-story .story-container .bg-sil.inview-act-start{ opacity: 1; transform: scale(2,2); transition: .8s all ease-in-out 1.1s; }
.cont-top-story .story-container > p{ font-size: 1.066em;  }
.cont-top-story .top-cont-link{  bottom:-3.5em;  }

/* profile */
.cont-top-profile{ width: 100%;  margin-bottom: 3em; }
.cont-top-profile.cont-top-content > .inner{ width: inherit; }
.cont-top-profile .profile-container{ padding: 12vw 0; }
.cont-top-profile .bg-grad{ min-height: 35vw; top:12vw; left:-10vw }
.cont-top-profile .profile-list > div{ padding:.1em; }
.cont-top-profile .profile-list > div a{ height: 30vw; }
.cont-top-profile .profile-list > div a span{ transform: scale(1.6,1.6); transform-origin: top left; }
.cont-top-profile .top-cont-link{  bottom:1em;  }

/* intro */
.cont-top-intro{ width: 96%; }
.cont-top-intro.cont-top-content > .inner{ width: inherit; padding: 2em 0 ; }
.cont-top-intro .intro-container{ padding: 1em; color:#5971b6 ; text-align: center; position: relative; overflow: hidden; }
.cont-top-intro .intro-container > p{ font-size: 1.066em; letter-spacing:.2em ; line-height: 2; }
.cont-top-intro .intro-container > p [data-ruby]::before { top: -1.7em; }

/* movie */
.cont-top-movie{ width: 100%; margin-bottom: 4em;  }
.cont-top-movie.cont-top-content > .inner{ width: inherit; padding:3em 0 2em 0; }
.cont-top-movie.cont-top-content > .inner:before{ height: 10vw; }
.cont-top-movie .movie-container .main{ width: calc(800/1000*100vw); padding: 0 ; margin: 0 auto 2em auto; filter: drop-shadow( 0 0 .3em rgba(0,0,0,.5)); }
.cont-top-movie .movie-container .main a::after{ width:calc(246/3000*100vw*1.5); height:calc(284/3000*100vw*1.5); top:17vw; opacity: .9; }
.cont-top-movie .movie-container .thumb > div:nth-child(4){ margin-right: 0;  }







/* SUB-PAGE */
/* news */
.cont-entries-news{ max-width: inherit; }

/* event */
.cont-entries-event{ max-width: inherit; }

/* onair */
.content-single-onair{ max-width: inherit; }
#Page_Onair .cont-title.bar-top{ padding-bottom: .5em; }

.onair-catch1{ font-size: 2.666em; }
.onair-catch2{ font-size: 2.666em; }

.onair-list{ margin: 0 auto .5em auto; max-width: inherit; }
.onair-list.first{  }
.onair-list .col-a{ width: 100%; }
.onair-list .col-b{ width: 100%; }
.onair-list .col-c{ width: 100%; }
.onair-list .col-d{ width: 100%; margin-left: 0; }

.onair-list-il > a{ width: 100%; margin: 0.5% 0; display: block; padding: .5em; color: #a589be; background-color: #FFF; border: #a589be solid .3em; border-radius:1em; text-decoration: none; font-weight: 600; }

/* staffcast */
.content-single-staffcast{ max-width: inherit; }
.cont-flex-staffcast > div{ width: 100%; }
.staffcast-list{ max-width: 100%; }
.staffcast-list .post{ width: 100%; }
.staffcast-list .name{ width: 100%; }

/* about */
.content-single-about{ max-width: inherit; }
#Page_About .cont-title.bar-top{ padding-bottom: .5em;  }
.about-catch{ position: relative; }
.about-catch .logo{ width: calc(800/1000*100vw); padding-top:3em; padding-left: 0; margin: 0 auto; margin-bottom: 2em; }
.about-catch .catch1{ font-size: 2em; margin-bottom: 1em; }
.about-catch .catch2{ font-size: 1.133em; margin-bottom: 3em; }
.about-block .text{ font-size: 1em; padding: .5em; letter-spacing: .1em; border-radius: .5em; }
.about-block.a2 .frame-grad{ padding: 1.0em; border-radius: 1em; }
.about-block.a3 .frame-grad{ padding: 1.0em; border-radius: 1em; }
.about-block.a4 .frame-grad{ padding: 1.0em; border-radius: 1em; }
.about-block.a3 .frame-grad .text-bg{ font-size:16em; top:-8vw; left:18vw;  }
.about-block.a4 .frame-grad .text-bg{ font-size:6em; top:12.5vw; left:-2vw;  }
.about-block .fig3{ width: calc(250/1000*100vw); position: absolute; top:18.5em; left: -2.5em; z-index: 2; }


/* story */
.cont-sub-story > .inner{ width: 100%; }
#StoryCont:before{ height: 15em; right:-10vw; top:calc(95vw - 38vw); }
#StoryCont:after{ height: 19em; right:-10vw; top:calc(230vw - 38vw); }
#StoryCont .story-bg-line.line-a{  height: 5em; top:calc(42vw - 38vw); }
#StoryCont .story-bg-line.line-b{  height: 10em; top:calc(119vw - 38vw); }

.cont-story-navi{ padding: .4em 0; }
.story-navi ul li{ padding: .4em .4em; }
.story-navi ul li.spc-sp{ display: none; }
.story-navi ul li a{ width: 6.5em; height: 6.5em; }

.cont-story-data{ min-height: 65vw; }
.story-data .story-block{ padding: .5em 0 0 0; }
.story-data .ep-title{ font-size: 1em; margin-bottom: 3.5em;}
.story-data .ep-title .no{ font-size: 4em; margin-bottom: .1em; display: block; }
.story-data .ep-title .sbt{ font-size: 3.5em;}
.story-data .ep-slider-sceneImage{ margin:0 auto .9em auto; }
.story-data .ep-slider-sceneImage .sld{ padding: 1em .5em; }
.story-data .ep-slider-thumb{ margin: 0 auto 2.5em auto; }
.story-data .ep-slider-thumb > div{ width: 6.0em; padding: 0 .3em; }
.story-data .ep-text{ padding: 0 .5em; margin-bottom: 3em; position: relative; z-index: 2; }
.story-data .ep-text p{ font-size: 1.666em;  }
.story-data .ep-staff p{ font-size: .666em;  }
.story-data .ep-trailer{ width: 30em; }
.story-data.crt{ display: block; animation: fadeIn .5s 0s ease-out both;  }


/* character */
.cont-sub-character > .inner{ width: 100%; }
.content-single-character{ max-width:inherit; }

/* .character-navi{ width: inherit; padding: 0; position: relative; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; }
.character-navi > ul{ width: auto; display: table; margin: 0 ; padding: 0; position: relative; }
.character-navi > ul > li{ width: 20vw; display: table-cell; margin: 0; padding: 0; white-space: nowrap; }
.character-navi > ul > li:first-child{ padding-left: 0;  }
.character-navi > ul > li:last-child{ padding-right: 0;  } */

.character-navi ul{ display: flex; flex-wrap: wrap; justify-content: center; margin: 0; padding: 0; list-style-type: none; }
.character-navi ul li{ width: calc((100vw/5) - 0.4em ); display: block; margin: 0; padding: .4em; }
.character-navi ul li a{ background-size: calc(31vw * 2 * 0.95);  }
.character-navi ul li a:after{ border-width: 1px; }
.character-navi ul li a:hover{  }
.character-navi ul li a:hover:after{ transform:none;  }
.character-navi ul li:nth-child(1) a{ background-image: url(../assets/character/c1-sp.png); background-position: -28vw -6vw; }
.character-navi ul li:nth-child(2) a{ background-image: url(../assets/character/c2-sp.png); background-position: -26vw -7vw; }
.character-navi ul li:nth-child(3) a{ background-image: url(../assets/character/c3-sp.png); background-position: -26vw -7vw; }
.character-navi ul li:nth-child(4) a{ background-image: url(../assets/character/c4-sp.png); background-position: -28vw -6vw; }
.character-navi ul li:nth-child(5) a{ background-image: url(../assets/character/c5-sp.png); background-position: -26vw -7vw; }
.character-navi ul li:nth-child(6) a{ background-image: url(../assets/character/c6-sp.png); background-position: -28vw -6vw; }
.character-navi ul li:nth-child(7) a{ background-image: url(../assets/character/c7-sp.png); background-position: -25vw -11vw; }
.character-navi ul li:nth-child(8) a{ background-image: url(../assets/character/c8-sp.png); background-position: -31vw -6vw; }
.character-navi ul li:nth-child(9) a{ background-image: url(../assets/character/c9-sp.png); background-position: -24vw -4vw; }
.character-navi ul li.n10 a{ background-image: url(../assets/character/c10-sp.png); background-position: -8vw -6vw; background-size: 32vw;  }
.character-navi ul li.n11 a{ background-image: url(../assets/character/c11-sp.png); background-position: -24vw -4vw; }
.character-navi ul li.n12 a{ background-image: url(../assets/character/c12-sp.png); background-position: -26vw -4vw; }
/* .character-navi ul li.crt a{ background-color: #ffee00; pointer-events: none; } */

.cont-character-data{ min-height: 70vw;  }
.character-data:before{ height: 2em; }

.character-data .chr-line{ height: 21em; padding: .45em 0; left:-10vw; top:calc(38vw + 8vw);  }
.character-data .chr-line:before{ height: 20em; }

.character-data .chr-msg{  height: 5em; }
.character-data .chr-msg .msg{ }
.character-data .chr-msg .msg span{ margin: 0 10vw 0 auto; }

.character-data .chr-prof{ position: relative; z-index: 3; width: 70%; top:inherit; padding-top: 13vw; margin: 0 0 0 auto; }
.character-data .chr-prof .name-alp{ font-size: 1.0em; }
.character-data .chr-prof .name{  margin:0 0 3em 1.0em;}
.character-data .chr-prof .name > span{ font-size: 4em; }
.character-data .chr-prof .name .t6-itaiji{ display: inline-block; width: .95em; height: .95em; position: relative; }
.character-data .chr-prof .name .t6-itaiji img{ position: absolute; top:0.1em; left: -0.08em; }
.character-data .chr-prof .post{ width: 60%; margin: 0 auto 1.5em auto; }

.character-data .chr-prof .data-list{ width: 70%; margin: 0 auto 6em auto; display: flex; flex-wrap: wrap; }
.character-data .chr-prof .data-list .data-list-l{ margin-right: 0; width: 100%; }
.character-data .chr-prof .data-list .data-list-r{ width: 100%; }
.character-data .chr-prof .data-list .data{ font-size: .666em;}

.character-data .chr-prof .profile{ width: 100%; font-size: 1.2em;}
.character-data .chr-prof .face{ width: 90%; margin: 0 auto 2em auto;}
.character-data .chr-img{ position: absolute; z-index: 2; width: calc(1120/3000*100vw*1.6); margin: 0; top:2vw; left: -13vw; }



/* music */
/* special */
.content-single-special{ max-width: inherit; }
.content-single-special-thm{ max-width: inherit; }

/* goods */
.goods-list .goods-data{ width: calc((100% - 1em)/2); }
.goods-list .goods-data:nth-of-type(4n){ margin-right: 1em;}
.goods-list .goods-data:nth-of-type(2n){ margin-right: 0;}
.goods-list .goods-data-img{ height: 37vw;}


}
/* SM ----------------------------------------------------------------------------- */
@media (orientation: portrait) and (max-width: 767px) {

}
/* XS ----------------------------------------------------------------------------- */
@media (max-width: 543px) {

}
/* pc - large ----------------------------------------------------------------------------- */
@media (min-width: 768px) {

}
/* pc - xlarge ----------------------------------------------------------------------------- */
@media (min-width: 1200px) {

}