@charset "UTF-8";

/* html */
html.scrollmenu-open {
width: 100%;
height: 100%;
overflow: hidden;
}

/*common class*/
.flex-wrapper {
position: relative;
display: flex;
flex-wrap: wrap;
}
.aligncenter {
display: block;
margin-right: auto;
margin-left: auto;
}
.alignright {
float: right;
margin-bottom: 20px;
margin-left: 20px;
}
.alignleft {
float: left;
margin-right: 20px;
margin-bottom: 20px;
}
.wp-caption,
[class*='wp-image'] {
display: block;
max-width: 100% !important;
margin-top: 1.5em;
text-align: center;
}
.wp-caption-text {
margin-top: 0;
}
@media (max-width: 760px){
.alignright{ float: none; margin-left: 0; }
.alignleft{ float: none; margin-right: 0;}
}
.swiper-wrapper{user-select: none;-webkit-user-select: none;}


/*１文字ずつ出現*/
.fadein_text span{opacity: 0;}
.fadein_text.appeartext span{ animation:text_anime_on .5s ease-out forwards; }
@keyframes text_anime_on {
  0% {opacity:0;}
  100% {opacity:1;}
}

/* header */
#header {
position: fixed;
width: 100%;
height:80px;
z-index: 10;
transition: .3s;
}
#header a {color:#FFF;}
#header {background: rgb(148,0,104);
background: linear-gradient(0deg, rgba(148,0,104,1) 0%, rgba(193,0,136,1) 50%, rgba(214,22,157,1) 50%, rgba(255,0,179,1) 100%);}
#header-inner{
position:relative;
z-index:1;
display: flex;
margin:auto;
height:100%;
}
#header #header-title {
display: flex;
justify-content: center;
align-items: center;
text-align:center;
font-size:115%;
line-height:1.2;
font-weight:900;
transform: scale(0.9, 1);
width: 115%;
position:relative;
overflow:hidden;
}
#header #header-title:after{
content:"";
position:absolute;
width: 35%;
padding-top: 35%;
background: url("../img/momo.svg") no-repeat 50% 50%;
filter: drop-shadow( 0px 0px 20px rgba(255,255,255,.8) );
z-index:0;
animation: flash 5s linear infinite;
}
@keyframes flash {
0% {opacity: 1;}
50% {opacity: 0;}
100% {opacity: 1;}
}
#header #header-title a {
position:absolute;
z-index:1;
}
#header #header-title span {
display:block;
font-size:1.65rem;
}
#header-sns svg {
width: 2rem;
height: 2rem;
fill:#FFF;
}
#header a:hover svg {
	fill: #F0B;
	filter: drop-shadow( 0px 0px 1px #FFF ) drop-shadow( 0px 0px 2px #FFF ) drop-shadow( 0px 0px 3px #FFF ) drop-shadow( 0px 0px 5px rgba(255,255,255,.5) ) drop-shadow( 0px 0px 8px rgba(255,255,255,.5) );
	transition: .3s;
}

/*body*/
#body {
position:relative;
padding:80px 0 0;
background: url("../img/bg-washi.jpg") repeat top center;
}
#body:before {
content:"";
position:absolute;
inset:0;
background: rgb(200,200,200);
background: linear-gradient(180deg, rgba(228,14,14,1) 10%, rgba(255,124,29,1) 25%, rgba(232,180,11,1) 40%, rgba(76,166,70,1) 55%, rgba(30,129,184,1) 70%, rgba(116,56,162,1) 85%, rgba(190,45,134,1) 100%);
mix-blend-mode: multiply;
}
#body .section{
position:relative;
padding:80px 0;
background: url("../img/bg-washi.jpg") repeat top center;
box-shadow: 0 0 10px rgba(0,0,0,.7);
}
#body .section:before {
content: "";
position: absolute;
inset: 0;
background: rgba(0,0,0,.7);
mix-blend-mode: multiply;
}
#body .section-header{
position:relative;
margin: auto;
width: 80%;
max-width: 1280px;
margin-bottom:2rem;
}
#body .section h2{
font-size:240%;
position:relative;
display:inline-block;
overflow: visible;
color:#430;
text-shadow: 
1px 1px 1px #fff, 1px -1px 1px #fff, -1px 1px 1px #fff, -1px -1px 1px #fff,
1px 2px 1px #fff, 1px -2px 1px #fff, -1px 2px 1px #fff, -1px -2px 1px #fff,
2px 1px 1px #fff, 2px -1px 1px #fff, -2px 1px 1px #fff, -2px -1px 1px #fff;
}
#body .section h2 span{
position:relative;
z-index:1;
}
#body .section h2:before{
content:"";
position:absolute;
top:-75%;
left:-35%;
width:160px;
height:120px;
background: url("../img/kasumi-1.svg") no-repeat top left;
filter: drop-shadow( 0px 3px 5px rgba(0,0,0,.3) );
animation: kasumi1 10s linear infinite;
}
#body .section h2:after{
content:"";
position:absolute;
top:-20%;
right:-35%;
width:160px;
height:120px;
background: url("../img/kasumi-2.svg") no-repeat bottom right;
filter: drop-shadow( 0px 3px 5px rgba(0,0,0,.3) );
z-index:0;
animation: kasumi2 8s linear infinite;
}
@keyframes kasumi1 {
0%,100% {transform: translateX(-20px); }
50% {transform: translateX(20px);}
}
@keyframes kasumi2 {
0%,100% {transform: translateX(20px); }
50% {transform: translateX(-20px); }
}
#body .section-body {
position:relative;
margin:0 auto;
width:80%;
max-width:1280px;
}




