@charset "utf-8";

/* ---------- TOP: KV ---------- */
#kv { background-color: var(--mc); aspect-ratio: 16 / 9; width: 100%; height: 100vh; /*max-height: 1080px;*/ overflow: hidden; position: relative; }
#kv .kv__area { pointer-events: none; }
#jpf_logo { vertical-align: baseline; margin-inline: 3%; /*background: url("../img/dammy_logo.jpg") top left no-repeat; background-size: 878px auto;*/ }
@media screen and (min-width: 961px) {
  #kv { min-height: 750px; }
  #kv .kv__area { position: absolute; bottom: 45%; }
  #jpf_logo { max-width: 77%; }
}
@media screen and (max-width: 960px) {
  #kv .kv__area {  position: absolute; bottom: 50%; }
}
@media screen and (max-width: 960px) and (orientation: landscape) {
  #kv { min-height: 750px; }
}
@media screen and (max-height: 667px) and (orientation: portrait) {
  #kv .kv__area { position: absolute; bottom: 65%; }
}
@media screen and (max-width: 960px) and (min-width: 481px) {
  .sp-w480 { display: none; }
}
#jpf_logo > p { display: inline-block; white-space: nowrap; margin: 1% 0; }
#jpf_logo span { display: inline-block; vertical-align: baseline; position: relative; }
#jpf_logo span.dot { display: block; width: calc((17 / var(--width02)) * 100vw); height: calc((17 / var(--width02)) * 100vw); max-width: 17px; max-height: 17px; background-color: #fff; border-radius: 50%; position: absolute; }

