@charset "UTF-8";
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
:where([hidden]:not([hidden='until-found'])){display:none!important;}
html{font-size:62.5%;-webkit-text-size-adjust:100%;}
@supports not (min-block-size:100dvb){html{block-size:100%;}}
body{min-block-size:100vh;min-block-size:100dvb;font-size:1.4rem;font-family:"Noto Sans JP",system-ui,"Hiragino Sans","Yu Gothic","メイリオ",Meiryo,sans-serif;font-style:normal;line-height:1.5;letter-spacing:0.05em;text-align:center;color:#140b0b;background:#fff;-webkit-font-smoothing:antialiased;}
:where(input,button,textarea,select){font:inherit;color:inherit;}
:where(textarea){resize:vertical;}
:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer;}
:where(:disabled){cursor:not-allowed;}
:where(button){border:0;background:none;}
:where(ul,ol){list-style:none;}
:where(a){color:inherit;text-decoration:none;text-underline-offset:.2ex;}
:where(img,svg,video,canvas,audio,iframe,embed,object){display:block;}
:where(img,picture,svg,video,canvas){max-inline-size:100%;block-size:auto;}
img{width:100%;max-width:100%;height:auto;}
img[src$=".svg"]{width:100%;}
:where(table){border-collapse:collapse;border-spacing:0;}
:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word;}
:where(h1,h2,h3){line-height:1.2;}
:where(hr){border:none;border-block-start:1px solid currentColor;}
:where(:focus-visible){outline:2px solid var(--focus-color,Highlight);outline-offset:2px;}
:where(.visually-hidden:not(:focus,:active,:focus-within,.not-visually-hidden)){position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important;}