/* mainvisual */
#mainvisual {
position: relative;
margin: 0 auto;
overflow: hidden;
z-index:1;
}
#mainvisual .mv-img{
position: relative;
top:50%;
left:50%;
transform: translate(-50%,-50%);
}
#mainvisual .mv-img img{
object-fit: cover;
height: 900px;
}

/* whatsnew */
#whatsnew{position:relative; z-index:1;display:flex; justify-content:space-between; flex-wrap:wrap;height:400px;background:#FFF;overflow:hidden;padding:20px 0;
-ms-overflow-style: none;scrollbar-width: none;
}
#whatsnew:-webkit-scrollbar{display: none;}
#whatsnew .whatsnew-item{flex-basis:49%;}
#whatsnew .whatsnew-item > div {width:90%; max-width:620px;}
#whatsnew #news.whatsnew-item > div { margin-left:auto; margin-right:0;-ms-overflow-style: none;scrollbar-width: none;}
#whatsnew #twitter.whatsnew-item > div { margin-left:0; margin-right:auto;-ms-overflow-style: none;scrollbar-width: none;}
#whatsnew .whatsnew-title {background:#F0B; color:#FFF; font-weight:900;padding:.25rem 1.5rem;}
#whatsnew #twitter .whatsnew-title {background:#1DA1F2; display:flex; justify-content:space-between; align-items: center; flex-wrap: wrap;}
#whatsnew #news ul {-ms-overflow-style: none;scrollbar-width: none; height:330px;overflow-y:scroll;}
#whatsnew #news li {padding:1rem 1.5rem; margin-top:3px; display:flex; justify-content:space-between;line-height:1.4;}
#whatsnew #news li:nth-of-type(odd) {background:#f1f1f1;}
#whatsnew #news li:nth-of-type(even) {background:#f8f8f8;}
#whatsnew #news span {display:block;}
#whatsnew #news span.day {flex-basis:16%; margin-right:3%;}
#whatsnew #news span.topic {flex-basis:81%;}
#whatsnew #news a {color:#F0b; text-decoration:underline;}
#whatsnew #twitter a {background:#fff; color:#1DA1F2; font-size:1.2rem; padding:0 1rem; border-radius:1.3rem;}
#whatsnew #twitter a:hover {color:#fff; background:#1DA1F2; border:1px #fff solid;}
#whatsnew #twitter a:hover svg {fill:#FFF;}
#whatsnew #twitter span:nth-of-type(2) {font-size:1.43rem;}
#whatsnew #twitter svg { display:inline; vertical-align:-1px; width:11px; height:11px; margin-left:3px; fill:#1DA1F2;}
#whatsnew #twitter iframe{-ms-overflow-style: none;scrollbar-width: none; height:330px;}
#whatsnew #twitter iframe:-webkit-scrollbar{display: none;}

