@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300&display=swap");
:root { --white: #ffffff; --black: #5a5a5a; --orange: #f39d1a; --gray: #919191; --skyblue: #c4edfb; --blue: #004fa2; }

@media screen and (min-width: 751px), print { :root { --width: 1200; } }
@media (max-width: 750px) and (min-width: 376px) { :root { --width: 750; } }
@media (max-width: 375px) { :root { --width: 375; } }
* { padding: 0; }

html, body { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-size: 62.5%; font-weight: 300; font-style: normal; line-height: 1.5; overflow-x: hidden; }

@media screen and (min-width: 751px), print { .sp { display: none; } }
@media (max-width: 750px) { .pc { display: none; } }
/* ---------- HEADER ---------- */
@media screen and (min-width: 751px), print { header#header { width: 100%; padding: 24px 0 19px; position: fixed; top: 0; left: 0; right: 0; z-index: 10; }
  header#header > .header__inner { max-width: 1054px; margin-inline: auto; } }
@media screen and (min-width: 751px) and (max-width: 1200px), print and (max-width: 1200px) { header#header > .header__inner { padding-inline: 2%; } }
@media screen and (min-width: 751px), print { header#header #logo { width: 355px; height: 40px; margin-right: auto; }
  header#header #logo a { transition: opacity ease-in-out .3s; }
  header#header #logo a[href=""] { pointer-events: none; opacity: 0.3; }
  header#header #logo a:hover { opacity: 0.5; } }
/* ---------- NAVIGATION---------- */
@media screen and (min-width: 751px), print { nav#gnav { margin-left: auto; display: flex; }
  nav#gnav ul.navs { list-style: none; display: flex; align-items: center; }
  nav#gnav ul.navs li:not(:first-child) { margin-left: 17px; }
  nav#gnav ul.navs li a { transition: opacity ease-in-out .3s; }
  nav#gnav ul.navs li a[href=""] { pointer-events: none; opacity: 0.3; }
  nav#gnav ul.navs li a:hover { opacity: 0.5; } }
@media (max-width: 750px) { nav#gnav { background-color: #fff; border: 5px solid var(--blue); width: 100%; padding: 12.80vw 4.27vw 4.27vw; position: fixed; top: -100%; left: 0; z-index: 10; opacity: 0; transition: all ease-in-out .5s; }
  nav#gnav.open { top: 0; opacity: 1; }
  nav#gnav.open #logo { margin-bottom: 32px; }
  nav#gnav.open ul.navs { list-style: none; }
  nav#gnav.open ul.navs li:not(:last-child) { margin-bottom: 10px; } }
@media screen and (min-width: 751px), print { button.hamburger { display: none; visibility: hidden; } }
@media (max-width: 750px) { button.hamburger { border: none; background-color: var(--blue); padding: 8px 16px; border-bottom-left-radius: 3.20vw; border-bottom-right-radius: 3.20vw; display: flex; align-items: center; position: fixed; top: 0; right: 4.27vw; z-index: 11; }
  button.hamburger > span { font-size: 1.6rem; font-weight: bold; color: #fff; letter-spacing: 0.1em; }
  button.hamburger > span::before { content: 'Menu'; }
  button.hamburger > i { display: inline-block; margin-left: 6px; width: 32px; height: 14px; position: relative; }
  button.hamburger > i::before, button.hamburger > i::after { content: ''; display: block; width: 32px; height: 4px; background-color: #fff; transition: transform ease-in-out .3s; position: absolute; }
  button.hamburger > i::before { top: 0; left: 0; }
  button.hamburger > i::after { bottom: 0; left: 0; }
  button.hamburger.open > span::before { content: 'Close'; }
  button.hamburger.open > i::before { transform: rotate(25deg); top: 50%; }
  button.hamburger.open > i::after { transform: rotate(-25deg); top: 50%; } }
/* ---------- FOOTER ---------- */
footer#footer { background: url("../img/common/footer_bg.png") var(--skyblue) center center no-repeat; background-size: cover; padding: 52px 0 12px; }
@media (max-width: 750px) { footer#footer { background: url("../img/common/footer_bg_sp.png") var(--skyblue) center center repeat; background-size: cover; } }
footer#footer > div.footer__inner { max-width: 1200px; margin-inline: auto; }
@media screen and (min-width: 751px), print { footer#footer > div.footer__inner { display: flex; justify-content: space-between; align-items: flex-end; }
  footer#footer > div.footer__inner div:has(a.logo--khnexpo) { margin-left: 125px; } }
@media (max-width: 1200px) { footer#footer > div.footer__inner { padding-inline: 2%; } }
footer#footer a.footer__logo { display: block; width: min(59.73vw, 453px); height: min(6.67vw, 51px); transition: opacity ease-in-out .3s; }
footer#footer a.footer__logo:hover { opacity: 0.5; }
footer#footer .footer__contacts { font-size: 1.7rem; line-height: 1.47; margin-top: 26px; }
footer#footer .footer__organizer { font-size: 1.5rem; line-height: 1.47; margin-top: 28px; }
@media (max-width: 750px) { footer#footer .footer__organizer { margin-bottom: 20px; } }
footer#footer a.logo--khnexpo { display: block; width: 313px; height: 58px; transition: opacity ease-in-out .3s; }
footer#footer a.logo--khnexpo:hover { opacity: 0.5; }

/* ---------- MAIN ---------- */
.inner { max-width: 1200px; margin-inline: auto; }
@media (max-width: 1200px) and (min-width: 751px) { .inner { padding-inline: 32px; } }
@media (max-width: 750px) { .inner { padding-inline: 4.27vw; } }

/* ---------- KEY VISUAL ---------- */
#kv { width: 100%; }
@media screen and (min-width: 751px), print { #kv { background: url("../img/kv.jpg") center center no-repeat; background-size: cover; height: 1280px; padding-top: 212px; } }
@media (max-width: 750px) { #kv { background: url("../img/kv_sp.jpg") top center no-repeat; background-size: cover; min-height: 100vh; max-height: 1136px; padding-top: 29.60vw; } }
@media (max-width: 750px) and (orientation: landscape) { #kv { min-height: 750px; background-position: center center; } }
#kv .kv__ttl { width: min(66.8vw, 795px); height: min(33.33vw, 397px); margin: 0 auto; opacity: 0; animation: titleshow ease-in-out .75s .5s forwards; }

@keyframes titleshow { from { opacity: 0; transform: translateY(35px); }
  to { opacity: 1; transform: translateY(0); } }
/* ---------- ABOUT ---------- */
#about { padding: 68px 0 89px; position: relative; }
#about p.about__ttl { color: var(--orange); font-size: min(7.47vw, 5.5rem); line-height: 1.25; text-align: center; margin-bottom: min(5vw, 96px); transform: rotate(-7deg); }
#about p.about__ttl > span { font-size: 61.8%; display: inline; }
#about p { color: var(--black); font-size: min(4.5vw, 2.3rem); line-height: 2.09; }
@media screen and (min-width: 751px), print { #about p { text-align: center; }
  #about p > span { display: block; } }
#about p strong { color: var(--orange); }
#about dl.about__venue { text-align: center; margin-top: min(9.73vw, 73px); }
#about dl.about__venue dt { font-size: 4rem; }
@media (max-width: 750px) { #about dl.about__venue dt { font-size: calc(40 / var(--width) * 100vw); } }
#about dl.about__venue dd > span { font-size: 5.5rem; background: linear-gradient(to bottom, transparent 0%, transparent 92%, var(--orange) 92%, var(--orange) 100%); }
@media (max-width: 750px) { #about dl.about__venue dd > span { font-size: calc(48 / var(--width) * 100vw); } }
#about dl.about__venue dd > img { margin: min(7.6vw, 57px) auto 0; }
@media (max-width: 750px) { #about dl.about__venue dd > img { width: 77.07vw; height: auto; } }

.square { width: 566px; height: 528px; opacity: 0.3; mix-blend-mode: multiply; border-radius: 17px; position: absolute; z-index: -1; pointer-events: none; }
.square.blue { background-color: #00afe9; }
.square.orange { background-color: #ee803b; }
.square.green { background-color: #87bd58; }
.square.left01 { width: 368px; height: 400px; top: -148px; left: -240px; transform: rotate(160deg); }
@media (max-width: 750px) { .square.left01 { width: 30.53vw; height: 33.20vw; top: -10vw; left: -17vw; } }
.square.left01.squaremove { opacity: 0; }
.square.left01.visible { animation: left01 ease-in-out 1s forwards; }
.square.left02 { bottom: 10px; left: -274px; transform: rotate(17deg); z-index: 1; }
@media (max-width: 750px) { .square.left02 { width: 47.07vw; height: 43.87vw; bottom: 0; left: 0; z-index: -1; } }
.square.left02.squaremove { opacity: 0; }
.square.left02.visible { animation: left02 ease-in-out 1s forwards; }
.square.right01 { top: 89px; right: -414px; transform: rotate(170deg); }
@media (max-width: 750px) { .square.right01 { width: 46.93vw; height: 44.27vw; top: 90vw; right: -15vw; } }
.square.right01.squaremove { opacity: 0; }
.square.right01.visible { animation: right01 ease-in-out 1s forwards; }
.square.right02 { width: 319px; height: 293px; top: 600px; right: -129px; transform: rotate(4.5deg); }
@media (max-width: 750px) { .square.right02 { width: 26.53vw; height: 24.40vw; top: 130vw; right: -7vw; } }
.square.right02.squaremove { opacity: 0; }
.square.right02.visible { animation: right02 ease-in-out 1s forwards; }

@keyframes left01 { from { transform: translateX(-50px) rotate(100deg); opacity: 0; }
  to { transform: translateX(0) rotate(160deg); opacity: 0.3; } }
@keyframes left02 { from { transform: translateX(-50px) rotate(-45deg); opacity: 0; }
  to { transform: translateX(0) rotate(17deg); opacity: 0.3; } }
@keyframes right01 { from { transform: translateX(50px) rotate(100deg); opacity: 0; }
  to { transform: translateX(0) rotate(170deg); opacity: 0.3; } }
@keyframes right02 { from { transform: translateX(50px) rotate(30deg); opacity: 0; }
  to { transform: translateX(0) rotate(4.5deg); opacity: 0.3; } }
aside.event-view { position: relative; width: 100%; height: min(58.93vw, 594px); z-index: -1; overflow: hidden; }
aside.event-view p { color: #fff; font-size: 1.6rem; text-shadow: 0 0 5px rgba(0, 0, 0, 0.75), 2px 2px 2px rgba(0, 0, 0, 0.75); position: absolute; right: 5%; bottom: 5%; z-index: 1; }
aside.event-view .view01, aside.event-view .view02 { display: flex; width: 200%; position: absolute; }
aside.event-view .view01 { animation: scrollL 25s linear infinite; top: 0; left: 0; }
aside.event-view .view02 { animation: scrollR 25s linear infinite; right: 0; bottom: 0; }
aside.event-view .view01 img, aside.event-view .view02 img { width: 100%; height: 100%; object-fit: cover; }

@keyframes scrollL { from { transform: translateX(0); }
  to { transform: translateX(-50%); } }
@keyframes scrollR { from { transform: translateX(0); }
  to { transform: translateX(50%); } }
/* ---------- TOUR ---------- */
#about-tour { background-color: #ebebeb; padding: min(10.67vw, 140px) 0 min(10.67vw, 127px); }
@media screen and (min-width: 751px), print { #about-tour .tour__header { display: flex; align-items: center; margin-bottom: 102px; } }
@media (max-width: 750px) { #about-tour .tour__header .tour__header__ttl { margin-bottom: 28px; } }
#about-tour .tour__header .tour__header__ttl img { width: min(61.07vw, 458px); height: auto; margin-inline: auto; }
#about-tour .tour__header ul.tour__header__icons { list-style: none; overflow: hidden; }
@media screen and (min-width: 751px), print { #about-tour .tour__header ul.tour__header__icons { margin-left: calc(55px - 24px); } }
#about-tour .tour__header ul.tour__header__icons li { height: 45px; float: left; margin: 12px 24px; }
#about-tour .tour__header ul.tour__header__icons li img { height: auto; }
#about-tour .tour__content:not(:last-child) { margin-bottom: min(19.33vw, 145px); }
@media screen and (min-width: 751px), print { #about-tour .tour__content .tour__days { width: 332px; float: left; } }
@media (max-width: 750px) { #about-tour .tour__content .tour__days { width: 100%; margin-bottom: 4px; } }
#about-tour .tour__content .tour__days img { width: 100%; height: auto; }
#about-tour .tour__content dl.schedules { font-size: 1.9rem; line-height: 2.16; }
@media screen and (min-width: 751px), print { #about-tour .tour__content dl.schedules { width: calc(100% - 332px - 40px); margin-left: 40px; float: left; } }
#about-tour .tour__content dl.schedules::after { content: ''; display: block; width: 100%; clear: both; margin-bottom: min(6.4vw, 48px); }
#about-tour .tour__content dl.schedules div { border-bottom: 1px solid #828282; }
@media screen and (min-width: 751px), print { #about-tour .tour__content dl.schedules div { display: flex; align-items: center; } }
#about-tour .tour__content dl.schedules div:first-child { border-top: 1px solid #828282; }
#about-tour .tour__content dl.schedules dt { width: 124px; }
@media (max-width: 750px) { #about-tour .tour__content dl.schedules dt { width: 100%; background-color: var(--skyblue); border: 2px solid var(--blue); color: var(--blue); font-size: 2rem; font-weight: bold; text-align: center; padding: 0 8px; } }
#about-tour .tour__content dl.schedules dd { width: calc(100% - 124px); }
@media (max-width: 750px) { #about-tour .tour__content dl.schedules dd { width: 100%; } }
#about-tour .tour__content dl.schedules dd > ul { list-style: none; }
#about-tour .tour__content dl.schedules dd > ul > li { line-height: 1.5; padding: 8px 0; }
#about-tour .tour__content dl.schedules dd > ul > li:not(:last-child) { border-bottom: 1px dashed #828282; }
#about-tour .tour__content .cards { display: flex; flex-wrap: wrap; clear: both; }
#about-tour .tour__content .cards .card { background-color: #fff; box-shadow: 4px 4px 2px rgba(0, 0, 0, 0.25); border-radius: 6px; font-size: 2rem; padding: 16px 12px; }
@media screen and (min-width: 961px), print { #about-tour .tour__content .cards .card { width: 23.75%; display: flex; flex-wrap: wrap; margin-bottom: 1.65%; }
  #about-tour .tour__content .cards .card:not(:nth-child(4n)) { margin-right: 1.65%; } }
@media (max-width: 960px) and (min-width: 751px) { #about-tour .tour__content .cards .card { width: 32%; margin-bottom: 2%; }
  #about-tour .tour__content .cards .card:not(:nth-child(3n)) { margin-right: 2%; } }
@media (max-width: 750px) { #about-tour .tour__content .cards .card { width: 48%; margin: 1%; } }
@media (max-width: 480px) { #about-tour .tour__content .cards .card { width: 100%; margin-bottom: 3%; } }
#about-tour .tour__content .cards .card > div { margin-bottom: auto; width: 100%; }
#about-tour .tour__content .cards .card div.card__box { border-top: 1px solid var(--black); margin-top: 14px; padding-top: 14px; padding-bottom: 18px; }
@media screen and (min-width: 751px), print { #about-tour .tour__content .cards .card div.card__box { display: flex; flex-wrap: wrap; min-height: 173px; } }
#about-tour .tour__content .cards .card div.card__box > p { font-size: 2.1rem; }
#about-tour .tour__content .cards .card div.card__box > p + ul.icons { margin-top: auto; width: 100%; }
#about-tour .tour__content .cards .card dl.card__join-location { font-size: 1.8rem; border-top: 1px dashed var(--black); padding-top: 20px; padding-bottom: 20px; }
#about-tour .tour__content .cards .card dl.card__join-location dt::before, #about-tour .tour__content .cards .card dl.card__join-location dt::after { vertical-align: baseline; }
#about-tour .tour__content .cards .card dl.card__join-location dt::before { content: '['; letter-spacing: 0.2em; }
#about-tour .tour__content .cards .card dl.card__join-location dt::after { content: ']'; letter-spacing: 0.2em; margin-left: 4px; }
#about-tour .tour__content .cards .card dl.card__join-location dd ul { margin-left: 2rem; }
#about-tour .tour__content .cards .card dl.card__join-location + div.card__box { display: block; border-top-style: dashed; }
#about-tour .tour__content .cards .card dl.card__join-location + div.card__box > p { font-size: 1.8rem; }
#about-tour .tour__content .cards .card dl.card__join-location.nostyle { border-top: none; padding-top: 0; }
#about-tour .tour__content .cards .card.end { position: relative; pointer-events: none; }
#about-tour .tour__content .cards .card.end::before { content: '終了しました'; display: block; color: #fff; font-size: 1.8rem; font-weight: bold; text-align: center; width: 100%; position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); }
#about-tour .tour__content .cards .card.end::after { content: ''; display: block; background-color: rgba(0, 0, 0, 0.45); border-radius: 6px; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; }

a.card__btn { display: inline-block; margin-top: auto; width: 100%; transition: opacity ease-in-out .3s; }
a.card__btn[href=""] { opacity: 0.3; pointer-events: none; }
a.card__btn > img { margin-inline: auto; }
a.card__btn:hover, a.card__btn:focus { opacity: 0.5; }

.caution { padding: min(10.67vw, 78px) 0 min(10.67vw, 114px); }
.caution .caution__ttl { text-align: center; margin-bottom: min(5.33vw, 40px); }
.caution .caution__ttl img { margin-inline: auto; }
.caution dl { color: #5a5a5a; font-size: 1.6rem; max-width: 920px; padding: min(4.27vw, 32px); background-color: #fff; border: 2px solid #ebebeb; margin-inline: auto; }
.caution dl dt { font-size: 1.8rem; font-weight: bold; margin-bottom: 8px; }
.caution dl dt::before { content: ''; display: inline-block; width: 16px; height: 16px; border: 1px solid var(--black); border-radius: 50%; vertical-align: middle; margin-right: 6px; }
.caution dl dd:not(:last-child) { margin-bottom: 24px; }

.information { clear: both; max-width: 920px; padding: min(4.27vw, 32px); border: 2px solid #fff; margin-inline: auto; background-color: #fff; margin-bottom: min(5.33vw, 40px); }
.information .caution__ttl { margin-bottom: 24px; }
.information .caution__ttl img { margin-inline: auto; }
.information dl { font-size: 1.6rem; color: #5a5a5a; }
.information dl dt { font-size: 1.8rem; font-weight: bold; margin-bottom: 8px; }
.information dl dt::before { content: ''; display: inline-block; width: 16px; height: 16px; border: 1px solid var(--black); border-radius: 50%; vertical-align: middle; margin-right: 6px; }
.information dl dd:not(:last-child) { margin-bottom: 24px; }

ul.list--circle { margin-left: 1.6rem; list-style: none; }
ul.list--circle li { text-indent: -1.6rem; padding-left: 1.6rem; }
ul.list--circle li::before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background-color: #333; margin-right: 8px; vertical-align: middle; }

p.comingsoon { text-align: center; }
p.comingsoon span { background-color: #fff; border: 1px solid var(--black); border-radius: 24px; font-size: 2.2rem; letter-spacing: 0.25em; line-height: 1.5; padding: 0 24px 4px; }

/* ---------- ICONS ---------- */
ul.icons { list-style: none; overflow: hidden; margin-top: 20px; margin-bottom: 20px; }
ul.icons li { float: left; margin: 6px; }
ul.icons li > i.icon--capacity { display: block; width: min(7.47vw, 56px); height: min(7.47vw, 56px); overflow: hidden; background: url("../img/common/suprite_capacity.png") left top no-repeat; background-size: min(74.67vw, 560px) min(7.47vw, 56px); color: transparent; text-indent: -999px; pointer-events: none; }
@media screen and (min-width: 751px), print { ul.icons li > i.icon--capacity.ca01 { background-position: 0 0; }
  ul.icons li > i.icon--capacity.ca02 { background-position: -56px 0; }
  ul.icons li > i.icon--capacity.ca03 { background-position: -112px 0; }
  ul.icons li > i.icon--capacity.ca04 { background-position: -168px 0; }
  ul.icons li > i.icon--capacity.ca05 { background-position: -224px 0; }
  ul.icons li > i.icon--capacity.ca06 { background-position: -280px 0; }
  ul.icons li > i.icon--capacity.ca07 { background-position: -336px 0; }
  ul.icons li > i.icon--capacity.ca08 { background-position: -392px 0; }
  ul.icons li > i.icon--capacity.ca09 { background-position: -448px 0; }
  ul.icons li > i.icon--capacity.ca10 { background-position: -504px 0; } }
@media (max-width: 750px) { ul.icons li > i.icon--capacity.ca01 { background-position: 0 0; }
  ul.icons li > i.icon--capacity.ca02 { background-position: -7.47vw 0; }
  ul.icons li > i.icon--capacity.ca03 { background-position: -14.93vw 0; }
  ul.icons li > i.icon--capacity.ca04 { background-position: -22.40vw 0; }
  ul.icons li > i.icon--capacity.ca05 { background-position: -29.87vw 0; }
  ul.icons li > i.icon--capacity.ca06 { background-position: -37.33vw 0; }
  ul.icons li > i.icon--capacity.ca07 { background-position: -44.80vw 0; }
  ul.icons li > i.icon--capacity.ca08 { background-position: -52.27vw 0; }
  ul.icons li > i.icon--capacity.ca09 { background-position: -59.73vw 0; }
  ul.icons li > i.icon--capacity.ca10 { background-position: -67.20vw 0; } }
ul.icons li > i.icon--capacity02 { display: block; width: min(7.47vw, 56px); height: min(7.47vw, 56px); overflow: hidden; background: url("../img/common/suprite_capacity02.png") left top no-repeat; background-size: min(74.67vw, 560px) min(7.47vw, 56px); color: transparent; text-indent: -999px; pointer-events: none; }
@media screen and (min-width: 751px), print { ul.icons li > i.icon--capacity02.ca01 { background-position: 0 0; }
  ul.icons li > i.icon--capacity02.ca02 { background-position: -56px 0; }
  ul.icons li > i.icon--capacity02.ca03 { background-position: -112px 0; }
  ul.icons li > i.icon--capacity02.ca04 { background-position: -168px 0; }
  ul.icons li > i.icon--capacity02.ca05 { background-position: -224px 0; }
  ul.icons li > i.icon--capacity02.ca06 { background-position: -280px 0; }
  ul.icons li > i.icon--capacity02.ca07 { background-position: -336px 0; }
  ul.icons li > i.icon--capacity02.ca08 { background-position: -392px 0; }
  ul.icons li > i.icon--capacity02.ca09 { background-position: -448px 0; }
  ul.icons li > i.icon--capacity02.ca10 { background-position: -504px 0; } }
@media (max-width: 750px) { ul.icons li > i.icon--capacity02.ca01 { background-position: 0 0; }
  ul.icons li > i.icon--capacity02.ca02 { background-position: -7.47vw 0; }
  ul.icons li > i.icon--capacity02.ca03 { background-position: -14.93vw 0; }
  ul.icons li > i.icon--capacity02.ca04 { background-position: -22.40vw 0; }
  ul.icons li > i.icon--capacity02.ca05 { background-position: -29.87vw 0; }
  ul.icons li > i.icon--capacity02.ca06 { background-position: -37.33vw 0; }
  ul.icons li > i.icon--capacity02.ca07 { background-position: -44.80vw 0; }
  ul.icons li > i.icon--capacity02.ca08 { background-position: -52.27vw 0; }
  ul.icons li > i.icon--capacity02.ca09 { background-position: -59.73vw 0; }
  ul.icons li > i.icon--capacity02.ca10 { background-position: -67.20vw 0; } }
ul.icons li > i.icon--plus { display: block; width: min(calc((56 / 750) * 100vw), 56px); height: min(calc((56 / 750) * 100vw), 56px); overflow: hidden; background: url("../img/common/suprite_plus.png") left top no-repeat; background-size: min(calc((504 / 750) * 100vw), 504px) min(calc((56 / 750) * 100vw), 56px); color: transparent; text-indent: -999px; pointer-events: none; }
@media screen and (min-width: 751px), print { ul.icons li > i.icon--plus.pl01 { background-position: 0 0; }
  ul.icons li > i.icon--plus.pl02 { background-position: -56px 0; }
  ul.icons li > i.icon--plus.pl03 { background-position: -112px 0; }
  ul.icons li > i.icon--plus.pl04 { background-position: -168px 0; }
  ul.icons li > i.icon--plus.pl05 { background-position: -224px 0; }
  ul.icons li > i.icon--plus.pl06 { background-position: -280px 0; }
  ul.icons li > i.icon--plus.pl07 { background-position: -336px 0; }
  ul.icons li > i.icon--plus.pl08 { background-position: -392px 0; }
  ul.icons li > i.icon--plus.pl09 { background-position: -448px 0; } }
@media (max-width: 750px) { ul.icons li > i.icon--plus.pl01 { background-position: 0 0; }
  ul.icons li > i.icon--plus.pl02 { background-position: -7.47vw 0; }
  ul.icons li > i.icon--plus.pl03 { background-position: -14.93vw 0; }
  ul.icons li > i.icon--plus.pl04 { background-position: -22.40vw 0; }
  ul.icons li > i.icon--plus.pl05 { background-position: -29.87vw 0; }
  ul.icons li > i.icon--plus.pl06 { background-position: -37.33vw 0; }
  ul.icons li > i.icon--plus.pl07 { background-position: -44.80vw 0; }
  ul.icons li > i.icon--plus.pl08 { background-position: -52.27vw 0; }
  ul.icons li > i.icon--plus.pl09 { background-position: -59.73vw 0; } }
ul.icons li > i.icon--parking { display: block; width: min(7.47vw, 56px); height: min(7.47vw, 56px); overflow: hidden; background: url("../img/common/suprite_parking.png") left top no-repeat; background-size: min(29.87vw, 224px) min(7.47vw, 56px); color: transparent; text-indent: -999px; pointer-events: none; }
@media screen and (min-width: 751px), print { ul.icons li > i.icon--parking.pa01 { background-position: 0 0; }
  ul.icons li > i.icon--parking.pa02 { background-position: -56px 0; }
  ul.icons li > i.icon--parking.pa03 { background-position: -112px 0; }
  ul.icons li > i.icon--parking.pa04 { background-position: -168px 0; } }
@media (max-width: 750px) { ul.icons li > i.icon--parking.pa01 { background-position: 0 0; }
  ul.icons li > i.icon--parking.pa02 { background-position: -7.47vw 0; }
  ul.icons li > i.icon--parking.pa03 { background-position: -14.93vw 0; }
  ul.icons li > i.icon--parking.pa04 { background-position: -22.40vw 0; } }
ul.icons li > i.icon--fee { display: block; width: min(7.47vw, 56px); height: min(7.47vw, 56px); overflow: hidden; background: url("../img/common/suprite_fee.png") left top no-repeat; background-size: min(14.93vw, 112px) min(7.47vw, 56px); color: transparent; text-indent: -999px; pointer-events: none; }
@media screen and (min-width: 751px), print { ul.icons li > i.icon--fee.fe01 { background-position: 0 0; }
  ul.icons li > i.icon--fee.fe02 { background-position: -56px 0; } }
@media (max-width: 750px) { ul.icons li > i.icon--fee.fe01 { background-position: 0 0; }
  ul.icons li > i.icon--fee.fe02 { background-position: -7.47vw 0; } }

.mgb10 { margin-bottom: 10px; }

.mgb20 { margin-bottom: 20px; }

p.txt { font-size: 1.5rem !important; }

.txt--link { text-decoration: underline 1px solid var(--blue); }

.bold { font-weight: bold; }

/* ---------- OTHER ---------- */
aside.notes--box { margin-top: 27px; }

p.notes { font-size: 1.4rem !important; line-height: 1.69; text-indent: -1.4rem; padding-left: 1.4rem; }
p.notes::before { content: '※'; }

.event-links { margin-bottom: 24px; clear: both; display: flex; flex-wrap: wrap; justify-content: flex-end; }
.event-links a { display: inline-block; background-color: transparent; border: 2px solid var(--blue); border-radius: 24px; font-size: 1.8rem; font-weight: bold; line-height: 1.2; text-decoration: none; color: var(--blue); padding: 6px 18px; margin: 6px; transition: background ease-in-out .3s, color ease-in-out .3s; }
.event-links a:hover { background-color: var(--blue); color: #ccc; }
.event-links a[href=""] { border-color: #ccc; color: #ccc; pointer-events: none; }

ul.page-navs { list-style: none; display: flex; flex-wrap: wrap; margin-bottom: 40px; }
ul.page-navs li { width: 48%; }
ul.page-navs li:nth-child(odd) { margin-right: 4%; }
ul.page-navs li a.page-nav__btn { display: block; color: #fff; font-size: 1.8rem; font-weight: bold; text-align: center; text-decoration: none; background-color: #333; border: 2px solid #333; border-radius: 6px; padding: 8px 16px; transition: background ease-in-out .3s, color ease-in-out .3s; }
ul.page-navs li a.page-nav__btn.techtour { background-color: var(--blue); border-color: var(--blue); }
ul.page-navs li a.page-nav__btn.techtour:hover { color: var(--blue); }
ul.page-navs li a.page-nav__btn.openlab { background-color: var(--orange); border-color: var(--orange); }
ul.page-navs li a.page-nav__btn.openlab:hover { color: var(--orange); }
ul.page-navs li a.page-nav__btn:hover { background-color: #fff; color: #333; }

@media (max-width: 750px) { ul.page-navs li { width: 100%; margin-right: 0 !important; margin-bottom: 4%; }
  ul.page-navs li:last-child { margin-bottom: 0; } }
/* ---------- TECHTOUR ---------- */
#techtour { color: #474747; background: url("../img/bg_techtour@2x.png") center center no-repeat; background-size: cover; padding-bottom: 60px; }

.techtour__header { background: url("../img/bg_header_techtour@2x.png") center center no-repeat; background-size: cover; padding: 48px 0 50px 0; margin-bottom: min(calc((40 / 750) * 100vw), 80px); }
@media (max-width: 750px) { .techtour__header { padding: calc((40 / 750) * 100vw) 0; } }

.techtour__ttl img { width: min(calc((406 / 750) * 100vw), 558px); height: min(calc((80 / 750) * 100vw), 110px); margin: auto; }

.techtour__subttl { font-size: min(calc((40 / 750) * 100vw), 4.3rem); font-weight: bold; text-align: center; margin-bottom: 16px; }

p.techtour__catch { font-size: min(calc((27 / 750) * 100vw), 2.3rem); font-weight: 100; text-align: center; margin-bottom: min(calc((60 / 750) * 100vw), 120px); }
p.techtour__catch strong { color: var(--orange); }

dl.techtour__schedule { font-size: min(calc((32 / 750) * 100vw), 2.8rem); font-weight: 100; background-color: rgba(255, 255, 255, 0.5); padding: min(calc((40 / 750) * 100vw), 60px) min(calc((40 / 750) * 100vw), 140px); width: 100%; margin-bottom: min(calc((50 / 750) * 100vw), 50px); }
@media screen and (min-width: 751px), print { dl.techtour__schedule div { display: flex; align-items: center; } }
dl.techtour__schedule div:not(:last-child) { margin-bottom: min(calc((32 / 750) * 100vw), 16px); }
dl.techtour__schedule div dt { margin-right: min(calc((44 / 750) * 100vw), 44px); }
dl.techtour__schedule div dt::before, dl.techtour__schedule div dt::after { display: inline-block; vertical-align: text-bottom; }
dl.techtour__schedule div dt::before { content: '['; margin-right: 3px; }
dl.techtour__schedule div dt::after { content: ']'; margin-left: 3px; }

.techtour__wrap { background-color: rgba(255, 255, 255, 0.5); padding: 29px 131px 62px 79px; }
@media screen and (min-width: 751px), print { .techtour__wrap { display: flex; flex-wrap: wrap; } }
@media (max-width: 750px) { .techtour__wrap { padding: calc((24 / 750) * 100vw); } }

.techtour__tab { flex-shrink: 0; }
@media screen and (min-width: 751px), print { .techtour__tab { width: min(calc((240 / 750) * 100vw), 240px); margin-right: min(calc((26 / 750) * 100vw), 26px); } }
@media (max-width: 750px) { .techtour__tab { margin-bottom: 24px; } }

.techtours { flex-shrink: 0; }

.techtours + div { width: 100%; margin-top: 24px; text-align: center; }
.techtours + div a { width: auto; }

ul.tourlist { list-style: none; padding: 0; }
ul.tourlist li.tourlist__start, ul.tourlist li.tourlist__end { background-color: #fff; border: 1px solid #474747; border-radius: 5px; font-size: min(calc((28 / 750) * 100vw), 2.4rem); padding: min(calc((16 / 750) * 100vw), 16px) min(calc((8 / 750) * 100vw), 8px); }
ul.tourlist li.tourlist__start time, ul.tourlist li.tourlist__end time { margin-right: min(calc((40 / 750) * 100vw), 40px); }
ul.tourlist li.tourlist__tarnsit { font-size: min(calc((24 / 750) * 100vw), 1.7rem); padding: min(calc((16 / 750) * 100vw), 16px) min(calc((8 / 750) * 100vw), 8px); }
ul.tourlist li.tourlist__event { border: 1px solid #474747; border-radius: 5px; }
ul.tourlist li.tourlist__event .tourlist__event__ttl { font-size: min(calc((28 / 750) * 100vw), 2.4rem); padding: 15px 28px 13px; border-bottom: 1px solid #474747; display: flex; align-items: flex-start; }
@media (max-width: 750px) { ul.tourlist li.tourlist__event .tourlist__event__ttl { padding: calc((24 / 750) * 100vw); } }
ul.tourlist li.tourlist__event .tourlist__event__ttl span:first-child { margin-right: auto; }
ul.tourlist li.tourlist__event dl { padding: 20px 24px 20px 16px; }
@media (max-width: 750px) { ul.tourlist li.tourlist__event dl { padding: calc((24 / 750) * 100vw); } }
ul.tourlist li.tourlist__event dl dt, ul.tourlist li.tourlist__event dl dd { padding: 6px; }
ul.tourlist li.tourlist__event dl dt { display: inline-block; font-size: min(calc((26 / 750) * 100vw), 2rem); background-color: #f39d1a; color: #fff; }
ul.tourlist li.tourlist__event dl dd { font-size: min(calc((24 / 750) * 100vw), 1.7rem); }

.icon--poc, .icon--activity { display: inline-block; vertical-align: baseline; color: #fff; font-size: min(calc((16 / 750) * 100vw), 1.6rem); font-weight: bold; line-height: 1; white-space: nowrap; border-radius: 3px; background-color: #ccc; padding: 6px; margin: 5px; }

.icon--poc { background-color: #cf5f92; }

.icon--activity { background-color: #23a193; letter-spacing: 0.25em; }

/* ---------- ANIMATION only ---------- */
@keyframes fadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes slideUp { 0% { transform: translateY(30px); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; } }
@keyframes slideUp02 { 0% { transform: translateY(30px) rotate(-7deg); opacity: 0; }
  100% { transform: translateY(0) rotate(-7deg); opacity: 1; } }
@keyframes rotateIn { 0% { transform: rotate(360deg) scale(0%); opacity: 0; }
  100% { transform: rotate(-7deg) scale(100%); opacity: 1; } }
.fadein { opacity: 0; }
.fadein.visible { animation: fadeIn ease-in-out .3s forwards; }

.slideup { opacity: 0; }
.slideup.visible { animation: slideUp ease-in-out .3s forwards; }

.slideup02 { opacity: 0; }
.slideup02.visible { animation: slideUp02 ease-in-out .3s forwards; }

.rotatein { opacity: 0; }
.rotatein.visible { animation: rotateIn ease-in-out .75s forwards; }

.delay01 { animation-delay: 0.1s; }

.delay02 { animation-delay: 0.2s; }

.delay03 { animation-delay: 0.3s; }

.delay04 { animation-delay: 0.4s; }

.delay05 { animation-delay: 0.5s; }

.delay06 { animation-delay: 0.6s; }

.delay07 { animation-delay: 0.7s; }

.delay08 { animation-delay: 0.8s; }

.delay09 { animation-delay: 0.9s; }

.delay10 { animation-delay: 1s; }