:root{--main-color:#140b0b;--accent-color:#f20215;--bg-color:#fff;--bg-color2:rgba(20, 11, 11, 0.05);--sec-space:40px 20px;}
@media only screen and (min-width:1200px) {
:root{--sec-padding:30px 0;}
}

.en{font-family: "futura-pt","Noto Sans JP", sans-serif;}

.editor-area ul{list-style:disc;padding-left:1.5em;}
.editor-area ol{list-style:decimal;padding-left:1.5em;}

img{width:100%;height:auto;}
img[src$=".svg"]{width:100%;}

/*Layout*/
a{color:#140b0b; text-decoration:underline; opacity: 1; transition: 0.5s;}
a:hover{opacity:.7;}

br.pc{display:none;}
br.smp{display:block;}
br.tbl{display:block;}
@media only screen and (min-width:540px) {
br.smp{display:none;}
}
@media only screen and (min-width:840px) {
br.tbl{display:none;}
}
@media only screen and (min-width:740px) {
br.pc{display:block;}
}

body{}
header{position:relative;}
header .fvtitle{position:absolute; bottom:calc(100% / 12); left:0; right:0; width:70%; margin:0 auto; max-width:600px;}


header{position:relative;}
header #fvimage img{width:110%; object-fit:cover; object-position:bottom center; aspect-ratio:6 / 4.3;}
@media only screen and (min-width:760px) {
header #fvimage img{aspect-ratio:6 / 4; object-position:bottom center;}
header .fvtitle{position:absolute; bottom:calc(100% / 12); left:0; right:0; width:70%; margin:0 auto; max-width:900px;}
}
@media only screen and (min-width:1200px) {
header #fvimage img{aspect-ratio:6 / 3.8; object-position:bottom center; max-height:95vh;}
}

.mainnavi{position:fixed; top:0; left:0; width:100%; z-index:1000; pointer-events:none;}
.menu-toggle{position:fixed; top:0; right:0; z-index:1100; width:46px; height:46px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; border:none; background:rgba(4, 1, 1, 0.8); pointer-events:auto; cursor:pointer; appearance:none; -webkit-appearance:none;}
.menu-toggle__line{display:block; width:24px; height:2px; background:#fff; transition:transform .3s ease,opacity .3s ease;}
.menu-toggle.is-open .menu-toggle__line:nth-child(1){transform:translateY(8px) rotate(45deg);}
.menu-toggle.is-open .menu-toggle__line:nth-child(2){opacity:0;}
.menu-toggle.is-open .menu-toggle__line:nth-child(3){transform:translateY(-8px) rotate(-45deg);}

.drawer{position:fixed; inset:0; z-index:1050; visibility:hidden; pointer-events:none;}
.drawer.is-open{visibility:visible; pointer-events:auto;}
.drawer__overlay{position:absolute; inset:0; background:rgba(0,0,0,.45); opacity:0; transition:opacity .3s ease;}
.drawer.is-open .drawer__overlay{opacity:1;}
.drawer__panel{position:absolute; top:0; right:0; width:min(86vw,360px); height:100dvh; padding:88px 24px 32px; background:#140b0b; transform:translateX(100%); transition:transform .3s ease; overflow-y:auto; -webkit-overflow-scrolling:touch;}
.drawer.is-open .drawer__panel{transform:translateX(0);}
.drawer__close{position:absolute; top:3px; right:15px; width:40px; height:40px; border:none; background:none; color:#fff; font-size:3.4rem; line-height:1; cursor:pointer; appearance:none; -webkit-appearance:none;}
.drawer__nav{display:flex; flex-direction:column; gap:20px; list-style:none; margin-left:50px; font-size:2rem;}
.drawer_link_ch {margin-bottom:20px;}
.drawer_link_ch li{margin-left:20px;}
.drawer_link_ch li a{color:#fff; text-decoration:none;}
.drawer_link_ch li a:before{content:"━"; margin-right:8px;}
.drawer__item{text-align:left; border-bottom:1px solid #ccc; }
.drawer__link{display:block; padding:0 0 8px; color:#fff; line-height:1.4; text-decoration:none;}

body.is-menu-open{overflow:hidden;}

@media screen and (min-width:741px){
.menu-toggle{top:24px; right:24px;}
.drawer__panel{width:min(420px,32vw); padding:100px 32px 40px;}
.drawer__link{font-size:2rem;}
}

@media (prefers-reduced-motion:reduce){
.menu-toggle__line{transition:none;}
.drawer__overlay{transition:none;}
.drawer__panel{transition:none;}
}


h3{font-family: "halcom", sans-serif; font-weight: 700; font-style: normal; letter-spacing:0; font-size:clamp(2.3rem,calc(2.3rem + 1.8 * ((100vw - 375px) / 525)),4rem); letter-spacing:0;}
h3 span{display:block; font-size:clamp(1.1rem,calc(1.1rem + 0.1 * ((100vw - 375px) / 525)),1.2rem); font-weight:400; color:rgba(20, 11, 11, 0.5)}

.information{padding:var(--sec-space);}
.information ul{margin-top:20px; padding:6px 20px 20px; text-align:left; overflow-y:scroll; height:160px;}
.information ul::-webkit-scrollbar {width:4px;}
.information ul::-webkit-scrollbar-track {background-color: #fff; border-radius: 100px;}
.information ul::-webkit-scrollbar-thumb {background-color: 
#7e7979; border-radius: 100px;}
.information ul li{margin-bottom:8px; padding-bottom:8px;}
.information ul li .date{display:block; letter-spacing:0; font-weight:500; font-size:clamp(1.4rem,calc(1.4rem + 0.2 * ((100vw - 375px) / 525)),1.6rem);}

.information ul li a{text-decoration:underline!important; font-weight:400; line-height:1.4;}
.information ul li a .en{display:block; font-size:1.46rem;}
.information ul li a:hover{opacity:.7;}
@media only screen and (min-width:760px) {
.information{margin:50px auto 0; max-width:760px; width:90%;}
/* .information .box{display:flex; gap:0 40px; justify-content:center; align-items:center;} */
/* .information h3{text-align:right;} */
.information ul{padding-bottom:0;}
}
@media only screen and (min-width:1100px) {
.information{width:100%;}
}


#schedule{padding:var(--sec-space); background:var(--bg-color2);}
#schedule .box{max-width:1000px; margin:0 auto;}
#schedule #datenavi ul.datelist{margin-top:20px; display:flex; gap:2px; flex-wrap:wrap;}
#schedule #datenavi li{background:var(--main-color); padding:6px 20px 2px; width:calc(100% / 5 - 2px); border-top-left-radius:15px; border-top-right-radius:15px;}
#schedule #datenavi ul.datelist li.is-active{background:var(--accent-color);}
#schedule #datenavi li a{display:block; font-family: futura-pt, sans-serif; font-size:2.0rem; text-decoration:none; line-height:1; color:#fff;}
#schedule #datenavi li a span{font-size:1.1rem; display:block; padding-bottom:2px; margin-bottom:2px; border-bottom:1px solid #fff;}

#schedule .datebox{margin-top:20px; padding-bottom:10px; background:var(--bg-color);}
#schedule .tourtitle{display:flex; justify-content:space-between; align-items:stretch;  background:var(--main-color); color:#fff; font-size:clamp(1.4rem,calc(1.4rem + 0.3 * ((100vw - 375px) / 525)),1.7rem); font-weight:500; line-height:1.3;}
#schedule .tourtitle .tourname{padding:4px 0 4px 10px; text-align:left; font-size:1.4rem; display:flex; align-items:flex-start; flex-direction: column; letter-spacing:0;}
#schedule .tourtitle .tourname.jp{font-size:clamp(1.38rem,calc(1.3rem + 0.3 * ((100vw - 375px) / 525)),1.68rem);}
#schedule .tourtitle .tourname span{ margin-left:4px; font-size:.8em; transform:translateY(-1px);}
#schedule .tourtitle .location{padding:0 4px; width:115px; display:flex;flex-wrap:wrap;align-content:center; justify-content:center; align-items:center;column-gap:0.2em;row-gap:0;line-height:1; font-size:1.3rem; letter-spacing:0;}
#schedule .tourtitle .location span{display:block;line-height:1.2; transform:translateY(1px);}
#schedule .tourtitle .location .en{font-size:1.5rem;:}
#schedule .tourtitle .location.cl01{background:#f16b50;}
#schedule .tourtitle .location.cl02{background:#6ea39a;}
#schedule .tourtitle .location.cl03{background:#2c2a6b;}
#schedule .tourtitle .location.cl04{background:#605138;}
#schedule .tourtitle .location.cl05{background:#973030;}
#schedule .tourtitle .location.cl06{background:#003d34;}
#schedule .tourtitle .location.cl07{background:#d72229;}
#schedule .tourtitle .location.cl08{background:#e29700;}
#schedule .tourtitle .location.cl09{background:#e00070;}
#schedule .tourtitle .location.cl10{background:#079569;}
#schedule .tourinfobox .tourdate{margin-top:10px; display:flex; gap:5px; align-items:center; justify-content:center; font-weight:700; font-size:3.2rem; line-height:1;}
#schedule .tourinfobox .tourdate .year{font-size:1.5rem; transform:translateY(3px);}
#schedule .tourinfobox .tourdate .week{width:50px;font-size:1.2rem; background:var(--main-color); color:#fff; border-radius:50px; padding:0 10px; transform:translateY(4px); text-align:center;}
#schedule .tourinfobox .tourdate .week.sat{color:#00a4dc;}
#schedule .tourinfobox .tourdate .week.sun{color:var(--accent-color);}
#schedule .tourinfobox .tourdate .week .hol{display:block; font-size:1.0rem; letter-spacing:0;}
#schedule .tourinfobox .tourdate .week:has(.hol){padding:2px 0; width:55px; text-wrap:center; transform:translateY(-2px);}
#schedule .tourinfobox .venuebox .venue{margin-top:8px; font-size:1.9rem; font-weight:800;}
#schedule .tourinfobox .venuebox .venue .en{display:block; font-size:1.4rem; transform:translateY(-2px); letter-spacing:0;}
#schedule .tourinfobox .venuebox .line2 .en{font-weight:600;}
#schedule .tourinfobox .venuebox .venue .en.type2{font-size:2.2rem; line-height:1.2; transform:translateY(2px);}
#schedule .tourinfobox .tourinfo{margin-top:4px; font-size:1.4rem; font-weight:500; line-height:1.4; letter-spacing:0;}
#schedule .tourinfobox .tourinfo .contact{font-size:1.2rem; letter-spacing:0; font-weight:400;}
#schedule .tourinfobox .tourinfo .contact:before{content:"[info]"; padding-right:4px;}
#schedule .tourinfobox .tourinfo .sold{margin:0 auto; background:var(--accent-color); color:#fff; text-align:center; font-weight:600; margin-bottom:8px; max-width:150px; font-family: "halcom", sans-serif;}

#schedule .note{padding-bottom:10px;}
#schedule .note .btn {margin:0 10px;}
#schedule .note .btn a{display: block; position: relative; padding:15px 20px 15px 30px;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1.4; text-align:left; letter-spacing:0;}
#schedule .note .btn .unext{margin: 20px 0 0;}
#schedule .note .btn .unext a{border: 2px solid rgb(0, 128, 222);}
#schedule .note .btn .unext a:hover{background-color: #e9ecef; border-color: rgb(0, 128, 222);}
#schedule .note .btn .ticket-title{display:block; color:rgb(0, 128, 222); font-weight:700; font-size:1.4rem;}
#schedule .note .btn .ticket-info2{display: block; margin-top: 4px; font-size: 1.2rem; color: #666; font-weight: normal;}
#schedule .note .btn .unext a::after{content: ""; position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(45deg); width: 10px; height: 10px; border-top: 2px solid rgb(0, 128, 222); border-right: 2px solid rgb(0, 128, 222);}

#schedule .note .btn .zaiko{margin:10px 0 0;}
#schedule .note .btn .zaiko a{border: 2px solid rgb(229, 53, 82);}
#schedule .note .btn .zaiko a:hover{background-color: #e9ecef; border-color: rgb(229, 53, 82);}
#schedule .note .btn .zaiko .ticket-title{display:block; color:rgb(229, 53, 82); font-weight:700; font-size:1.4rem;}
#schedule .note .btn .zaiko .ticket-info2{display: block; margin-top: 4px; font-size: 1.3rem; color: #666; font-weight: normal; line-height:1.4;}
#schedule .note .btn .zaiko a::after{content: ""; position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(45deg); width: 10px; height: 10px; border-top: 2px solid rgb(229, 53, 82); border-right: 2px solid rgb(229, 53, 82);}

#schedule .arrow{max-width:26px; margin:18px auto 0;}
@media only screen and (min-width:540px) {
#schedule .tourtitle .tourname{flex-direction:initial; align-items:center;}
#schedule .tourtitle .tourname span{ transform:translateY(0);}
}
@media only screen and (min-width:680px) {
#schedule .tourtitle .tourname{font-size:1.7rem;}
#schedule .tourtitle .location{width:180px;}
#schedule .tourinfobox{padding:10px 20px 0 20px; display:flex; justify-content:space-between; align-items:center; text-align:left;}

#schedule .tourinfobox .tourdate{width:145px; flex-wrap:wrap; gap:2px; align-items:center; justify-content:flex-start; margin-left:0;}
#schedule .tourinfobox .tourdate{margin-top:0; justify-content:space-between; align-items:center;}
#schedule .tourinfobox .tourdate .year{width:100%;}
#schedule .tourinfobox .venuebox{display:flex; align-items:center; gap:28px; flex:1;}
#schedule .tourinfobox .venuebox .line1{transform: translateY(7px);}
#schedule .tourinfobox .venuebox .venue{margin-top:0; flex:1;}
#schedule .tourinfobox .tourinfo{margin-right:20px;}
#schedule .tourinfobox .tourinfo .contact{width:200px; text-indent:-3.5rem;padding-left:3.5rem;}
#schedule .tourinfobox .tourinfo .sold{margin:0 0 4px;}
#schedule .arrow{width:10vw; max-width:26px; margin-left:auto; margin-top:5px;}
#schedule .note .btn .zaiko,#schedule .note .btn .unext{margin-top:4px;}
#schedule .note .btn{display:flex; gap:18px; justify-content:flex-start; align-items:center;}
#schedule .note .btn a{width:40vw; max-width:400px;}
#schedule #datenavi li{width:calc(100% / 10 - 2px);}
}

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

}


#ticket{}
#ticket .box{max-width:1000px; margin:0 auto; padding:var(--sec-space);}
#ticket .tourtitle{display:block; margin:20px auto 10px; padding:4px 0; color:#fff; font-size:1.5rem; font-weight:600;}
#ticket .tourtitle.cl07{background:#d72229;}
#ticket .tourtitle.cl08{background:#e29700;}
#ticket .tourtitle.cl09{background:#e00070;}
#ticket .tourtitle.cl10{background:#079569;}
#ticket .ticketbox{margin-bottom:16px; text-align:center; font-weight:800;}
#ticket .ticketprice{padding-bottom:8px; margin-bottom:8px; border-bottom:1px solid #ccc; font-size:1.5rem;}
#ticket .ticketprice .ticket-typebox .en{display:block; font-weight:500; letter-spacing:0; line-height:1.2;}
#ticket .ticketprice .ticket-price{font-size:1.6rem; letter-spacing:0;}
#ticket .ticketprice .ticket-price .tax{font-size:1.2rem; font-weight:300;}

#ticket .ticketorder{margin:20px auto; padding:20px 0; border-top:2px solid #d72229; border-bottom:2px solid #d72229;}
#ticket .title{font-size:1.8rem; font-weight:800; color:#d72229;}
#ticket .title.en{margin-top:40px; letter-spacing:0;}
#ticket .ordertitle{display:inline-block; padding:2px 8px; margin:6px auto; background:#ccc; font-weight:600;}
#ticket .orderdate{margin-bottom:4px; font-size:1.7rem; font-weight:700;}
#ticket .orderdate span,#ticket .orderdate2 span{font-size:.8em;}
#ticket .note ul{font-size:1.3rem;}
#ticket .note ul li{text-align:left; text-indent:-1.2rem; padding-left:1rem;}
#ticket .note ul li:before{content:"＊";}
#ticket .orderbtn a{display: block; position: relative; margin:16px auto; padding:15px 0 15px 0;  border-radius: 60px; text-decoration: none; transition: all 0.3s ease; line-height: 1.4; text-align:center; letter-spacing:0; background:#ffbd00; font-size:1.6rem; font-weight:700; max-width:280px;}
#ticket .orderbtn a::after{content: ""; position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(45deg); width: 10px; height: 10px; border-top: 2px solid var(--main-color); border-right: 2px solid var(--main-color);}

#ticket .ticketsv{background:rgba(243, 243, 243, 1); padding:0 0;}
#ticket .ticketsv.welfare{background:rgba(229, 228, 228, 1);}
#ticket .ticketsv .box{max-width:800px;}
#ticket .ticketsv .box.en{letter-spacing:0; font-size:1.1em;}
#ticket .ticketsv h4{font-size:1.6rem; font-weight:800;}
#ticket .ticketsv p{margin:16px 0; text-align:left;}
#ticket .ticketsv ul{text-align:left;}
#ticket .ticketsv ul li{text-indent:-1.2rem; padding-left:1rem;}
#ticket .ticketsv ul li:before{content:"＊";}

@media only screen and (min-width:600px) {
#ticket .ticketbox{margin-bottom:16px; display:flex; gap:26px; justify-content:center; align-items: center; text-align:center; font-weight:600;}
#ticket .ticketprice{display: flex; height: 100%; min-height:80px; flex-direction: column; padding-right:26px; border-bottom:none; border-right:1px solid #999;}
#ticket .ticketprice:last-child{border:none;}
#ticket .ticket-price{margin-top:auto;}
#ticket .note ul{display:flex; gap:2px 16px; justify-content:center; flex-wrap:wrap; font-size:1.3rem;}
}


#popupnews{padding:5vw 15px;max-height:initial; background:#fff; text-align:left; height:100%; line-height:1.6;}
#popupnews h1{max-width:800px; margin-bottom:16px; padding-bottom:8px; font-size:clamp(1.7rem, 1.627rem + 0.36vw, 1.9rem); font-weight:700; color:#e15b4b; text-align:left; border-bottom:2px solid #e15b4b;}
#popupnews h1.imgtitle{border:none; max-width:760px; margin:0 auto;}
#popupnews h3{max-width:800px; margin:0 auto;}
#popupnews h3.type2{margin-bottom:16px; color:#e15b4b; text-align:center;}
#popupnews p{margin:0 auto; margin-bottom:16px;  padding-left:5px; font-size:clamp(1.4rem, 1.364rem + 0.18vw, 1.5rem); max-width:800px;}
#popupnews p.right{text-align:right;}
#popupnews p.ticketinfo strong{margin-top:4px; display:inline-block; width:140px;}
#popupnews .date{text-align:right; font-size:12px; font-size:1.2rem; margin-top:16px; margin-bottom:32px;}
#popupnews .artist span:before{content:"●";}
#popupnews .artist span{display:block; font-weight:600;}
#popupnews .artist ul{margin-bottom:8px; display:flex; gap:16px; flex-wrap:wrap; font-family: "Poppins", sans-serif; font-weight:500; letter-spacing:0;}
#popupnews .artist ul li{width:calc(100% / 2 - 8px);}
#popupnews .artist ul li img{margin-bottom:2px;}
#popupnews .artist ul li.soon{}
#popupnews .artist p{margin:16px 0 30px 0px; padding:0; font-family: "Poppins", sans-serif; font-weight:500; letter-spacing:0; font-size:1.4rem; text-align:center;}
#popupnews ul{margin-left:0;}
#popupnews ul.first li{margin-bottom:8px; text-indent: -1em; padding-left: 1em;}
#popupnews ul.popticket li{margin-bottom:8px;}
#popupnews ul.popticket li li{margin-bottom:0;}
#popupnews ul.first li span:before{content:"●";}
#popupnews ul.first li span{display:block; font-weight:600;}
#popupnews ul.popticket{margin-left:10px;}
#popupnews ul.popticket ul{margin-left:20px;}
#popupnews ul.popticket li:before{content:"・";}
#popupnews ul.popticket li li:before{content:"∟";}]
#popupnews .map{text-align:center;}
#popupnews .map img{max-width:600px; margin:0 auto;}

#popupnews .back{max-width:800px; margin:0 auto; margin:16px 0; font-size:13px;}
#popupnews .border{max-width:800px; margin:0 auto; margin-top:16px; padding:16px; border:1px solid #000;}
#popupnews .ticket{margin-top:30px; }
#popupnews .ticket,#popupnews .ticket p{text-align:center; font-weight:600; font-size:1.9rem; color:#cc0000;}
#popupnews .contact{margin-top:30px; padding-top:30px;}
#popupnews a{text-decoration:underline;}
#popupnews .btn a{height:60px; line-height:60px; max-width:500px; text-decoration:none;}
#popupnews .btn a:hover{opacity:.7;}
#popupnews .btn a:after{top:38%;}

@media only screen and (min-width:760px) {
#popupnews .artist ul li{width:calc(100% / 3 - 12px);}
}

.movieyet{margin:40px auto; max-width:700px;}
.movieyet p{margin-top:4px:}

.movie{position:relative; aspect-ratio: 16 / 9; width: 90%; margin:0 auto; height: auto;}
.movie iframe {position: absolute; left: 0; top: 0; height: 100%; width: 100%;}

footer{padding:40px 20px 30px; font-size:1.3rem; font-weight:400; text-align:center; font-weight:400;text-align:left; background:#c5000f; color:#fff;}
footer a{color:#fff;}
footer p{margin-bottom:4px;}
footer .copy{margin-top:30px; font-size:1.2rem; font-size:1.2rem; letter-spacing:0; }
@media only screen and (min-width:760px) {
footer .box{display:flex; gap:0 32px; justify-content:center;}
footer{font-size:1.4rem; text-align:center;}
footer p{margin-bottom:4px;}
}

/*fadein*/
.fadeUpTrigger,.fadeDownTrigger,.fadeLeftTrigger,.fadeRightTrigger{opacity: 0;}
.fadeUp{animation-name:fadeUpAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeUpAnime{
from {opacity: 0; transform: translateX(20px);}
to {opacity: 1; transform: translateY(0);}
}

.fadeDown{animation-name:fadeDownAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeDownAnime{
from {opacity: 0; transform: translateY(-100px);}
to {opacity: 1; transform: translateY(0);}
}

.fadeLeft{animation-name:fadeLeftAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0; }
@keyframes fadeLeftAnime{
from {opacity: 0; transform: translateX(-100px);}
to {opacity: 1; transform: translateX(0);}
}

.fadeRight{animation-name:fadeRightAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeRightAnime{
from {opacity: 0; transform: translateX(100px);}
to {opacity: 1; transform: translateX(0);}
}

/*TOP PAGE*/
#pagetop {
	position:fixed;
	bottom:20px;
	right:10px;
	font-size:1.3rem;
	font-weight:700;
	z-index:999;
}
#pagetop a {
	margin-bottom:8px;
	background:var(--main-color);
	text-decoration: none;
	color: #fff;
	padding:10px 20px;
	text-align: center;
	display: block;
	border-radius: 3px;
}
#pagetop a:hover {
	text-decoration: none;
	background:#222;
}

.soon{font-family: "Noto Sans JP", sans-serif;}