/*details*/
#details.section{
font-size:2.4rem;
color:#FFF;
transform: skewY(-3deg);
text-shadow:0px 0px 3px rgba(255,255,225,.4);
padding-bottom: 110px;
}
#details.section:before {
background: radial-gradient(circle, rgba(80,94,115,.8) 0%, rgba(1,0,9,.95) 100%);
}
#details .section-body {
transform: skewY(3deg);
}
#details .section-body:after {
content:"";
position:absolute;
top:50%;
left:50%;
transform: translate(-50%,-50%);
width: 70%;
padding-top: 70%;
background: url("../img/momo.svg") no-repeat 50% 50%;
filter: drop-shadow( 0px 0px 40px rgba(255,50,225,.7) );
z-index:0;
animation: detailbg 5s linear infinite;
}
#details .section-body p{
position:relative;
z-index:1;
}
@keyframes detailbg {
0% {opacity: .5;}
50% {opacity: 0;}
100% {opacity: .5;}
}
#details .section-body {
display:flex;
justify-content:space-between;
flex-wrap:wrap;
}
#details .section-body p{
margin-bottom:0;
}
#details .section-body #detail-title{
flex-basis:47%;
}
#details .section-body #pv{
position:relative;
flex-basis:48%;
width: 100%;
z-index:1;
overflow: visible;
}
#details .section-body #pv iframe{
width: 100%;
height: 100%;
border:none;
vertical-align:bottom;
margin-top:25px;
}
#details .section-body p:nth-of-type(2) {
flex-basis:100%;
margin-top: 4rem;
}
#details .section-body p:nth-of-type(3) {
flex-basis:100%;
margin-top: 3rem;
}



/*event-parts*/
#event-parts.section{
transform: skewY(3deg);
color:#FFF;
}
#event-parts.section:before {
background: radial-gradient(circle, rgba(185,171,59,7) 0%, rgba(32,27,0,8) 100%);
}
#event-parts .section-header{
transform: skewY(-3deg);
}
#event-parts .section-body {
transform: skewY(-3deg);
}
#event-parts ol {display:flex;flex-wrap:wrap; justify-content:space-between;}
#event-parts ol li {flex-basis:48%;border:2px rgba(255,211,0,.5) solid;background:rgba(255,211,70,.4);}
#event-parts dt {background:rgba(80,66,0,.7); padding:.25rem 2rem; font-weight:900;}
#event-parts dd { padding:2rem 2rem;}


