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

body {
margin:0;
padding:0;
border:none}
img,div,p,blockquote,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,form,fieldset,textarea,address,main,article,aside,dialog,figure,footer,header,hgroup,nav,section {
margin:0;
padding:0;
border:0;
font-size:100%;
text-decoration:none;
list-style-type:none}
main,article,aside,dialog,figure,footer,header,hgroup,nav,section {
display:block}
h1,h2,h3,h4,h5,h6 {
font-weight:inherit}
table {
border:none;
border-collapse:collapse;
border-spacing:0}
th,td {
text-align:left;
vertical-align:top}
caption {
text-align:left}
a,a:focus,a:hover,a:active {
outline:0}
input,input:focus,input:hover,input:active,textarea,textarea:focus,textarea:hover,textarea:active {
outline:0}
img {
vertical-align:top}
html {
font-size:10px}
@media screen and (max-width: 849px) {
html {
font-size:2.56410256vw}
}
body {
color:#281c79;
font-family:"ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-size:1.4rem;
font-weight:500;
line-height:1.8;
-webkit-text-size-adjust:100%;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
overscroll-behavior:none;
  background: linear-gradient(-45deg, #005c7d, #55d9f0, #019ebd, #1dbbd6) fixed;
  background-size: 800% 800%;
  animation: GradietionAnimation 20s ease infinite;
}

@keyframes GradietionAnimation { 
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}




html.nav-open body {
overflow:hidden}
::-moz-selection {

color:#fff}
::selection {

color:#fff}
a {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:border,background,color;
color:#281c79}
a:has(.c-lineText) {
text-decoration:none}
img {
width:100%;
height:auto}
picture {
display:block}
input[type=text],input[type=tel],input[type=email],input[type=password],textarea {
font-family:"ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:500;
color:#281c79;
box-sizing:border-box;
outline:0;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
margin:0}
input[type=text]::placeholder,input[type=text]:placeholder-shown,input[type=text]::-webkit-input-placeholder,input[type=text]:-moz-placeholder,input[type=text]::-moz-placeholder,input[type=text]:-ms-input-placeholder,input[type=tel]::placeholder,input[type=tel]:placeholder-shown,input[type=tel]::-webkit-input-placeholder,input[type=tel]:-moz-placeholder,input[type=tel]::-moz-placeholder,input[type=tel]:-ms-input-placeholder,input[type=email]::placeholder,input[type=email]:placeholder-shown,input[type=email]::-webkit-input-placeholder,input[type=email]:-moz-placeholder,input[type=email]::-moz-placeholder,input[type=email]:-ms-input-placeholder,input[type=password]::placeholder,input[type=password]:placeholder-shown,input[type=password]::-webkit-input-placeholder,input[type=password]:-moz-placeholder,input[type=password]::-moz-placeholder,input[type=password]:-ms-input-placeholder,textarea::placeholder,textarea:placeholder-shown,textarea::-webkit-input-placeholder,textarea:-moz-placeholder,textarea::-moz-placeholder,textarea:-ms-input-placeholder {
color:#bcbfe1}
input::-ms-clear {
visibility:hidden}
input::-ms-reveal {
visibility:hidden}
select {
font-family:"ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:500;
color:#281c79;
box-sizing:border-box;
outline:0;
cursor:pointer;
padding:0;
margin:0;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none}
select::-ms-expand {
display:none}
button {
box-sizing:border-box;
outline:0;
cursor:pointer;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none}
.symbols {
display:none;
position:absolute;
top:0;
left:0}
.header {
position:fixed;
inset:0 0 auto;
z-index:11}
.header__logo {
position:absolute;
top:.4rem;
left:1rem;
width:19.1rem}
.header__logo a {
display:block}
.header__entry {
position:absolute;
top:1rem;
right:6.4rem;
display:block;
font-size:1.2rem;
font-weight:800;
letter-spacing:-0.1em;
line-height:1;
text-decoration:none;
color:#fff;
background:#ed6c00;
border:2px solid #ed6c00;
border-radius:10rem;
padding:.5rem 1rem}
.header__entry .emp {
font-size:1.4rem;
letter-spacing:0}
.header__entry .mark {
position:relative;
top:.1rem;
display:inline-block;
font-size:1.4rem;
letter-spacing:0;
margin-left:.1rem}
@media(hover) {
.header__entry:hover {
color:#ed6c00;
background:rgba(0,0,0,0)}
}
.header__menu {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
top:1rem;
right:1rem;
display:block;
width:4.6rem;
height:2.8rem;
background:#fff;
border:1px solid #5960c1;
border-radius:2rem;
box-sizing:border-box;
z-index:11}
.header__menu .line {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:background,transform;
position:absolute;
top:calc(50% - .1rem);
left:calc(50% - .9rem);
display:block;
width:1.8rem;
height:.2rem;

border-radius:.2rem}
.header__menu .line-1 {
transform:translateY(-0.3rem)}
.header__menu .line-2 {
transform:translateY(0.3rem)}
@media(hover) {
.header__menu:hover {
background:#281c79}
.header__menu:hover .line {
background:#fff}
}
html.nav-open .header__menu {
background:#281c79}
html.nav-open .header__menu .line {
background:#fff}
html.nav-open .header__menu .line-1 {
transform:rotate(195deg)}
html.nav-open .header__menu .line-2 {
transform:rotate(-195deg)}
@media screen and (min-width: 767px) {
.header__logo {
display:none}
.header__entry {
display:none}
.header__menu {
display:none}
}
@media screen and (max-width: 849px) {
.header {
height:4.8rem;
background:#fff}
.header:after {
position:absolute;
inset:auto 0 0;
display:block;
content:"";
border-bottom:1px solid #e3e5f3}
body.page-top .header {
background:rgba(0,0,0,0)}
body.page-top .header:after {
opacity:0}
html.intro-scrolled .header {
background:#fff}
html.intro-scrolled .header:after {
opacity:1}
html.nav-open .header {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
background:rgba(0,0,0,0)}
html.nav-open .header:after {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
opacity:0}
}
.naiotoko-links {
position:relative;
display:grid;
gap:1.6rem;
margin:2.7rem 1rem 0}
.naiotoko-links__person {
position:absolute;
top:-19.3rem;
left:-0.4rem;
width:10.4rem;
z-index:-2}
@media screen and (min-width: 767px) {
.naiotoko-links {
margin:auto 0 0}
.naiotoko-links__person {
display:none}
}
.h-document {
position:relative;
display:flex;
align-items:center;
color:#fff;
text-decoration:none;
padding:1.2rem 2rem 1.2rem 2.3rem}
.h-document:before {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:background-color,border-color;
position:absolute;
inset:0;
display:block;
content:"";
background:#2564ec;
border:2px solid #281c79;
border-radius:10rem;
z-index:-1}
.h-document .icon {
flex-shrink:0;
margin:-0.2rem .8rem -0.2rem 0}
.h-document .txt {
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:.5rem}
.h-document .en {
font-size:1.8rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1;
margin:-0.2rem 0 -0.3rem}
.h-document .ja {
font-size:1.2rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
margin-top:.1rem}
@media(hover) {
.h-document:hover {
color:#2564ec}
.h-document:hover:before {
background:rgba(0,0,0,0);
border-color:#2564ec}
}
@media screen and (min-width: 767px) {
.h-document {
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
padding:1rem 2rem 1rem 2.3rem}
}
.h-official {
position:relative;
display:flex;
align-items:center;
color:#fff;
text-decoration:none;
padding:1.2rem 2.1rem 1.2rem 2rem}
.h-official:before {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:background-color,border-color;
position:absolute;
inset:0;
display:block;
content:"";
background:#ed6c00;
border:2px solid #281c79;
border-radius:10rem;
z-index:-1}
.h-official .icon {
flex-shrink:0;
margin-right:.5rem}
.h-official .txt {
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:.5rem}
.h-official .en {
font-size:1.8rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1;
margin:-0.2rem 0 -0.3rem}
.h-official .ja {
font-size:1.2rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
margin-top:.1rem}
@media(hover) {
.h-official:hover {
color:#ed6c00}
.h-official:hover:before {
background:rgba(0,0,0,0);
border-color:#ed6c00}
}
@media screen and (min-width: 767px) {
.h-official {
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
padding:1rem 2.1rem 1rem 2rem}
}
.h-tel {
order:-1;
position:relative;
display:flex;
align-items:center;
text-decoration:none;
padding:1.6rem 2rem 1.6rem 2.1rem}
.h-tel:before {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:0;
display:block;
content:"";
background:#fff;
border:2px solid #281c79;
border-radius:10rem;
z-index:-1}
.h-tel .icon {
flex-shrink:0;
margin:-0.1rem .6rem -0.1rem 0}
.h-tel .txt {
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:1.2rem .6rem}
.h-tel .number {
display:block;
font-size:2.8rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
letter-spacing:-0.04em;
line-height:1;
margin:-0.3rem 0 -0.5rem}
.h-tel .cap {
font-size:1rem;
line-height:1.2;
font-feature-settings:"palt" on;
margin:-0.2rem 0}
@media(hover) {
.h-tel:hover {
color:#fff}
.h-tel:hover:before {
background:#281c79}
}
@media screen and (min-width: 767px) {
.h-tel {
order:3;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content}
.h-tel .number {
letter-spacing:0}
}
.h-sns {
display:flex;
flex-wrap:wrap;
align-items:center;
gap:.8rem;
padding:0 0 0 1rem;
margin-top:2.2rem}
.h-sns__title {
flex-shrink:0;
font-size:1.2rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
line-height:1;
color:#fff;

border-radius:10rem;
padding:.5rem 1.5rem .3rem}
.h-sns__list {
display:flex;
}


.h-sns__item {
position:relative;
display:grid;
place-items:center;
width:3.4rem;
aspect-ratio:1/1}
.h-sns__item:before {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:background-color,border-color;
position:absolute;
inset:0;
display:block;
content:"";
background:#fff;
border:2px solid #5960c1;
border-radius:50%;
z-index:-1}
@media(hover) {
.h-sns__item:hover {
color:#fff}
.h-sns__item:hover:before {

border-color:#281c79}
}
@media screen and (min-width: 767px) {

.h-sns {
padding: 0;
width: 80px;
margin: 0 auto;
}


.naiotoko-navi__title {
display:none}
.naiotoko-list {
display:grid;
gap:1.8rem 0;
margin:-0.5rem 0 -0.3rem}
.naiotoko-item {
position:relative;
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:0 .5rem;
text-decoration:none}
.naiotoko-item .en {
position:relative;
top:-0.1rem;
display:block;
font-size:2rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1.4}
.naiotoko-item .ja {
display:block;
font-size:1.4rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1.572;
color:#767688;
margin-top:.2rem}
@media screen and (min-width: 767px) {
.naiotoko-navi {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:opacity,visibility;
opacity:0;
visibility:hidden}
html:not(.is-noOpening) body.page-top .naiotoko-navi {
transition-delay:2s}
html.is-loaded .naiotoko-navi {
opacity:1;
visibility:visible}
.naiotoko-navi__title {
display:block;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:1.2rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
line-height:1;
color:#fff;

border-radius:10rem;
padding:.1rem 1.2rem}
.naiotoko-list {
gap:.4rem 0;
margin:1.2rem 0 0}
.naiotoko-item {
padding-left:1.1rem}
.naiotoko-item:before {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
top:.7rem;
left:.2rem;
display:block;
content:"";
width:.7rem;
aspect-ratio:1/1;
background:currentColor;
border-radius:50%;
opacity:0}
.naiotoko-item .en {
font-size:1.8rem;
line-height:1.389}
.naiotoko-item .ja {
font-size:1.2rem;
line-height:1.584}
}
@media screen and (min-width: 767px)and (hover) {
.naiotoko-item:hover {
color:#ed6c00}
.naiotoko-item:hover:before {
opacity:1}
.naiotoko-item:hover .ja {
color:currentColor}
}
@-webkit-keyframes outerScale {
0% {
scale:1}
25% {
scale:1.05}
50% {
scale:1}
75% {
scale:1.05}
100% {
scale:1}
}
@keyframes outerScale {
0% {
scale:1}
25% {
scale:1.05}
50% {
scale:1}
75% {
scale:1.05}
100% {
scale:1}
}
@-webkit-keyframes outerRotate {
0% {
rotate:0deg}
100% {
rotate:360deg}
}
@keyframes outerRotate {
0% {
rotate:0deg}
100% {
rotate:360deg}
}
@-webkit-keyframes leadRotate {
0% {
rotate:0deg}
100% {
rotate:-360deg}
}
@keyframes leadRotate {
0% {
rotate:0deg}
100% {
rotate:-360deg}
}
.h-entry {
position:relative;
display:block;
width:21rem;
aspect-ratio:1/1;
margin:2.6rem 0 0 11rem}
.h-entry__button {
display:flex;
justify-content:center;
aspect-ratio:1/1}
.h-entry__outer {
position:absolute;
inset:0;
z-index:-1}
.h-entry__outer img {
filter:drop-shadow(0 0 1rem rgba(69, 54, 155, 0.5));
-webkit-animation:outerRotate 28s linear 0s infinite;
animation:outerRotate 28s linear 0s infinite}
.h-entry__lead {
position:absolute;
inset:0;
width:75.334%;
aspect-ratio:1/1;
margin:auto;
mix-blend-mode:multiply;
z-index:-1;
-webkit-animation:leadRotate 28s linear 0s infinite;
animation:leadRotate 28s linear 0s infinite}
.h-entry__text {
width:65.715%;
margin:30.477% auto 0}
.h-entry__person {
display:none}
.h-entry.is-animation .h-entry__outer {
-webkit-animation:outerScale .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:outerScale .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
@media screen and (min-width: 767px) {
.h-entry {
width:min(23.077vw,30rem);
margin:auto 0 0 -1.5rem;
rotate:-10deg}
.h-entry__button {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .1s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .1s;
opacity:0;
scale:.7}
html:not(.is-noOpening) body.page-top .h-entry__button {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 2s}
html.is-loaded .h-entry__button {
opacity:1;
scale:1}
.h-entry__text {
width:72%;
margin:29.334% 0 0 1%}
.h-entry__person {
position:absolute;
right:4%;
bottom:-12.667%;
display:block;
width:30.334%;
rotate:10deg}
.h-entry__person .circle {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:auto -1px -2px auto;
width:8.2rem;
aspect-ratio:82/84;
background:#ff0;
border:2px solid #5960c1;
box-sizing:border-box;
border-radius:50%;
z-index:-1;
opacity:0;
scale:0}
.h-entry__person .person {
transition:scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .1s;
scale:0;
transform-origin:center bottom}
html:not(.is-noOpening) body.page-top .h-entry__person .circle {
transition-delay:2s}
html:not(.is-noOpening) body.page-top .h-entry__person .person {
transition-delay:2.1s}
html.is-loaded .h-entry__person .circle {
opacity:1;
scale:1}
html.is-loaded .h-entry__person .person {
scale:1}
}
#wrapper {
overflow-x:clip}

.main {
position:relative;
width:50%;
min-height:100vh;
background:#fff;
box-sizing:border-box;
padding:0;
margin:0 auto;
z-index:2;
box-shadow:-0.2rem 0 2rem 0 rgba(40,28,121,.1),.2rem 0 2rem 0 rgba(40,28,121,.1);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: contain; /* トリミングなしで中央表示 */
  background-color: #fff;   /* 画像外の余白が白になるよう設定 */
}


.naiotoko-kv {
position:relative;
background: url(../img/bg.jpg) #006b8c;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover; /* トリミングなしで中央表示 */
  background-color: #fff;   /* 画像外の余白が白になるよう設定 */
  height: 100vh;
}



html:not(.is-noOpening) body.page-top .main {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s;
transition-property:background-color,box-shadow;
background:rgba(0,0,0,0);
box-shadow:none}
html.is-loaded .main {
background:#0fa5c3 !important;
box-shadow:-0.2rem 0 2rem 0 rgba(40,28,121,.1),.2rem 0 2rem 0 rgba(40,28,121,.1) !important}
@media screen and (max-width: 849px) {
.main {
padding:0;
box-shadow:none}
}
.c-pageHead {
padding-top:7.2rem}
.c-pageHead__title .en {
line-height:1;
margin:0 auto;
opacity:0;
scale:0}
html.is-loaded .c-pageHead__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.c-pageHead__title .ja {
font-size:2rem;
font-weight:800;
font-feature-settings:"palt" on;
line-height:1.4;
text-align:center;
margin-top:1rem;
opacity:0;
scale:0}
html.is-loaded .c-pageHead__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
body.page-event .c-pageHead .en {
width:21rem;
padding-left:.5rem}
body.page-join-us .c-pageHead {
padding-top:7.8rem}
body.page-join-us .c-pageHead .en {
width:26.3rem}
body.page-join-us .c-pageHead .ja {
margin-top:.9rem}
@media screen and (max-width: 849px) {
.c-pageHead {
padding-top:11.8rem}
body.page-event .c-pageHead {
padding-top:11.8rem}
body.page-join-us .c-pageHead {
padding-top:11.7rem}
}
.p-section__body {
max-width:41rem;
box-sizing:border-box;
padding-right:3rem;
padding-left:3rem;
margin-right:auto;
margin-left:auto}
@media screen and (max-width: 849px) {
.p-section__body {
padding-right:2rem;
padding-left:2rem}
}
.footer {
display:flex;
flex-direction:column;
padding:4rem 0}
.footer__background {
position:relative;
z-index:-2;
margin-top:-21.6rem}
.footer__background+.footer__copyright {
padding-bottom:1.5rem;
margin-top:-2.7rem !important}
.footer__copyright {
font-size:1rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:400;
line-height:1.2;
color:#969be0;
text-align:center}
.footer__copyright:not(:first-child) {
margin-top:4rem}
body.page-join-us .footer {
padding:4rem 0 6rem;
margin-top:8rem}
body.page-top .footer {
padding:4rem 0 0}
@media screen and (min-width: 767px) {
body.page-top .footer {
padding:4.7rem 0 0}
}
@media screen and (max-width: 849px) {
.footer {
padding:4rem 0}
.footer__background {
margin:-22.5rem -0.6rem 0 -1.4rem}
.footer__background+.footer__copyright {
padding-bottom:5.9rem}
}
.f-links {
display:grid;
gap:1.6rem;
padding:0 3.1rem 0 3rem;
margin-top:4rem}
body.page-top .f-links {
margin-top:0}
@media screen and (min-width: 767px) {
.f-links {
display:none}
}
.f-tel {
position:relative;
display:flex;
align-items:center;
text-decoration:none;
padding:1.6rem 1.6rem 1.6rem 2.1rem}
.f-tel:before {
position:absolute;
inset:0;
display:block;
content:"";
background:#fff;
border:2px solid #281c79;
border-radius:10rem;
z-index:-1}
.f-tel .icon {
flex-shrink:0;
margin:-0.1rem .6rem -0.1rem 0}
.f-tel .txt {
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:1.2rem .6rem}
.f-tel .number {
display:block;
font-size:2.8rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
letter-spacing:-0.04em;
line-height:1;
margin:-0.3rem 0 -0.5rem}
.f-tel .cap {
font-size:1rem;
line-height:1.2;
font-feature-settings:"palt" on;
margin:-0.2rem 0}
.f-document {
position:relative;
display:flex;
align-items:center;
color:#fff;
text-decoration:none;
padding:1.2rem 2rem 1.2rem 2.3rem}
.f-document:before {
position:absolute;
inset:0;
display:block;
content:"";
background:#2564ec;
border:2px solid #281c79;
border-radius:10rem;
z-index:-1}
.f-document .icon {
flex-shrink:0;
margin:-0.2rem .8rem -0.2rem 0}
.f-document .txt {
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:.5rem}
.f-document .en {
font-size:1.8rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1;
margin:-0.2rem 0 -0.3rem}
.f-document .ja {
font-size:1.2rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
margin-top:.1rem}
.f-official {
position:relative;
display:flex;
align-items:center;
color:#fff;
text-decoration:none;
padding:1.2rem 2.1rem 1.2rem 2rem}
.f-official:before {
position:absolute;
inset:0;
display:block;
content:"";
background:#ed6c00;
border:2px solid #281c79;
border-radius:10rem;
z-index:-1}
.f-official .icon {
flex-shrink:0;
margin-right:.5rem}
.f-official .txt {
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:.5rem}
.f-official .en {
font-size:1.8rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1;
margin:-0.2rem 0 -0.3rem}
.f-official .ja {
font-size:1.2rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
margin-top:.1rem}
.f-sns {
display:flex;
flex-wrap:wrap;
align-items:center;
gap:1rem;
margin:2.2rem auto 0}
.f-sns__title {
flex-shrink:0;
width:9rem;
font-size:1.2rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
line-height:1;
color:#fff;
text-align:center;

border-radius:10rem;
padding:.5rem 0 .3rem}
.f-sns__list {
display:flex;
flex-wrap:wrap;
gap:.6rem;
margin:0 -0.2rem}
.f-sns__item {
position:relative;
display:grid;
place-items:center;
width:3.4rem;
aspect-ratio:1/1}
.f-sns__item:before {
position:absolute;
inset:0;
display:block;
content:"";
background:#fff;
border:2px solid #5960c1;
border-radius:50%;
z-index:-1}
@media screen and (min-width: 767px) {
.f-sns {
display:none}
}
.f-entry {
position:relative;
display:flex;
justify-content:center;
width:30rem;
aspect-ratio:1/1;
margin:6.4rem auto 0}
body:not(.page-top) .f-entry {
order:-1;
margin-top:0}
.f-entry__outer {
position:absolute;
inset:0;
z-index:-1}
.f-entry__outer img {
filter:drop-shadow(0 0 1rem rgba(69, 54, 155, 0.5));
-webkit-animation:outerRotate 28s linear 0s infinite;
animation:outerRotate 28s linear 0s infinite}
.f-entry__lead {
position:absolute;
inset:0;
width:75.334%;
aspect-ratio:1/1;
margin:auto;
mix-blend-mode:multiply;
z-index:-1;
-webkit-animation:leadRotate 28s linear 0s infinite;
animation:leadRotate 28s linear 0s infinite}
.f-entry__text {
width:70.334%;
margin:30% 0 0 1%;
margin:7.7rem 0 0 .7rem}
.f-entry.is-animation .f-entry__outer {
-webkit-animation:outerScale .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:outerScale .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
@media screen and (min-width: 767px) {
.f-entry {
margin-top:0}
}
@media screen and (max-width: 849px) {
.f-entry:not(:first-child) {
margin-top:6.1rem}
.f-entry__text {
width:68.334%;
margin:7.7rem 0 0 0}
}
@-webkit-keyframes arw_r {
0% {
opacity:1;
transform:translateX(0)}
50% {
opacity:0;
transform:translateX(50%)}
50.1% {
opacity:0;
transform:translateX(-50%)}
100% {
opacity:1;
transform:translateX(0)}
}
@keyframes arw_r {
0% {
opacity:1;
transform:translateX(0)}
50% {
opacity:0;
transform:translateX(50%)}
50.1% {
opacity:0;
transform:translateX(-50%)}
100% {
opacity:1;
transform:translateX(0)}
}
@-webkit-keyframes arw_b {
0% {
opacity:1;
transform:translateY(0)}
50% {
opacity:0;
transform:translateY(50%)}
50.1% {
opacity:0;
transform:translateY(-50%)}
100% {
opacity:1;
transform:translateY(0)}
}
@keyframes arw_b {
0% {
opacity:1;
transform:translateY(0)}
50% {
opacity:0;
transform:translateY(50%)}
50.1% {
opacity:0;
transform:translateY(-50%)}
100% {
opacity:1;
transform:translateY(0)}
}
@-webkit-keyframes arw_l {
0% {
opacity:1;
transform:translateX(0)}
50% {
opacity:0;
transform:translateX(-50%)}
50.1% {
opacity:0;
transform:translateX(50%)}
100% {
opacity:1;
transform:translateX(0)}
}
@keyframes arw_l {
0% {
opacity:1;
transform:translateX(0)}
50% {
opacity:0;
transform:translateX(-50%)}
50.1% {
opacity:0;
transform:translateX(50%)}
100% {
opacity:1;
transform:translateX(0)}
}
.icon {
display:block;
fill:currentColor}
.icon--instagram {
width:1.8rem;
aspect-ratio:1/1}
.icon--x {
width:1.6rem;
aspect-ratio:16/18}
.icon--facebook {
width:1rem;
aspect-ratio:10/21}
.icon--line {
width:1.8rem;
aspect-ratio:18/19}
.icon--tiktok {
width:2.6rem;
aspect-ratio:26/9;
padding-bottom:.1rem}
.icon--youtube {
width:1.8rem;
aspect-ratio:18/12}
.icon--phone {
width:1.6rem;
aspect-ratio:16/22}
.icon--document {
width:1.4rem;
aspect-ratio:14/17}
.icon--common {
width:2rem;
aspect-ratio:20/13}
.icon--visual {
width:1.6rem;
aspect-ratio:16/12}
.icon--building {
width:1.6rem;
aspect-ratio:16/14}
.icon--picture {
width:1.6rem;
aspect-ratio:1/1}
.icon--arw_r {
width:1.2rem;
aspect-ratio:1/1}
button.is-animation .icon--arw_r,a[href].is-animation .icon--arw_r {
-webkit-animation:arw_r .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:arw_r .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
.icon--arw_b {
width:1.2rem;
aspect-ratio:1/1}
button.is-animation .icon--arw_b,a[href].is-animation .icon--arw_b {
-webkit-animation:arw_b .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:arw_b .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
.icon--arw_l {
width:1.2rem;
aspect-ratio:1/1}
button.is-animation .icon--arw_l,a[href].is-animation .icon--arw_l {
-webkit-animation:arw_l .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:arw_l .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
.c-button {
position:relative;
display:flex;
gap:0 1rem;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:1.4rem;
font-weight:700;
font-feature-settings:"palt" on;
letter-spacing:.05em;
line-height:1;
text-decoration:none;
border-radius:10rem;
padding:1.3rem 1.4rem}
.c-button:before {
position:absolute;
inset:0;
display:block;
content:"";
border:1px solid #5960c1;
border-radius:10rem}
@media(hover) {
.c-button:hover {
color:#fff;
background:#281c79}
}
@-webkit-keyframes lineText {
0% {
background-position:right bottom;
background-size:100% 1px}
50% {
background-position:right bottom;
background-size:0% 1px}
50.1% {
background-position:left bottom;
background-size:0% 1px}
100% {
background-position:left bottom;
background-size:100% 1px}
}
@keyframes lineText {
0% {
background-position:right bottom;
background-size:100% 1px}
50% {
background-position:right bottom;
background-size:0% 1px}
50.1% {
background-position:left bottom;
background-size:0% 1px}
100% {
background-position:left bottom;
background-size:100% 1px}
}
.c-lineText {
background-repeat:no-repeat;
background-position:right bottom;
background-size:100% 1px;
background-image:linear-gradient(currentColor, currentColor)}
@media(hover) {
a[href].is-animation .c-lineText {
-webkit-animation:lineText .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:lineText .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
}
.naiotoko-loading {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:opacity,visibility;
position:fixed;
inset:0;
display:grid;
place-items:center;
background:#019ebd;
z-index:100}


@-webkit-keyframes log_animation {
  0% {
margin-top: 0;
  }
  15% {
margin-top: 10px;
  }
  35% {
margin-top: 0;
  }
  50% {
margin-top: 10px;
  }
  72% {
margin-top: 0;
  }
}
@keyframes log_animation {
  0% {
margin-top: 0;
  }
  15% {
margin-top: 10px;
  }
  35% {
margin-top: 0;
  }
  50% {
margin-top: 10px;
  }
  72% {
margin-top: 0;
  }
}



.naiotoko-loading-logo {
    position: fixed; /* 中央配置には fixed または absolute を使う */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* 上下左右中央に */
    width: 35.5rem;
    animation: log_animation 2s infinite;
    z-index: 9999; /* 他要素より前に出す（必要に応じて） */
}




.naiotoko-loading-loader {
transition:transform .4s linear 0s;
position:absolute;
inset:auto 0 0;
display:block;
content:"";
aspect-ratio:355/27;
background:rgba(255,255,255,.5);
transform-origin:right bottom;
margin-bottom: -50px;
}



html.is-loaded .naiotoko-loading {
opacity:0;
visibility:hidden}
@media screen and (max-width: 849px) {
.naiotoko-loading-logo {
width:25.5rem}
}
@-webkit-keyframes backgroundScrollText {
0% {
transform:translateX(0)}
100% {
transform:translateX(-100%)}
}
@keyframes backgroundScrollText {
0% {
transform:translateX(0)}
100% {
transform:translateX(-100%)}
}
@-webkit-keyframes cloudFloat {
0% {
transform:translateY(0)}
50% {
transform:translateY(2rem)}
100% {
transform:translateY(0)}
}
@keyframes cloudFloat {
0% {
transform:translateY(0)}
50% {
transform:translateY(2rem)}
100% {
transform:translateY(0)}
}
.naiotoko-background {
position:fixed;
inset:0 0 auto;
height:100vh;
z-index:-1}
.naiotoko-background:before {
position:absolute;
inset:0 0 auto;
display:block;
content:"";
height:35.2rem;
background-image:url(../imgs/common/background.webp);
background-repeat:repeat-x;
background-size:contain}
.naiotoko-background__scrollText {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:fixed;
top:50%;
left:0;
display:flex;
translate:0 -50%;
margin-top:1rem;
opacity:0}
html:not(.is-noOpening) body.page-top .naiotoko-background__scrollText {
transition-delay:2s}
html.is-loaded .naiotoko-background__scrollText {
opacity:1}
.naiotoko-background__scrollText .text {
-webkit-animation:backgroundScrollText 24s linear 0s infinite;
animation:backgroundScrollText 24s linear 0s infinite;
flex-shrink:0;
width:122.6rem;
white-space:nowrap;
padding-right:5rem}
.naiotoko-background-side {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
position:absolute;
opacity:0;
scale:0;
-webkit-animation:cloudFloat 8s linear 0s infinite;
animation:cloudFloat 8s linear 0s infinite}
.naiotoko-background-side.cloud-1 {
top:-4.1rem;
left:15.4rem;
width:22.6rem}
.naiotoko-background-side.cloud-2 {
top:-5.3rem;
right:-6.4rem;
width:32.8rem}
.naiotoko-background-side.cloud-3 {
top:8.464%;
left:0;
width:7.7rem}
.naiotoko-background-side.cloud-4 {
top:29.037%;
right:6.4rem;
width:7.6rem}
.naiotoko-background-side.cloud-5 {
top:60%;
left:0;
width:25.3rem}
.naiotoko-background-side.cloud-6 {
top:51.5625%;
right:0;
width:13.1rem}
.naiotoko-background-side.cloud-1 {
-webkit-animation-delay:.2s;
animation-delay:.2s}
.naiotoko-background-side.cloud-2 {
-webkit-animation-delay:.4s;
animation-delay:.4s}
.naiotoko-background-side.cloud-3 {
-webkit-animation-delay:.6s;
animation-delay:.6s}
.naiotoko-background-side.cloud-4 {
-webkit-animation-delay:.8s;
animation-delay:.8s}
.naiotoko-background-side.cloud-5 {
-webkit-animation-delay:1s;
animation-delay:1s}
.naiotoko-background-side.cloud-6 {
-webkit-animation-delay:1.2s;
animation-delay:1.2s}
html:not(.is-noOpening) body.page-top .naiotoko-background-side {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 2s}
html.is-loaded .naiotoko-background-side {
opacity:1;
scale:1}
.naiotoko-background__person {
position:absolute;
left:74%;
bottom:-0.3rem;
width:min(13.308%,17.3rem)}
.naiotoko-background__person .speech {
position:absolute;
top:-6.667%;
left:45.665%;
width:102.891%;
opacity:0;
translate:0 1rem;
scale:.5}
.naiotoko-background__person .person {
opacity:0;
translate:0 4rem;
scale:.9}
html.is-loaded .naiotoko-background__person .speech {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,translate .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s;
transform-origin:center bottom;
opacity:1;
translate:0 0;
scale:1}
html.is-loaded .naiotoko-background__person .person {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .1s,translate .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .1s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .1s;
opacity:1;
translate:0 0;
scale:1;
transform-origin:center bottom}
.naiotoko-background-btm {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,translate .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
position:absolute;
inset:auto 0 -6.9rem;
display:block;
content:"";
height:18.8rem;
background-image:url(../imgs/common/background_bottom.webp);
background-repeat:repeat-x;
background-size:auto 100%;
z-index:-2;
opacity:0;
translate:0 4rem}
html:not(.is-noOpening) body.page-top .naiotoko-background-btm {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s,translate .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 2s}
html.is-loaded .naiotoko-background-btm {
opacity:1;
translate:0 0}
@media screen and (max-width: 849px) {
.naiotoko-background {
display:none}
.naiotoko-background * {
display:none;
transition:none !important;
-webkit-animation:none !important;
animation:none !important}
}
.c-entry {
position:relative;
display:block;
width:min(92.3077%,30rem);
aspect-ratio:1/1;
rotate:-10deg}
.c-entry__button {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:0;
scale:.7;
display:flex;
justify-content:center;
aspect-ratio:1/1}
.c-entry__outer {
position:absolute;
inset:0;
z-index:-1}
.c-entry__outer img {
filter:drop-shadow(0 0 1rem rgba(69, 54, 155, 0.5));
-webkit-animation:outerRotate 28s linear 0s infinite;
animation:outerRotate 28s linear 0s infinite}
.c-entry__lead {
position:absolute;
inset:0;
width:75.334%;
aspect-ratio:1/1;
margin:auto;
mix-blend-mode:multiply;
z-index:-1;
-webkit-animation:leadRotate 28s linear 0s infinite;
animation:leadRotate 28s linear 0s infinite}
.c-entry__text {
width:72%;
margin:30% 0 0 1%}
.c-entry__person {
position:absolute;
right:1.2rem;
bottom:-3.8rem;
display:block;
width:30.334%;
rotate:10deg}
.c-entry__person .circle {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:auto -1px -2px auto;
width:8.2rem;
aspect-ratio:82/84;
background:#ff0;
border:2px solid #e2e21c;
box-sizing:border-box;
border-radius:50%;
z-index:-1;
opacity:0;
scale:0}
.c-entry__person .person {
transition:scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
scale:0;
transform-origin:center bottom}
.c-entry.is-animation .c-entry__outer {
-webkit-animation:outerScale .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:outerScale .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
.is-visible .c-entry__button {
opacity:1;
scale:1}
.is-visible .c-entry__person .circle {
opacity:1;
scale:1}
.is-visible .c-entry__person .person {
scale:1}
.naiotoko {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:opacity,visibility;
position:fixed;
inset:0;
background:#fff;
z-index:10;
overflow-y:auto;
opacity:0;
visibility:hidden;
overscroll-behavior:none}
.naiotoko-wrapper {
position:relative;
display:flex;
flex-direction:column;
min-height:100%;
box-sizing:border-box;
padding:8rem 2rem 3.8rem;
overflow:hidden}
.naiotoko-wrapper:before,.naiotoko-wrapper:after {
position:absolute;
display:block;
content:"";
z-index:-2}
.naiotoko-wrapper:before {
inset:0 0 auto;
height:35.2rem;
background-image:url(../imgs/common/background.webp);
background-repeat:repeat-x;
background-size:contain}
.naiotoko-wrapper:after {
inset:auto 0 -2.2rem;
height:10rem;
background-image:url(../imgs/common/background_bottom.webp);
background-repeat:repeat-x;
background-size:auto 100%}
.naiotoko-left {
order:2;
display:flex;
flex-direction:column}
.naiotoko-logo {
display:none}
.naiotoko-right {
order:1;
display:flex;
flex-direction:column}
.naiotoko__illust {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:opacity,transform;
position:absolute;
z-index:-2;
opacity:0}
.naiotoko__illust.illust-1 {
top:0;
right:0;
width:10rem;
transform:translateX(2rem)}
.naiotoko__illust.illust-2 {
top:50.4rem;
left:0;
width:7.2rem;
transform:translateX(-2rem)}
html.nav-open .naiotoko {
opacity:1;
visibility:visible}
html.nav-open .naiotoko__illust {
opacity:1;
transform:translateX(0)}
html.nav-open .naiotoko__illust.illust-1 {
transition-delay:.2s}
html.nav-open .naiotoko__illust.illust-2 {
transition-delay:.4s}
@media screen and (min-width: 767px) {
.naiotoko {
background:rgba(0,0,0,0);
overflow-y:clip;
opacity:1;
visibility:visible;
z-index:1}
.naiotoko-wrapper {
display:grid;
grid-template-columns:1fr 43rem 1fr;
width:min(100%);
height:100%;
padding:0;
margin:0 auto}
.naiotoko-wrapper:before,.naiotoko-wrapper:after {
display:none}



.naiotoko-left {
transition: all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property: opacity,visibility;
order: 1;
padding: 15% 45% 5% 10%;
opacity: 0;
visibility: hidden;
width: 18vw;
}



html:not(.is-noOpening) body.page-top .naiotoko-left {
transition-delay:2s}
html.is-loaded .naiotoko-left {
opacity:1;
visibility:visible}
.naiotoko-logo {
display:block}


.naiotoko-right {
order: 2;
grid-column: 3;
padding: 5% 0 5% 41%;
}


body.page-join-us .naiotoko-right {
display:none}
.naiotoko__illust {
display:none}
}
@-webkit-keyframes eventLineText {
0% {
transform:scaleX(1);
transform-origin:right bottom}
50% {
transform:scaleX(0);
transform-origin:right bottom}
50.1% {
transform:scaleX(0);
transform-origin:left bottom}
100% {
transform:scaleX(1);
transform-origin:left bottom}
}
@keyframes eventLineText {
0% {
transform:scaleX(1);
transform-origin:right bottom}
50% {
transform:scaleX(0);
transform-origin:right bottom}
50.1% {
transform:scaleX(0);
transform-origin:left bottom}
100% {
transform:scaleX(1);
transform-origin:left bottom}
}
.c-eventItem {
position:relative;
display:block}
.c-eventItem:not(:first-child) {
margin-top:4rem}
.c-eventItem__link {
position:absolute;
inset:0;
z-index:2}
@media(hover) {
.c-eventItem__link:hover+.c-eventItem__img img {
scale:1.05}
}
.c-eventItem__img {
position:relative;
border-radius:1rem;
overflow:hidden;
aspect-ratio:350/230}
.c-eventItem__img:before {
position:absolute;
inset:0;
display:block;
content:"";
border:.3rem solid;
border-radius:1rem;
overflow:hidden;
z-index:1}
.c-eventItem__img img {
transition:scale .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
height:100%;
-o-object-fit:cover;
object-fit:cover}
.c-eventItem__body {
margin-top:1.6rem}
.c-eventItem__categories .category {
display:flex;
align-items:center;
gap:0 .3rem;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:1.2rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
background:#fff;
border-radius:10rem;
padding:.2rem 1rem .2rem .3rem}
.c-eventItem__categories .category__icon {
flex-shrink:0;
display:flex;
align-items:center;
justify-content:center;
width:2rem;
aspect-ratio:1/1;
border-radius:50%;
background:currentColor}
.c-eventItem__categories .category__icon .icon {
fill:#fff}
.c-eventItem__categories .category__icon .icon--common {
width:1.4rem}
.c-eventItem__categories .category__icon .icon--visual {
width:1.4rem}
.c-eventItem__categories .category__icon .icon--building {
width:1.2rem}
.c-eventItem__categories .category__icon .icon--picture {
width:1.2rem}
.c-eventItem__title {
font-size:1.8rem;
font-weight:700;
font-feature-settings:"palt" on;
letter-spacing:.03em;
line-height:1.389;
margin-top:1.1rem}
.c-eventItem__dates {
display:flex;
align-items:flex-start;
gap:0 .5rem;
margin-top:1rem}
.c-eventItem__dates dt {
flex-shrink:0;
font-size:1.2rem;
font-weight:700;
line-height:1;
color:#fff;
background:#5960c1;
border-radius:2rem;
padding:.3rem 1rem .4rem}
.c-eventItem__dates dd {
display:flex;
flex-wrap:wrap;
gap:.9rem 1rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:600;
line-height:1;
margin-top:.2rem}
.c-eventItem__dates dd>p {
position:relative;
display:flex;
align-items:center;
font-size:1.5rem;
text-decoration:none;
padding-left:1rem}
.c-eventItem__dates dd>p:before {
position:absolute;
top:.5rem;
left:0;
display:block;
content:"";
width:.5rem;
aspect-ratio:1/1;
border-radius:50%;
background:#5960c1}
.c-eventItem__dates dd>p:after {
position:absolute;
inset:auto 0 0 1rem;
display:block;
content:"";
height:1px;
background:#5960c1}
.c-eventItem__dates .sep {
display:block;
font-size:1.1rem;
font-weight:700;
letter-spacing:.03em;
margin:0 .2rem}
.c-eventItem__dates .week {
display:block;
min-width:2.8rem;
font-size:.9rem;
color:#fff;
text-align:center;

border-radius:1rem;
box-sizing:border-box;
padding:.2rem .3rem .1rem;
margin:0 0 .3rem .3rem}
.c-eventItem.--common .c-eventItem__img:before {
border-color:#ed6c00}
.c-eventItem.--common .c-eventItem__categories .category {
color:#ed6c00;
background:#fff1e5}
.c-eventItem.--visual .c-eventItem__img:before {
border-color:#cc2525}
.c-eventItem.--visual .c-eventItem__categories .category {
color:#cc2525;
background:#feeced}
.c-eventItem.--building .c-eventItem__img:before {
border-color:#139a39}
.c-eventItem.--building .c-eventItem__categories .category {
color:#139a39;
background:rgba(19,154,57,.1)}
.c-eventItem.--picture .c-eventItem__img:before {
border-color:#2639a6}
.c-eventItem.--picture .c-eventItem__categories .category {
color:#2639a6;
background:#e9f0fd}
.p-top-event__list .c-eventItem__categories .category {
background:#fff !important}
.c-eventItem.js-scrollTarget {
opacity:0;
scale:.8}
.c-eventItem.is-visible {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.c-form {
margin-top:4rem}
.c-form .req {
display:inline-block;
font-size:1.1rem;
line-height:1;
color:#ed6c00;
border:1px solid #ed6c00;
border-radius:1rem;
padding:.2rem .9rem .3rem;
margin-left:.5rem}
.c-form label.error {
display:block;
color:#cc2525;
margin:.5rem 0 -0.5rem}
.c-form__group:not(:first-child) {
margin-top:3.2rem}
.c-form__group dt {
display:flex;
font-size:1.4rem;
font-weight:800;
font-feature-settings:"palt" on;
line-height:1.286}
.c-form__group dt:not(:has(.req)) {
margin:-0.3rem 0 -0.4rem}
.c-form__group dd {
font-size:1.4rem;
line-height:1.786;
font-feature-settings:"palt" on;
margin-top:1.6rem}
.c-form__input {
width:100%;
height:4.3rem;
font-size:1.4rem;
font-feature-settings:"palt" on;
letter-spacing:0;
border:1px solid #969be0;
border-radius:1rem;
box-sizing:border-box;
padding:.1rem 1.9rem 0}
.c-form__input::-moz-placeholder {
color:#bcbfe1}
.c-form__input::placeholder {
color:#bcbfe1}
.c-form__input.error {
border-color:#cc2525}
.c-form__input.error::-moz-placeholder {
color:rgba(204,37,37,.3)}
.c-form__input.error::placeholder {
color:rgba(204,37,37,.3)}
.c-form__select {
position:relative}
.c-form__select select {
width:100%;
height:4.3rem;
font-size:1.4rem;
font-feature-settings:"palt" on;
color:#bcbfe1;
background:rgba(0,0,0,0);
border:1px solid #969be0;
border-radius:1rem;
box-sizing:border-box;
padding:.1rem 4.6rem 0 1.9rem}
.c-form__select select.is-focused {
color:#281c79}
.c-form__select select.error {
color:rgba(204,37,37,.3);
border-color:#cc2525}
.c-form__select .icon {
position:absolute;
inset:0 1.8rem 0 auto;
fill:#5960c1;
margin:auto 0;
pointer-events:none}
.c-form__select:has(.error) .icon {
fill:#cc2525}
.c-form__radios {
display:flex;
flex-wrap:wrap;
gap:1.6rem}
.c-form__radio {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:relative;
display:inline-flex;
gap:0 .3rem;
line-height:1;
background:#f4f5f8;
border-radius:1rem;
padding:.8rem 1.5rem .8rem 1.3rem;
cursor:pointer}
.c-form__radio input {
position:absolute;
inset:0;
padding:0;
margin:0;
opacity:0;
visibility:hidden}
.c-form__radio .circle {
align-self:center;
position:relative;
width:1.6rem;
border:1px solid #969be0;
border-radius:50%;
aspect-ratio:1/1;
box-sizing:border-box}
.c-form__radio .circle:before {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:.3rem;
display:block;
content:"";

border-radius:50%;
opacity:0}
.c-form__radio .txt {
position:relative;
top:.1rem}
.c-form__radio:has(:checked) {
background:#e3e5f3}
.c-form__radio:has(:checked) .circle:before {
opacity:1}
.c-form__textarea {
display:block;
width:100%;
height:18rem;
font-feature-settings:"palt" on;
border:1px solid #969be0;
border-radius:1rem;
box-sizing:border-box;
padding:.7rem 1.9rem}
.c-form__textarea::-moz-placeholder {
color:#bcbfe1}
.c-form__textarea::placeholder {
color:#bcbfe1}
.c-form__caption {
font-feature-settings:"palt" on;
line-height:1.429;
color:#767688;
margin:2.8rem 0 -0.5rem}
.c-form__caption a {
color:currentColor}
.c-form__buttons {
display:flex;
justify-content:center;
gap:0 1.5rem;
margin-top:3.2rem}
.c-form__button {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:color,background;
display:flex;
align-items:center;
justify-content:center;
width:15rem;
height:4rem;
font-size:1.4rem;
font-family:"ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
font-feature-settings:"palt" on;
letter-spacing:.05em;
line-height:1;
color:#fff;
text-decoration:none;
background:#ed6c00;
border:2px solid #ed6c00;
border-radius:10rem;
box-sizing:border-box}
@media(hover) {
.c-form__button:hover {
color:#ed6c00;
background:rgba(0,0,0,0)}
}
.c-form__foot {
display:grid;
place-items:center;
border-top:2px solid #e3e5f3;
padding-top:2.4rem;
margin-top:7.2rem}
.js-fade {
opacity:0}
html.is-loaded .js-fade {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
opacity:1}
@-webkit-keyframes lightRight {
0% {
rotate:0deg}
50% {
rotate:30deg}
100% {
rotate:0deg}
}
@keyframes lightRight {
0% {
rotate:0deg}
50% {
rotate:30deg}
100% {
rotate:0deg}
}
@-webkit-keyframes lightLeft {
0% {
rotate:0deg}
50% {
rotate:-30deg}
100% {
rotate:0deg}
}
@keyframes lightLeft {
0% {
rotate:0deg}
50% {
rotate:-30deg}
100% {
rotate:0deg}
}

html:not(.is-noOpening) .naiotoko-kv:before {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s;
opacity:0}
html.is-loaded .naiotoko-kv:before {
opacity:1}
.naiotoko-kv-wrapper {
position:relative;
transform:translateY(20%)}
html:not(.is-noOpening) .naiotoko-kv-wrapper {
transition:transform 1.6s cubic-bezier(0.215, 0.61, 0.355, 1) .4s}
html.is-loaded .naiotoko-kv-wrapper {
transform:translateY(0)}
html.is-openingEnd .naiotoko-kv-wrapper {
overflow-x:clip}
@-moz-document url-prefix() {
.naiotoko-kv-wrapper {
transform:translateY(0);
top:20%}
html:not(.is-noOpening) .naiotoko-kv-wrapper {
transition-property:top}
html.is-loaded .naiotoko-kv-wrapper {
top:0}
}
.naiotoko-kv__light {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:opacity,transform;
position:absolute;
opacity:0;
transform:scale(0.8)}
html:not(.is-noOpening) .naiotoko-kv__light {
transition-delay:2s;
will-change:opacity,transform}
html.is-loaded .naiotoko-kv__light {
opacity:1;
transform:scale(1)}
.naiotoko-kv__light.--blue {
top:-9.1rem;
left:9.4rem;
width:11.2rem;
transform-origin:left bottom}
.naiotoko-kv__light.--blue img {
transform-origin:left bottom}
html.is-loaded .naiotoko-kv__light.--blue img {
-webkit-animation:lightLeft 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite;
animation:lightLeft 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite}
.naiotoko-kv__light.--pink {
top:-8.4rem;
right:5.8rem;
width:5rem;
transform-origin:left bottom}
.naiotoko-kv__light.--pink img {
transform-origin:left bottom}
html.is-loaded .naiotoko-kv__light.--pink img {
-webkit-animation:lightRight 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite;
animation:lightRight 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite}
.naiotoko-kv__light.--green {
top:-7.7rem;
left:22.4rem;
width:39.7rem;
transform-origin:left bottom}
.naiotoko-kv__light.--green img {
transform-origin:left bottom}
html.is-loaded .naiotoko-kv__light.--green img {
-webkit-animation:lightLeft 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite;
animation:lightLeft 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite}
.naiotoko-kv__light.--yellow {
top:-11.9rem;
left:-22.4rem;
width:38.2rem;
transform-origin:right bottom}
.naiotoko-kv__light.--yellow img {
transform-origin:right bottom}
html.is-loaded .naiotoko-kv__light.--yellow img {
-webkit-animation:lightRight 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite;
animation:lightRight 8s cubic-bezier(0.43, 0.05, 0.17, 1) 2.4s infinite}
.naiotoko-kv__ship {
position:absolute;
inset:1rem 0 auto 11.1rem;
width:22.9rem;
opacity:0;
transform:translateY(1rem);
transform-origin:center bottom}
html:not(.is-noOpening) .naiotoko-kv__ship {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s,transform .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s;
will-change:opacity,transform}
html.is-loaded .naiotoko-kv__ship {
opacity:1;
transform:translateY(0)}
.naiotoko-kv-background {
position:relative;
opacity:0;
translate:0 -170%;
transform-origin:center top}
.naiotoko-kv-background:before {
position:absolute;
inset:auto -5rem -1rem;
display:block;
content:"";
aspect-ratio:420/163;
background:url(../imgs/top/fv_bottom.svg);
background-repeat:no-repeat;
background-size:cover;
z-index:2;
opacity:0}
.naiotoko-kv-background img {
transform:scale(10);
transform-origin:center top}
html:not(.is-noOpening) .naiotoko-kv-background {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,translate .4s cubic-bezier(0.215, 0.61, 0.355, 1) 1.6s;
will-change:opacity,translate}
html:not(.is-noOpening) .naiotoko-kv-background:before {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 2s}
html:not(.is-noOpening) .naiotoko-kv-background img {
transition:transform .4s cubic-bezier(0.215, 0.61, 0.355, 1) 1.6s}
html.is-loaded .naiotoko-kv-background {
opacity:1;
translate:0 0}
html.is-loaded .naiotoko-kv-background:before {
opacity:1}
html.is-loaded .naiotoko-kv-background img {
transform:scale(1)}
.naiotoko-kv__person {
position:absolute;
top:15rem;
left:18.7rem;
width:4.1rem;
opacity:0;
translate:0 -80%;
transform-origin:center top}
.naiotoko-kv__person img {
transform:scale(10);
transform-origin:center top}
html:not(.is-noOpening) .naiotoko-kv__person {
transition:opacity .2s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,translate .4s cubic-bezier(0.215, 0.61, 0.355, 1) 1.6s;
will-change:opacity,translate}
html:not(.is-noOpening) .naiotoko-kv__person img {
transition:transform .4s cubic-bezier(0.215, 0.61, 0.355, 1) 1.6s}
html.is-loaded .naiotoko-kv__person {
opacity:1;
translate:0 0}
html.is-loaded .naiotoko-kv__person img {
transform:scale(1)}
.naiotoko-kv__person .before {
position:absolute;
inset:0}
html:not(.is-noOpening) .naiotoko-kv__person .before {
transition:opacity .2s cubic-bezier(0.215, 0.61, 0.355, 1) 1.8s;
will-change:opacity}
html.is-loaded .naiotoko-kv__person .before {
opacity:0}
.naiotoko-kv__person .after {
opacity:0}
html:not(.is-noOpening) .naiotoko-kv__person .after {
transition:opacity .2s cubic-bezier(0.215, 0.61, 0.355, 1) 1.8s;
will-change:opacity}
html.is-loaded .naiotoko-kv__person .after {
opacity:1}
@media screen and (max-width: 849px) {
.naiotoko-kv {
margin:0 -1rem}
.naiotoko-kv:before {
height:42.2rem;
background-image:url(../imgs/common/background_sp.webp);
opacity:1 !important}
.naiotoko-kv__light.--blue {
top:-5.8rem}
.naiotoko-kv__light.--pink {
top:-5.3rem}
.naiotoko-kv__light.--green {
top:-4.8rem;
left:22.4rem}
.naiotoko-kv__light.--yellow {
top:-9rem}
.naiotoko-kv__ship {
inset:4rem 0 auto 11.1rem}
.naiotoko-kv-background {
translate:0 -128.5%;
padding-top:3.1rem}
.naiotoko-kv-background img {
transform:scale(8)}
.naiotoko-kv__person {
top:18rem}
.naiotoko-kv__person img {
transform:scale(8)}
}
.p-top-section__body {
max-width:41rem;
box-sizing:border-box;
padding-right:3rem;
padding-left:3rem;
margin-right:auto;
margin-left:auto}
@media screen and (max-width: 849px) {
.p-top-section__body {
padding-right:2rem;
padding-left:2rem}
}
.p-top-section__title .en {
line-height:1;
opacity:0;
scale:0}
.p-top-section__title .ja {
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:2rem;
font-weight:800;
font-feature-settings:"palt" on;
line-height:1.4;
opacity:0;
scale:0}
.p-top-section.is-visible .p-top-section__title .en {
opacity:1;
scale:1}
.p-top-section.is-visible .p-top-section__title .ja {
opacity:1;
scale:1}
.p-top-entry {
display:flex;
justify-content:center;
padding-left:1.5rem}
.p-top-entry.entry-1 {
margin-top:6.1rem}
.p-top-entry.entry-2 {
margin-top:4rem}
.p-top-introduction {
position:relative;
z-index:2;
overflow-x:clip;
padding-top:12.8rem;
margin-top:-22.6rem}
.p-top-introduction__illust {
position:absolute;
opacity:0;
scale:0}
.p-top-introduction__illust.illust-1 {
top:0;
left:-0.5rem;
width:16.1rem}
.p-top-introduction__illust.illust-2 {
top:.4rem;
right:-0.1rem;
width:16.3rem}
.p-top-introduction__copy {
display:grid;
place-items:center;
opacity:0;
scale:0}
.p-top-introduction__copy .small {
display:block;
width:20.9rem;
margin-left:-0.1rem}
.p-top-introduction__copy .emp {
display:block;
width:36.7rem;
margin-top:.4rem}
.p-top-introduction__title {
width:35.6rem;
margin:1rem auto 0;
opacity:0;
scale:0}
.p-top-introduction__text {
font-weight:700;
line-height:2;
font-feature-settings:"palt" on;
text-align:center;
margin-top:1.7rem;
opacity:0}
.p-top-introduction.is-visible .p-top-introduction__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-introduction.is-visible .p-top-introduction__illust.illust-1 {
transform-origin:left}
.p-top-introduction.is-visible .p-top-introduction__illust.illust-2 {
transform-origin:right}
.p-top-introduction.is-visible .p-top-introduction__copy {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-introduction.is-visible .p-top-introduction__title {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s;
opacity:1;
scale:1}
.p-top-introduction.is-visible .p-top-introduction__text {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s;
opacity:1}
@media screen and (max-width: 849px) {
.p-top-introduction {
margin-top:-21.3rem}
.p-top-introduction__illust.illust-1 {
left:-1.5rem}
.p-top-introduction__illust.illust-2 {
right:-1.1rem}
}
.p-top-schedule {
margin-top:8.5rem;
scroll-margin-top:6.5rem}
.p-top-schedule__illust {
position:relative;
width:37.2rem;
margin:0 auto -2.9rem;
opacity:0;
scale:.7;
z-index:-1}
.p-top-schedule__title {
display:grid;
place-items:center}
.p-top-schedule__title .en {
width:31.9rem;
margin-left:.2rem}
.p-top-schedule__title .ja {
margin-top:1rem}
.p-top-schedule__categories {
display:flex;
flex-wrap:wrap;
gap:.8rem 1rem;
border-bottom:2px solid #e3e5f3;
padding-bottom:1.6rem;
margin:3.4rem -0.5rem 0;
opacity:0}
.p-top-schedule__categories .category {
display:flex;
align-items:center;
gap:0 .3rem;
font-size:1.4rem;
font-weight:700;
font-feature-settings:"palt" on;
letter-spacing:-0.03em;
line-height:1;
text-decoration:none;
border-radius:3rem;
padding:.3rem 1.2rem .3rem .4rem}
.p-top-schedule__categories .category__icon {
flex-shrink:0;
display:grid;
place-items:center;
width:2.4rem;
aspect-ratio:1/1;
background:currentColor;
border-radius:50%}
.p-top-schedule__categories .category__icon .icon {
fill:#fff}
.p-top-schedule__categories .category.--common {
color:#ed6c00;
background:#fff1e5}
.p-top-schedule__categories .category.--common .icon {
width:1.8rem}
.p-top-schedule__categories .category.--visual {
color:#cc2525;
background:#feeced}
.p-top-schedule__categories .category.--building {
color:#139a39;
background:rgba(19,154,57,.1)}
.p-top-schedule__categories .category.--building .icon {
width:1.5rem}
.p-top-schedule__categories .category.--picture {
color:#2639a6;
background:#e9f0fd}
.p-top-schedule__list {
display:grid;
grid-template-columns:repeat(3, 1fr);
gap:1.2rem 1rem;
margin:2.4rem -0.5rem 0}
.p-top-schedule__list .schedule {
position:relative;
display:flex;
flex-direction:column;
align-items:center;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
text-decoration:none;
border:2px solid;
border-radius:1rem;
padding:2.3rem 0 1.5rem;
opacity:0;
scale:.5}
.p-top-schedule__list .schedule__icon {
position:absolute;
top:.4rem;
left:.4rem;
display:flex;
align-items:center;
justify-content:center;
width:2.3rem;
aspect-ratio:1/1;
border-radius:50%}
.p-top-schedule__list .schedule__icon .icon {
fill:#fff}
.p-top-schedule__list .schedule__year {
font-size:1.4rem;
line-height:1}
.p-top-schedule__list .schedule__date {
display:flex;
align-items:center;
line-height:1;
margin-top:.2rem}
.p-top-schedule__list .schedule__date .mon {
display:block;
font-size:3.6rem;
letter-spacing:-0.1em;
margin-top:.1rem}
.p-top-schedule__list .schedule__date .sep {
display:block;
font-size:2.8rem;
margin:.1rem .3rem 0 .6rem}
.p-top-schedule__list .schedule__date .day {
display:block;
font-size:4.2rem;
letter-spacing:-0.05em}
.p-top-schedule__list .schedule__week {
font-size:1.4rem;
line-height:1;
margin-top:0rem}
.p-top-schedule__list .schedule.--common {
background:#fff1e5;
border-color:#ed6c00}
.p-top-schedule__list .schedule.--common .schedule__icon {
background:#ed6c00}
.p-top-schedule__list .schedule.--common .schedule__icon .icon {
width:1.7rem}
.p-top-schedule__list .schedule.--visual {
background:#feeced;
border-color:#cc2525}
.p-top-schedule__list .schedule.--visual .schedule__icon {
background:#cc2525}
.p-top-schedule__list .schedule.--visual .schedule__icon .icon {
width:1.5rem}
.p-top-schedule__list .schedule.--building {
background:rgba(19,154,57,.1);
border-color:#139a39}
.p-top-schedule__list .schedule.--building .schedule__icon {
background:#139a39}
.p-top-schedule__list .schedule.--building .schedule__icon .icon {
width:1.5rem}
.p-top-schedule__list .schedule.--picture {
background:#e9f0fd}
.p-top-schedule__list .schedule.--picture .schedule__icon {
background:#2639a6}
.p-top-schedule__list .schedule.--picture .schedule__icon .icon {
width:1.5rem}
.p-top-schedule.is-visible .p-top-schedule__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-schedule.is-visible .p-top-schedule__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-schedule.is-visible .p-top-schedule__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-schedule.is-visible .p-top-schedule__categories {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s;
opacity:1}
.p-top-schedule.is-visible .p-top-schedule__list .schedule {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .6s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .6s;
opacity:1;
scale:1}
.p-top-event {
position:relative;
margin-top:8.9rem;
scroll-margin-top:8.9rem}
.p-top-event__background {
position:absolute;
inset:0 0 -20.7rem;
background:#fff;
z-index:-1}
.p-top-event__background:before,.p-top-event__background:after {
position:absolute;
display:block;
content:"";
background:#fff;
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:100% auto;
mask-size:100% auto;
z-index:1}
.p-top-event__background:before {
inset:-0.1rem 0 auto;
aspect-ratio:410/81;
-webkit-mask-image:url(../imgs/top/background_top.svg);
mask-image:url(../imgs/top/background_top.svg);
-webkit-mask-position:center top;
mask-position:center top}
.p-top-event__background:after {
inset:auto 0 -0.1rem;
aspect-ratio:410/97;
-webkit-mask-image:url(../imgs/top/background_bottom.svg);
mask-image:url(../imgs/top/background_bottom.svg);
-webkit-mask-position:center bottom;
mask-position:center bottom}
.p-top-event__backgroundBody {
position:absolute;
inset:0;
background:url(../imgs/top/event_dots.webp),rgba(90,235,249,.4);
background-repeat:repeat;
background-size:42rem auto}
.p-top-event__backgroundBody:before {
position:absolute;
inset:0;
display:block;
content:"";
background:url(../imgs/top/background_texture.webp);
background-repeat:repeat-y;
background-size:100% auto;
mix-blend-mode:overlay}
.p-top-event__head {
position:relative;
padding-top:6.4rem;
margin-bottom:10.4rem}
.p-top-event__illust {
position:absolute;
top:-1.6rem;
right:-3rem;
width:36.8rem;
z-index:-1;
opacity:0;
scale:.8;
transform-origin:center bottom}
.p-top-event__title .en {
width:20.4rem}
.p-top-event__title .ja {
margin-top:1rem}
.p-top-event__more {
display:grid;
place-items:center;
margin-top:3.2rem}
.p-top-event.is-visible .p-top-event__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s;
opacity:1;
scale:1}
.p-top-event.is-visible .p-top-event__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s}
.p-top-event.is-visible .p-top-event__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s}
.p-top-features {
margin-top:3.7rem}
.p-top-features__head {
position:relative;
padding-top:18.6rem}
.p-top-features__illust {
position:absolute;
top:0;
left:-3rem;
width:28.4rem;
z-index:-1;
opacity:0;
scale:.7;
transform-origin:left}
.p-top-features__title {
display:grid;
place-items:center}
.p-top-features__title .en {
width:31rem;
margin-right:-0.6rem}
.p-top-features__title .ja {
margin-top:1rem}
.p-top-features__lead {
font-feature-settings:"palt" on;
line-height:1.786;
margin:3rem 0 -0.8rem;
opacity:0}
.p-top-features__list {
display:grid;
gap:1.6rem;
margin-top:4rem}
.p-top-features__list .item {
background:#f4f5f8;
border-radius:1rem;
padding:2rem;
opacity:0;
scale:0}
.p-top-features__list .item.is-visible {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-features__list .item .number {
position:relative;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
line-height:1;
color:#ed6c00}
.p-top-features__list .item .max {
opacity:0}
.p-top-features__list .item .count {
position:absolute;
top:0;
right:0}
.p-top-features__list .item__lead {
font-size:1.6rem;
font-feature-settings:"palt" on;
font-weight:800;
line-height:1.1875;
text-align:center;
margin:-0.3rem 0 -0.4rem}
.p-top-features__list .item__lead.--large {
font-size:2rem;
line-height:1.2;
margin:-0.5rem 0 -0.4rem}
.p-top-features__list .item__lead.--trim {
letter-spacing:-0.03em}
.p-top-features__list .item__employment {
margin-top:.3rem}
.p-top-features__list .item__employment .wrap {
display:flex;
align-items:flex-start;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
margin:0 auto}
.p-top-features__list .item__employment .head {
font-size:2.4rem;
font-feature-settings:"palt" on;
font-weight:800;
line-height:1;
margin:1.4rem .2rem 0 0}
.p-top-features__list .item__employment .number {
font-size:10rem;
-webkit-text-stroke-width:4px;
margin:0 0 -1.4rem}
.p-top-features__list .item__employment .small {
font-size:7.8rem;
letter-spacing:.03em;
-webkit-text-stroke-width:2px;
margin-left:.2rem}
.p-top-features__list .item__employment .suffix {
display:block;
font-size:4rem;
font-weight:800;
line-height:1;
margin-top:auto}
.p-top-features__list .item__employment .caption {
display:block;
font-size:1rem;
font-feature-settings:"palt" on;
line-height:1.2;
text-align:center;
margin:.5rem 0 -0.2rem}
.p-top-features__list .item__exemption {
font-weight:800;
margin-top:1.5rem}
.p-top-features__list .item__exemption .head {
display:block;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
text-align:center}
.p-top-features__list .item__exemption .wrap {
display:flex;
align-items:flex-start;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-feature-settings:"palt" on;
line-height:1;
margin:-0.2rem auto -0.1rem}
.p-top-features__list .item__exemption .prefix {
font-size:2.4rem;
margin-top:auto}
.p-top-features__list .item__exemption .number {
font-size:6.8rem;
-webkit-text-stroke-width:2px;
margin:0 0 -1.1rem}
.p-top-features__list .item__exemption .suffix {
font-size:3.8rem;
margin-top:auto}
.p-top-features__list .item__exemption .txt {
font-size:2.4rem;
margin-top:auto}
.p-top-features__list .item__founding {
display:flex;
align-items:flex-end;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:3.8rem;
font-weight:800;
font-feature-settings:"palt" on;
line-height:1;
margin:.8rem auto -0.2rem}
.p-top-features__list .item__founding .number {
font-size:6.8rem;
-webkit-text-stroke-width:2px;
margin:0 .3rem -1rem}
.p-top-features__list .item__collaborate {
margin-top:1.4rem}
.p-top-features__list .item__collaborate .head {
display:block;
font-size:1.6rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
text-align:center}
.p-top-features__list .item__collaborate .wrap {
display:flex;
align-items:flex-end;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-weight:800;
font-feature-settings:"palt" on;
line-height:1;
padding-right:.8rem;
margin:-0.3rem auto 0}
.p-top-features__list .item__collaborate .prefix {
font-size:2.4rem}
.p-top-features__list .item__collaborate .number {
font-size:10rem;
-webkit-text-stroke-width:4px;
margin:0 .6rem -1.7rem}
.p-top-features__list .item__collaborate .suffix {
font-size:4rem}
.p-top-features__list .item__graduate {
margin-top:.8rem}
.p-top-features__list .item__graduate .wrap {
display:flex;
align-items:flex-end;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-weight:800;
font-feature-settings:"palt" on;
line-height:1;
padding-left:.1rem;
margin:0 auto}
.p-top-features__list .item__graduate .prefix {
font-size:2rem;
line-height:1.2;
text-align:right;
margin-bottom:-0.2rem}
.p-top-features__list .item__graduate .number {
font-size:6.8rem;
-webkit-text-stroke-width:2px;
margin:0 0 -1rem .5rem}
.p-top-features__list .item__graduate .mark {
position:relative;
bottom:.8rem;
-webkit-text-stroke-width:0;
margin:0 -0.2rem 0 -0.1rem}
.p-top-features__list .item__graduate .suffix {
font-size:3.8rem}
.p-top-features__list .item__graduate .caption {
display:block;
font-size:1rem;
font-feature-settings:"palt" on;
line-height:1.2;
text-align:center;
margin:1.2rem 0 -0.2rem}
.p-top-features__list .item__support {
margin-top:1.5rem}
.p-top-features__list .item__support .head {
display:block;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1;
text-align:center}
.p-top-features__list .item__support .wrap {
display:flex;
align-items:flex-end;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-weight:800;
font-feature-settings:"palt" on;
line-height:1;
margin:-0.2rem auto 0}
.p-top-features__list .item__support .number {
font-size:6.8rem;
-webkit-text-stroke-width:2px;
margin:0 0 -0.9rem}
.p-top-features__list .item__support .suffix {
font-size:4rem}
.p-top-features__list .item__support .caption {
display:block;
font-size:1rem;
font-feature-settings:"palt" on;
line-height:1.2;
text-align:center;
margin:.3rem 0 -0.2rem}
.p-top-features.is-visible .p-top-features__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-features.is-visible .p-top-features__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-features.is-visible .p-top-features__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-features.is-visible .p-top-features__lead {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s;
opacity:1}
.p-top-department {
position:relative;
overflow-x:clip;
margin-top:9.6rem;
scroll-margin-top:9.6rem}
.p-top-department__background {
position:absolute;
inset:-3.2rem 0 -14.8rem;
background:#fff;
z-index:-1}
.p-top-department__background:before,.p-top-department__background:after {
position:absolute;
display:block;
content:"";
background:#fff;
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:100% auto;
mask-size:100% auto;
z-index:1}
.p-top-department__background:before {
inset:0 0 auto;
aspect-ratio:410/81;
-webkit-mask-image:url(../imgs/top/background_top.svg);
mask-image:url(../imgs/top/background_top.svg);
-webkit-mask-position:center top;
mask-position:center top}
.p-top-department__background:after {
inset:auto 0 -0.1rem;
aspect-ratio:410/97;
-webkit-mask-image:url(../imgs/top/background_bottom.svg);
mask-image:url(../imgs/top/background_bottom.svg);
-webkit-mask-position:center bottom;
mask-position:center bottom}
.p-top-department__backgroundBody {
position:absolute;
inset:0;
background:url(../imgs/top/department_dots.webp),rgba(255,255,0,.2);
background-repeat:repeat;
background-size:42rem auto}
.p-top-department__backgroundBody:before {
position:absolute;
inset:0;
display:block;
content:"";
background:url(../imgs/top/background_texture.webp);
background-repeat:repeat-y;
background-size:100% auto;
mix-blend-mode:overlay;
opacity:.8}
.p-top-department__head {
position:relative;
padding-top:15.4rem}
.p-top-department__illust {
position:absolute;
inset:0 0 auto;
width:32.8rem;
margin:0 auto;
z-index:-1;
opacity:0;
scale:.7}
.p-top-department__title {
display:grid;
place-items:center}
.p-top-department__title .en {
width:35.4rem;
margin:0 0 0 .1rem}
.p-top-department__title .ja {
margin:1rem .5rem 0 0}
.p-top-department__list {
padding-bottom:.2rem;
margin-top:3.3rem}
.p-top-department__list .department {
position:relative;
font-feature-settings:"palt" on}
.p-top-department__list .department:nth-child(odd) .department__head {
margin-left:auto}
.p-top-department__list .department:not(:first-child) {
margin-top:4rem}
.p-top-department__list .department__head {
position:relative;
display:flex;
flex-direction:column;
align-items:center;
width:28rem;
aspect-ratio:1/1;
box-sizing:border-box;
padding:3rem;
margin:0 -1rem;
opacity:0;
scale:.5}
.p-top-department__list .department__head:before {
position:absolute;
inset:0;
display:block;
content:"";
border:2px solid currentColor;
border-radius:50%;
z-index:-1}
.p-top-department__list .department__icon {
display:flex;
align-items:center;
justify-content:center;
width:4rem;
aspect-ratio:1/1;
background:currentColor;
border-radius:50%}
.p-top-department__list .department__icon .icon {
fill:#fff}
.p-top-department__list .department__post {
font-size:1.2rem;
font-weight:700;
margin-top:.2rem}
.p-top-department__list .department__name {
font-size:3rem;
font-weight:800;
line-height:1;
margin-top:.3rem}
.p-top-department__list .department__name .suffix {
font-size:1.2rem;
margin-left:.3rem}
.p-top-department__list .department__lead {
width:min(100%,18rem);
font-size:1.2rem;
line-height:1.834;
color:#767688;
margin-top:1.3rem}
.p-top-department__list .department__img {
position:absolute;
opacity:0;
scale:.9}
.p-top-department__list .department__body {
position:relative;
line-height:1.786;
box-sizing:border-box;
z-index:2;
margin:0 -3rem;
opacity:0;
scale:.7;
transform-origin:center top}
.p-top-department__list .department__body:before,.p-top-department__list .department__body:after {
position:absolute;
display:block;
content:"";
background:currentColor;
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:100% auto;
mask-size:100% auto;
z-index:-1}
.p-top-department__list .department__body:before {
inset:0 0 auto;
height:9rem;
-webkit-mask-image:url(../imgs/top/department_top.svg);
mask-image:url(../imgs/top/department_top.svg);
-webkit-mask-position:center top;
mask-position:center top}
.p-top-department__list .department__body:after {
inset:auto 0 0;
height:8.6rem;
-webkit-mask-image:url(../imgs/top/department_bottom.svg);
mask-image:url(../imgs/top/department_bottom.svg);
-webkit-mask-position:center bottom;
mask-position:center bottom}
.p-top-department__list .department__inner {
position:relative}
.p-top-department__list .department__inner:before {
position:absolute;
inset:8.9rem 0 8.2rem;
display:block;
content:"";
background:currentColor;
z-index:-1}
.p-top-department__list .department__text {
color:#fff}
.p-top-department__list .department.--visual {
color:#cc2525}
.p-top-department__list .department.--visual .department__head:before {
background:#feeced}
.p-top-department__list .department.--visual .department__icon .icon {
width:2.7rem}
.p-top-department__list .department.--visual .department__img {
top:4.1rem;
left:-3.7rem;
width:28.2rem;
transform-origin:left bottom}
.p-top-department__list .department.--visual .department__body {
margin-top:-0.5rem}
.p-top-department__list .department.--visual .department__inner {
padding:6.9rem 4.5rem 4.3rem}
.p-top-department__list .department.--picture {
color:#2639a6}
.p-top-department__list .department.--picture .department__head:before {
background:#e9f0fd}
.p-top-department__list .department.--picture .department__icon .icon {
width:2.6rem;
margin-bottom:.2rem}
.p-top-department__list .department.--picture .department__img {
top:2.9rem;
right:-3.4rem;
width:43.5rem;
transform-origin:right bottom}
.p-top-department__list .department.--picture .department__body {
margin-top:-1.4rem}
.p-top-department__list .department.--picture .department__body:before {
transform:scaleX(-1)}
.p-top-department__list .department.--picture .department__inner {
padding:8.1rem 4.5rem 5rem}
.p-top-department__list .department.--building {
color:#139a39}
.p-top-department__list .department.--building .department__head:before {
background:#e7f5eb}
.p-top-department__list .department.--building .department__icon .icon {
width:2.6rem}
.p-top-department__list .department.--building .department__img {
top:3.7rem;
left:-4.1rem;
width:34.7rem;
transform-origin:left bottom}
.p-top-department__list .department.--building .department__body {
margin-top:-1.1rem}
.p-top-department__list .department.--building .department__inner {
padding:8.1rem 4.5rem 4.8rem}
.p-top-department__list .department.is-visible .department__head {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s;
opacity:1;
scale:1}
.p-top-department__list .department.is-visible .department__img {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-department__list .department.is-visible .department__body {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .4s;
opacity:1;
scale:1}
.p-top-department.is-visible .p-top-department__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-department.is-visible .p-top-department__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-department.is-visible .p-top-department__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-flow {
margin-top:10.5rem;
scroll-margin-top:7.5rem}
.p-top-flow__head {
position:relative;
padding-top:16rem}
.p-top-flow__illust {
position:absolute;
opacity:0;
scale:.7}
.p-top-flow__illust.illust-1 {
top:0;
left:-0.3rem;
width:35.3rem;
z-index:-1}
.p-top-flow__illust.illust-2 {
bottom:-12.6rem;
left:-2.6rem;
width:16.4rem;
transform-origin:left}
.p-top-flow__title {
display:grid;
place-items:center}
.p-top-flow__title .en {
width:18.1rem;
margin-left:-0.3rem;
opacity:0;
scale:0}
.p-top-flow__title .ja {
margin:.9rem 1rem 0 0;
opacity:0;
scale:0}
.p-top-flow__list {
margin-top:3.4rem}
.p-top-flow__list .flow {
display:grid;
grid-template-columns:15rem 1fr;
gap:0 1rem}
.p-top-flow__list .flow__time {
position:relative;
top:.1rem;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:2rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:600;
letter-spacing:.02em;
line-height:1;
color:#ed6c00;
margin-left:auto;
opacity:0;
scale:0}
.p-top-flow__list .flow__img {
margin-top:.8rem;
opacity:0;
scale:.7}
.p-top-flow__list .flow__body {
position:relative;
width:100%}
.p-top-flow__list .flow__body:before {
position:absolute;
top:0;
left:.9rem;
display:block;
content:"";
width:2px;
height:100%;
background:#e3e5f3;
transform:scaleY(0);
transform-origin:center top}
.p-top-flow__list .flow__point {
position:relative;
display:block}
.p-top-flow__list .flow__point .circle {
position:relative;
display:block;
width:2rem;
aspect-ratio:1/1;
background:#ed6c00;
border-radius:50%;
scale:0}
.p-top-flow__list .flow__point .circle:before {
position:absolute;
inset:.4rem;
display:block;
content:"";
border:2px solid #fff;
border-radius:50%}
.p-top-flow__list .flow__point:before {
position:absolute;
inset:0;
display:block;
content:"";
height:2px;
background:#ed6c00;
margin:auto 0;
transform:scaleX(0);
transform-origin:left center}
.p-top-flow__list .flow__title {
font-size:1.6rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1.1875;
padding:0 0 0 3rem;
margin-top:.4rem;
opacity:0}
.p-top-flow__list .flow__text {
font-size:1.2rem;
font-feature-settings:"palt" on;
line-height:1.417;
color:#767688;
padding:0 0 0 3rem;
margin-top:.8rem;
opacity:0}
.p-top-flow__list .flow__illust {
position:relative;
opacity:0;
scale:.8}
.p-top-flow__list .flow__illust.illust-1 {
width:8.9rem;
margin:-0.7rem .6rem 0 auto}
.p-top-flow__list .flow__illust.illust-2 {
width:8.7rem;
margin:1.3rem 0 0 auto}
.p-top-flow__list .flow:first-child .flow__body {
padding-bottom:6.8rem}
.p-top-flow__list .flow:nth-child(2) .flow__body {
padding-bottom:.5rem}
.p-top-flow__list .flow:nth-child(3) .flow__body {
padding-bottom:1.5rem}
.p-top-flow__list .flow:nth-child(4) .flow__body {
padding-bottom:6.6rem}
.p-top-flow__list .flow:nth-child(5) .flow__body {
padding-bottom:.5rem}
.p-top-flow__list .flow:last-child .flow__body {
display:grid;
align-items:center;
grid-template-columns:8rem 1fr;
gap:0 1rem}
.p-top-flow__list .flow:last-child .flow__title {
padding-left:0;
margin-top:0}
.p-top-flow__list .flow.is-visible .flow__time {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-flow__list .flow.is-visible .flow__img {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-flow__list .flow.is-visible .flow__body:before {
transition:transform .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transform:scaleY(1)}
.p-top-flow__list .flow.is-visible .flow__point .circle {
transition:scale .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
scale:1}
.p-top-flow__list .flow.is-visible .flow__point:before {
transition:transform .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transform:scaleX(1);
will-change:transform}
.p-top-flow__list .flow.is-visible .flow__title,.p-top-flow__list .flow.is-visible .flow__text {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s;
opacity:1}
.p-top-flow__list .flow.is-visible .flow__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .4s;
opacity:1;
scale:1}
.p-top-flow.is-visible .p-top-flow__illust {
opacity:1;
scale:1}
.p-top-flow.is-visible .p-top-flow__illust.illust-1 {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s}
.p-top-flow.is-visible .p-top-flow__illust.illust-2 {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .4s}
.p-top-flow.is-visible .p-top-flow__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-flow.is-visible .p-top-flow__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-voice {
margin-top:10.2rem;
scroll-margin-top:8.2rem}
.p-top-voice__head {
position:relative}
.p-top-voice__title {
display:grid;
place-items:end}
.p-top-voice__title .en {
width:18.9rem;
margin-right:-0.4rem}
.p-top-voice__title .ja {
margin-top:.9rem}
.p-top-voice__illust {
position:absolute;
top:1.4rem;
left:-2rem;
width:28.4rem;
z-index:-1;
opacity:0;
scale:.7;
transform-origin:center bottom}
.p-top-voice__list {
position:relative;
margin:.8rem -3rem 0}
.p-top-voice__list[data-color=red] .p-top-voice__backgroundBody {
background:#cc2525}
.p-top-voice__list[data-color=blue] .p-top-voice__backgroundBody {
background:#2639a6}
.p-top-voice__list[data-color=green] .p-top-voice__backgroundBody {
background:#139a39}
.p-top-voice__background {
position:relative;
z-index:0;
-webkit-mask-image:url(../imgs/top/background_top.svg),linear-gradient(#000, #000);
mask-image:url(../imgs/top/background_top.svg),linear-gradient(#000, #000);
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-position:center top -0.1rem,0 0;
mask-position:center top -0.1rem,0 0;
-webkit-mask-size:100% auto,100% auto;
mask-size:100% auto,100% auto;
-webkit-mask-composite:xor;
mask-composite:exclude}
.p-top-voice__background:after {
position:absolute;
inset:auto 0 -0.1rem;
display:block;
content:"";
background:#fff;
aspect-ratio:410/97;
-webkit-mask-image:url(../imgs/top/background_bottom.svg);
mask-image:url(../imgs/top/background_bottom.svg);
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-position:center bottom -0.1rem;
mask-position:center bottom -0.1rem;
-webkit-mask-size:100% auto;
mask-size:100% auto;
z-index:2}
.p-top-voice__backgroundBody {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:0}
.p-top-voice__backgroundBody:before {
position:absolute;
inset:0;
display:block;
content:"";
background:url(../imgs/top/voice_dots.webp);
background-repeat:repeat;
background-size:42rem auto;
mix-blend-mode:multiply}
.p-top-voice__backgroundBody:after {
position:absolute;
inset:0;
display:block;
content:"";
background:url(../imgs/top/background_texture.webp);
background-repeat:repeat-y;
background-size:100% auto;
mix-blend-mode:overlay;
opacity:.4}
.p-top-voice__comments {
pointer-events:none;
opacity:0;
translate:0 2rem}
.p-top-voice__comments .comment {
position:relative;
padding:10.8rem 0 28.8rem;
overflow:hidden}
.p-top-voice__comments .comment__body {
transition:all .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
transition-property:opacity,translate;
position:relative;
padding:10.6rem 0 14.7rem;
opacity:0;
translate:0 6rem}
.p-top-voice__comments .comment__body:before,.p-top-voice__comments .comment__body:after {
position:absolute;
display:block;
content:"";
background-repeat:no-repeat;
background-size:contain;
z-index:-1}
.p-top-voice__comments .comment__body:before {
inset:0 0 auto;
height:10.7rem}
.p-top-voice__comments .comment__body:after {
inset:auto 0 0;
height:15.9rem;
filter:drop-shadow(0.5rem 0.5rem 0 rgba(69, 54, 155, 0.3))}
.p-top-voice__comments .comment__inner {
position:relative;
padding:0 4.5rem}
.p-top-voice__comments .comment__inner:before {
position:absolute;
inset:.8rem 0 .9rem;
display:block;
content:"";
z-index:-1}
.p-top-voice__comments .comment__text {
font-size:1.6rem;
font-feature-settings:"pwid" on,"palt" on;
letter-spacing:.05em;
line-height:1.8125;
color:#281c79;
margin:-0.8rem 0 -0.9rem}
.p-top-voice__comments .comment__details {
display:flex;
gap:0 1.2rem;
font-feature-settings:"palt" on;
margin-top:2.4rem}
.p-top-voice__comments .comment__label {
display:flex;
align-items:center;
gap:0 .3rem}
.p-top-voice__comments .comment__icon {
display:flex;
align-items:center;
justify-content:center;
width:2.4rem;
aspect-ratio:1/1;
background:currentColor;
border-radius:50%}
.p-top-voice__comments .comment__icon .icon {
fill:#fff}
.p-top-voice__comments .comment__post {
font-size:1.2rem;
font-weight:700;
line-height:1.1667}
.p-top-voice__comments .comment__name {
font-size:2rem;
font-weight:900;
line-height:1.2}
.p-top-voice__comments .comment__name .suffix {
font-size:1.4rem;
font-weight:700;
margin-left:.5rem}
.p-top-voice__comments .comment[data-color=red] {
color:#cc2525}
.p-top-voice__comments .comment[data-color=red] .comment__body:before {
background-image:url(../imgs/top/voice_red_top.webp)}
.p-top-voice__comments .comment[data-color=red] .comment__body:after {
background-image:url(../imgs/top/voice_red_bottom.webp)}
.p-top-voice__comments .comment[data-color=red] .comment__inner:before {
background:#feeced}
.p-top-voice__comments .comment[data-color=blue] {
color:#2639a6}
.p-top-voice__comments .comment[data-color=blue] .comment__body:before {
background-image:url(../imgs/top/voice_blue_top.webp)}
.p-top-voice__comments .comment[data-color=blue] .comment__body:after {
background-image:url(../imgs/top/voice_blue_bottom.webp)}
.p-top-voice__comments .comment[data-color=blue] .comment__inner:before {
background:#e9f0fd}
.p-top-voice__comments .comment[data-color=blue] .comment__icon .icon {
width:1.4rem}
.p-top-voice__comments .comment[data-color=green] {
color:#139a39}
.p-top-voice__comments .comment[data-color=green] .comment__body:before {
background-image:url(../imgs/top/voice_green_top.webp)}
.p-top-voice__comments .comment[data-color=green] .comment__body:after {
background-image:url(../imgs/top/voice_green_bottom.webp)}
.p-top-voice__comments .comment[data-color=green] .comment__inner:before {
background:#e7f5eb}
.p-top-voice__comments .swiper-slide-active .comment__body {
opacity:1;
translate:0 0}
.p-top-voice__persons {
position:absolute;
inset:0 13.5rem;
margin:0 auto;
z-index:2;
opacity:0;
translate:0 2rem}
.p-top-voice__persons .person {
display:flex;
align-items:flex-end}
.p-top-voice__persons .person__img {
transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
transition-property:scale,translate;
position:relative;
margin:auto -8rem -29.4rem;
scale:.4;
translate:0 -6rem}
.p-top-voice__persons .swiper-slide-active,.p-top-voice__persons .swiper-slide-duplicate-active {
z-index:2}
.p-top-voice__persons .swiper-slide-active .person__img,.p-top-voice__persons .swiper-slide-duplicate-active .person__img {
transition-timing-function:cubic-bezier(0.175, 0.885, 0.32, 1.275);
scale:1;
translate:0 0}
.p-top-voice__button {
transition:color .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s;
position:absolute;
bottom:17.2rem;
display:flex;
align-items:center;
justify-content:center;
width:4rem;
aspect-ratio:1/1;
color:#969be0;
border:none;
border-radius:50%;
background:rgba(0,0,0,0);
padding:0;
margin:0;
z-index:2;
opacity:0}
.p-top-voice__button:before {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:0;
display:block;
content:"";
background:#fff;
border:2px solid #969be0;
border-radius:50%;
z-index:-1}
.p-top-voice__button.prev {
left:1rem}
.p-top-voice__button.next {
right:1rem}
.p-top-voice__button .icon {
width:1.8rem}
@media(hover) {
.p-top-voice__button:hover {
color:#fff}
.p-top-voice__button:hover:before {
background:#969be0}
}
.p-top-voice.is-visible .p-top-voice__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s}
.p-top-voice.is-visible .p-top-voice__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s}
.p-top-voice.is-visible .p-top-voice__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s;
opacity:1;
scale:1}
.p-top-voice.is-visible .p-top-voice__comments {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,translate .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .4s;
opacity:1;
translate:0 0}
.p-top-voice.is-visible .p-top-voice__persons {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,translate .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .4s;
opacity:1;
translate:0 0}
.p-top-voice.is-visible .p-top-voice__button {
opacity:1}
@media screen and (max-width: 849px) {
.p-top-voice__button.prev {
left:2rem}
.p-top-voice__button.next {
right:2rem}
}
.p-top-movie {
margin-top:-1.1rem}
.p-top-movie__head {
position:relative;
padding-bottom:2.2rem}
.p-top-movie__illust {
position:absolute;
top:-2.2rem;
left:2.4rem;
width:13.2rem;
opacity:0;
scale:0;
transform-origin:center bottom}
.p-top-movie__title {
text-align:right}
.p-top-movie__title .en {
position:relative;
top:-0.4rem;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:3.8rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1;
margin-left:auto}
.p-top-movie__title .ja {
font-size:1.4rem;
font-weight:700;
line-height:1;
margin:-0.3rem 0 0 auto}
.p-top-movie__movie {
position:relative;
overflow:hidden;
border-radius:1rem;
opacity:0;
scale:.9}
.p-top-movie__movie .thumbnail {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:relative;
z-index:1;
cursor:pointer}
.p-top-movie__movie .thumbnail:before {
position:absolute;
inset:0;
display:block;
content:"";
width:6rem;
aspect-ratio:1/1;
background:url(../imgs/top/movie_play.webp) no-repeat;
background-size:contain;
margin:auto}
.p-top-movie__movie .youtube {
position:absolute;
inset:0;
width:100%;
height:100%}
.p-top-movie__movie.is-play .thumbnail {
opacity:0;
pointer-events:none}
.p-top-movie.is-visible .p-top-movie__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s}
.p-top-movie.is-visible .p-top-movie__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s}
.p-top-movie.is-visible .p-top-movie__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s;
opacity:1;
scale:1}
.p-top-movie.is-visible .p-top-movie__movie {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-faq {
margin-top:9.4rem;
scroll-margin-top:6.4rem}
.p-top-faq__head {
position:relative;
padding-top:9.8rem}
.p-top-faq__illust {
position:absolute;
top:0;
left:1rem;
width:33rem;
z-index:-1;
opacity:0;
scale:.7}
.p-top-faq__title {
display:grid;
place-items:center}
.p-top-faq__title .en {
width:12.8rem;
margin-left:.7rem}
.p-top-faq__lead {
font-feature-settings:"palt" on;
line-height:1.786;
margin:2.8rem 0 -0.8rem;
opacity:0}
.p-top-faq__items {
margin-top:2.4rem}
.p-top-faq__items .item {
position:relative;
opacity:0;
scale:.8}
.p-top-faq__items .item:not(:first-child) {
margin-top:1.6rem}
.p-top-faq__items .item:before {
transition:border-color .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:0;
display:block;
content:"";
border:2px solid #e3e5f3;
border-radius:1rem}
.p-top-faq__items .item__head {
position:relative;
padding:1.6rem 5rem 1.6rem 2rem;
cursor:pointer}
.p-top-faq__items .item__head:before {
position:absolute;
inset:0 0 -0.1rem;
display:block;
content:"";
background:#f4f5f8;
border-bottom:1px solid #e3e5f3;
z-index:-1;
opacity:0}
.p-top-faq__items .item__title {
transition:transform .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
display:flex;
align-items:flex-start;
gap:0 .8rem;
font-size:1.6rem;
font-weight:700;
font-feature-settings:"palt" on;
line-height:1.625}
.p-top-faq__items .item__title:before {
flex-shrink:0;
display:flex;
align-items:center;
justify-content:center;
width:2rem;
aspect-ratio:1/1;
content:"Q";
font-size:1.4rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1;
color:#fff;

border-radius:50%;
box-sizing:border-box;
padding-bottom:.2rem;
margin-top:.4rem}
.p-top-faq__items .item__toggle {
transition:right .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
top:50%;
right:1.6rem;
width:2.2rem;
aspect-ratio:1/1;
box-sizing:border-box;
border:1px solid #a4a6ad;
border-radius:50%;
translate:0 -50%}
.p-top-faq__items .item__toggle:before,.p-top-faq__items .item__toggle:after {
position:absolute;
inset:0;
display:block;
content:"";
width:1.4rem;
height:2px;
background:#a4a6ad;
margin:auto}
.p-top-faq__items .item__toggle:after {
rotate:90deg}
.p-top-faq__items .item__body {
transition:height .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
height:0;
overflow:hidden}
.p-top-faq__items .item__inner {
padding:2.8rem 2.2rem 2.7rem}
.p-top-faq__items .item__text {
display:flex;
align-items:flex-start;
gap:0 .8rem;
font-feature-settings:"palt" on;
line-height:1.572;
color:#767688}
.p-top-faq__items .item__text:before {
flex-shrink:0;
display:flex;
align-items:center;
justify-content:center;
width:2rem;
aspect-ratio:1/1;
content:"A";
font-size:1.4rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:800;
line-height:1;
color:#fff;
background:#ed6c00;
border-radius:50%;
box-sizing:border-box}
@media(hover) {
.p-top-faq__items .item:hover:before {
border-color:#281c79}
}
.p-top-faq__items .item.is-open:before {
border-color:#281c79}
.p-top-faq__items .item.is-open .item__head:before {
opacity:1}
.p-top-faq__items .item.is-open .item__title {
transform:translateX(0.2rem)}
.p-top-faq__items .item.is-open .item__toggle {
right:1.8rem}
.p-top-faq__items .item.is-open .item__toggle:after {
opacity:0}
.p-top-faq__items .item.is-open .item__body {
height:var(--height)}
.p-top-faq.is-visible .p-top-faq__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-faq.is-visible .p-top-faq__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-faq.is-visible .p-top-faq__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-faq.is-visible .p-top-faq__lead {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s;
opacity:1}
.p-top-faq.is-visible .p-top-faq__items .item {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .4s;
opacity:1;
scale:1}
.p-top-information {
position:relative;
overflow-x:clip;
margin-top:9.6rem;
scroll-margin-top:6.6rem}
.p-top-information__background {
position:absolute;
inset:20rem 0 -5.3rem;
background:#fff;
z-index:-1}
.p-top-information__background:before,.p-top-information__background:after {
position:absolute;
display:block;
content:"";
background:#fff;
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-size:100% auto;
mask-size:100% auto;
z-index:1;
transform:scaleX(-1)}
.p-top-information__background:before {
inset:-0.1rem 0 auto;
aspect-ratio:410/81;
-webkit-mask-image:url(../imgs/top/background_top.svg);
mask-image:url(../imgs/top/background_top.svg);
-webkit-mask-position:center top;
mask-position:center top}
.p-top-information__background:after {
inset:auto 0 -0.1rem;
aspect-ratio:410/97;
-webkit-mask-image:url(../imgs/top/background_bottom.svg);
mask-image:url(../imgs/top/background_bottom.svg);
-webkit-mask-position:center bottom;
mask-position:center bottom}
.p-top-information__backgroundBody {
position:absolute;
inset:0;
background:url(../imgs/top/information_dots.webp),#2abaef;
background-repeat:repeat;
background-size:42rem auto}
.p-top-information__backgroundBody:before {
position:absolute;
inset:0;
display:block;
content:"";
background:url(../imgs/top/background_texture.webp);
background-repeat:repeat-y;
background-size:100% auto;
mix-blend-mode:overlay;
opacity:.4}
.p-top-information__head {
position:relative;
padding-top:13.5rem}
.p-top-information__illust {
position:absolute;
top:0;
left:-0.9rem;
width:30.9rem;
z-index:-1;
opacity:0;
scale:.7}
.p-top-information__title {
display:grid;
place-items:center;
margin-left:-0.4rem}
.p-top-information__title .en {
width:36rem;
aspect-ratio:360/46}
.p-top-information__title .ja {
margin:.9rem .2rem 0 0}
.p-top-information__lead {
font-weight:700;
font-feature-settings:"palt" on;
line-height:1.786;
color:#fff;
margin:6.8rem 0 -0.8rem;
opacity:0}
.p-top-information__list {
display:grid;
gap:1.6rem 0;
margin-top:4rem}
.p-top-information__list li {
opacity:0;
scale:.7}
.p-top-information__list li.is-visible {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-information__list .item {
position:relative;
display:block;
font-feature-settings:"palt" on;
text-decoration:none;
padding:2rem}
.p-top-information__list .item:before {
position:absolute;
inset:0;
display:block;
content:"";
background:#fff;
border:2px solid #5960c1;
border-radius:1rem;
box-shadow:.5rem .5rem 0 0 rgba(69,54,155,.3);
z-index:-1}
.p-top-information__list .item__label {
display:flex;
align-items:center;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:1.2rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:700;
line-height:1;
color:#5960c1;
border:1px solid currentColor;
border-radius:2rem;
padding:.2rem .9rem .1rem}
.p-top-information__list .item__label .head {
position:relative;
top:.1rem}
.p-top-information__list .item__label .number {
position:relative;
font-size:1.8rem;
margin-left:.3rem}
.p-top-information__list .item__title {
font-size:1.8rem;
font-weight:800;
line-height:1.389;
border-bottom:1px solid #5960c1;
padding-bottom:.2rem;
margin-top:1.1rem}
.p-top-information__list .item__text {
font-size:1.4rem;
line-height:1.786;
color:#767688;
margin:1rem 0 -0.8rem}
.p-top-information__list .item__icon {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
display:flex;
align-items:center;
justify-content:center;
width:2.2rem;
aspect-ratio:1/1;
color:#5960c1;
border:1px solid currentColor;
border-radius:50%;
box-sizing:border-box;
margin:1.6rem 0 0 auto}
.p-top-information__list .item__icon .icon {
transition:fill .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
@media(hover) {
.p-top-information__list .item:hover .item__icon {
background:currentColor}
.p-top-information__list .item:hover .item__icon .icon {
fill:#fff}
}
.p-top-information.is-visible .p-top-information__illust {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
opacity:1;
scale:1}
.p-top-information.is-visible .p-top-information__title .en {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-information.is-visible .p-top-information__title .ja {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s}
.p-top-information.is-visible .p-top-information__lead {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .4s;
opacity:1}
.p-event__categories {
display:flex;
flex-wrap:wrap;
gap:.8rem 1rem;
margin:3.4rem -0.5rem 0}
.p-event__categories .category {
display:flex;
align-items:center;
gap:0 .3rem;
font-size:1.4rem;
font-weight:700;
font-feature-settings:"palt" on;
letter-spacing:-0.03em;
line-height:1;
border-radius:3rem;
text-decoration:none;
padding:.3rem 1.2rem .3rem .4rem}
.p-event__categories .category__icon {
flex-shrink:0;
display:grid;
place-items:center;
width:2.4rem;
aspect-ratio:1/1;
background:currentColor;
border-radius:50%}
.p-event__categories .category__icon .icon {
fill:#fff}
.p-event__categories .category.--common {
color:#ed6c00;
background:#fff1e5}
.p-event__categories .category.--common .icon {
width:1.8rem}
.p-event__categories .category.--visual {
color:#cc2525;
background:#feeced}
.p-event__categories .category.--building {
color:#139a39;
background:rgba(19,154,57,.1)}
.p-event__categories .category.--building .icon {
width:1.5rem}
.p-event__categories .category.--picture {
color:#2639a6;
background:#e9f0fd}
.p-event__title {
font-size:2.8rem;
font-weight:900;
font-feature-settings:"palt" on;
letter-spacing:.03em;
line-height:1.393;
border-bottom:2px solid #e3e5f3;
padding-bottom:.7rem;
margin-top:3.9rem}
.p-event__list {
margin-top:3.2rem}
.p-event__more {
display:grid;
place-items:center;
margin-top:3rem}
.p-event__more .c-button {
gap:0 .4rem;
font-size:1.2rem;
color:#5960c1;
padding:.9rem}
.p-event__more .c-button:before {
border-color:#969be0}
@media(hover) {
.p-event__more .c-button:hover {
color:#fff;
background:#969be0}
}
.p-event__foot {
display:grid;
place-items:center;
border-top:2px solid #e3e5f3;
padding-top:2.4rem;
margin-top:5rem}
.p-eventDetail {
padding-top:7.4rem}
.p-eventDetail__wrapper {
max-width:41rem;
box-sizing:border-box;
padding-right:3rem;
padding-left:3rem;
margin-right:auto;
margin-left:auto}
@media screen and (max-width: 849px) {
.p-eventDetail__wrapper {
padding-right:2rem;
padding-left:2rem}
}
.p-eventDetail__header {
border-bottom:2px solid #e3e5f3;
padding-bottom:1.6rem;
margin-bottom:4rem}
.p-eventDetail__categories {
margin-bottom:2.4rem}
.p-eventDetail__categories .category {
display:flex;
align-items:center;
gap:0 .3rem;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:1.4rem;
font-weight:700;
font-feature-settings:"palt" on;
letter-spacing:-0.03em;
line-height:1;
background:#fff;
border-radius:10rem;
text-decoration:none;
padding:.3rem 1.2rem .3rem .4rem}
.p-eventDetail__categories .category__icon {
flex-shrink:0;
display:flex;
align-items:center;
justify-content:center;
width:2.4rem;
aspect-ratio:1/1;
border-radius:50%;
background:currentColor}
.p-eventDetail__categories .category__icon .icon {
fill:#fff}
.p-eventDetail__categories .category__icon .icon--common {
width:1.8rem}
.p-eventDetail__title {
font-size:2.4rem;
font-weight:800;
font-feature-settings:"palt" on;
letter-spacing:.03em;
line-height:1.4167;
margin:-0.8rem 0}
.p-eventDetail__thumbnail {
position:relative;
aspect-ratio:350/230;
overflow:hidden}
.p-eventDetail__thumbnail:before {
position:absolute;
inset:0;
display:block;
content:"";
border:3px solid}
.p-eventDetail__thumbnail img {
height:100%;
-o-object-fit:cover;
object-fit:cover}
.p-eventDetail__dates {
display:flex;
align-items:flex-start;
gap:0 1rem;
background:#e3e5f3;
border-radius:1rem;
padding:2rem 1rem;
margin-top:4rem}
.p-eventDetail__dates dt {
flex-shrink:0;
font-size:1.2rem;
font-weight:700;
line-height:1;
color:#fff;
background:#5960c1;
border-radius:2rem;
padding:.3rem 1rem .4rem}
.p-eventDetail__dates dd {
display:flex;
flex-wrap:wrap;
gap:.9rem 1rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:600;
line-height:1;
margin-top:.2rem}
.p-eventDetail__dates dd>p {
position:relative;
display:flex;
align-items:center;
font-size:1.5rem;
text-decoration:none;
padding-left:1rem}
.p-eventDetail__dates dd>p:before {
position:absolute;
top:.5rem;
left:0;
display:block;
content:"";
width:.5rem;
aspect-ratio:1/1;
border-radius:50%;
background:#5960c1}
.p-eventDetail__dates dd>p:after {
position:absolute;
inset:auto 0 0 1rem;
display:block;
content:"";
height:1px;
background:#5960c1}
@media(hover) {
.p-eventDetail__dates dd>p.is-animation:after {
-webkit-animation:eventLineText .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:eventLineText .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
}
.p-eventDetail__dates dd .sep {
display:block;
font-size:1.1rem;
font-weight:700;
letter-spacing:.03em;
margin:0 .2rem}
.p-eventDetail__dates dd .week {
display:block;
min-width:2.8rem;
font-size:.9rem;
font-weight:600;
color:#fff;
text-align:center;

border-radius:1rem;
box-sizing:border-box;
padding:.2rem .3rem .1rem;
margin:0 0 .3rem .3rem}
.p-eventDetail__body {
--fontsize: 1rem;
font-size:calc(var(--fontsize)*1.4);
font-feature-settings:"palt" on;
letter-spacing:0;
line-height:1.786;
color:#281c79;
margin-top:4rem}
.p-eventDetail__body h2 {
position:relative;
font-size:calc(var(--fontsize)*1.8);
font-weight:700;
font-feature-settings:"palt",on;
letter-spacing:.03em;
line-height:1.389;
color:#ed6c00;
box-sizing:border-box;
padding:0 0 0 calc(var(--fontsize)*1.5);
margin:calc(var(--fontsize)*4) 0 calc(var(--fontsize)*2.4)}
.p-eventDetail__body h2:before {
position:absolute;
inset:0 auto 0 0;
display:block;
content:"";
width:calc(var(--fontsize)*.5);
background:#ed6c00}
.p-eventDetail__body h2+p {
margin-top:calc(var(--fontsize)*-0.6)}
.p-eventDetail__body h3 {
position:relative;
font-size:calc(var(--fontsize)*1.6);
font-weight:700;
font-feature-settings:"palt",on;
letter-spacing:0;
line-height:1.375;
padding:0 0 0 calc(var(--fontsize)*1.7);
margin:calc(var(--fontsize)*3.5) 0 calc(var(--fontsize)*1.9)}
.p-eventDetail__body h3:before {
position:absolute;
top:calc(var(--fontsize)*.6);
left:calc(var(--fontsize)*.1);
display:block;
content:"";
width:calc(var(--fontsize)*1);
aspect-ratio:1/1;
background:#969be0;
border-radius:50%}
.p-eventDetail__body h3+p {
margin-top:calc(var(--fontsize)*-0.6)}
.p-eventDetail__body h3+.wp-block-table,.p-eventDetail__body h3+.wp-block-buttons {
margin-top:0}
.p-eventDetail__body p {
margin:calc(var(--fontsize)*1.8) 0 calc(var(--fontsize)*-0.8)}
.p-eventDetail__body p:first-child {
margin-top:calc(var(--fontsize)*-0.6)}
.p-eventDetail__body a {
word-break:break-all;
color:currentColor}
@media(hover) {
.p-eventDetail__body a:hover {
text-decoration:none}
}
.p-eventDetail__body figure figcaption {
font-size:calc(var(--fontsize)*1.2);
letter-spacing:0;
line-height:1.5;
text-align:left;
color:rgba(40,28,121,.6);
margin:calc(var(--fontsize)*1.8) 0 calc(var(--fontsize)*-0.8)}
.p-eventDetail__body .wp-block-image {
margin:calc(var(--fontsize)*2.4) 0 0}
.p-eventDetail__body .wp-block-image:first-child {
margin-top:0}
.p-eventDetail__body .wp-block-embed {
margin:calc(var(--fontsize)*2.4) 0 0}
.p-eventDetail__body .wp-block-embed:first-child {
margin-top:0}
.p-eventDetail__body .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper {
position:relative;
aspect-ratio:16/9}
.p-eventDetail__body .wp-block-embed.wp-embed-aspect-16-9 iframe {
position:absolute;
inset:0;
width:100%;
height:100%;
padding:0;
margin:0}
.p-eventDetail__body .wp-block-buttons {
margin:calc(var(--fontsize)*2.4) 0 0}
.p-eventDetail__body .wp-block-buttons:first-child {
margin-top:0}
.p-eventDetail__body .wp-block-button__link {
position:relative;
display:block;
width:-webkit-fit-content;
width:-moz-fit-content;
width:fit-content;
font-size:calc(var(--fontsize)*1.4);
font-weight:700;
letter-spacing:.05em;
line-height:1.5;
color:#fff;
text-decoration:none;
background:#5960c1;
border-radius:calc(var(--fontsize)*10);
box-sizing:border-box;
border:1px solid #5960c1;
padding:calc(var(--fontsize)*1.5) calc(var(--fontsize)*5.2) calc(var(--fontsize)*1.4) calc(var(--fontsize)*1.9)}
.p-eventDetail__body .wp-block-button__link:after {
position:absolute;
top:calc(var(--fontsize)*2);
right:calc(var(--fontsize)*2.1);
display:block;
content:"";
width:calc(var(--fontsize)*1.2);
aspect-ratio:1/1;
-webkit-mask-image:url("../imgs/common/icon_arw_r.svg");
mask-image:url("../imgs/common/icon_arw_r.svg");
-webkit-mask-repeat:no-repeat;
mask-repeat:no-repeat;
-webkit-mask-position:center;
mask-position:center;
-webkit-mask-size:contain;
mask-size:contain;
background:currentColor}
@media(hover) {
.p-eventDetail__body .wp-block-button__link:hover {
color:#5960c1;
background:rgba(0,0,0,0)}
}
.p-eventDetail__body .wp-block-button__link.is-animation:after {
-webkit-animation:arw_r .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
animation:arw_r .8s cubic-bezier(0.215, 0.61, 0.355, 1) 0s}
.p-eventDetail__body .has-text-align-right {
text-align:right}
.p-eventDetail__body .has-text-align-center {
text-align:center}
.p-eventDetail__body .is-content-justification-right {
display:flex;
justify-content:flex-end}
.p-eventDetail__body .is-content-justification-center {
display:flex;
justify-content:center}
.p-eventDetail__body .wp-block-table {
margin:calc(var(--fontsize)*2.4) 0 0}
.p-eventDetail__body .wp-block-table:first-child {
margin-top:0}
.p-eventDetail__body .wp-block-table table {
width:100%;
color:#281c79;
box-sizing:border-box;
border:1px solid #e3e5f3}
.p-eventDetail__body .wp-block-table table tr {
border-bottom:1px solid #e3e5f3}
.p-eventDetail__body .wp-block-table table tr:last-child {
border-bottom:none}
.p-eventDetail__body .wp-block-table table tr:last-child th,.p-eventDetail__body .wp-block-table table tr:last-child td {
padding-bottom:calc(var(--fontsize)*.8)}
.p-eventDetail__body .wp-block-table table th,.p-eventDetail__body .wp-block-table table td {
border:none;
box-sizing:border-box;
padding:calc(var(--fontsize)*1) calc(var(--fontsize)*2) calc(var(--fontsize)*.6)}
.p-eventDetail__body .wp-block-table table th:first-child,.p-eventDetail__body .wp-block-table table td:first-child {
padding:calc(var(--fontsize)*1) calc(var(--fontsize)*2) calc(var(--fontsize)*.6) calc(var(--fontsize)*1.9);
border-right:1px solid #e3e5f3}
.p-eventDetail__body .wp-block-table table.has-fixed-layout {
table-layout:fixed}
.p-eventDetail__body .wp-block-table.is-style-left-head td:first-child {
width:calc(var(--fontsize)*12);
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif;
font-weight:600;
background:#f8f8f8;
border-right:none;
padding:calc(var(--fontsize)*1) calc(var(--fontsize)*2) calc(var(--fontsize)*.6) calc(var(--fontsize)*1.9)}
.p-eventDetail__body .wp-block-gallery {
position:relative;
width:calc(var(--fontsize)*33);
margin:calc(var(--fontsize)*2.4) auto 0}
.p-eventDetail__body .wp-block-gallery:first-child {
margin-top:0}
.p-eventDetail__body .wp-block-gallery .wp-block-image {
margin-top:0}
.p-eventDetail__body .wp-block-gallery .wp-block-image img {
width:100%;
height:100%;
aspect-ratio:cover}
.p-eventDetail__body .wp-block-gallery .swiper-button-prev,.p-eventDetail__body .wp-block-gallery .swiper-button-next {
position:absolute;
top:calc(50% - 1.5rem);
display:flex;
align-items:center;
justify-content:center;
width:3rem;
aspect-ratio:1/1;
color:#fff;
background:#5960c1;
border:none;
border-radius:50%;
z-index:2;
transform:translateY(-50%);
overflow:hidden}
.p-eventDetail__body .wp-block-gallery .swiper-button-prev .icon,.p-eventDetail__body .wp-block-gallery .swiper-button-next .icon {
flex-shrink:0}
.p-eventDetail__body .wp-block-gallery .swiper-button-prev {
left:-1.5rem}
.p-eventDetail__body .wp-block-gallery .swiper-button-next {
right:-1.5rem}
.p-eventDetail__body .wp-block-gallery .swiper-pagination {
display:flex;
justify-content:center;
gap:0 .6rem;
margin-top:1.6rem}
.p-eventDetail__body .wp-block-gallery .swiper-pagination-bullet {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:relative;
display:block;
width:1.4rem;
aspect-ratio:1/1;
background:rgba(0,0,0,0);
border-radius:50%;
cursor:pointer}
.p-eventDetail__body .wp-block-gallery .swiper-pagination-bullet:before {
transition:background .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:absolute;
inset:.4rem;
display:block;
content:"";
border-radius:50%;
background:#e3e5f3}
.p-eventDetail__body .wp-block-gallery .swiper-pagination-bullet-active {
background:#5960c1}
.p-eventDetail__body .wp-block-gallery .swiper-pagination-bullet-active:before {
background:#fff}
.p-eventDetail__footer {
display:grid;
place-items:center;
border-top:2px solid #e3e5f3;
padding-top:2.4rem;
margin-top:4rem}
.p-eventDetail.--common .p-eventDetail__thumbnail:before {
border-color:#ed6c00}
.p-eventDetail.--common .p-eventDetail__categories .category {
color:#ed6c00;
background:#fff1e5}
.p-eventDetail.--visual .p-eventDetail__thumbnail:before {
border-color:#cc2525}
.p-eventDetail.--visual .p-eventDetail__categories .category {
color:#cc2525;
background:#feeced}
.p-eventDetail.--building .p-eventDetail__thumbnail:before {
border-color:#139a39}
.p-eventDetail.--building .p-eventDetail__categories .category {
color:#139a39;
background:rgba(19,154,57,.1)}
.p-eventDetail.--picture .p-eventDetail__thumbnail:before {
border-color:#2639a6}
.p-eventDetail.--picture .p-eventDetail__categories .category {
color:#2639a6;
background:#e9f0fd}
@media screen and (max-width: 849px) {
.p-eventDetail {
padding-top:12rem}
}
.p-join-us {
position:relative}
.p-join-us__illust {
position:absolute;
top:0;
right:0;
width:23.1rem;
z-index:-1}
.p-join-us__illust img {
opacity:0;
scale:0;
transform-origin:right}
html.is-loaded .p-join-us__illust img {
transition:opacity .4s cubic-bezier(0.215, 0.61, 0.355, 1) .2s,translate .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s,scale .4s cubic-bezier(0.175, 0.885, 0.32, 1.275) .2s;
opacity:1;
scale:1}
.p-join-us__lead {
font-feature-settings:"palt" on;
line-height:1.786;
margin:2.8rem 0 -0.8rem}
.p-join-us__remaining {
transition:transform .4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
position:fixed;
inset:auto 0 0;
display:flex;
align-items:center;
justify-content:center;
gap:0 .5rem;
font-weight:700;
line-height:1;
color:#fff;
background:rgba(40,28,121,.9);
padding:.9rem 0 .5rem;
transform:translateY(100%)}
.p-join-us__remaining.is-visible {
transform:translateY(0)}
.p-join-us__remaining.is-hidden {
transform:translateY(100%)}
.p-join-us__remaining .count {
font-size:2.4rem;
font-family:"alexandria","ryo-gothic-plusn","Hiragino Sans",Meiryo,sans-serif}
@media screen and (max-width: 849px) {
.p-join-us__illust {
top:4.9rem;
right:-0.8rem}
}
.pc-hidden {
display:none}
.pctb-hidden {
display:none}
@media only screen and (max-width: 1023px) {
.tb-hidden,.tbsp-hidden {
display:none}
.pc-hidden {
display:block}
br.pc-hidden {
display:inline-block}
}
@media only screen and (max-width: 849px) {
.sp-hidden {
display:none}
.tb-hidden,.pctb-hidden {
display:block}
br.tb-hidden,br.pctb-hidden {
display:inline-block}
}



}