#jpf_logo span.j { width: calc((100 / var(--width02)) * 100vw); height: calc((157 / var(--width02)) * 100vw); max-width: 100px; max-height: 157px; margin-right: min(calc((96 / var(--width02)) * 100vw), 96px); }
#jpf_logo span.dot.j_01 { top: 0; right: -1px; animation: j_01 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_01 {
  0% { transform: translate(-132px, -126px); }
  15% { transform: translate(-132px, -126px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_02 { top: min(calc((23 / var(--width02)) * 100vw), 23px); right: -1px; animation: j_02 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_02 {
  0% { transform: translate(34px, -101px); }
  15% { transform: translate(34px, -101px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_03 { top: min(calc((46 / var(--width02)) * 100vw), 46px); right: -1px; animation: j_03 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_03 {
  0% { transform: translate(-255px, 0); }
  15% { transform: translate(-255px, 0); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_04 { top: min(calc((69 / var(--width02)) * 100vw), 69px); right: -1px; animation: j_04 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_04 {
  0% { transform: translate(11px, 4px); }
  15% { transform: translate(11px, 4px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_05 { top: min(calc((92 / var(--width02)) * 100vw), 92px); right: -1px; animation: j_05 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_05 {
  0% { transform: translate(150px, 150px); }
  15% { transform: translate(150px, 150px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_06 { top: min(calc((115 / var(--width02)) * 100vw), 115px); right: min(calc((3 / var(--width02)) * 100vw), 3px); animation: j_06 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_06 {
  0% { transform: translate(141px, -60px); }
  15% { transform: translate(141px, -60px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_07 { top: min(calc((133 / var(--width02)) * 100vw), 133px); right: min(calc((18 / var(--width02)) * 100vw), 18px); animation: j_07 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_07 {
  0% { transform: translate(38px, 165px); }
  15% { transform: translate(38px, 165px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_08 { top: min(calc((137 / var(--width02)) * 100vw), 137px); right: min(calc((41 / var(--width02)) * 100vw), 41px); animation: j_08 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_08 {
  0% { transform: translate(95px, 60px); }


  15% { transform: translate(95px, 60px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_09 { top: min(calc((133 / var(--width02)) * 100vw), 133px); right: min(calc((64 / var(--width02)) * 100vw), 64px); animation: j_09 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_09 {
  0% { transform: translate(-13px, -36px); }
  15% { transform: translate(-13px, -36px); }
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.j_10 { top: min(calc((115 / var(--width02)) * 100vw), 115px); right: min(calc((82 / var(--width02)) * 100vw), 82px); animation: j_10 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes j_10 {
  0% { transform: translate(-39px, 86px); }
  15% { transform: translate(-39px, 86px); }
  100% { transform: translate(0, 0); }
}

#jpf_logo span.p { width: calc((110 / var(--width02)) * 100vw); height: calc((157 / var(--width02)) * 100vw); max-width: 110px; max-height: 157px; margin-right: min(calc((74 / var(--width02)) * 100vw), 74px); }
#jpf_logo span.dot.p_01 { top: 0; left: 0; animation: p_01 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_01 {
  0% { transform: translate(-140px, -194px); }/*左上*/
  15% { transform: translate(-140px, -194px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_02 { top: min(calc((23 / var(--width02)) * 100vw), 23px); left: 0; animation: p_02 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_02 {
  0% { transform: translate(46px, -60px); }/*右上*/
  15% { transform: translate(46px, -60px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_03 { top: min(calc((46 / var(--width02)) * 100vw), 46px); left: 0; animation: p_03 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_03 {
  0% { transform: translate(-131px, -121px); }/*左上*/
  15% { transform: translate(-131px, -121px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_04 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left: 0; animation: p_04 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_04 {
  0% { transform: translate(40px, -13px); }/*右上*/
  15% { transform: translate(40px, -13px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_05 { top: min(calc((92 / var(--width02)) * 100vw), 92px); left: 0; animation: p_05 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_05 {
  0% { transform: translate(-103px, -98px); }/*左上*/
  15% { transform: translate(-103px, -98px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_06 { top: min(calc((115 / var(--width02)) * 100vw), 115px); left: 0; animation: p_06 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_06 {
  0% { transform: translate(34px, 23px); }/*右下*/
  15% { transform: translate(34px, 23px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_07 { top: min(calc((138 / var(--width02)) * 100vw), 138px); left: 0; animation: p_07 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_07 {
  0% { transform: translate(-126px, 109px); }/*左下*/
  15% { transform: translate(-126px, 109px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_08 { top: 0; left: min(calc((23 / var(--width02)) * 100vw), 23px); animation: p_08 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_08 {
  0% { transform: translate(-140px, -194px); }/*左上*/
  15% { transform: translate(-140px, -194px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_09 { top: 0; left: min(calc((46 / var(--width02)) * 100vw), 46px); animation: p_09 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_09 {
  0% { transform: translate(81px, 1px); }/*右*/
  15% { transform: translate(81px, 1px); }/*右*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_10 { top: min(calc((7 / var(--width02)) * 100vw), 7px); left: min(calc((69 / var(--width02)) * 100vw), 69px); animation: p_10 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_10 {
  0% { transform: translate(9px, -139px); }/*上*/
  15% { transform: translate(9px, -139px); }/*上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_11 { top: min(calc((23 / var(--width02)) * 100vw), 23px); left: min(calc((85 / var(--width02)) * 100vw), 85px); animation: p_11 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_11 {
  0% { transform: translate(99px, -101px); }/*右上*/
  15% { transform: translate(99px, -101px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_12 { top: min(calc((46 / var(--width02)) * 100vw), 46px); left: min(calc((93 / var(--width02)) * 100vw), 93px); animation: p_12 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_12 {
  0% { transform: translate(46px, 37px); }/*右下*/
  15% { transform: translate(46px, 37px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_13 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left: min(calc((85 / var(--width02)) * 100vw), 85px); animation: p_13 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_13 {
  0% { transform: translate(113px, 174px); }/*右下*/
  15% { transform: translate(113px, 174px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_14 { top: min(calc((85 / var(--width02)) * 100vw), 85px); left: min(calc((69 / var(--width02)) * 100vw), 69px); animation: p_14 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_14 {
  0% { transform: translate(78px, 98px); }/*右下*/
  15% { transform: translate(78px, 98px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_15 { top: min(calc((92 / var(--width02)) * 100vw), 92px); left: min(calc((46 / var(--width02)) * 100vw), 46px); animation: p_15 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_15 {
  0% { transform: translate(199px, 50px); }/*右下*/
  15% { transform: translate(199px, 50px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.p_16 { top: min(calc((92 / var(--width02)) * 100vw), 92px); left: min(calc((23 / var(--width02)) * 100vw), 23px); animation: p_16 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes p_16 {
  0% { transform: translate(23px, 327px); }/*右下*/
  15% { transform: translate(23px, 327px); }/*右下*/
  100% { transform: translate(0, 0); }
}

#jpf_logo span.f { width: calc((110 / var(--width02)) * 100vw); height: calc((157 / var(--width02)) * 100vw); max-width: 110px; max-height: 157px; margin-right: min(calc((73 / var(--width02)) * 100vw), 73px); }
#jpf_logo span.dot.f_01 { top: 0; left: min(calc((1 / var(--width02)) * 100vw), 1px); animation: f_01 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_01 {
  0% { transform: translate(-182px, 50px); }/*左下*/
  15% { transform: translate(-182px, 50px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_02 { top: min(calc((23 / var(--width02)) * 100vw), 23px); left: min(calc((1 / var(--width02)) * 100vw), 1px); animation: f_02 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_02 {
  0% { transform: translate(23px, -8px); }/*右上*/
  15% { transform: translate(23px, -8px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_03 { top: min(calc((46 / var(--width02)) * 100vw), 46px); left: min(calc((1 / var(--width02)) * 100vw), 1px); animation: f_03 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_03 {
  0% { transform: translate(-129px, 74px); }/*左下*/
  15% { transform: translate(-129px, 74px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_04 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left: min(calc((1 / var(--width02)) * 100vw), 1px); animation: f_04 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_04 {
  0% { transform: translate(161px, 335px); }/*右下*/
  15% { transform: translate(161px, 335px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_05 { top: min(calc((92 / var(--width02)) * 100vw), 92px); left: min(calc((1 / var(--width02)) * 100vw), 1px); animation: f_05 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_05 {
  0% { transform: translate(-43px, 46px); }/*左下*/
  15% { transform: translate(-43px, 46px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_06 { top: min(calc((115 / var(--width02)) * 100vw), 115px); left: min(calc((1 / var(--width02)) * 100vw), 1px); animation: f_06 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_06 {
  0% { transform: translate(77px, 74px); }/*右下*/
  15% { transform: translate(77px, 74px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_07 { top: min(calc((138 / var(--width02)) * 100vw), 138px); left: min(calc((1 / var(--width02)) * 100vw), 1px); animation: f_07 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_07 {
  0% { transform: translate(-196px, 89px); }/*左下*/
  15% { transform: translate(-196px, 89px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_08 { top: 0; left: min(calc((24 / var(--width02)) * 100vw), 24px); animation: f_08 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_08 {
  0% { transform: translate(24px, 51px); }/*右下*/
  15% { transform: translate(24px, 51px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_09 { top: 0; left: min(calc((47 / var(--width02)) * 100vw), 47px); animation: f_09 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_09 {
  0% { transform: translate(-93px, -92px); }/*左上*/
  15% { transform: translate(-93px, -92px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_10 { top: 0; left: min(calc((70 / var(--width02)) * 100vw), 70px); animation: f_10 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_10 {
  0% { transform: translate(28px, -160px); }/*右上*/
  15% { transform: translate(28px, -160px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_11 { top: 0; left: min(calc((93 / var(--width02)) * 100vw), 93px); animation: f_11 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_11 {
  0% { transform: translate(183px, -118px); }/*右上*/
  15% { transform: translate(183px, -118px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_12 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left: min(calc((24 / var(--width02)) * 100vw), 24px); animation: f_12 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_12 {
  0% { transform: translate(33px, 40px); }/*右下*/
  15% { transform: translate(33px, 40px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_13 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left: min(calc((47 / var(--width02)) * 100vw), 47px); animation: f_13 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_13 {
  0% { transform: translate(141px, 67px); }/*右下*/
  15% { transform: translate(141px, 67px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_14 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left: min(calc((70 / var(--width02)) * 100vw), 70px); animation: f_14 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_14 {
  0% { transform: translate(167px, -70px); }/*右上*/
  15% { transform: translate(167px, -70px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.f_15 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left: min(calc((93 / var(--width02)) * 100vw), 93px); animation: f_15 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes f_15 {
  0% { transform: translate(0, 301px); }/*下*/
  15% { transform: translate(0, 301px); }/*下*/
  100% { transform: translate(0, 0); }
}

#jpf_logo span.num_0 { width: calc((126 / var(--width02)) * 100vw); height: calc((157 / var(--width02)) * 100vw); max-width: 126px; max-height: 157px; margin-right: min(calc((54 / var(--width02)) * 100vw), 54px); }
#jpf_logo span.dot.num_0_01 { top: 0; left: min(calc((55 / var(--width02)) * 100vw), 55px); animation: num_0_01 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_01 {
  0% { transform: translate(106px, -118px); }/*右上*/
  15% { transform: translate(106px, -118px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_02 { top: min(calc((6 / var(--width02)) * 100vw), 6px); left: min(calc((31 / var(--width02)) * 100vw), 31px); animation: num_0_02 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_02 {
  0% { transform: translate(-164px, 54px); }/*左上*/
  15% { transform: translate(-164px, 54px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_03 { top: min(calc((21 / var(--width02)) * 100vw), 21px); left: min(calc((13 / var(--width02)) * 100vw), 13px); animation: num_0_03 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_03 {
  0% { transform: translate(13px, -10px); }/*右上*/
  15% { transform: translate(13px, -10px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_04 { top: min(calc((45.5 / var(--width02)) * 100vw), 45.5px); left: min(calc((3 / var(--width02)) * 100vw), 3px); animation: num_0_04 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_04 {
  0% { transform: translate(4px, -37px); }/*右上*/
  15% { transform: translate(4px, -37px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_05 { top: min(calc((69 / var(--width02)) * 100vw), 69px); left:  min(calc((2 / var(--width02)) * 100vw), 2px); animation: num_0_05 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_05 {
  0% { transform: translate(-156px, 57px); }/*左上*/
  15% { transform: translate(-156px, 57px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_06 { bottom: min(calc((47 / var(--width02)) * 100vw), 47px); left: min(calc((3 / var(--width02)) * 100vw), 3px); animation: num_0_06 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_06 {
  0% { transform: translate(-93px, 44px); }/*左下*/
  15% { transform: translate(-93px, 44px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_07 { bottom: min(calc((22 / var(--width02)) * 100vw), 22px); left: min(calc((13 / var(--width02)) * 100vw), 13px); animation: num_0_07 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_07 {
  0% { transform: translate(28px, -14px); }/*右上*/
  15% { transform: translate(28px, -14px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_08 { bottom: min(calc((6 / var(--width02)) * 100vw), 6px); left: min(calc((31 / var(--width02)) * 100vw), 31px); animation: num_0_08 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_08 {
  0% { transform: translate(-152px, 144px); }/*左下*/
  15% { transform: translate(-152px, 144px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_09 { bottom: 1px; left: min(calc((55 / var(--width02)) * 100vw), 55px); animation: num_0_09 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_09 {
  0% { transform: translate(0, 52px); }/*下*/
  15% { transform: translate(0, 52px); }/*下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_10 { bottom: min(calc((6 / var(--width02)) * 100vw), 6px); right: min(calc((30 / var(--width02)) * 100vw), 30px); animation: num_0_10 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_10 {
  0% { transform: translate(14px, 3px); }/*右下*/
  15% { transform: translate(14px, 3px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_11 { bottom: min(calc((22 / var(--width02)) * 100vw), 22px); right: min(calc((12 / var(--width02)) * 100vw), 12px); animation: num_0_11 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_11 {
  0% { transform: translate(-14px, 202px); }/*左下*/
  15% { transform: translate(-14px, 202px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_12 { bottom: min(calc((46 / var(--width02)) * 100vw), 46px); right: min(calc((2 / var(--width02)) * 100vw), 2px); animation: num_0_12 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_12 {
  0% { transform: translate(-17px, 34px); }/*左上*/
  15% { transform: translate(-17px, 34px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_13 { bottom: min(calc((71 / var(--width02)) * 100vw), 71px); right: 0; animation: num_0_13 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_13 {
  0% { transform: translate(102px, 78px); }/*右下*/
  15% { transform: translate(102px, 78px); }/*右下*/
  100% { transform: translate(0, 0); }
} 
#jpf_logo span.dot.num_0_14 { top: min(calc((45 / var(--width02)) * 100vw), 45px); right: min(calc((2 / var(--width02)) * 100vw), 2px); animation: num_0_14 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_14 {
  0% { transform: translate(331px, 415px); }/*右下*/
  15% { transform: translate(331px, 415px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_15 { top: min(calc((21 / var(--width02)) * 100vw), 21px); right: min(calc((12 / var(--width02)) * 100vw), 12px); animation: num_0_15 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_15 {
  0% { transform: translate(180px, -49px); }/*右上*/
  15% { transform: translate(180px, -49px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_0_16 { top: min(calc((6 / var(--width02)) * 100vw), 6px); right: min(calc((30 / var(--width02)) * 100vw), 30px); animation: num_0_16 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_0_16 {
  0% { transform: translate(108px, -162px); }/*右上*/
  15% { transform: translate(108px, -162px); }/*右上*/
  100% { transform: translate(0, 0); }
}

#jpf_logo span.num_6 { width: calc((125 / var(--width02)) * 100vw); height: calc((160 / var(--width02)) * 100vw); max-width: 125px; max-height: 160px; }
#jpf_logo span.dot.num_6_01 { top: min(calc((18 / var(--width02)) * 100vw), 18px); right: min(calc((9 / var(--width02)) * 100vw), 9px); animation: num_6_01 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_01 {
  0% { transform: translate(391px, -39px); }/*右上*/
  15% { transform: translate(391px, -39px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_02 { top: min(calc((5 / var(--width02)) * 100vw), 5px); right: min(calc((29.5 / var(--width02)) * 100vw), 29.5px); animation: num_6_02 ease-in 0.75s forwards; }
@keyframes num_6_02 {
  0% { transform: translate(90px, -60px); }/*右上*/
  15% { transform: translate(90px, -60px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_03 { top: 0; right: min(calc((54 / var(--width02)) * 100vw), 54px); animation: num_6_03 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_03 {
  0% { transform: translate(256px, -176px); }/*右上*/
  15% { transform: translate(256px, -176px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_04 { top: min(calc((8 / var(--width02)) * 100vw), 8px); left: min(calc((30 / var(--width02)) * 100vw), 30px); animation: num_6_04 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_04 {
  0% { transform: translate(-25px, 22px); }/*左上*/
  15% { transform: translate(-25px, 22px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_05 { top: min(calc((24 / var(--width02)) * 100vw), 24px); left: min(calc((12 / var(--width02)) * 100vw), 12px); animation: num_6_05 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_05 {
  0% { transform: translate(11px, -160px); }/*右上*/
  15% { transform: translate(11px, -160px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_06 { top: min(calc((48 / var(--width02)) * 100vw), 48px); left: min(calc((2 / var(--width02)) * 100vw), 2px); animation: num_6_06 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_06 {
  0% { transform: translate(-76px, 31px); }/*左上*/
  15% { transform: translate(-76px, 31px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_07 { top: min(calc((72 / var(--width02)) * 100vw), 72px); left: 0; animation: num_6_07 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_07 {
  0% { transform: translate(-232px, 53px); }/*左上*/
  15% { transform: translate(-232px, 53px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_08 { bottom: min(calc((46 / var(--width02)) * 100vw), 46px); left: min(calc((2 / var(--width02)) * 100vw), 2px); animation: num_6_08 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_08 {
  0% { transform: translate(-28px, 48px); }/*左下*/
  15% { transform: translate(-28px, 48px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_09 { bottom: min(calc((22 / var(--width02)) * 100vw), 22px); left: min(calc((12 / var(--width02)) * 100vw), 12px); animation: num_6_09 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_09 {
  0% { transform: translate(-244px, 154px); }/*左下*/
  15% { transform: translate(-244px, 154px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_10 { bottom: min(calc((6 / var(--width02)) * 100vw), 6px); left: min(calc((30 / var(--width02)) * 100vw), 30px); animation: num_6_10 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_10 {
  0% { transform: translate(-69px, 157px); }/*左下*/
  15% { transform: translate(-69px, 157px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_11 { bottom: 1px; left: min(calc((54 / var(--width02)) * 100vw), 54px); animation: num_6_11 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_11 {
  0% { transform: translate(-12px, 27px); }/*左下*/
  15% { transform: translate(-12px, 27px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_12 { bottom: min(calc((7 / var(--width02)) * 100vw), 7px); right: min(calc((30 / var(--width02)) * 100vw), 30px); animation: num_6_12 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_12 {
  0% { transform: translate(-60px, 33px); }/*左上*/
  15% { transform: translate(-60px, 33px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_13 { bottom: min(calc((22 / var(--width02)) * 100vw), 22px); right: min(calc((12 / var(--width02)) * 100vw), 12px); animation: num_6_13 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_13 {
  0% { transform: translate(155px, 194px); }/*右下*/
  15% { transform: translate(155px, 194px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_14 { bottom: min(calc((44 / var(--width02)) * 100vw), 44px); right: min(calc((1 / var(--width02)) * 100vw), 1px); animation: num_6_14 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_14 {
  0% { transform: translate(186px, 191px); }/*右下*/
  15% { transform: translate(186px, 191px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_15 { bottom: min(calc((68 / var(--width02)) * 100vw), 68px); right: min(calc((12 / var(--width02)) * 100vw), 12px); animation: num_6_15 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_15 {
  0% { transform: translate(4px, 11px); }/*右下*/
  15% { transform: translate(4px, 11px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_16 { top: min(calc((60 / var(--width02)) * 100vw), 60px); right: min(calc((34 / var(--width02)) * 100vw), 34px); animation: num_6_16 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_16 {
  0% { transform: translate(191px, -40px); }/*右上*/
  15% { transform: translate(191px, -40px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_17 { top: min(calc((56 / var(--width02)) * 100vw), 56px); left: min(calc((50 / var(--width02)) * 100vw), 50px); animation: num_6_17 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_17 {
  0% { transform: translate(86px, -24px); }/*右上*/
  15% { transform: translate(86px, -24px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_6_18 { top: min(calc((70 / var(--width02)) * 100vw), 70px); left: min(calc((27 / var(--width02)) * 100vw), 27px); animation: num_6_18 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_6_18 {
  0% { transform: translate(43px, -68px); }/*右上*/
  15% { transform: translate(43px, -68px); }/*右上*/
  100% { transform: translate(0, 0); }
}

#jpf_logo span.num_7 { width: calc((110 / var(--width02)) * 100vw); height: calc((155 / var(--width02)) * 100vw); max-width: 110px; max-height: 155px; position: relative; }
#jpf_logo span.dot.num_7_01 { top: 0; left: 0; animation: num_7_01 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_01 {
  0% { transform: translate(-82px, 55px); }/*左上*/
  15% { transform: translate(-82px, 55px); }/*左上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_02 { top: 0; left: min(calc((24 / var(--width02)) * 100vw), 24px); animation: num_7_02 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_02 {
  0% { transform: translate(-13px, 36px); }/*左下*/
  15% { transform: translate(-13px, 36px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_03 { top: 0; left: min(calc((47 / var(--width02)) * 100vw), 47px); animation: num_7_03 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_03 {
  0% { transform: translate(36px, -161px); }/*右上*/
  15% { transform: translate(36px, -161px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_04 { top: 0; left: min(calc((69 / var(--width02)) * 100vw), 69px); animation: num_7_04 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_04 {
  0% { transform: translate(69px, -71px); }/*右上*/
  15% { transform: translate(69px, -71px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_05 { top: 0; left: min(calc((93 / var(--width02)) * 100vw), 93px); animation: num_7_05 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_05 {
  0% { transform: translate(37px, 58px); }/*右下*/
  15% { transform: translate(37px, 58px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_06 { top: min(calc((23 / var(--width02)) * 100vw), 23px); left: min(calc((83 / var(--width02)) * 100vw), 83px); animation: num_7_06 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_06 {
  0% { transform: translate(98px, 23px); }/*右上*/
  15% { transform: translate(98px, 23px); }/*右上*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_07 { top: min(calc((44 / var(--width02)) * 100vw), 44px); left: min(calc((74 / var(--width02)) * 100vw), 74px); animation: num_7_07 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_07 {
  0% { transform: translate(61px, 99px); }/*右下*/
  15% { transform: translate(61px, 99px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_08 { top: min(calc((66 / var(--width02)) * 100vw), 66px); left: min(calc((65 / var(--width02)) * 100vw), 65px); animation: num_7_08 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_08 {
  0% { transform: translate(-30px, 64px); }/*左下*/
  15% { transform: translate(-30px, 64px); }/*左下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_09 { top: min(calc((88 / var(--width02)) * 100vw), 88px); left: min(calc((56 / var(--width02)) * 100vw), 56px); animation: num_7_09 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_09 {
  0% { transform: translate(54px, 62px); }/*右下*/
  15% { transform: translate(54px, 62px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_10 { top: min(calc((109 / var(--width02)) * 100vw), 109px); left: min(calc((46 / var(--width02)) * 100vw), 46px); animation: num_7_10 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_10 {
  0% { transform: translate(85px, 69px); }/*右下*/
  15% { transform: translate(85px, 69px); }/*右下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_11 { top: min(calc((132 / var(--width02)) * 100vw), 132px); left: min(calc((36 / var(--width02)) * 100vw), 36px); animation: num_7_11 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_11 {
  0% { transform: translate(9px, 72px); }/*下*/
  15% { transform: translate(9px, 72px); }/*下*/
  100% { transform: translate(0, 0); }
}
#jpf_logo span.dot.num_7_12 { top: min(calc((148 / var(--width02)) * 100vw), 148px); left: min(calc((24 / var(--width02)) * 100vw), 24px); animation: num_7_12 0.75s forwards; cubic-bezier(0.42, 0, 1.0, 1.0); }
@keyframes num_7_12 {
  0% { transform: translate(-31px, 63px); }/*左下*/
  15% { transform: translate(-31px, 63px); }/*左下*/
  100% { transform: translate(0, 0); }
}

#jpf_logo_sub { display: inline-block; vertical-align: baseline; margin-top: min(calc((60 / var(--width02)) * 100vw), 60px); overflow: hidden; }
#jpf_logo_sub > span { display: inline-block; vertical-align: baseline; animation: textUp ease-in-out 0.45s forwards; opacity: 0; float: left; }
#jpf_logo_sub > span > img { pointer-events: none; }
#jpf_logo_sub > span:first-child { animation-delay: 2s; }/* J - JPF0X表示後から表示する*/
#jpf_logo_sub > span:nth-child(2) { animation-delay: 2.1s; }/* A */
#jpf_logo_sub > span:nth-child(3) { animation-delay: 2.2s; }/* P */
#jpf_logo_sub > span:nth-child(4) { animation-delay: 2.3s; }/* A */
#jpf_logo_sub > span:nth-child(5) { animation-delay: 2.4s; }/* N */

#jpf_logo_sub > span:nth-child(6) { animation-delay: 2.5s; }/* P */
#jpf_logo_sub > span:nth-child(7) { animation-delay: 2.6s; }/* E */
#jpf_logo_sub > span:nth-child(8) { animation-delay: 2.7s; }/* A */
#jpf_logo_sub > span:nth-child(9) { animation-delay: 2.8s; }/* R */
#jpf_logo_sub > span:nth-child(10) { animation-delay: 2.9s; }/* L */

#jpf_logo_sub > span:nth-child(11) { animation-delay: 3s; }/* F */
#jpf_logo_sub > span:nth-child(12) { animation-delay: 3.1s; }/* A */
#jpf_logo_sub > span:nth-child(13) { animation-delay: 3.2s; }/* I */
#jpf_logo_sub > span:nth-child(14) { animation-delay: 3.3s; }/* R */
@keyframes textUp {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

#jpf_logo_sub span.font_j { width: calc((31 / var(--width02)) * 100vw); height: calc((48 / var(--width02)) * 100vw); max-width: 31px; margin-right: min(calc((26 / var(--width02)) * 100vw), 26px); }
#jpf_logo_sub span.font_a { width: calc((45 / var(--width02)) * 100vw); height: calc((52 / var(--width02)) * 100vw); max-width: 45px; }
#jpf_logo_sub span.font_a_01 { margin-right: min(calc((27 / var(--width02)) * 100vw), 27px); }
#jpf_logo_sub span.font_a_02 { margin-right: min(calc((24 / var(--width02)) * 100vw), 24px); }
#jpf_logo_sub span.font_a_03 { margin-right: min(calc((27 / var(--width02)) * 100vw), 27px); }
#jpf_logo_sub span.font_a_04 { margin-right: min(calc((25 / var(--width02)) * 100vw), 25px); }
#jpf_logo_sub span.font_a:first-child { margin-right: min(calc((43 / var(--width02)) * 100vw), 43px); }
#jpf_logo_sub span.font_p { width: calc((33 / var(--width02)) * 100vw); height: calc((48 / var(--width02)) * 100vw); max-width: 33px; }
#jpf_logo_sub span.font_p_01 { margin-right: min(calc((19 / var(--width02)) * 100vw), 19px); }
#jpf_logo_sub span.font_p_02 { margin-right: min(calc((27 / var(--width02)) * 100vw), 27px); }
#jpf_logo_sub span.font_n { width: calc((41 / var(--width02)) * 100vw); height: calc((48 / var(--width02)) * 100vw); max-width: 41px; margin-right: miN(calc((59 / var(--width02)) * 100vw), 59px); }
#jpf_logo_sub span.font_e { width: calc((35 / var(--width02)) * 100vw); height: calc((49 / var(--width02)) * 100vw); max-width: 35px; margin-right: min(calc((22 / var(--width02)) * 100vw), 22px); }
#jpf_logo_sub span.font_r { width: calc((36 / var(--width02)) * 100vw); height: calc((49 / var(--width02)) * 100vw); max-width: 36px; }
#jpf_logo_sub span.font_r_01 { margin-right: min(calc((26 / var(--width02)) * 100vw), 26px); }
#jpf_logo_sub span.font_l { width: calc((34 / var(--width02)) * 100vw); height: calc((49 / var(--width02)) * 100vw); max-width: 34px; margin-right: min(calc((46 / var(--width02)) * 100vw), 46px); }
#jpf_logo_sub span.font_f { width: calc((35 / var(--width02)) * 100vw); height: calc((49 / var(--width02)) * 100vw); max-width: 35px; margin-right: min(calc((17 / var(--width02)) * 100vw), 17px); }
#jpf_logo_sub span.font_i { width: calc((5.5 / var(--width02)) * 100vw); height: calc((48 / var(--width02)) * 100vw); max-width: 5.5px;  margin-right: min(calc((33 / var(--width02)) * 100vw), 33px); }


/* ---------- HEADER ---------- */
.info__area { position: absolute; left: 3%; right: 3%; bottom: 3%; }

/* date & venue */
html[lang="ja"] dl.event-info { font-family: "Geologica", sans-serif; }
dl.event-info { color: var(--ac); margin-top: min(calc((40 / var(--width)) * 100vw), 40px); }
dl.event-info .event-info__item {}
dl.event-info .event-info__item dt { display: inline-block; font-size: min(calc((18 / var(--width)) * 100vw), 1.8rem); font-weight: bold; text-transform: uppercase; line-height: 1.3; border-right: 1px solid var(--ac); padding-right: 12px; margin-bottom: 10px; }
dl.event-info .event-info__item dd { font-size: min(calc((21 / var(--width)) * 100vw), 2.1rem); font-weight: 400; line-height: 1.7; }
dl.event-info .event-info__item dd > span { font-size: 120%; font-weight: 500; }
dl.event-info .event-info__item.date { animation: textUp ease-in-out 0.45s forwards; animation-delay: 2.1s; opacity: 0; }
dl.event-info .event-info__item.venue { animation: textUp ease-in-out 0.45s forwards; animation-delay: 2.2s; opacity: 0; }

.free { display: inline-block; background-color: #fff; color: var(--ac); padding: min(calc((24 / var(--width)) * 100vw), 24px) min(calc((16 / var(--width)) * 100vw), 16px); animation: textUp ease-in-out 0.45s forwards; animation-delay: 2s; opacity: 0; }
.free > span { font-size: min(calc((28 / var(--width)) * 100vw), 2.8rem); line-height: 1; }
.free > small { font-size: min(calc((14 / var(--width)) * 100vw), 1.4rem); line-height: 1.3; margin-top: 4px; }
@media screen and (min-width: 961px) {
  .free > small { display: block; }
  dl.event-info { display: flex; column-gap: calc((110 / var(--width)) * 100vw); }
}
@media screen and (max-width: 960px) {
  dl.event-info .event-info__item.date, dl.event-info .event-info__item.venue { margin-bottom: 24px; }
  .free { width: 100%; }
}


/* ---------- BUTTON ---------- */
button.btn__scroll { display: flex; align-items: center; justify-content: center; text-transform: uppercase; width: calc((80 / var(--width)) * 100vw); height: calc((80 / var(--width)) * 100vw); border: 1px solid #666; border-radius: 50%; background-color: transparent; position: absolute; right: 3%; bottom: 3%; pointer-events: none; }
button.btn__scroll > span { font-size: min(calc((15 / var(--width)) * 100vw), 1.5rem); color: #666; position: relative; }
button.btn__scroll > span::after { content: ''; display: block; width: 16px; height: 16px; border-right: 1px solid #666; border-bottom: 1px solid #666; transform: rotate(45deg); margin: 6px auto 0; animation: scrollArrow ease 1s infinite; position: absolute; bottom: -14px; left: 0; right: 0; margin: auto; }
@keyframes scrollArrow {
  0% { bottom: -14px; }
  50% { bottom: -18px; }
  100% { bottom: -14px; }
}
@media screen and (max-width: 960px) {
  button.btn__scroll { display: none; visibility: hidden; }
}

@media screen and (min-width: 961px) {
  ul.qr { position: absolute; right: 3%; bottom: 0; }
}
@media screen and (max-width: 960px) {
  ul.qr { justify-content: center; margin-top: 24px; }
}
ul.qr { display: flex; }
ul.qr > li { background-color: #fff; padding: 4px; width: 100px; }
ul.qr > li span { display: block; color: #333; font-size: 10px;  font-weight: bold; margin-top: 4px; }
ul.qr > li:not(:first-child) { margin-left: 10px; }
ul.qr > li > a { background: none; color: var(--ac); text-decoration: none; text-align: center; display: block; padding: 0; }
ul.qr > li > img { width: 100%; height: auto; vertical-align: text-bottom; object-fit: contain; }

/* ---------- NEWS ---------- */
.news { padding: min(calc((32 / var(--width)) * 100vw), 32px) 0 min(calc((80 / var(--width)) * 100vw), 80px); }
.news dl { display: flex; font-size: min(calc((18 / var(--width)) * 100vw), 1.8rem); justify-content: center; max-width: 1200px; margin-inline: auto; }
.news dl dt { background-color: var(--ac); color: #fff; padding: min(calc((24 / var(--width)) * 100vw), 24px) min(calc((32 / var(--width)) * 100vw), 32px); font-size: min(calc((18 / var(--width)) * 100vw), 1.8rem); }
.news dl dd { background-color: #666; color: #fff; display: flex; column-gap: calc((76 / var(--width)) * 100vw); padding: min(calc((24 / var(--width)) * 100vw), 24px) min(calc((55 / var(--width)) * 100vw), 48px); width: 89.16%; font-size: min(calc((18 / var(--width)) * 100vw), 1.8rem); }
.news dl dd time {}
.news dl dd p {}
@media screen and (max-width: 480px) {
  .news dl { flex-wrap: wrap; }
  .news dl dt, .news dl dd { width: 100%; padding: calc((16 / var(--width)) * 100vw) calc((24 / var(--width)) * 100vw); }
  .news dl dd { flex-wrap: wrap; }
  .news dl dd time, .news dl dd p { width: 100%; }
}


/* ---------- FOR EXHIBITOR ---------- */
#for-exhibitor { padding-bottom: min(calc((70 / var(--width)) * 100vw), 70px); }
#for-exhibitor > .inner { padding-top: min(calc((70 / var(--width)) * 100vw), 70px); }
#for-exhibitor p { font-size: min(calc((16 / var(--width)) * 100vw), 1.6rem); line-height: 1.7; color: #fff; margin-top: min(calc((32 / var(--width)) * 100vw), 32px); }
/*.for-exhibitor__ttl { display: block; width: calc((395 / var(--width))* 100vw); max-width: 395px; margin-bottom: min(calc((64 / var(--width)) * 100vw), 64px); }*/
.for-exhibitor__ttl { display: block; width: calc((326 / var(--width))* 100vw); max-width: 326px; margin-bottom: min(calc((64 / var(--width)) * 100vw), 64px); }

button.btn--reserved { display: block; background-color: #fff; border: 1px solid transparent; color: var(--ac); font-size: min(calc((24 / var(--width)) * 100vw), 2.4rem); line-height: 1; vertical-align: middle; text-align: center; margin-inline: auto; padding: min(calc((18 / var(--width)) * 100vw), 18px); transition: all ease 0.3s; position: relative; }
button.btn--reserved::after { content: ''; display: block; width: 12px; height: 12px; border-top: 2px solid var(--ac); border-right: 2px solid var(--ac); transform: rotate(45deg); position: absolute; right: 15px; top: calc(50% - 6px); transition: right ease-in-out .3s, background ease-in-out .2s; }
button.btn--reserved:hover::after,
button.btn--reserved:focus::after { border-color: #fff; right: 12px; }
button.btn--reserved:hover, button.btn--reserved:focus { background-color: transparent; border: 1px solid #fff; color: #fff; }
button.btn--reserved.nolink { background-color: transparent; border-color: #ccc; color: #ccc; pointer-events: none; opacity: 0.75; }
@media screen and (min-width: 961px) {
  #for-exhibitor > .inner { padding-inline: calc((48 / var(--width)) * 100vw); }
  /*.for-exhibitor__ttl { position: absolute; top: -36px; }*/
  .for-exhibitor__ttl { position: absolute; top: -38px; }
  button.btn--reserved { width: calc((684 / var(--width)) * 100vw); max-width: 684px; }
}
@media screen and (max-width: 960px) {
  .for-exhibitor__ttl { position: absolute; top: -28px;  }
  button.btn--reserved { min-width: 100%; }
}

#seminar { padding: min(calc((70 / var(--width)) * 100vw), 70px) 0; }
#seminar button.btn--reserved { color: #fff; background-color: var(--ac); border: 1px solid var(--ac); }
#seminar button.btn--reserved:hover { color: var(--ac); background-color: #fff; border-color: var(--ac); }
#seminar button.btn--reserved::after { border-top-color: #fff; border-right-color: #fff; }
#seminar button.btn--reserved:hover::after { border-top-color: var(--ac); border-right-color: var(--ac); }
  

/* ---------- INTRODUCTION ---------- */
#introduction { padding: min(calc((42 / var(--width)) * 100vw), 84px) 0 min(calc((45 / var(--width)) * 100vw), 90px); }
#introduction > .inner { background-color: #fff; padding: min(3.9vw, 75px) min(5.7vw, 109px); overflow: hidden; }
.introduction__ttl { color: #4d4d4d; font-size: min(calc((28 / var(--width)) * 100vw), 2.8rem); font-weight: 500; text-align: center; margin-bottom: min(2.1vw, 40px); width: 100%; }
.introduction__txt { color: #4d4d4d; font-size: min(calc((18 / var(--width)) * 100vw), 1.8rem); font-weight: 300;  }
.introduction__txt.right { font-size: min(calc((18 / var(--width)) * 100vw), 1.8rem); background-color: var(--ac); color: #fff; padding: min(3.85vw, 37px) min(5.2vw, 50px);  }
@media screen and (min-width: 961px) {
  html[lang="ja"] .introduction__txt { width: calc(50% - 23px); }
  html[lang="ja"] .introduction__txt.left { float: left; }
  html[lang="ja"] .introduction__txt.right { float: right; }
}
@media screen and (max-width: 960px) {
  .introduction__txt.right { max-width: 80%; margin: min(3.54vw, 40px) auto 0; }
}


/* ---------- HOTEL ---------- */
#hotel { color: #fff; padding: min(calc((45 / var(--width)) * 100vw) , 90px) 0 min(calc((60 / var(--width)) * 100vw), 120px); }
#hotel > .inner {}
#hotel h3 { font-size: min(calc((22 / var(--width)) * 100vw), 2.2rem); line-height: 1.7; letter-spacing: 0.1rem; }
#hotel h4 { font-size: min(calc((17 / var(--width)) * 100vw), 1.7rem); letter-spacing: 0.1rem; }
#hotel p { font-size: min(calc((16 / var(--width)) * 100vw), 1.6rem); line-height: 1.7; }
#hotel p:not(:last-child) { margin-bottom: 32px; }

ul.asterisk { font-size: min(calc((16 / var(--width)) * 100vw), 1.6rem); line-height: 1.7; }
ul.asterisk li { text-indent: calc(-1rem + -6px); padding-left: calc(1rem + 6px); }
ul.asterisk li::before { margin-right: 6px; }
html[lang="ja"] ul.asterisk li::before,
html[lang="cn"] ul.asterisk li::before { content: '※'; }
html[lang="en"] ul.asterisk li::before { content: '*'; }

/* ---------- HOTEL end ---------- */
#hotel.end { position: relative; }
#hotel.end::before { content: '終了しました'; display: inline-block; background-color: var(--red); color: #fff; font-size: 4rem; font-weight: bold; text-align: center; position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%) rotate(-7deg); z-index: 1; padding: 0 16px; margin: auto; }
html[lang="en"] #hotel.end::before { content: 'Closed!'; }
html[lang="zh-cmn-Hans"] #hotel.end::before { content: '申请已截止，恕无法再接受新的申请。'; }
#hotel.end > .inner { opacity: 0.25; pointer-events: none; }


/* ---------- Why Visit JPF ---------- */
#why-visit-jpf { padding: min(80px, 236px) 0 min(70px, 236px); }
.why-visit-jpf__ttl { width: 80vw; max-width: 803px; margin-bottom: min(8.5333vw, 65px); }

ul.why-visit-jpf__items { display: flex; flex-wrap: wrap; max-width: 1096px; margin-inline: auto; }
ul.why-visit-jpf__items li { background-color: #f1f1f1; padding: min(5.33333vw, 40px) min(3.73333vw, 24px); margin-bottom: 3.5%; }
ul.why-visit-jpf__items li h3 { color: #4d4d4d; font-size: min(calc((26 / var(--width)) * 100vw), 2.6rem); font-weight: 700; text-align: center; line-height: 1.3; }
ul.why-visit-jpf__items li h3 > strong { display: inline-block; font-size: 150%; line-height: 1; color: var(--ac); white-space: nowrap; vertical-align: baseline; margin: 8px 0 4px; }
ul.why-visit-jpf__items li h3 > strong.num { font-size: 200%; line-height: 1; padding-right: 6px; }
ul.why-visit-jpf__items li p { font-size: min(calc((16 / var(--width)) * 100vw), 1.6rem); font-weight: 300; margin-top: min(4vw, 28px); }
ul.why-visit-jpf__items li p.why-notes { background-color: var(--ac); color: #fff; font-size: min(calc((17 / var(--width)) * 100vw), 1.7rem); line-height: 1; padding: 6px; display: inline-block; margin-top: 0; position: absolute; top: 0; }

ul.why-visit-jpf__items li .popup { position: absolute; top: 100%; left: 0; }
ul.why-visit-jpf__items li .popup p { background-color: var(--ac); color: #fff; font-size: min(calc((16 / var(--width)) * 100vw), 1.6rem); padding: 16px; position: relative; }
ul.why-visit-jpf__items li .popup p::before { content: ''; height: 0; width: 0; border-top: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid var(--ac); border-left: 12px solid transparent; position: absolute; top: -24px; right: 10%; }
ul.why-visit-jpf__items li:has(.popup) { position: relative; margin-bottom: 120px!important; }

@media screen and (min-width: 961px) {
  .why-visit-jpf__ttl { margin-left: 46px; }
  
  ul.why-visit-jpf__items { column-gap: 3.5%; }
  ul.why-visit-jpf__items li { width: 31%; }
  ul.why-visit-jpf__items li:not(:has(.popup)):last-child, ul.why-visit-jpf__items li:not(:has(.popup)):nth-last-child(2), ul.why-visit-jpf__items li:not(:has(.popup)):nth-last-child(3) { margin-bottom: auto; }
}
@media screen and (max-width: 960px) {
  ul.why-visit-jpf__items { column-gap: 4%; }
  ul.why-visit-jpf__items li { width: 48%; }
}
@media screen and (max-width: 960px) and (min-width: 481px) {
   ul.why-visit-jpf__items li:not(:has(.popup)):last-child, ul.why-visit-jpf__items li:not(:has(.popup)):nth-last-child(2) { margin-bottom: auto; }
}
@media screen and (max-width: 480px) {
  ul.why-visit-jpf__items li { width: 100%; }
  ul.why-visit-jpf__items li:not(:last-child) { margin-bottom: 4%; }
  ul.why-visit-jpf__items li:has(.popup) { padding-top: 10vw; }
}

/* ---------- About JPF? ---------- */
#about-jpf { padding-bottom: min(17.3333vw, 135px); }
#about-jpf > .inner { max-width: 1096px; }
#about-jpf p { font-size: min(calc((17 / var(--width)) * 100vw), 1.7rem); color: #4d4d4d; font-weight: 300; max-width: 760px; }

.about-jpf__ttl { width: 73.3%; max-width: 550px; margin-bottom: min(calc((43 / var(--width)) * 100vw), 86px); position: relative; }

ul.about-jpf__imgs { display: flex; flex-wrap: wrap; max-width: 1096px; margin-inline: auto; margin-top: min(9.3333vw, 70px); }

@media screen and (min-width: 481px) {
  .about-jpf__ttl { margin-top: -49px; }
  
  ul.about-jpf__imgs { gap: 3.5%; }
  ul.about-jpf__imgs li { width: 31%; max-width: 340px; margin-bottom: 3.5%; }
  ul.about-jpf__imgs li:last-child, ul.about-jpf__imgs li:nth-child(2), ul.about-jpf__imgs li:nth-child(3) { margin-bottom: 0; }
}
@media screen and (max-width: 480px) {
  .about-jpf__ttl { margin-top: -8%; }
  
  ul.about-jpf__imgs { gap: 4%; }
  ul.about-jpf__imgs li { width: 48%; margin-bottom: 4%; }
  ul.about-jpf__imgs li:last-child, ul.about-jpf__imgs li:nth-child(2) { margin-bottom: 0; }
}

a.btn--pdf { display: inline-block; vertical-align: middle; background-color: #4d4d4d; background-image: none; padding-right: 0; border: 1px solid transparent; color: #fff; text-decoration: none; font-size: min(calc((17 / var(--width)) * 100vw), 1.7rem); padding: 10px; margin-top: min(5.3333vw, 40px); transition: all ease 0.3s; }
a.btn--pdf > span { padding-left: 10px; }
a.btn--pdf::before { content: 'pdf'; display: inline-block; text-transform: uppercase; border-right: 1px solid #fff; padding-right: 10px; }
/* hover*/
a.btn--pdf:hover, a.btn--pdf:focus { background-color: transparent; border-color: #4d4d4d; color: #4d4d4d; }
a.btn--pdf:hover::before, a.btn--pdf:focus::before { border-color: #4d4d4d; }
/* empty */
a.btn--pdf[href=""] { background-color: #fff; color: #ccc; border-color: #ccc; pointer-events: none; }
a.btn--pdf[href=""]::before { border-color: #ccc; }
a.btn--pdf[href=""]::after { content: ' (no links)'; }

/* ---------- ORGANIZER ---------- */
#organizer { padding: min(10vw, 82px) 0; }

.organizer__item {}
.organizer__ttl { margin-inline: auto; margin-bottom: min(5vw, 48px); }
.organizer__ttl.ttl01 { width: calc((280 / var(--width)) * 100vw);/*width: calc((288 / var(--width)) * 100vw); height: calc((32 / var(--width)) * 100vw);*/ max-width: 288px; max-height: 32px; }
.organizer__ttl.ttl02 { width: calc((240 / var(--width)) * 100vw);/*width: calc((253 / var(--width)) * 100vw); height: calc((32 / var(--width)) * 100vw)*/; max-width: 253px; max-height: 32px; }
.organizer__item dl { font-size: min(calc((20 / var(--width)) * 100vw), 2rem); text-align: center; }
.organizer__ttl.ttl01 + dl { margin-bottom: min(8vw, 48px); }
.organizer__item dl dt {}
.organizer__item dl dd:not(:last-child) { margin-bottom: min(5vw, 48px); }