/*cast*/
#cast.section{
transform: skewY(-3deg);
color:#333;
}
#cast.section:before {
background: linear-gradient(180deg, rgba(214,189,63,1) 0%, rgba(255,255,255,1) 20%, rgba(255,255,255,1) 80%, rgba(214,189,63,1) 100%);
}
#cast.section:after {
content:"";
position:absolute;
inset: 0;
background-color:rgba(212,189,76,.6);
background-image:
radial-gradient(circle at 100% 150%, rgba(212,189,76,1) 24%, #fff 24%, #fff 28%, rgba(212,189,76,1) 28%, rgba(212,189,76,1) 36%, #fff 36%, #fff 40%, transparent 40%, transparent),
radial-gradient(circle at 0    150%, rgba(212,189,76,1) 24%, #fff 24%, #fff 28%, rgba(212,189,76,1) 28%, rgba(212,189,76,1) 36%, #fff 36%, #fff 40%, transparent 40%, transparent),
radial-gradient(circle at 50%  100%, #fff 10%, rgba(212,189,76,1) 10%, rgba(212,189,76,1) 23%, #fff 23%, #fff 30%, rgba(212,189,76,1) 30%, rgba(212,189,76,1) 43%, #fff 43%, #fff 50%, rgba(212,189,76,1) 50%, rgba(212,189,76,1) 63%, #fff 63%, #fff 71%, transparent 71%, transparent),
radial-gradient(circle at 100% 50%, #fff 5%, rgba(212,189,76,1) 5%, rgba(212,189,76,1) 15%, #fff 15%, #fff 20%, rgba(212,189,76,1) 20%, rgba(212,189,76,1) 29%, #fff 29%, #fff 34%, rgba(212,189,76,1) 34%, rgba(212,189,76,1) 44%, #fff 44%, #fff 49%, transparent 49%, transparent),
radial-gradient(circle at 0    50%,#fff 5%, rgba(212,189,76,1) 5%, rgba(212,189,76,1) 15%, #fff 15%, #fff 20%, rgba(212,189,76,1) 20%, rgba(212,189,76,1) 29%, #fff 29%, #fff 34%, rgba(212,189,76,1) 34%, rgba(212,189,76,1) 44%, #fff 44%, #fff 49%, transparent 49%, transparent);
background-size: 50px 25px;
z-index:0;
opacity:.1;
mix-blend-mode: multiply;
}
#cast .section-header{
transform: skewY(3deg);
z-index:1;
}
#cast .section-body {
transform: skewY(3deg);
z-index:1;
}
#cast ul {display:flex; justify-content:start; flex-wrap:wrap;}
#cast #regular > h3 {background:#C08; color:#fff; padding:.25rem 1rem; font-weight:900;}
#cast #regular ul li {flex-basis:calc( 92% / 5 ); background:#FFF; margin:1%;padding:1rem;}
#cast #regular ul li.spacer {background:transparent;}
#cast #regular ul li:nth-of-type(5n+1) {margin-left:0;}
#cast #regular ul li:nth-of-type(5n) {margin-right:0;}
#cast ul li p {margin-bottom:0;text-align:center;}
#cast ul li p:nth-of-type(2) { font-weight:900; padding:1rem .25rem; color:#FFF;background:#306;}
#cast ul li p span {display:block; font-size:1.2rem;font-weight:700;}
#cast ul li p:nth-of-type(3){margin-top:.5rem;}
#cast ul li p:nth-of-type(3),#cast ul li p:nth-of-type(4) {font-size:1.1rem; text-align:left;}
#cast #regular ul li:nth-of-type(1) p:nth-of-type(2){background:#C21;}/*赤*/
#cast #regular ul li:nth-of-type(2) p:nth-of-type(2){background:#14A;}/*青*/
#cast #regular ul li:nth-of-type(3) p:nth-of-type(2){background:#971;}/*黄*/
#cast #regular ul li:nth-of-type(4) p:nth-of-type(2){background:#333;}/*黒*/
#cast #regular ul li:nth-of-type(5) p:nth-of-type(2){background:#A36;}/*桃*/
#cast #regular ul li:nth-of-type(6) p:nth-of-type(2){background: rgba(180,159,44,1);}/*金*/
#cast #regular li.non-regular {position:relative; overflow:visible; margin-top:3%;}
#cast #regular li.non-regular h4 {position:absolute; top:-1em; left:-.5em; background:#FFF; padding:0 1rem; border:2px #333 solid; border-radius:1.6rem;}
#cast #regular li.non-regular p:nth-of-type(2) {background:#E73;}
#cast #regular li:nth-of-type(12) p:nth-of-type(2) {background:#2AC;}


#cast #osaka-special {margin-top:30px;}
#cast #osaka-special .flex-wrapper{justify-content:space-between; margin-bottom:15px;}
#cast #osaka-special .flex-item{flex-basis:49%;}
#cast #osaka-special .flex-item:nth-of-type(1) p:nth-of-type(2) {background:#390;}
#cast #osaka-special h3 {background:#C08; color:#fff; padding:.25rem 1rem; font-weight:900;}
#cast #osaka-special h4 {border:1px #C08 solid; color:#C08; padding:.25rem 1rem; font-weight:900; margin-top:10px;}
#cast #osaka-special > p {margin-bottom:0;}
#cast #osaka-special ul li {flex-basis:calc( 96% / 3 ); background:#FFF; margin:1%;padding:1rem;}
#cast #osaka-special ul li:nth-of-type(3n+1) {margin-left:0;}
#cast #osaka-special ul li:nth-of-type(3n) {margin-right:0;}


/*schedule*/
#schedule {
transform: skewY(3deg);
color:#333;
}
#schedule.section:before {
background: radial-gradient(circle, rgba(33,130,184,1) 10%, rgba(13,30,75,1) 75%);
}
#schedule .section-header{
transform: skewY(-3deg);
}
#schedule .section-body {
width:100%;
transform: skewY(-3deg);
}
#schedule .table-wrapper{ overflow-x: scroll; margin:0 auto; padding:0 2.5% 0 7.5%; -ms-overflow-style: none;scrollbar-width: none;}
#schedule .table-wrapper::-webkit-scrollbar{display:none;}
#schedule table { white-space: nowrap; border-spacing:3px;width:100%;}
#schedule th {font-size:90%; background:rgba(255, 230, 0,.9); }
#schedule td { padding:1rem 2.5rem; font-size:120%; background:rgba(255,255,255,.95);}
#schedule td p { margin-bottom:0;}
#schedule td:nth-of-type(6),
#schedule td:nth-of-type(7),
#schedule td:nth-of-type(8){ font-size:100%;}
#schedule td.none{display:none;}
#schedule ul {margin-top:15px;}
#schedule td.state{text-align:center; color:#fff; font-weight:900;}
#schedule td.state a{color:#fff; font-weight:900;}
#schedule td a svg{display: inline; width: 1.4rem; height: 1.4rem; margin-left: 3px;}
#schedule td .linktogmap{ margin-top:-.25em; }
#schedule td .linktogmap a {font-size:1.2rem; text-decoration:underline;}
#schedule td .linktogmap a svg{fill:#333;width: 1.1rem; height: 1.1rem;}
#schedule td.state span{display:inline-block;padding:0.5rem 1.5rem;border-radius:2rem;}
#schedule .state.onsale span{ background:#e43;}
#schedule .state.soldout span{ background:#63E;}
#schedule .state.showclose span{ background:#333;}
#schedule .state.upcoming span{ background:#0B5;}
#schedule ul {width:80%; max-width:1280px; margin:15px auto 0;color:#fff;}
#schedule .slidehint {position:absolute; top:20px; right:10%; display:flex; flex-flow: column;align-items: center;}
#schedule .slidehint figure { width: 30px; height: 27px; animation: slidehint 3s linear infinite;}
#schedule .slidehint p { display:inline-block; font-size: 1.2rem; line-height: 1.4; margin: 0; color:#fff;}
@keyframes slidehint {
0%,100% {transform: translateX(30px); }
50% {transform: translateX(-30px); }
}

