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

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

■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ ■■■ 
*/
/* ---- Style ---- */
body{ color: #000; background:#fff; font-family: YakuHanMPs, "Noto Serif JP", serif; font-weight: 400; }
.fnt-bsc{font-family: YakuHanMPs, "Noto Serif JP", serif;}
.fnt-bsc.noyh{ font-family: "Noto Serif JP", serif; }
.fnt-dsp1{ font-family: "Zen Old Mincho", serif; }

.fnt-n{ font-weight: 300; }

a,a:visited {color: #00c592;}
a:hover,a:active {color: #00c592; }

.fnt-ac0{ color:#000; }
.fnt-ac1{ color:#00c592; }
.fnt-ac2{ color:#b7956c; }
.fnt-ac3{ color:#fef9e6; }
.fnt-ac4{ color:#16afe1; }

.fnt-ts{ text-shadow:-2px 0px 0px #000,2px 0px 0px #fff; }

.fnt-ul1{ position: relative; }
.fnt-ul1 > span{ position: relative; z-index: 1; }
.fnt-ul1 > span:before{ content:""; display: block; width: 100%; height: .2em; background-color:rgba(188, 182, 243, 0.5); position: absolute; bottom:0; left: 0; }

.fnt-ul2{ position: relative; }
.fnt-ul2 > span{ position: relative; z-index: 1; }
.fnt-ul2 > span:before{ content:""; display: block; width: 100%; height: .2em; background-color:rgba(255, 115, 140, 0.5); position: absolute; bottom:0; left: 0; }

.ttl1{ padding: .3em; font-weight: bold; color: #fff; background-color: #b7956c; padding: .2em .5em; border-radius: 0; }
.ttl2{ margin-bottom: .5em; }
.ttl2 > span{ display: block; padding: .2em .5em; border:#b7956c solid 1px; border-left:none; border-right:none; color: #b7956c; border-radius: 0; }
.ttl3{ position: relative; line-height: 1; }
.ttl3 > span{ display: inline-block; padding: 0 .5em .4em .5em; position: relative; z-index: 2; }
.ttl4{  }
.ttl4 > span{ display:block; border:#FFF solid 1px; padding: .2em .4em; }
.ttl4.il{  }
.ttl4.il > span{ display: inline-block; border:#FFF solid 1px; padding: .2em .4em; }
.ttl5{ background: rgba(0,0,0,.2); border-radius: 1.5em; padding: .25em; margin-left: auto; margin-right: auto; }

.ilink{ display: inline-block; padding: .75em 1.5em .75em 1.25em ; border:#00c592 solid 1px ; border-radius: .5em; text-decoration: none; font-size: 1em; font-weight: 600; line-height: 1; }
.ilink:before{ content:"> "; }
.ilink,
.ilink:visited,
.ilink:active{ color: #00c592; background-color: transparent; }
.ilink:hover{ text-decoration: none; border-color: #00c592; color: #00c592; }
.ilink.off{ pointer-events: none; border-color: #666; color:#666; }


/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
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: 500; }
.part-body{ position: relative; }
.part-footer{ position: relative; }

/* lazyestload */
img { transition: filter 0.3s;}
img.lazyestload { width: 100%; filter: blur(8px);}

/* background */
#Background  > div{ width: 100%; min-height: 100%; position: absolute;  pointer-events: none; }
#Background .bg-ptn{ background: url("../images/common/bg-pattern.webp") repeat center top; background-size: calc(1158/3000*100vw); }
/* foreground */
#Foreground  > div{ width: 100%; min-height: 100%; position: absolute; top:0; pointer-events: none; }

/* header */
.part-header{ width: 100%; height: 100vh; position: fixed; top:0; left:0; pointer-events: none; background: rgba(255, 255, 255, 1)
url("../images/common/bg-pattern.webp") repeat center top; background-size: calc(1158/3000*100vw);}
.cont-global-logo{ width: calc(600/3000*100em); padding: 2em 0; margin: 0 auto; z-index: 2; }

.cont-global-navi{ position: relative; padding: 0; margin: 0 auto; z-index: 2; }
.global-navi{ width: 100%; padding:1em 1em; margin: 0 auto; position: relative; pointer-events: auto; text-align: center; }
.global-navi > ul{ display: flex; flex-wrap: wrap; justify-content: center; align-items: center; list-style-type: none; padding: 0; margin: 0; position: relative; }
.global-navi > ul > li{ width: 100%; display: block; padding: 0; margin: 0 0 1em 0; letter-spacing: .15em; position: relative; }
.global-navi > ul > li a{ color: #000; text-decoration: none; position: relative; display: inline-block; padding: 1em 0; }
.global-navi > ul > li a:before{ content:""; width: 3em; height: .3em; position: absolute; left: 0; right: 0; margin: 0 auto; bottom:.6em; background-color:#000; }
.global-navi > ul > li a .label{ font-size: 2.0em; font-weight: 900; letter-spacing: .3em; font-family: "Zen Old Mincho", serif; }
.global-navi > ul > li a:hover{ color: #000; text-decoration: none;}
.global-navi > ul > li a:hover:before{ background-color:#b7956c; }
.global-navi > ul > li.gnx{ padding-top: 1em; }
.global-navi > ul > li.gnx a{ width: 3.0em; margin: 0 auto; }
.global-navi > ul > li.gnx a .label-image{ display: block; width:100%; }
.global-navi > ul > li.gnx a:before{ display: none;}
.global-navi > ul > li.gnx a:hover{ transform: scale(1.1); }
.global-navi > ul > li.gnx a:hover:before{ visibility: hidden; }
.global-navi > ul > li.crt a{ opacity: 1; pointer-events: none; color: #000; }
.global-navi > ul > li.crt a:before{ background-color:#b7956c; }
.global-navi > ul > li.cs a{ opacity: 1; pointer-events: none; color: #CCC; }
.global-navi > ul > li a.hdn{ display: none; }

.cont-sp-btn{ display: block; width: 4.7em; height: 4.7em; position: absolute; top:3em; left: 5.3em; z-index: 3; pointer-events: all; }
.cont-sp-btn a{ text-align: center; line-height: 0;  }
.cont-sp-btn a:hover{ text-decoration: none;}
.cont-sp-btn svg{ fill: currentColor; }
.cont-sp-btn .sp-navi-open{ display: block; }
.cont-sp-btn .sp-navi-close{ display: none;  }

.part-header{ background-color: rgba(255,255,255,0); background-image: none; transition: background-color .5s ease-out 0s; }
.part-header:before,
.part-header:after{ visibility: hidden; }
.cont-global-navi,
.cont-global-logo{ display: none; }

.spmenu-on .cont-sp-btn .sp-navi-open{ display: none; }
.spmenu-on .cont-sp-btn .sp-navi-close{ display: block; }
.spmenu-on .part-header{ background-color: rgba(251, 240, 244, 1); background-image: url("../images/common/bg-pattern.webp"); pointer-events: auto; }
.spmenu-on .part-header:before,
.spmenu-on .part-header:after{ visibility: visible; }
.spmenu-on .cont-global-navi,
.spmenu-on .cont-global-logo{ display: block; }

/* body */
.part-body{ position: relative; display: block; margin: 0; }
.part-body-side{ display: none; }
.part-body-main{ position: relative; width: 100%; padding-bottom: 0; }
.cont-upper{ position: relative; }
.sub-page .cont-upper{ padding: 2em 0 0 0; margin-bottom: 4em; }
.cont-middle{ position: relative;  }

.cont-top-content > .inner{ padding: 0; margin: 0 auto;}
.cont-sub-content > .inner{ width: calc(2000/3000*100vw); margin: 0 auto; }

.top-subtitle{ font-size: 1em; line-height: 1; text-align: center; z-index: 2; }
.top-subtitle p{ margin: 0 auto; z-index: 2; position: relative; }

.sub-subtitle{ font-size: 1em; line-height: 1; text-align: center; z-index: 2; }
.sub-subtitle p{ margin: 0 auto; z-index: 2; position: relative; }

.sub-logo{ width: calc(400/3000*100vw); padding: 0; margin: 0 auto 4em auto; position: relative; z-index: 51; }


/* footer */
.part-footer{ }
.cont-global-footer{ margin: 0 auto;  position: relative; text-align: center; background: linear-gradient(180deg,rgba(171, 171, 171, 1) 0%, rgba(255, 255, 255, 1) 4px, rgba(255, 255, 255, 1) 100%); }
.footer-pagetop{ width: calc( 135/3000 * 100vw ); height: calc( 254/3000 * 100vw ); position: absolute; top:-7.5vw; left:0; right: 0; margin: 0 auto; z-index: 10; }
.footer-pagetop a{ display: block; position: relative; width: 100%; min-height: 100%; background:url("../images/navi/pagetop.png") no-repeat center center; background-size: contain; transform-origin: center center; }
.footer-pagetop a:hover{ transform: scale(1.1); }
/* .footer-pagetop{ opacity: 0;}
.footer-pagetop.start{ animation: anm-pagetop-btn .5s 0s ease-out both running;}
@-webkit-keyframes anm-pagetop-btn { 0% { opacity: 0; -webkit-transform: translateY(-2em); transform: translateY(-2em);} 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}}
@keyframes anm-pagetop-btn { 0% { opacity: 0; -webkit-transform: translateY(-2em); transform: translateY(-2em);} 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);}}
.anm-pagetop-btn { -webkit-animation-name: anm-pagetop-btn; animation-name: anm-pagetop-btn;} */

.cont-footer{ padding: 1.25em 0 2em 0; width: 100%; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center;  }
.cont-footer > .left-block{ width: 100%; order:2; }
.global-navi.footer{ margin: 0 auto 1em auto; }
.global-navi.footer > ul{ flex-direction: row; justify-content: center; }
.global-navi.footer > ul > li{ width: inherit; margin: 0; }
.global-navi.footer > ul > li a{ padding: 0 .75em; line-height: 1; }
.global-navi.footer > ul > li a:before{ display: none; }
.global-navi.footer > ul > li a .label{ font-size: 1.2em; letter-spacing: .2em; }
.global-navi.footer > ul > li.gnx{ padding-top: inherit; }
.global-navi.footer > ul > li.gnx a{ width: 3.0em; position: relative; }
.global-navi.footer > ul > li.gnx a .label-image img{ vertical-align: bottom; }
.cont-footer > .right-block{ width: 100%; order:1; }

.footer-banner{ width:calc( 2000/3000 * 100em ); padding: 2.5em 0; margin: 0 auto 2em auto; border-top:#ece1da solid .1em;  border-bottom:#ece1da solid .1em;}
.footer-banner > ul{ display: flex; justify-content: center; align-items: center; list-style-type: none; margin: 0; padding: 0; }
.footer-banner > ul > li{ width: inherit; margin: 0 2em; padding: 0; }
.footer-banner > ul > li a{ padding: 0; line-height: 1; display: inline-block; position: relative; }
.footer-banner > ul > li a:hover{ transform: scale(1.05); }
.footer-banner > ul > li.flg1{ width:calc( 258/3000 * 100em ); }
.footer-banner > ul > li.flg2{ width:calc( 262/3000 * 100em ); }
.footer-banner > ul > li.flg3{ width:calc( 360/3000 * 100em ); }
.footer-banner > ul > li.flg4{ width:calc( 273/3000 * 100em ); }

.footer-copyrihgt{ width: 100%; padding: 0; margin: 0; text-align: center; }
.footer-copyrihgt p{ font-size: .8em; margin-bottom: 0; color: #353535;}



/* content */
.inview{ animation:inview 0.4s .2s ease-out both paused; }
.inview-start{ animation:inview-start 0.4s .2s ease-out both running; }
.inview-act{ transform-origin: left top; transition: all .5s ease .1s;  }

hr.sld{ border-color: #b7956c; }
hr.dot{ border-color: #b7956c; }

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

.frame-x{ background-color:rgba(183, 149, 108, 0.2); padding: .6em; position: relative; }
.frame-x > .inner{ background-color: #FFF; border-radius: .6em; overflow: hidden; position: relative; z-index: 1; }
.frame-x.pline > .inner{ border-radius: 0; border:#b7956c solid .1em; overflow: visible; }

.sep-s{ width: 2.75em; height: .25em; margin-left: auto; margin-right:auto; background-color:#000; }

/* 1 */
.cont-entries{ padding: 0; margin: 0 auto; padding-bottom: 3em; }
.content-entry{ padding: 0; margin: 0 0 3em 0; position: relative; }
.content-entry .entry-head{ margin-bottom: 0; position: relative; padding: 3em; background-color: #FFF; }
.content-entry .entry-date{ font-size: 1em; line-height: 1; margin: 0 ; pointer-events: none; position: absolute; top:3.5em; left:3.5em; }
.content-entry .entry-date > span{ font-size: 1.1em; letter-spacing: .1em; margin-bottom: 0; position: relative;}
.content-entry .entry-date > span:before{ content:"◇ "; }
.content-entry .entry-title{ padding: 0 4em 0 8em; margin: 0; position: relative; }
.content-entry .entry-title > span{ font-size: 1.333em; font-weight: 700; line-height: 1.5; }
.content-entry .entry-body{ padding: 3em; font-size: 1.2em; letter-spacing: .05em; line-height: 1.8; position: relative; pointer-events: all; letter-spacing: .1em; background-color: #FFF; border-top:#b7956c solid .1em;}


.content-entry .entry-body [data-ruby]::before { top: -1.5em; }

.content-accordion .acd-check{ display: none;}
.content-accordion .acd-label{ display: block; margin: 0; }
.content-accordion .acd-head{ position: relative; }
.content-accordion .acd-head::after{ content:""; display: block; padding: 0; width: 3.3em; height: 3.3em; text-align: center; line-height: 1; background: url("../images/common/news-open.webp") no-repeat center center; background-size: contain; position: absolute; top:2.4em; right:2.5em; margin: 0; 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{ border-bottom:none; }
.content-accordion .acd-check:checked ~ .acd-head::after{ background-image: url("../images/common/news-close.webp");}

.content-link .lnk-head{ position: relative; }
.content-link .lnk-head::after{content:""; display: block; padding: 0; width: 3.3em; height: 3.3em; text-align: center; line-height: 1; background: url("../images/common/news-link.webp") no-repeat center center; background-size: contain; position: absolute; top:2.4em; right:2.5em; margin: 0; pointer-events: none;}
.content-link .lnk-head a{ display: block; text-decoration: none; color: #a9831e; }

.content-non .non-head{ position: relative; }
.content-non .non-head a{ display: block; text-decoration: none; pointer-events: none; }

.content-single .inner{ padding:3em; }

.cont-tiles{ display: flex; flex-wrap: wrap; justify-content: center;  }

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



/* modaal */
.modaal-overlay{ background: rgba(255,255,255,1) url("../images/common/bg-pattern.webp") repeat-y center top; background-size: 100%; }
.modaal-wrapper{ overflow-x: hidden; }
.modaal-inner-wrapper{ padding: 80px 0; }
.modaal-container{ color: inherit; background-color: transparent; box-shadow:none; max-width: inherit; }
.modaal-content-container{ padding: 0; }
.modaal-video-wrap{ margin: auto auto; }
.modaal-close{ right: 2.5em; top: 1.5em; width: 3em; height: 3em; z-index: 100;}
.modaal-close:before,.modaal-close:after{ background-color: #000; border-radius: 0; top: .4em; left: 2em; width: .4em; height: 4em; }
.modaal-close:focus,.modaal-close:hover {background: transparent;}
.modaal-close:focus:before,.modaal-close:focus:after{background: #bcb6f3;}
.modaal-close:hover:before,.modaal-close:hover:after{background: #bcb6f3;}

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

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

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

/* TOP-PAGE */
/* main */
.cont-top-visual{ position: relative; overflow: hidden; }
.cont-top-visual img{ width: 100%; height: auto; }
.cont-top-visual .kv-container{ padding: 0;  position: relative; margin: 0 auto; }
.kv-container > div{ position: absolute; top:0; }
.kv-container .grp{ width: 100%; position: relative; top:inherit; margin: 0 auto; display: none; }
.kv-container .grp.on{ display: block; }
.kv-container .grp > div{ position: absolute; top:0; }
.kv-container .grp .vis-grp{ position: relative; width: 100%; margin: 0 0 auto auto; }
.kv-container .grp .vis-grp .bg{ width: 100%; margin: 0 0 auto auto; position: relative; }
.kv-container .grp .vis-grp .vis{ width: 100%; position: absolute; top:0; right: 0; }
.kv-container .logo{ width: calc(1224/3000*100em); top:1.0em; left: 0; right:0; margin: 0 auto; }
.kv-container .catch{ width: calc(276/3000*100em); top:.5em; right: .5em; }

.cont-top-oa{ padding: 1em 0; background-color: rgba(1, 149, 95, 0.1); }
.cont-top-oa > div{ width: calc(1076/3000*100em); margin: 0 auto;  }

.vis-switch-container{ padding: 1em 0 0 0; margin: 0; position: absolute; top:72vw; left:1.5vw;  z-index: 2; }
.vis-switch{ display: flex; flex-wrap: wrap; justify-content: flex-start; }
.vis-switch > div{ width: calc(240/3000*100vw); line-height: 0;}
.vis-switch > div a{ display: inline-block; padding: .5em;  }
.vis-switch > div.on a{  pointer-events: none; opacity: .5; }

#Foreground .top-op{ pointer-events: all; position: fixed; top:0;}
.top-op .bg{ background-color: #FFF; width: 100%; min-height: 100vh; position: absolute; top:0; }
.top-op .op-cont{ width: 100%; padding-top: 8em; position: relative; display: flex; flex-direction: column; justify-content: center;  }
.top-op .op-logo{ width: calc(1405/3000*100em); position: relative; margin: 0 auto 4em auto; }
.top-op .op-logo .logo{ position: absolute; top:0; }
.top-op .op-logo .logo.l1{ position: relative; }
.top-op .op-oa{ width: calc(883/3000*100em); margin: 0 auto; position: relative;}
.top-op .op-oa .bg{ width: 100%; min-height: 100%; background-color: #000; position: absolute; top:0; }
.top-op .op-oa .oa{ position: relative; padding: .75em 1em; }

/* cookie */
.vst #Foreground .top-op{ display: none; }

.kv-container .grp .vis-grp .vis{ opacity: 0; transform: scale(1.1); }
.kv-container .logo{ opacity: 0; transform: translateY(-10%); }
.kv-container .catch{ opacity: 0; transform: translateY(10%); }
.cont-top-oa{ opacity: 0; transform: translateY(10%); }

.top-op .op-logo .logo{ opacity: 0; }
.top-op .op-oa .bg{ opacity: 0; transform: scale(1.3); }
.top-op .op-oa .oa{ opacity: 0; }

.s0 .top-op .op-logo .logo.l1{ opacity: 1; transition: all 1.5s ease-in-out .4s;}
.s0 .top-op .op-logo .logo.l2{ opacity: 1; transition: all 1.5s ease-in-out .4s;}
.s0 .top-op .op-logo .logo.l3{ opacity: 1; transition: all 1.5s ease-in-out .4s;}
.s0 .top-op .op-logo .logo.l4{ opacity: 1; transition: all 1.5s ease-in-out .4s;}
.s0 .top-op .op-logo .logo.l5{ opacity: 1; transition: all 1.5s ease-in-out .4s;}
.s0 .top-op .op-logo .logo.l6{ opacity: 1; transition: all 1.5s ease-out 1.2s;}

.s2 .top-op .op-oa .bg{ opacity: 1; transform: scale(1); transition: all 1s ease-out 0s;}
.s2 .top-op .op-oa .oa{ opacity: 1; transition: all .5s ease-out .45s;}

.s5 .top-op .op-cont{ opacity: 0; transition: all .25s ease-in-out .25s; }
.s5 .top-op .bg{ opacity: 0; transition: all .5s ease-in-out .5s; }

.s6 .top-op{ display: none; }
.s6 .kv-container .grp .vis-grp .vis{ transform: scale(1); opacity: 1; transition: all .75s ease-out 0s; }
.s6 .kv-container .logo{ opacity: 1; transform: translateY(0%); transition: all .75s ease-out 0s; }
.s6 .kv-container .catch{ opacity: 1; transform: translateY(0%); transition: all .75s ease-out 0s; }
.s6 .cont-top-oa{ opacity: 1; transform: translateY(0%); transition: all .75s ease-out 0s; }

.kv-container .grp{ transform: scale(1.1,1.1) ; transform-origin: center center; opacity: 0; }
.kv-container .grp.on{ transform: scale(1,1); opacity: 1; transition: all 1.0s ease .0s; }



/* top-movie */
.cont-top-movie{ position: relative; overflow: hidden; background-color: #FFF; }
.cont-top-movie:before{ content:""; width: 100%; min-height: 100%; position: absolute; top:0; background: url("../assets/top/movie-bg.webp") no-repeat center center; background-size: cover; filter: blur(1px); opacity: .3;}
.cont-top-movie > .inner{ padding:4em 0; position: relative; z-index: 2;}
.top-movie-list{ width: calc(1400/3000*100em); position: relative; margin: 0 auto; filter: drop-shadow( 0 0 .75em rgba(0, 0, 0, 0.3)); }
/* no slick ver */
.top-movie-list .thm{ width: 100%; margin: 0; line-height: 0; border:#000 solid .75em; }

.top-movie-list .thm a{ width: 100%; display: inline-block; pointer-events: auto; overflow: hidden; line-height: 0; opacity: 1; }
.top-movie-list .thm.slick-current a{ opacity: 1; }
.top-movie-list .thm a:before {content:""; z-index: 2; position: absolute;}
.top-movie-list .thm a::after{ content:""; position: absolute; display: block; width:100%; height:100%; background: url("../images/common/play-btn.webp") no-repeat center center; background-size: calc(120/3000*100em); transform-origin: center center; pointer-events: none; top:0; left: 0; right: 0; margin: 0 auto; opacity: 1; }
.top-movie-list .thm a:hover::after{ background-size: calc(120/3000*100em*1.1); }


/* top-news */
.cont-top-news{ background: rgba(183, 149, 108, 0.1); }
.cont-top-news > .inner{ padding: 4em 0 ;  }

.top-subtitle.news{ margin-bottom: 3em; }
.top-subtitle.news p{ width: calc(435/3000*100em); }

.top-news-container{  width: 50%; padding:0; min-height: 20em; margin: 0 auto; }
.top-news-container > a{ display: block; padding: .75em 0 1.5em 0; margin-bottom: .75em; pointer-events: all; letter-spacing: .1em; border-bottom: #000 solid 1px; }
.top-news-container > a:last-child{ background-image: none; }
.top-news-container > a dl{ padding: 0; margin: 0; display: block; }
.top-news-container > a dl dt{ width: inherit; color: #000; display: inline-block; padding: 0 ; margin: 0 0 .5em 0; line-height: 1; font-weight: normal; }
.top-news-container > a dl dt span{ font-size: .8em; }
.top-news-container > a dl dt span:before{ content:"◇"; }
.top-news-container > a dl dd{ width:100%; font-size: 1em; font-weight: 300; color: #000; display: block; padding: 0; margin: 0; line-height: 1.5; }
.top-news-container > a,
.top-news-container > a:visited{ text-decoration: none; color: #000; }
.top-news-container > a:hover{ text-decoration: underline; color: #000; }
.top-news-container > a.nonlink{ pointer-events: none; }


/* staff */
.cont-top-staff{ background: rgba(183, 149, 108, 0.05); }
.cont-top-staff > .inner{ padding: 4em 0 ; }

.top-subtitle.staff{ margin-bottom: 5em; }
.top-subtitle.staff p{ width: calc(502/3000*100em); }

.staffcast-list{ position: relative; margin-bottom: 1em; }
.staffcast-list .list-item{ width: 100%; margin-bottom: 2em; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.staffcast-list .pos{ width: 100%; display: block; margin: 0 0 .75em 0; line-height: 1; }
.staffcast-list .pos span{ display: block; font-size: 1.3em; letter-spacing: .05em;  }

.staffcast-list .name{ width: 100%; display: block; margin: 0 0 .75em 0; line-height: 1;}
.staffcast-list .name span{ display: block; font-size: 1.3em; font-weight: 700; letter-spacing: .05em; position: relative; }

.staffcast-list .exname{ width: 100%; display: block; margin: 0 0 .75em 0; line-height: 1; }
.staffcast-list .exname span{ display: block; font-size: .9em; letter-spacing: .05em; position: relative; }

.staffcast-list .comment{ width: 8em; display: block; margin: 0 auto; }
.staffcast-list .cmt{ display: inline-block; }
.staffcast-list .cmt:hover{transform: scale(1.1); text-decoration: none; cursor: pointer; }



/* comics */
.cont-top-comics{  }
.cont-top-comics > .inner{ padding: 4em 0 ; }

.top-subtitle.comics{ margin-bottom: 5em; }
.top-subtitle.comics p{ width: calc(642/3000*100em); }

.top-comics-container{  }
.comics-text{ text-align: center; margin-bottom: 3em; }
.comics-list{ width: calc(2000/3000*100em); display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 0 auto 2em auto; }
.comics-list > div{ width: calc( (1 / 4 * (100% + 1em)) - 1em ); margin-bottom: 1em; margin-right: 1em; }
.comics-list > div:nth-of-type(4n){ margin-right: 0;}
.comics-list > div p{ margin: 0; }

.comics-banner{ width: calc(500/3000*100em); text-align: center; margin: 0 auto 4em auto; }



/* SUB-PAGE */

.cont-cat-navi{ width: 100%; position: relative; margin: 0 auto 2em auto;}
.cat-navi{ width: 100%; margin: 0; position: relative; }
.cat-navi > ul{ display: flex; flex-wrap: wrap; justify-content: center; flex-direction: row; list-style-type: none; padding: 0; margin: 0; position: relative; }
.cat-navi > ul > li{ display: block; padding: 0 ; margin: .5em ; letter-spacing: .1em; line-height: 1; position: relative;}
.cat-navi > ul > li.sep{ width: 100%; height: 1px; margin: 0 ; }
.cat-navi > ul > li a{ color: #2a5828; padding: .75em 1em ; text-decoration: none; position: relative; display: block; pointer-events: auto; background: #FFF; border:#2a5828 double 3px; }
.cat-navi > ul > li a .label{ padding-left: 1em; font-size: 1.1em; position: relative; }
.cat-navi > ul > li a .label:before{ content:"> "; margin-right: .25em; display: inline-block; position: absolute; top:.35em; left:0;}
.cat-navi > ul > li a:hover{ text-decoration: none; color: #fabe00; border-color: #fabe00; }
.cat-navi > ul > li.crt a{ text-decoration: none; color: #fabe00; border-color: #fabe00; pointer-events: none;}

.block-data{ display: none; }
.block-data.crt{ display: inherit; }

.sub-page .cont-upper{ }
.sub-page .cont-middle{ min-height: calc(100vh - 26.5em);}


/* news */
.cont-sub-news{ }
.cont-sub-news > .inner{}
.sub-subtitle.news p{ width: calc(435/3000*100em); }
.sub-news-container{ position: relative; }







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

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

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

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

}
/* MD ----------------------------------------------------------------------------- */
@media (max-width: 991px) {
}
/* lt768 ----------------------------------------------------------------------------- */
@media (min-width:768px) {
}
/* SM ----------------------------------------------------------------------------- */
@media (max-width: 767px) {
/* ---- Structure ---- */
html,body{ min-height:100%; position: relative; }
body{ }

/* background */
#Background .plxbg{ width: 100%; height: 100%; min-height: 100%; position: absolute; pointer-events: none; }
#Background .bg-ptn{  }


/* foreground */

/* header */
.part-header{}
.cont-global-logo{ width: calc(600/3000*100em*0.55); padding: 2em 0 0 0;  }
.cont-global-navi{ }
.global-navi{ padding:1em 1em; }
.global-navi > ul > li{ margin: 0 0 0em 0; letter-spacing: .15em;}
.global-navi > ul > li a{ padding: 1em 0; }
.global-navi > ul > li a:before{ width: 3em; height: .3em; bottom:.6em; }
.global-navi > ul > li a .label{ font-size: 1.5em; letter-spacing: .3em; }

.global-navi > ul > li.gnx{ padding-top: 1em; }
.global-navi > ul > li.gnx a{ width: 2.0em; }

.cont-sp-btn{ width: 3em; height: 3em; top:1em; left: 1em; }


/* body */
.sub-page .cont-upper{ padding: 2em 0 0 0; margin-bottom: 2em; }

.cont-top-content > .inner{ padding: 0; margin: 0 auto;}
.cont-sub-content > .inner{ width: 100%; margin: 0 auto; }

.sub-logo{ display: none; }


/* footer */
.part-footer{  }
.cont-global-footer{  }
.footer-pagetop{ width: calc( 135/3000 * 100vw *2 ); height: calc( 254/3000 * 100vw *2); position: absolute; top:-15vw; }

.cont-footer{  }
.global-navi.footer{ margin: 0 auto 1em auto; }
.global-navi.footer > ul > li a{ padding: .6em .6em; }
.global-navi.footer > ul > li a .label{ font-size: 1.0em; letter-spacing: .2em; }
.global-navi.footer > ul > li.gnx a{ width: 2.5em;  }

.cont-footer > .right-block{ width: 100%; order:1; }
.footer-banner{ width:90%; padding: 1em 0; margin: 0 auto 2em auto; }
.footer-banner > ul{ flex-wrap: wrap; justify-content: center; }
.footer-banner > ul > li{ margin: 0 .65em; }
.footer-banner > ul > li a:hover{ transform: scale(1); }
.footer-banner > ul > li.flg1{ width:calc( 258/3000 * 100em * 0.55 ); }
.footer-banner > ul > li.flg2{ width:calc( 262/3000 * 100em * 0.55 ); }
.footer-banner > ul > li.flg3{ width:calc( 360/3000 * 100em * 0.55 ); }
.footer-banner > ul > li.flg4{ width:calc( 273/3000 * 100em * 0.55 ); }



/* content */

.frame-x{  padding: .6em; position: relative; }
.frame-x > .inner{ border-radius: .6em; }
.frame-x.pline > .inner{  }

.sep-s{ width: 1.75em; height: .15em;}

/* 1 */
.cont-entries{ padding-bottom: 3em; }
.content-entry{ margin: 0 0 2em 0;  }
.content-entry .entry-head{ padding: 1.75em; }
.content-entry .entry-date{ position: relative; top:inherit; left:inherit; }
.content-entry .entry-date > span{ font-size: 1.1em; }
.content-entry .entry-title{ padding: .5em 3em 0 0;  }
.content-entry .entry-title > span{ font-size: 1.2em; }
.content-entry .entry-body{ padding: 1.75em; font-size: 1.0em; letter-spacing: .05em; line-height: 1.8; position: relative; pointer-events: all; letter-spacing: .1em; background-color: #FFF; border-top:#b7956c solid .1em;}

.content-entry .entry-body [data-ruby]::before { top: -1.5em; }

.content-accordion .acd-head::after{ width: 2em; height: 2em; top:1.4em; right:1.5em; }
.content-link .lnk-head::after{ width: 2em; height: 2em; top:1.4em; right:1.5em; }

.cont-tiles{ display: flex; flex-wrap: wrap; justify-content: center;  }

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




/* modaal */
.modaal-inner-wrapper{ padding: 60px 0; }
.modaal-close{ right: 2.5em; top: 1.5em; width: 2em; height: 2em;}
.modaal-close:before,.modaal-close:after{ top: .4em; left: 2em; width: .3em; height: 3em; }
.modaal-gallery-control{ bottom:-4.5em; }


/* TOP-PAGE */
/* main */
.cont-top-visual{ position: relative; overflow: hidden; padding-top: 10.5em; }
.cont-top-visual img{ width: 100%; height: auto; }
.cont-top-visual .kv-container{ padding: 0;  position: relative; margin: 0 auto; }
.kv-container > div{ position: absolute; top:0; }
.kv-container .grp{ width: 100%; position: relative; top:inherit; display: none; }
.kv-container .grp.on{ display: block; }
.kv-container .grp > div{ position: absolute; top:0; }
.kv-container .grp .vis-grp{ position: relative; width: 100%; margin: 0; }
.kv-container .grp .vis-grp .bg{ position: relative; }
.kv-container .grp .vis-grp .vis{ position: absolute; top:0; }
.kv-container .logo{ width: 55%; top:-9.5em; }
.kv-container .catch{ width: calc(240/3000*100em*0.5); top:1.5em; right: inherit; left:1.25em; }

.cont-top-oa{ padding: 1em 0; }
.cont-top-oa > div{ width: 60%; margin: 0 auto;  }

.top-op .op-cont{ padding-top: 11em; }
.top-op .op-logo{ width: calc(1405/3000*100em*0.5); margin: 0 auto 3em auto; }
.top-op .op-oa{ width: calc(883/3000*100em*0.7); }
.top-op .op-oa .oa{ padding: .5em .75em; }


/* top-movie */
.cont-top-movie{ }
.cont-top-movie > .inner{ padding:3em 0; }
.top-movie-list{ width: calc(1400/3000*100em*0.55); position: relative; margin: 0 auto; }
/* no slick ver */
.top-movie-list .thm{ border-width:.3em; }
.top-movie-list .thm.slick-current a{ opacity: 1; }
.top-movie-list .thm a:before {content:""; z-index: 2; position: absolute;}
.top-movie-list .thm a::after{background-size: calc(120/3000*100em*0.75); }
.top-movie-list .thm a:hover::after{ background-size: calc(120/3000*100em*0.75); }


/* top-news */
.cont-top-news{ }
.cont-top-news > .inner{ padding: 3em 0 ;  }

.top-subtitle.news{ margin-bottom: 2em; }
.top-subtitle.news p{ width: calc(435/3000*100em*0.5); }

.top-news-container{  width: 80%; min-height: inherit;  }


/* staff */
.cont-top-staff{ }
.cont-top-staff > .inner{ padding: 3em 0 ; }

.top-subtitle.staff{ margin-bottom: 3em; }
.top-subtitle.staff p{ width: calc(502/3000*100em*0.5); }

.staffcast-list .list-item{ margin-bottom: 1.5em;}
.staffcast-list .pos span{ font-size: 1.2em;  }
.staffcast-list .name span{ font-size: 1.2em;}
.staffcast-list .exname span{ font-size: .8em; }



/* comics */
.cont-top-comics{  }
.cont-top-comics > .inner{ padding: 3em 0 ; }

.top-subtitle.comics{ margin-bottom: 3em; }
.top-subtitle.comics p{ width: calc(642/3000*100em*0.5); }

.top-comics-container{  }

.comics-list{ width: 90%; margin: 0 auto 2em auto; }
.comics-list > div{ width: calc( (1 / 3 * (100% + 1em)) - 1em ); margin-bottom: 1em; margin-right: 1em; }
.comics-list > div:nth-of-type(4n){ margin-right: 1em;}
.comics-list > div:nth-of-type(3n){ margin-right: 0;}
.comics-list > div p{ margin: 0; }

.comics-banner{ width: calc(500/3000*100em*0.75); text-align: center; margin: 0 auto 3em auto; }



/* SUB-PAGE */

.cont-cat-navi{ width: 100%; position: relative; margin: 0 auto 2em auto ;}
.cat-navi > ul > li{ margin: .25em ; }
.cat-navi > ul > li a{ padding: .5em .5em ; }
.cat-navi > ul > li a .label{ font-size: .9em; }

.sub-page .cont-upper{ }
.sub-page .cont-middle{ min-height: calc(100vh - 27em);}

/* news */
.cont-sub-news{ }
.cont-sub-news > .inner{ width: 95%; }
.sub-subtitle.news p{ width: calc(435/3000*100em*.5); }
.sub-news-container{ position: relative; }







/* 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) {

}