/*tickets*/
#tickets.section{
transform: skewY(-3deg);
color:#fff;
overflow:hidden;
}
#tickets.section:before {
background: radial-gradient(circle, rgba(184,33,147,1) 10%, rgba(75,13,55,1) 75%);
}
#tickets.section:after {
content:"";
position:absolute;
background-image: repeating-conic-gradient(from 0deg, #fff 0deg 90deg, #000 90deg 180deg);
background-repeat: repeat;
background-size: 60px 60px;
z-index:0;
opacity:.1;
mix-blend-mode: multiply;
width:100%;
height:105%;
top:50%;
left:50%;
transform: translate(-50%,-50%) skewY(3deg);
}
#tickets .section-header{
transform: skewY(3deg);
z-index:1;
}
#tickets .section-body {
transform: skewY(3deg);
z-index:1;
}
#tickets #online.section-body {
margin-top:50px;
}
#tickets .section-body h4 { background:rgba(191, 21, 109,1); margin:15px 0 1px; padding:0 2rem;}
#tickets .section-body dl {display:flex; flex-wrap:wrap;font-size:2.4rem;width:100%;}
#tickets .section-body dt {flex-basis:35%; color:#333; background:rgba(255,255,255,1); margin:1px 1px 1px 0; padding:1rem 2rem;}
#tickets .section-body dd {flex-basis:calc(65% - 2px); color:#333; background:rgba(255,255,255,1); margin:1px 0 1px 1px; padding:1rem 2rem;}
#tickets .section-body ul {margin-top:15px;}
#tickets .section-body ul a{color:#fff; text-decoration:underline;}
#tickets .section-body .linktoplayguide {
margin-top:25px;
text-align:center;
}
#tickets .section-body .linktoplayguide a {
display:inline-block;
font-size:2.4rem;
font-weight:900;
color:#1f5fa8;
background:#fff;
padding:1rem 2rem;
border-radius:1rem;
transition: .3s;
}
#tickets .section-body .linktoplayguide a:hover {
color:#fff;
background:#1f5fa8;
}
#tickets .section-body .linktoplayguide span {
white-space: nowrap;
display: inline-block;
}
#tickets .section-body .linktoplayguide svg {
display:inline-block;
vertical-align:-1px;
width:2rem;
height:2rem;
fill:#1f5fa8;
margin-left:3px;
}
#tickets .section-body .linktoplayguide a:hover svg {
fill:#FFF;
}
#tickets dl#sales-schedule {
font-size:100%;
}
#tickets dl#sales-schedule dt,#tickets dl#sales-schedule dd {
padding:.75rem 2rem;
}

/*goods*/
#goods {
transform: skewY(3deg);
color:#333;
}
#goods.section:before {
background: radial-gradient(circle, rgba(117,184,33,1) 10%, rgba(47,75,13,1) 75%);
}
#goods .section-header{
transform: skewY(-3deg);
}
#goods .section-body {
transform: skewY(-3deg);
}
#goods ul {display:flex; justify-content:start; flex-wrap:wrap;}
#goods ul li {flex-basis:calc( 92% / 5 ); background:#f5f5f5; margin:1%;padding:1rem;}
#goods ul li:nth-of-type(5n+1) {margin-left:0;}
#goods ul li:nth-of-type(5n) {margin-right:0;}
#goods ul li p {margin-bottom:0;text-align:center;}
#goods ul li p:nth-of-type(2) { font-size:1.6rem; line-height: 1.2; margin-top:.6rem;}
#goods ul li p span {display:block; font-size:1.2rem;}

/*notice*/
#notice.section{
transform: skewY(-3deg);
color:#fff;
overflow:hidden;
padding-bottom:0px;
}
#notice.section:before {
background: radial-gradient(circle, rgba(98,100,111,1) 0%, rgba(33,35,36,1) 100%);
}
#notice.section:after {
content:"";
position:absolute;
background-repeat: repeat;
background-size: 60px 60px;
z-index:0;
opacity:.08;
width:100%;
height:105%;
top:50%;
left:50%;
transform: translate(-50%,-50%) skewY(3deg);
  background-image: radial-gradient(farthest-corner, rgba(255, 255, 255, 0) 68%, #fff 68% 70%, 
rgba(255, 255, 255, 0) 70% 100%),
radial-gradient(circle at top left, rgba(255, 255, 255, 0) 34%, #fff 34% 35%, 
rgba(255, 255, 255, 0) 35% 100%),
radial-gradient(circle at top right, rgba(255, 255, 255, 0) 34%, #fff 34% 35%, 
rgba(255, 255, 255, 0) 35% 100%),
radial-gradient(circle at bottom left, rgba(255, 255, 255, 0) 34%, #fff 34% 35%, 
rgba(255, 255, 255, 0) 35% 100%),
radial-gradient(circle at bottom right, rgba(255, 255, 255, 0) 34%, #fff 34% 35%, 
rgba(255, 255, 255, 0) 35% 100%);
}
#notice .section-header{
transform: skewY(3deg);
z-index:1;
margin-bottom:25px;
}
#notice .section-body {
transform: skewY(3deg);
margin-bottom:40px;
z-index: 1;
}
#notice .section-body h3 {
background: #000;
color: #fff;
padding: 0.25rem 1.5rem;
font-weight: 900;
margin-bottom:15px;
}
#fureai.section-body table{
border-collapse: collapse;
margin:0 auto;
}
#fureai.section-body table th{
background:#000;
}
#fureai.section-body td {
padding:1rem 2.5rem;
font-size:120%;
background:rgba(0,0,0,.4);
border:1px solid rgba(255,255,255,.5)
}
#fureai.section-body p{
margin-top: 15px;
}
#notice .section-body .linktopdf {
margin-top:25px;
text-align:center;
}
#notice .section-body .linktopdf a {
display:inline-block;
font-size:1.6rem;
font-weight:900;
color:#000;
background:#fff;
padding:1rem 2rem;
border-radius:1rem;
transition: .3s;
}
#notice .section-body .linktopdf a:hover {
color:#fff;
background:#000;
}
#notice .section-body .linktopdf span {
white-space: nowrap;
}


/*privacy-policy*/
#privacy-policy{
}
#privacy-policy.section:before {
background: transparent;
}
#privacy-policy .section-header{
margin-bottom: 25px;
}
#privacy-policy .section-body{
margin-bottom:50px;
}
#privacy-policy .section-body h3{
background:#c9007c;
color:#fff;
padding:.25rem 1rem;
margin-bottom:15px;
}
#privacy-policy .section-body a {
text-decoration:underline;
}




/*link_banners*/
#link_banners {
position:relative;
height:160px;
background: #F6F6F6;
display: flex;
align-items: center;
justify-content: center;
margin-top:30px;
box-shadow: none;
}
#link_banners.section{
box-shadow: none;
}
/*
#link_banners:before{
transform: skewY(-1.4deg) translateY(-1.4vw);
}
*/
#link_banners ul{
display:flex;
justify-content: space-between;
width:100%;
max-width:100%;
position:absolute;
top:50%;
left:50%;
transform: translate(-50%, -50%);
z-index: 1;
}
#link_banners li {
  flex-basis:calc(94% / 5);
  max-width:calc(94% / 5);
  text-align:center;
}
#link_banners li a {
  display:block;
}
#link_banners img {
vertical-align:middle;
width:100%;
max-width:240px;
}
#link_banners li a:hover img {
filter: blur(2px) brightness(1.3);
transition: all 0.3s linear;
}
#link_banners .row_inner {
  transition: 450ms all;
  white-space: nowrap;
  z-index:1;
  position:relative;
  padding:20px;
  overflow-x: scroll;
  width:100%;
  max-width:100%;
  -ms-overflow-style: none;scrollbar-width: none;
}
#link_banners .row_inner::-webkit-scrollbar{display:none;}
#link_banners .tile {
  position: relative;
  display: inline-block;
  width: 240px;
  height: 120px;
  margin-right: 20px;
  font-size: 10px;
  cursor: pointer;
  transition: 450ms all;
  transform-origin: center center;
}
#link_banners .tile:last-child {
  margin-right: 0;
}
#link_banners .tile_img {
  width: 240px;
  height: 120px;
  object-fit: cover;
}
#link_banners .tile_details {
  position: absolute;
  inset:0;
  opacity: 0;
  background: rgba(0,0,0,0.75);
}
#link_banners .tile_details:before {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  color:#FFF;
  content: 'クリックすると以下のサイトを\A新規ウインドウで開きます';
  white-space: pre;
  font-size: 10px;
  text-align: center;
  border:1px #FFF solid;
  padding:.5em 1em;
}
#link_banners .tile:hover .tile_details {
  opacity: 1;
}
#link_banners .tile_title {
  position: absolute;
  font-size: clamp(10px, .8rem, 1rem);
  width:100%;
  bottom:20%;
  padding: 0 10px;
  color:#FFF;
  text-align:center;
}
#link_banners .tile_title svg {
display:inline;
vertical-align:-1px;
width:12px;
height:12px;
}
#link_banners .row_inner:hover .tile {
  opacity: 0.75;
}
#link_banners .row_inner:hover .tile:hover {
  transform: scale(1.1);
  opacity: 1;
  z-index: 5;
}






/* footer */
#footer {
background: url("../img/bg-washi.jpg") repeat top center;
position:relative;
overflow:visible;
}
#footer-menu-wrapper{
display: grid;
grid-template-columns: repeat(2, 1fr);
width: 80%;
padding:50px 0 60px;
max-width: 1280px;
margin: 0 auto;
}

/* footer-logo */
#footer-logo {
grid-area: 1 / 1 / 4 / 2;
}
#footer-logo p.title {
width: 90%;
/* margin: 0 auto; */
}
#footer-logo img{
max-width:480px;
}
#footer-logo p span {
display:block;
font-size:1.3rem;
}

/* footer-sns */
ul#footer-sns{
display: flex;
justify-content: center;
align-content: center;
flex-wrap: wrap;
padding: 10px 0;
}
#footer-sns li {
flex-basis:30px;
margin:0 2%;
}
#footer-sns li a {
display:block
}
#footer-sns svg {
width: 100%;
height: 30px;
fill: #000;
}
#footer-sns a:hover svg {
fill: #F0B;
filter: drop-shadow( 0px 0px 1px #FFF ) drop-shadow( 0px 0px 2px #FFF ) drop-shadow( 0px 0px 3px #FFF ) drop-shadow( 0px 0px 5px rgba(255,255,255,.5) ) drop-shadow( 0px 0px 8px rgba(255,255,255,.5) );
transition: .3s;
}

/* footer-menu */
#footer-menu {
height: 10em;
display: flex;
flex-flow: column wrap;
}
#footer-menu li {
flex-basis: 25%;
display: flex;
align-content: center;
flex-wrap: wrap;
margin: 0 3px;
}
#footer-menu a{
display: block;
background: rgba(255,255,255,.5);
white-space: nowrap;
padding: 0.4rem 1rem;
text-align: center;
width: 100%;
transition: .3s;
}
#footer-menu a:hover {
background: #F0B;
color:#FFF;
}

/* copyright */
#copyright {
display: flex;
justify-content: center;
align-content: center;
flex-wrap: wrap;
padding: 10px 0;
}
#copyright p{font-size: 1.2rem;}


/*page-top*/
#page-top {
display:none;
position: fixed;
z-index:100;
right: 15px;
bottom: 15px;
background: #E1B;
padding: 10px;
border-radius: 50%;
box-shadow: 0 0 5px rgba(0,0,0,.5);
width:50px;
height:50px;
}
#page-top:hover {
background: #fff;
}
#page-top span {
position: relative;
display:block;
opacity: 0;
animation-iteration-count: infinite;
animation-duration: 2.0s;
animation-name: scroll;
}
#page-top span::before,#page-top span::after{
position: absolute;
display:block;
content: "";
border-bottom:3px solid #FFF;
left:0;
top:50%;
width:50%;
transform: rotate(-45deg) translateX(25%);
}
#page-top:hover span::before,#page-top:hover span::after {
border-color: #777;
}
#page-top span::after {
left:auto;
right:0;
transform: rotate(45deg) translateX(-25%);
}
#page-top span:nth-of-type(1) { animation-delay:.5s; top: 10px; }
#page-top span:nth-of-type(2) { animation-delay: .2s; top: 20px; }


/*share*/
#share {
background:#FFF;
margin-top:30px;
border-radius:2rem;
border-top: 2rem #602 solid;
border-bottom: 2rem #602 solid;
}
#share p {
position:relative;
font-weight:900;
color:#FFF;
background:#602;
padding:0 3rem 2rem;
margin-bottom:0;
}
#share span {
position: absolute;
top: -1.25rem;
left: 3rem;
}
#share ul {
padding:2rem;
display:flex;
justify-content:center;
}
#share li {
margin:0 2%;
}
#share li a {
display:block;
background:#602;
color:#fff;
padding:.5rem 1rem;
border-radius:.5rem;
font-weight:900;
white-space: nowrap;
}
#share svg {
width: 1.6rem;
height: 1.6rem;
vertical-align:-1px;
margin-right:5px;
fill:#fff;
}
#share li:nth-of-type(1) a{
background:#00acee;
}
#share li:nth-of-type(2) a{
background:#3b5998;
}
#share li:nth-of-type(3) a{
background:#00B900;
}
#share.layout-1column {
    width: 85%;
    margin: 0 auto 30px;
    max-width: 1280px;
}

/*follow*/
#follow {
background:#FFF;
margin-top:30px;
border-radius:2rem;
border-top: 2rem #777 solid;
border-bottom: 2rem #777 solid;
}
#follow p {
position:relative;
font-weight:900;
color:#FFF;
background:#777;
padding:0 3rem 2rem;
margin-bottom:0;
}
#follow span {
position: absolute;
top: -1.25rem;
left: 3rem;
}
#follow ul {
padding:2rem 3rem;
display:flex;
justify-content:center;
}
#follow li {
margin:0 2%;
}
#follow li a {
display:block;
background:#777;
color:#fff;
padding:.5rem 1rem;
border-radius:.5rem;
font-weight:900;
white-space:nowrap;
}
#follow svg {
width: 1.6rem;
height: 1.6rem;
vertical-align:-1px;
margin-right:5px;
fill:#fff;
}
#follow li:nth-of-type(1) a{
background:#00acee;
}
#follow li:nth-of-type(2) a{
background:#3b5998;
}
#follow li:nth-of-type(3) a{
background:#00B900;
}
#follow li:nth-of-type(4) a{
background:#2d8c3c;
}
#follow.layout-1column {
width:85%;
margin:0 auto;
max-width:1280px;
}
#follow.home {
display:flex;
justify-content:center;
align-content:center;
flex-wrap:wrap;
width:100%;
margin:0 auto;
background: #777;
margin-top: 0;
padding: 2rem;
border-radius: 0;
border: none;
}
#follow.home p {
flex-basis:25%;
padding:0;
text-align:center;
line-height:1.4;
border:1px #fff solid;
margin-right:3%;
}
#follow.home span {
position: absolute;
top:50%;
left:50%;
transform: translate(-50%,-50%);
white-space:nowrap;
}
#follow.home ul {
flex-basis:50%;
padding:0;
}

/*modal-window*/
.modal-open{ cursor: pointer; text-decoration:underline;}
.modal-container{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0,0,0,50%);
	padding: 40px 20px;
	overflow: auto;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
    box-sizing: border-box;
    z-index:101;
}
.modal-container:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
.modal-container.active{
	opacity: 1;
	visibility: visible;
}
.modal-body{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	max-width: 500px;
	width: 90%;
}
.modal-close{
	position: absolute;
	display: flex;
    align-items: center;
    justify-content: center;
	top: -40px;
	right: -40px;
	width: 40px;
	height: 40px;
	font-size: 40px;
	color: #fff;
	cursor: pointer;
}
.modal-content{
	background: #fff;
	text-align: left;
	padding: 30px;
	height: 525px;
}
.modal-content iframe{ width: 100%; border: none; height: 100%;}