@charset "UTF-8";
:root { --blue: #00a0e9; --red: #e50315; --gray: #e8e8e8; --darkgray: #4d4d4d; --black: #1c1c1c; }

html, body { color: #1c1c1c; font-size: 62.5%; line-height: 1.5; scroll-behavior: smooth; scroll-padding-top: 88px; }
@media (max-width: 780px) { html, body { scroll-padding-top: 70px; } }

html[lang="ja"] { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }

html[lang="en"] { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 400; }

* { box-sizing: border-box; }

ul, dl { padding: 0; }

@media (hover: hover) { a:has(img) { transition: opacity ease-in-out .25s; }
  a:has(img):hover { opacity: 0.3; } }
/* Noto sans JP */
.notoR { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }

.notoM { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; }

.notoSB { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; }

/* Familjen Grotesk */
.familjenSB { font-family: "Familjen Grotesk", sans-serif; font-optical-sizing: auto; font-style: normal; font-weight: 600; }

.familjenB { font-family: "Familjen Grotesk", sans-serif; font-optical-sizing: auto; font-style: normal; font-weight: 700; }

/* Georama */
.georamaR { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 400; }

.georamaM { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 500; }

.georamaSB { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; }

/* HEADER */
header#header { width: 100%; position: fixed; top: 0; left: 0; z-index: 10; /*transition: all ease-in-out .5s;*/ height: auto; }
header#header.sticky { position: sticky; backdrop-filter: blur(1px); }

.exclusion-mode { mix-blend-mode: exclusion; }
.exclusion-mode.open { mix-blend-mode: initial; }

/* NAVIGATION */
@media screen and (min-width: 1227px), print { #gnav { display: flex; padding: 16px 24px 16px 40px; } }
@media (max-width: 1226px) { #gnav { padding: 16px 24px; transition: background ease-in-out .15s; } }
@media (max-width: 780px) { #gnav { padding: 16px; } }

/* logo */
:where(h1) { font-size: 2.4rem; }

.gnav__logo { margin-right: auto; }
.gnav__logo a { display: block; width: 46.15vw; height: 10.26vw; max-width: 180px; max-height: 40px; }
.gnav__logo a img { width: 100%; height: auto; object-fit: contain; vertical-align: top; }

.gnav__logo--bridgestone { margin-right: 0; margin-left: 16px; display: flex; align-items: center; }
@media (max-width: 1226px) { .gnav__logo--bridgestone { margin-top: 16px; } }
.gnav__logo--bridgestone a { display: block; max-width: 100px; max-height: 44px; width: 8.33vw; height: 3.67vw; margin-left: auto; }
.gnav__logo--bridgestone a img { width: 100%; height: auto; object-fit: contain; vertical-align: top; }
.gnav__logo--bridgestone span { display: block; color: #fff; font-size: 1rem; line-height: 1.3; margin-left: 12px; padding-left: 12px; border-left: 1px solid #fff; }

/* navigation links */
.gnav__links { list-style: none; }
@media screen and (min-width: 1226px) { .gnav__links { display: flex; margin-left: auto; } }
.gnav__links .gnav__item { font-size: 1.6rem; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; letter-spacing: 0.01em; position: relative; }
.gnav__links .gnav__item a { display: block; color: #fff; text-decoration: none; width: 100%; padding: 0 20px; }
.gnav__links .gnav__item a:not([data-target])[href=""] { opacity: 0.3; pointer-events: none; }
@media screen and (min-width: 1226px) { .gnav__links .gnav__item a::before { content: ''; width: 1px; height: 0%; background-color: #fff; position: absolute; top: 0; left: 0; transition: all ease-in-out .2s; } }
@media screen and (min-width: 1226px) and (hover: hover) { .gnav__links .gnav__item a:hover::before { height: 100%; } }
@media screen and (min-width: 1226px) { .gnav__links .gnav__item a:focus-within::before { height: 100%; } }
.gnav__links .gnav__item.current a::before { height: 100%; }
.gnav__links .gnav__item small { display: block; font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; font-size: 1rem; letter-spacing: 0; }

/* tablet - phone common */
@media (max-width: 1226px) { body.clip { overflow: hidden; }
  .gnav__links { position: relative; visibility: hidden; opacity: 0; z-index: -10; pointer-events: none; height: 0; }
  header#header.open { background-color: var(--blue); }
  header#header.open nav#gnav { height: 100vh; width: 100%; overflow-y: auto; }
  header#header.open .gnav__links { visibility: visible; opacity: 1; z-index: 9; height: auto; pointer-events: auto; }
  header#header.open .gnav__links::after { content: ''; display: block; clear: both; }
  header#header.open .gnav__links .gnav__item:not(:first-child) { border-top: 1px solid #fff; }
  header#header.open .gnav__links .gnav__item:last-child { border-bottom: 1px solid #fff; }
  header#header.open .gnav__links .gnav__item > a { display: block; padding: 16px 0; transition: padding-left ease-in-out .2s, color ease-in-out .2s; }
  header#header.open .gnav__links .gnav__item > a::before { content: ''; display: block; background-color: #fff; height: 100%; width: 0%; position: absolute; top: 0; left: 0; z-index: -1; transition: all ease-in-out .2s; }
  header#header.open .gnav__links .gnav__item > a:hover { color: var(--blue); padding-left: 16px; }
  header#header.open .gnav__links .gnav__item > a:hover::before { width: 100%; } }
/* tablet only */
@media (max-width: 1226px) and (min-width: 781px) { header#header.open { overflow: hidden; display: flex; }
  header#header.open::before { content: ''; display: block; height: 100vh; width: 50%; background: url("../img/kv.jpg") center center no-repeat; background-size: cover; }
  header#header.open nav#gnav { width: 50%; }
  header#header.open nav#gnav .gnav__links { margin-top: 16px; } }
@media (max-width: 780px) { header#header.open .gnav__links { margin-top: 16px; } }
/* navigation -- button */
button.btn--hamburger { /* 1227px以上  : hidden */ /* 1226px以下～phone */ }
@media (hover: hover) { button.btn--hamburger { cursor: pointer; } }
@media screen and (min-width: 1227px), print { button.btn--hamburger { display: none; visibility: hidden; opacity: 0; } }
@media (max-width: 1226px) { button.btn--hamburger { display: block; background-color: transparent; border: none; position: absolute; right: 2%; top: 20px; }
  button.btn--hamburger .btn--hamburger__txt { color: #fff; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 500; font-size: 2rem; font-weight: bold; }
  button.btn--hamburger .btn--hamburger__icon { display: inline-block; vertical-align: baseline; width: 24px; height: 10px; margin-left: 6px; position: relative; }
  button.btn--hamburger .btn--hamburger__icon::before, button.btn--hamburger .btn--hamburger__icon::after { content: ''; display: block; background-color: #fff; width: 24px; height: 2px; position: absolute; right: 0; transition: transform ease-in-out .3s; }
  button.btn--hamburger .btn--hamburger__icon::before { top: 0; }
  button.btn--hamburger .btn--hamburger__icon::after { width: 19px; bottom: 0; }
  button.btn--hamburger.open .btn--hamburger__icon::before { transform: rotate(20deg); transform-origin: top left; }
  button.btn--hamburger.open .btn--hamburger__icon::after { transform: rotate(-20deg); transform-origin: bottom left; width: 100%; } }

/* CONTAINER */
.inner { max-width: 1200px; margin-inline: auto; }

@media (max-width: 1200px) { .inner { padding-inline: 16px; } }
/* COMMON TITLE - style */
.ttl { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(8.21vw, 4.8rem); /* min-font-size: 32px */ line-height: 1.5; margin-bottom: min(8.21vw, 58px); /* 32px */ }
.ttl small { display: block; font-size: min(3.59vw, 1.7rem); /*min-font-size: 14px */ line-height: 2.18; }

/* アニメーション用に区切る文字列 */
.split-ttl span.row { display: block; word-break: break-all; overflow: hidden; }
.split-ttl span.row span.cell { display: inline-block; transform: translate(20%, 100%); transition: transform 0.75s cubic-bezier(0.65, 0.02, 0.23, 1); }
.split-ttl.visible span.row span.cell { transform: translate(0, 0); }
.split-ttl.visible span.row span.cell.empty { display: inline-block; width: 10px; }

/* TOP - MAIN VISUAL */
.mv { width: 100%; aspect-ratio: 16 / 9; position: relative; /* pc */ /* tablet */ }
@media screen and (min-width: 781px), print { .mv { height: calc(100vh + 80px); min-height: 866px; background-color: var(--blue); background: url("../img/kv.webp") top center no-repeat; background-size: cover; background-attachment: fixed; } }
@media (max-width: 780px) { .mv { /*height: calc(100vh + 8.21vw);*/ min-height: 100vh; }
  .mv::after { content: ''; display: block; width: 100%; height: 100%; background-color: var(--blue); background: url("../img/kv_sp.webp") top center no-repeat; background-size: cover; position: fixed; top: 0; left: 0; z-index: -1; } }
.mv .mv__title { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(10.77vw, 8rem); /* min-font-size: 42px */ line-height: 1.3; color: #fff; }
@media screen and (min-width: 781px), print { .mv .mv__title { position: absolute; left: 45px; bottom: calc(60px + 80px); /*角丸ボックスの重なりを足す*/ } }
@media (max-width: 780px) { .mv .mv__title { margin-left: 4.1vw; /* 16px */ margin-top: 34.87vw; /* 136px */ } }
.mv .mv__title span { display: block; }
.mv .mv__title small { font-size: min(5.13vw, 38px); /* min-font-size: 20px */ line-height: 1.5; display: block; }

/* TOP - INTORODUCTION */
.introduction { padding-top: 84px; }
@media (max-width: 780px) { .introduction { padding-top: 8.21%; /* 32px */ } }

.introduction__ttl { /*font-size: min(6.15vw, 4rem);*/ font-size: min(5vw, 3.2rem); line-height: 1.5; margin-bottom: 60px; }
@media (max-width: 780px) { .introduction__ttl { margin-bottom: 10.26%; } }
.introduction__ttl span { display: block; }

/* slider */
@keyframes infinity-scroll-left { from { transform: translateX(0); }
  to { transform: translateX(-100%); } }
.slider--photos { display: flex; overflow: hidden; }
.slider--photos.min--landscape { width: 100%; height: min(22.05vw, 160px); }
.slider--photos.min--landscape .slider--photos__item { display: flex; animation: infinity-scroll-left 30s infinite linear 0.5s both; flex-shrink: 0; flex-basis: content; }
.slider--photos.min--landscape img { width: min(33.33vw, 240px); height: 160px; flex-basis: min(33.33vw, 240px); flex-shrink: 1; }
@media (max-width: 780px) { .slider--photos.min--landscape img { height: auto; } }
.slider--photos.portrait { padding-top: 80px; padding-bottom: 80px; position: relative; z-index: 1; }
.slider--photos.portrait::after { content: ''; display: block; width: 100%; height: 100%; background-image: linear-gradient(to bottom, #fff 0%, transparent 100%); opacity: 0.75; position: absolute; top: 0; left: 0; z-index: -1; }
.slider--photos.portrait .slider--photos__item { display: flex; animation: infinity-scroll-left 45s infinite linear 0.5s both; }
.slider--photos.portrait .slider--photos__item figure { width: 232px; margin-left: 23px; margin-right: 23px; overflow: hidden; }
.slider--photos.portrait .slider--photos__item figure img { width: 232px; height: 375px; flex-basis: 232px; flex-shrink: 0; }
.slider--photos.portrait .slider--photos__item figure figcaption { color: #787878; font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; font-size: 10px; line-height: 1.5; text-align: right; }
.slider--photos.portrait .slider--photos__item figure:nth-child(odd) figcaption { margin-top: 6px; }
.slider--photos.portrait .slider--photos__item figure:nth-child(even) figcaption { text-align: left; margin-bottom: 6px; }

/* TOP - ABOUT */
.about { color: #fff; padding-top: 100px; padding-bottom: calc(100px + 80px); }
@media (max-width: 780px) { .about { padding-top: 12.31%; /* 48px */ padding-bottom: calc(12.31% + 8.21%); /* 48px + 角丸分 */ } }
@media screen and (min-width: 781px), print { .about .inner { display: flex; } }
@media (max-width: 780px) { .about .inner { padding-inline: 8.21%; /*32px*/ } }
.about .ttl span:nth-child(3) { letter-spacing: -0.02em; }
@media (max-width: 780px) { .about .ttl small { font-size: 3.2vw; } }
@media (max-width: 1166px) and (min-width: 781px) { .about .ttl span:nth-child(3) span:nth-child(12) { display: block !important; } }

.about__box { display: flex; }
@media (max-width: 780px) { .about__box { display: block; } }
@media screen and (min-width: 781px), print { .about__box .about__box__item { width: 25vw; max-width: 300px; margin-left: 3.17vw; } }
@media (max-width: 780px) { .about__box .about__box__item { width: 100%; } }
.about__box .about__box__item p { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; font-size: 1.6rem; line-height: 2; text-align: justify; }

/* TOP - RULE */
.rule { padding-top: 100px; padding-bottom: 65px; }
@media (max-width: 780px) { .rule { padding-top: 10.26%; /* 40px */ padding-bottom: 10.26%; /* 40px */ }
  .rule .ttl.split-ttl.animated span.row span.cell:nth-child(11) { display: block; }
  .rule .ttl.split-ttl.animated > small > span.row span.cell:nth-child(11) { display: inline; } }

@media (max-width: 780px) { #rule .ttl.split-ttl span.row span.cell:nth-child(11) { display: block; }
  #rule .ttl.split-ttl small span.cell { display: inline !important; } }
.rule__list { list-style: none; display: flex; flex-wrap: wrap; }
@media (max-width: 390px) { .rule__list { display: block; } }

.rule__list__item { background-color: #fff; border-radius: 16px; text-align: center; padding: 54px 24px 24px; width: 22.5%; }
@media screen and (min-width: 781px), print { .rule__list__item:not(:first-child) { margin-left: 24px; } }
@media (max-width: 780px) { .rule__list__item { width: 48%; margin: 0 1% 5%; } }
@media (max-width: 480px) { .rule__list__item { width: 100%; } }
.rule__list__item small { display: block; color: var(--blue); font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 400; font-size: 1.7rem; line-height: 2; }
.rule__list__item strong { display: block; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(7.18vw, 2.8rem); line-height: 1.4; }

.rule__icon { display: block; margin: 0 auto min(8.21vw, 32px); }
.rule__icon img { margin: auto; }

/* TOP - COURSE */
.course { padding-top: 60px; padding-bottom: 60px; overflow-x: hidden; }

.cource__ttl { color: #fff; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(9.74vw, 10.8rem); line-height: 1.25; text-shadow: 0 0 15px rgba(28, 28, 28, 0.13); margin-left: 40px; }
@media (max-width: 780px) { .cource__ttl { margin-left: 4.10%; } }
.cource__ttl span.unit { font-size: 70%; }
.cource__ttl.ttl-anm { opacity: 0; }
.cource__ttl.ttl-anm.visible { animation: ttl-anm ease 1s forwards; }

@keyframes ttl-anm { 0% { color: var(--gray); text-shadow: 0 0 0 transparent; opacity: 0; }
  90% { color: #fff; opacity: 1; }
  100% { text-shadow: 0 0 15px rgba(28, 28, 28, 0.13); opacity: 1; } }
.cource__map { opacity: 0; /* スクロールしたら画面上部で固定する:pc */ }
@media screen and (min-width: 781px), print { .cource__map { width: 91.67vw; height: 77.83vw; max-width: 1100px; max-height: 934px; position: absolute; top: 56px; right: -148px; z-index: -1; } }
@media (max-width: 780px) { .cource__map { width: 95.90vw; /* 374px */ margin-bottom: 8.21vw; /* 32px */ } }
.cource__map img { width: 100%; height: auto; object-fit: contain; vertical-align: top; }
.cource__map.sticky { position: fixed; top: 24px; }

.course__outlines { max-width: 1200px; margin-inline: auto; padding-top: 184px; position: relative; z-index: 1; }
@media (max-width: 780px) { .course__outlines { padding-top: 7.69vw; padding-inline: 4.10%; } }

@media screen and (min-width: 781px), print { .course__outline { max-width: 663px; margin-right: 45%; margin-left: 40px; } }
.course__outline:not(:last-child) { margin-bottom: min(12.31vw, 48px); }
.course__outline p { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; font-size: min(3.85vw, 1.5rem); /* min-font-size: 15px */ line-height: 1.6; }
.course__outline > div .course__outline__img img { width: 100%; height: auto; object-fit: contain; vertical-align: top; }
@media screen and (min-width: 781px), print { .course__outline > div::after { content: ''; display: block; clear: both; }
  .course__outline > div .course__outline__img { float: right; max-width: 320px; max-height: 213px; margin-left: 16px; margin-bottom: 16px; } }
@media (max-width: 780px) { .course__outline > div { display: flex; flex-wrap: wrap; }
  .course__outline > div .course__outline__img { width: 100%; margin-top: 5.13%; order: 2; } }

.course__outline__ttl { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(8.21vw, 4rem); /* min-font-size: 32px */ line-height: 1.2; text-transform: uppercase; }
.course__outline__ttl small { color: var(--red); font-size: min(5.13vw, 2.4rem); /* min-font-size: 20px */ line-height: 1.16; }
.course__outline__ttl strong { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-size: min(5.13vw, 2.4rem); /* min-font-size: 20px */ line-height: 2; }

/* TOP - SCHEDULE */
.shcedule { padding-top: 60px; padding-bottom: 120px; }
@media (max-width: 780px) { .shcedule { padding-top: 14.36%; /* 56px */ padding-bottom: 14.36%; /* 56px */ }
  .shcedule .inner { padding-left: 0; } }

.shcedule__ttl { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(11.54vw, 7.2rem); line-height: 1.35; margin-bottom: 28px; }
@media (max-width: 780px) { .shcedule__ttl { margin-bottom: 10.26%; padding-left: 4.10%; } }
.shcedule__ttl small { display: block; font-size: 1.7rem; line-height: 2.18; }
@media (max-width: 780px) { .shcedule__ttl.split-ttl span.row span.cell:nth-child(16) { display: block; } }

.schedule__box { border: 2px solid var(--black); border-radius: 24px; padding: 60px 0; position: relative; z-index: 1; /* 縦の点線 */ }
.schedule__box::after { content: ''; display: block; height: 100%; width: 3px; border-right: 3px dashed var(--black); position: absolute; top: 0; left: 20%; z-index: -1; }
@media (max-width: 780px) { .schedule__box { border-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; padding: 30px 0 0; /* 縦の点線 */ }
  .schedule__box::after { left: 6.15%; } }

.schedule__box__item { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }
@media screen and (min-width: 781px), print { .schedule__box__item { display: flex; flex-wrap: wrap; } }
@media (max-width: 780px) { .schedule__box__item { padding: 0 4% 10% 10%; } }
.schedule__box__item p { font-size: min(3.85vw, 1.6rem); line-height: 1.9; text-align: justify; }
@media screen and (min-width: 781px), print { .schedule__box__item .inbox { width: 80%; padding: 16px 40px 16px 28px; } }
@media (max-width: 780px) { .schedule__box__item .inbox { display: flex; flex-wrap: wrap; } }
@media screen and (min-width: 781px), print { .schedule__box__item .inbox > figure { width: 320px; margin-left: 32px; margin-bottom: 16px; float: right; } }
@media (max-width: 780px) { .schedule__box__item .inbox > figure { float: none; margin-top: 4.10%; width: 100%; order: 2; }
  .schedule__box__item .inbox > figure img { width: 100%; height: auto; object-fit: contain; vertical-align: top; } }

.schedule__time { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(5.13vw, 2.6rem); line-height: 1.9; }
@media screen and (min-width: 781px), print { .schedule__time { text-align: right; width: 20%; padding: 16px 16px 16px 0; } }
@media (max-width: 780px) { .schedule__time { line-height: 1.3; margin-left: -2.15vw; }
  .schedule__time::before { content: ''; display: inline-block; width: 18px; height: 18px; background-color: var(--red); border: 2px solid var(--gray); border-radius: 50%; margin-left: -11px; } }

.schedule__ttl { clear: both; font-weight: 700; font-size: min(4.62vw, 2.4rem); line-height: 1.9; }
@media (max-width: 780px) { .schedule__ttl { line-height: 1.3; margin-bottom: 10px; } }
@media screen and (min-width: 781px), print { .schedule__ttl { margin-left: -24px; }
  .schedule__ttl::before { content: ''; display: inline-block; width: 18px; height: 18px; background-color: var(--red); border: 2px solid var(--gray); border-radius: 50%; margin-right: 8px; margin-left: -11px; } }

/* TOP - BON VOYAGE */
.bon-voyage { background-color: #fff; }
@media screen and (min-width: 961px), print { .bon-voyage { display: flex; flex-wrap: wrap; justify-content: space-between; } }

@media screen and (min-width: 1001px), print { .bon-voyage__texts { width: 37.9%; padding: 2.77% 0 2.77% 8.3%; /* 40px 0 40px 120px / 1440 */ } }
@media (max-width: 1000px) { .bon-voyage__texts { padding: 56px 40px; } }
.bon-voyage__texts p { font-size: min(3.85vw, 1.6rem); /*15px*/ font-weight: 600; line-height: 2; text-align: justify; }

.bon-voyage__img { overflow: hidden; }
@media screen and (min-width: 1001px), print { .bon-voyage__img { width: 50.4%; background: url("../img/car_680x453.webp") left bottom no-repeat; background-size: cover; }
  .bon-voyage__img img { display: none; } }
@media (max-width: 1000px) { .bon-voyage__img { width: 100%; }
  .bon-voyage__img img { width: 100%; height: auto; object-fit: contain; vertical-align: top; } }

/* TOP - TEAM CAR */
.team-car { padding-top: 100px; padding-bottom: 100px; }
@media (max-width: 780px) { .team-car { padding-top: 14.36%; /* 56px */ padding-bottom: 14.36%; /* 56px */ }
  .team-car .ttl span.row > span.cell:nth-child(9) { display: inline-block; width: 10px; } }

.team-car__main-image { background: url("../img/bg_check.png") left top repeat; background-size: 40px 40px; margin: 0 auto min(7.09vw, 56px); padding: min(7.09vw, 56px) min(4.05vw, 32px); min-height: min(28vw, 326px); position: relative; /* wire svg setting & animation */ /* animation */ }
.team-car__main-image .car-image, .team-car__main-image .car-frame { max-width: 1200px; max-height: 221px; width: 100%; margin: auto; }
.team-car__main-image .car-image img, .team-car__main-image .car-frame img { width: 100%; height: auto; object-fit: contain; vertical-align: top; }
@media (max-width: 1200px) { .team-car__main-image .car-image, .team-car__main-image .car-frame { padding-inline: 16px; } }
.team-car__main-image .car-image { opacity: 0; position: absolute; left: 0; right: 0; }
.team-car__main-image .car-frame { position: absolute; left: 0; right: 0; margin: auto; z-index: 1; }
.team-car__main-image #wire-path path { fill: none; stroke: #fff; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 2000px; opacity: 0; }
@media (max-width: 780px) { .team-car__main-image #wire-path path { stroke-width: 2px; } }
.team-car__main-image.visible { animation: carBgAnm linear .1s infinite; animation-delay: 3.75s; }
@media (min-width: 1200px) { .team-car__main-image.visible { animation-duration: .05s; } }
@media (max-width: 780px) { .team-car__main-image.visible { animation-duration: 1s; } }
.team-car__main-image.visible #wire-path path { animation: svgAnm 1.5s linear forwards; opacity: 1; }
.team-car__main-image.visible .car-image { animation: carShow linear 1.25s forwards; animation-delay: 2s; }

@keyframes carBgAnm { 0% { background-position: right top; }
  100% { background-position: left top; } }
@keyframes svgAnm { 0% { fill: transparent; stroke-dashoffset: 2000px; }
  100% { stroke-dashoffset: 0; } }
@keyframes carShow { 0% { opacity: 0; }
  100% { opacity: 1; } }
.team-car__concept { max-width: 1054px; margin: 0 auto 56px; }
@media (max-width: 780px) { .team-car__concept { margin-bottom: 14.36%; /* 56px */ } }
.team-car__concept::after { content: ''; display: block; clear: both; }
.team-car__concept .ttl { display: block; }
@media screen and (min-width: 781px), print { .team-car__concept .ttl { float: left; width: 23%; max-width: 230px; margin-right: 4.67%; margin-bottom: 0; white-space: nowrap; } }
@media (max-width: 780px) { .team-car__concept .ttl { text-align: center; } }
.team-car__concept p { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; font-size: min(3.85vw, 1.6rem); /*min-font-size: 15px */ line-height: 2; }

ul.team-car__category { list-style: none; max-width: 1054px; margin: 0 auto 56px; }
@media screen and (min-width: 781px), print { ul.team-car__category { display: flex; justify-content: center; } }
ul.team-car__category li { white-space: nowrap; }
@media screen and (min-width: 781px), print { ul.team-car__category li { padding-inline: 3.89%; }
  ul.team-car__category li:not(:last-child) { border-right: 1px solid #fff; } }
@media (max-width: 780px) { ul.team-car__category li { text-align: center; }
  ul.team-car__category li:not(:last-child)::after { content: ''; display: block; height: 1px; width: 30%; margin: 5% auto; background-color: #fff; } }

.number { font-family: "Familjen Grotesk", sans-serif; font-optical-sizing: auto; font-style: normal; font-weight: 700; font-size: min(14.36vw, 6rem); /* min-font-size: 56px */ line-height: 1; vertical-align: baseline; white-space: nowrap; }

.txt--unit { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(8.21vw, 3.2rem); /* min-font-size: 32px */ line-height: 1; vertical-align: baseline; white-space: nowrap; margin-left: min(2.05vw, 8px); }

.team-car__category__name { color: var(--blue); display: block; text-align: center; font-size: min(4.1vw, 1.4rem); /* min-font-size: 16px */ line-height: 2.4; word-break: keep-all; }

/* TOP - SPECIFICATIONS */
.specifications { background-color: var(--darkgray); box-shadow: 0 0 13px rgba(0, 0, 0, 0.25); color: #fff; max-width: 683px; margin-inline: auto; padding: 32px; }
@media (max-width: 780px) { .specifications { padding: 8.21% 6.15%; /* 32px 24px */ } }

.specifications__ttl { color: #d4d4d4; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(5.13vw, 2.8rem); /* min-font-size: 20px */ line-height: 1.5; border-bottom: 1px solid #a3a3a3; padding-bottom: 8px; margin-bottom: 24px; }
.specifications__ttl small { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-size: 50%; vertical-align: baseline; }

dl.specifications__list { display: flex; flex-wrap: wrap; color: #d4d4d4; font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; font-size: min(3.59vw, 1.3rem); /*min-font-size: 14px */ line-height: 1.5; }
dl.specifications__list dt { width: 20%; text-align: right; }
dl.specifications__list dd { width: calc(100% - 20% - 5.8%); margin-left: 5.8%; }
dl.specifications__list dt, dl.specifications__list dd { margin-bottom: 8px; }

.btn--challenger { display: block; color: #fff; text-decoration: none; border: 2px solid #fff; border-radius: min(8.21vw, 32px); padding: min(6.15vw, 32px); /* 24px */ margin: min(20.51vw, 80px) auto 0; max-width: 960px; position: relative; }
.btn--challenger .btn--challenger__txt { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(8.21vw, 4rem); line-height: 1.4; }
.btn--challenger .btn--challenger__txt small { display: block; font-size: min(5.13vw, 1.8rem); font-weight: 600; line-height: 1.6; }
.btn--challenger > i { display: block; width: min(12.31vw, 48px); height: min(12.31vw, 48px); border: 2px solid #fff; border-radius: 50%; position: absolute; right: min(3.08vw, 24px); bottom: min(3.08vw, 24px); transition: background linear .3s, transform linear .2s; }
.btn--challenger > i svg { fill: #fff; width: min(5.13vw, 20px); height: min(2.05vw, 8px); transform: translate(60%, 200%); transition: background linear .2s, transform linear .2s; }
@media (hover: hover) { .btn--challenger:hover > i { transform: scale(75%); background-color: #fff; }
  .btn--challenger:hover > i svg { fill: var(--blue); transform: translate(75%, 200%); } }

/* TOP - SPONSOR */
.sponsor { background-color: #fff; padding-top: 100px; padding-bottom: 100px; }
@media (max-width: 780px) { .sponsor { padding-top: 14.36%; padding-bottom: 0; } }
.sponsor .ttl { color: var(--blue); }

.sponsor__logos { max-width: 1200px; margin-inline: auto; }
.sponsor__logos .sponsor__logo { list-style: none; display: flex; justify-content: space-between; }
.sponsor__logos .sponsor__logo .sponsor__logo__item { width: min(20vw, 198px); max-width: 198px; }
.sponsor__logos .sponsor__logo .sponsor__logo__item img { width: 100%; height: auto; object-fit: contain; vertical-align: top; }

@media screen and (min-width: 781px), print { .sponsor__logos .sponsor__logo { flex-wrap: wrap; } }
@media (max-width: 780px) { .sponsor__logos { display: flex; flex-wrap: nowrap; overflow: hidden; width: 100%; /*height: min(25.38vw, 99px);*/ }
  .sponsor__logos .sponsor__logo { display: flex; animation: infinity-scroll-left 30s infinite linear 0.5s both; }
  .sponsor__logos .sponsor__logo .sponsor__logo__item { flex-basis: 20vw; flex-shrink: 0; width: 20vw; /*height: 8.25vw; */ } }
/* FOOTER */
#footer { background-color: #fff; padding-top: 80px; }
@media (max-width: 780px) { #footer { padding-top: 14.36%; } }
#footer .bg--grad--gray { padding-top: 64px; padding-bottom: 32px; }
@media (max-width: 780px) { #footer .bg--grad--gray { padding-top: 12.31%; padding-bottom: 8.21%; } }

@media screen and (min-width: 781px), print { .footer__banners { display: flex; flex-wrap: wrap; justify-content: center; margin-inline: 16px; margin-bottom: 40px; } }
@media (max-width: 780px) { .footer__banners { padding: 0 2.67% 2.67%; } }
.footer__banners .footer__banner { display: block; background-color: #ccc; color: #fff; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(7.18vw, 4.8rem); line-height: 0.9; text-align: center; text-decoration: none; width: 48%; padding: min(8.21vw, 60px); /*32px */ position: relative; }
.footer__banners .footer__banner small { display: block; font-size: min(4.62vw, 1.8rem); line-height: 1.9; }
.footer__banners .footer__banner > i { display: block; width: min(12.31vw, 48px); height: min(12.31vw, 48px); border: 2px solid #fff; border-radius: 50%; position: absolute; right: min(3.08vw, 24px); bottom: min(3.08vw, 24px); transition: background ease-in-out .3s, transform ease-in-out .2s; }
.footer__banners .footer__banner > i svg { fill: #fff; width: min(5.13vw, 20px); height: min(2.05vw, 8px); transform: translate(60%, 200%); transition: background ease-in-out .2s, transform ease-in-out .2s; }
@media (hover: hover) { .footer__banners .footer__banner:hover > i { transform: scale(75%); background-color: #fff; }
  .footer__banners .footer__banner:hover > i svg { fill: var(--blue); transform: translate(75%, 200%); } }
.footer__banners .footer__banner.donation { background: url("../img/common/banner_donation.webp") center center no-repeat; background-size: cover; }
@media screen and (min-width: 781px), print { .footer__banners .footer__banner { max-width: 640px; }
  .footer__banners .footer__banner.donation { margin-right: 4%; } }
@media (max-width: 780px) { .footer__banners .footer__banner { width: 100%; }
  .footer__banners .footer__banner:not(:last-child) { margin-bottom: 4.10%; } }

.footer__logos { list-style: none; display: flex; flex-wrap: wrap; align-items: center; /*&.other { margin-top: 40px; @media (max-width: 780px) { margin-top: 5.13%; } .footer__logo {}
}*/ }
@media screen and (min-width: 781px) { .footer__logos { justify-content: center; } }
.footer__logos .footer__logo { flex-shrink: 0; margin: 8px 16px; }

.copyrights { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 400; font-size: 1.2rem; line-height: 1.16; text-align: center; margin-top: 64px; }
@media (max-width: 780px) { .copyrights { margin-top: 12.31%; } }

/* PAGE */
body.page { background-color: #fff; }
body.page::after { content: ''; display: block; background-color: var(--blue); width: 100%; height: 100vh; animation: pageView linear 0.75s forwards; position: fixed; bottom: 0; left: 0; z-index: 11; pointer-events: none; transform: translateY(-100%); }
body.page header, body.page .container, body.page footer { opacity: 0; animation: pageShow ease 1.25s forwards running; animation-delay: 1s; }

@keyframes pageView { 0% { transform: translateY(100%); }
  50% { transform: translateY(0%); }
  100% { transform: translateY(100%); } }
@keyframes pageShow { 0% { opacity: 0; filter: blur(3px); }
  100% { opacity: 1; filter: blur 0px; } }
.page-header { width: 100%; min-height: 600px; background-color: var(--blue); display: flex; align-items: center; }
.page-header .page-ttl { color: #fff; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(13.85vw, 10.8rem); line-height: 1.24; margin-left: min(6.15vw, 48px); text-shadow: 1px 1px 9px rgba(0, 0, 0, 0.25); }
.page-header .page-ttl small { display: block; font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 600; font-style: normal; font-size: min(4.1vw, 3.2rem); line-height: 1.5; }

main.challenger .page-header { background: url("../img/bg_page-header_challenger.jpg") top center no-repeat; background-size: auto 600px; background-attachment: fixed; }
@media (max-width: 780px) { main.challenger .page-header { background: url("../img/bg_page-header_challenger_sp.jpg") top center no-repeat; background-size: 100% auto; background-attachment: fixed; } }

/* page navigation */
.pagenav { max-width: 1200px; margin-inline: auto; margin-bottom: 88px; display: flex; justify-content: flex-end; }
@media (max-width: 1200px) { .pagenav { padding-inline: 16px; } }
.pagenav.fixed { position: fixed; top: 0; right: 0; }

.pagenav__list { list-style: none; font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 500; font-size: min(4.1vw, 1.6rem); line-height: 1.5; }
.pagenav__list::after { content: ''; display: block; clear: both; }
.pagenav__list .pagenav__list__item { border: 2px solid var(--black); border-radius: min(6.15vw, 24px); background-color: #fff; margin: 4px; float: left; }
.pagenav__list .pagenav__list__item a { border-radius: min(6.15vw, 24px); display: inline-block; color: var(--black); padding: min(2.05vw, 8px) min(4.1vw, 16px); text-decoration: none; transition: color ease-in-out .2s, background ease-in-out .2s; }
@media (hover: hover) { .pagenav__list .pagenav__list__item a:hover { color: #fff; background-color: var(--black); } }

/* CHALLENGER */
@media (max-width: 1200px) { article.challenger { padding-inline: 16px; } }
article.challenger:not(:last-child) { margin-bottom: 40px; }

.page section { padding-top: min(14.36vw, 80px); /* min-padding-top: 56px */ padding-bottom: min(14.36vw, 80px); /* min-padding-top: 56px */ }

.profile__list { list-style: none; display: flex; flex-wrap: wrap; max-width: 1200px; margin-inline: auto; /* driver */ /* not driver - profile image */ /* challenger - common profile */ }
.profile__list.center { justify-content: center; }
.profile__list.driver { margin-bottom: 80px; }
@media (max-width: 780px) { .profile__list.driver { display: block; } }
.profile__list.driver .profile { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; position: relative; z-index: 1; padding-inline: 24px; margin-bottom: 20px; /* animation */ }
@media screen and (min-width: 1200px), print { .profile__list.driver .profile { max-width: 380px; width: 31.67%; margin-right: 1.67%; }
  .profile__list.driver .profile:nth-child(3n) { margin-right: 0; } }
@media (max-width: 1199px) and (min-width: 781px) { .profile__list.driver .profile { width: 48%; }
  .profile__list.driver .profile:nth-child(odd) { margin-right: 4%; } }
@media (max-width: 780px) { .profile__list.driver .profile { width: 100%; } }
.profile__list.driver .profile::after { content: ''; display: block; width: 100%; height: 100%; background: url("../img/challenger/bg_b.jpg") center center no-repeat; background-size: cover; position: absolute; bottom: -8px; left: 0; z-index: -1; clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%); }
.profile__list.driver .profile .profile__position { color: var(--red); font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: 6.4rem; line-height: 1; position: absolute; top: 0; left: 24px; mix-blend-mode: luminosity; transform: translateX(-150%); opacity: 0; }
.profile__list.driver .profile .profile__txt { width: calc(100% - 120px); padding-bottom: 24px; color: #fff; text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5); transform: translateX(-150%); opacity: 0; }
.profile__list.driver .profile .profile__txt .profile__name { font-size: 2.8rem; font-weight: 600; letter-spacing: 0.1em; }
.profile__list.driver .profile .profile__txt .profile__pref { font-size: 1.3rem; font-weight: 400; letter-spacing: 0.1em; }
.profile__list.driver .profile .profile__img { width: 120px; height: 220px; /*transform: translateX(150%);*/ opacity: 0; }
.profile__list.driver .profile.visible::after { animation: driverBgAnm linear .25s forwards; }
.profile__list.driver .profile.visible .profile__position { animation: driverAnm01 linear .35s forwards; animation-delay: 0.25s; }
.profile__list.driver .profile.visible .profile__txt { animation: driverAnm01 linear .35s forwards; animation-delay: 0.25s; }
.profile__list.driver .profile.visible .profile__img { animation: driverAnm02 linear .5s forwards; animation-delay: 0.75s; }
@keyframes driverBgAnm { 0% { clip-path: polygon(0 15%, 0 15%, 0 100%, 0 100%); }
  100% { clip-path: polygon(0 15%, 100% 0%, 100% 85%, 0% 100%); } }
@keyframes driverAnm01 { 0% { transform: translateX(-150%); opacity: 0; }
  100% { transform: translateX(0%); opacity: 1; } }
@keyframes driverAnm02 { 0% { /*transform: translateX(150%);*/
opacity: 0; }
  100% { /*transform: translateX(0%);*/
opacity: 1; } }
@media screen and (min-width: 1200px), print { .profile__list:not(.driver) .profile { margin-bottom: 40px; width: 15%; max-width: 180px; margin-right: 1.65%; } }
@media (max-width: 1199px) and (min-width: 781px) { .profile__list:not(.driver) .profile { width: 22%; margin-right: 4%; margin-bottom: 2%; }
  .profile__list:not(.driver) .profile:nth-child(4n) { margin-right: 0; } }
@media (max-width: 780px) { .profile__list:not(.driver) .profile { width: 48%; }
  .profile__list:not(.driver) .profile:nth-child(odd) { margin-right: 4%; } }
.profile__list:not(.driver) .profile .profile__name { text-align: center; }
.profile__list:not(.driver) .profile .profile__pref { display: block; padding: 8px; background-color: #f1f1f1; }
.profile__list:not(.driver) .profile__img { display: block; text-align: center; overflow: hidden; margin-bottom: 12px; }
@media screen and (min-width: 1200px), print { .profile__list:not(.driver) .profile__img { max-width: 180px; max-height: 180px; } }
.profile__list:not(.driver) .profile__img > img { width: 100%; height: auto; object-fit: contain; vertical-align: top; }
.profile__list .profile__img.move { position: relative; z-index: 1; }
.profile__list .profile__img.move::after { content: ''; display: block; width: 100%; height: 80%; background-color: var(--blue); clip-path: polygon(0 15%, 100% 0%, 100% 85%, 0% 100%); position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%) scale(0%); opacity: 0; z-index: -1; }
.profile__list .profile__img.move.visible::after { animation: anmProfileBg ease-in-out .3s forwards; animation-delay: 0.1s; }
.profile__list .profile__img.move.visible img { animation: anmProfileImg ease-in-out .35s forwards; animation-delay: 0.5s; }
.profile__list .profile__img.move > img { transform: translateY(100%); }
@keyframes anmProfileBg { 0% { transform: translateY(-50%) scale(0%); opacity: 0; }
  100% { transform: translateY(-50%) scale(100%); opacity: 1; } }
@keyframes anmProfileImg { 0% { transform: translateY(100%); }
  100% { transform: translateY(0%); } }
.profile__list .profile { flex-basis: auto; flex-shrink: 1; /* hover */ }
.profile__list .profile .profile__name { display: block; font-size: 1.8rem; font-weight: 600; line-height: 1.4; margin-bottom: 8px; }
.profile__list .profile .profile__name > span { font-size: 1.2rem; line-height: 1; font-weight: 600; color: var(--red); }
.profile__list .profile .profile__pref { font-size: 1.2rem; font-weight: 500; line-height: 1.3; }
.profile__list .profile:has(a) a { color: var(--black); text-decoration: none; transition: background ease-in-out .3s, color ease-in-out .3s; }
.profile__list .profile:has(a) a:hover { opacity: 1; color: var(--red); }
.profile__list .profile:has(a) a:hover .profile__img.move::after { background-color: var(--red); }
.profile__list .profile:has(a) a .profile__img.move::after { transition: background ease-in-out .3s; }

.ttl--marker { display: inline-block; margin-bottom: min(4vw, 48px); padding: 8px 16px; position: relative; z-index: 1; }
.ttl--marker::after { content: ''; display: block; background-color: var(--black); width: 0%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; }
.ttl--marker.visible::after { animation: anmMarker ease-in-out .5s forwards; }
.ttl--marker.visible span, .ttl--marker.visible small { animation: anmMakerTxt ease-in-out .35s forwards; animation-delay: .45s; }
.ttl--marker span, .ttl--marker small { color: #fff; display: inline-block; vertical-align: baseline; opacity: 0; }
.ttl--marker span { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; font-weight: 600; font-size: min(6.15vw, 4.8rem); line-height: 1.2; }
.ttl--marker small { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; font-size: min(2.56vw, 2rem); margin-left: 6px; }

@keyframes anmMarker { 0% { width: 0%; }
  100% { width: 100%; } }
@keyframes anmMakerTxt { 0% { opacity: 0; transform: translateX(-50px); }
  100% { opacity: 1; transform: translateX(0px); } }
/* box style - 大枠のボックスの上部だけ角丸 */
.boxstyle--start-round { border-top-left-radius: min(8.21vw, 80px); border-top-right-radius: min(8.21vw, 80px); }

* + .boxstyle--start-round { margin-top: -80px; position: relative; }

@media (max-width: 780px) { * + .boxstyle--start-round { margin-top: -8.21vw; } }
@media screen and (min-width: 781px) { .sp-only { display: none; } }
@media (max-width: 780px) { .pc-only { display: none; } }
/* background-color */
.bg--white { background-color: #fff; }

.bg--blue { background-color: #00a0e9; }

.bg--gray { background-color: #e8e8e8; }

.bg--darkgray { background-color: #4d4d4d; }

.bg--grad--gray { color: #fff; background-image: linear-gradient(75deg, #7e7e7e 0%, #4d4d4d 25%); }

/* font family */
.txt--en { font-family: "Georama", sans-serif; font-optical-sizing: auto; font-variation-settings: "wdth" 100; }

/* text align */
.align--left { text-align: left; }

.align--center { text-align: center; }

.align--right { text-align: right; }

/* text */
.notes { text-indent: -1.6rem; margin-left: 1.6rem; }
.notes::before { content: '※'; }

html[lang="en"] .notes::before { content: '*'; }

/* animation */
.anm--slideup { opacity: 0; }

.anm--slideup.visible { animation: slideup ease 0.75s forwards; }

.anm--slideup.visible:nth-child(1) { animation-delay: 0s; }

.anm--slideup.visible:nth-child(2) { animation-delay: 0.1s; }

.anm--slideup.visible:nth-child(3) { animation-delay: 0.2s; }

.anm--slideup.visible:nth-child(4) { animation-delay: 0.3s; }

.anm--slideup.visible:nth-child(5) { animation-delay: 0.4s; }

.anm--slideup.visible:nth-child(6) { animation-delay: 0.5s; }

.anm--slideup.visible:nth-child(7) { animation-delay: 0.6s; }

.anm--slideup.visible:nth-child(8) { animation-delay: 0.7s; }

.anm--slideup.visible:nth-child(9) { animation-delay: 0.8s; }

.anm--slideup.visible:nth-child(10) { animation-delay: 0.9s; }

.anm--slideup.visible:nth-child(11) { animation-delay: 1s; }

@keyframes slideup { 0% { transform: translateY(100px); opacity: 0; }
  100% { transform: translateY(0px); opacity: 1; } }
.anm--slidedown { opacity: 0; }

.anm--slidedown.visible { animation: slidedown ease 0.75s forwards; }

.anm--slidedown.visible:nth-child(1) { animation-delay: 0s; }

.anm--slidedown.visible:nth-child(2) { animation-delay: 0.1s; }

.anm--slidedown.visible:nth-child(3) { animation-delay: 0.2s; }

.anm--slidedown.visible:nth-child(4) { animation-delay: 0.3s; }

.anm--slidedown.visible:nth-child(5) { animation-delay: 0.4s; }

.anm--slidedown.visible:nth-child(6) { animation-delay: 0.5s; }

.anm--slidedown.visible:nth-child(7) { animation-delay: 0.6s; }

.anm--slidedown.visible:nth-child(8) { animation-delay: 0.7s; }

.anm--slidedown.visible:nth-child(9) { animation-delay: 0.8s; }

.anm--slidedown.visible:nth-child(10) { animation-delay: 0.9s; }

.anm--slidedown.visible:nth-child(11) { animation-delay: 1s; }

@keyframes slidedown { 0% { transform: translateY(-100px); opacity: 0; }
  100% { transform: translateY(0px); opacity: 1; } }
.anm--slideleft { opacity: 0; }

.anm--slideleft.visible { animation: slideleft ease 0.75s forwards; }

.anm--slideleft.visible:nth-child(1) { animation-delay: 0s; }

.anm--slideleft.visible:nth-child(2) { animation-delay: 0.1s; }

.anm--slideleft.visible:nth-child(3) { animation-delay: 0.2s; }

.anm--slideleft.visible:nth-child(4) { animation-delay: 0.3s; }

.anm--slideleft.visible:nth-child(5) { animation-delay: 0.4s; }

.anm--slideleft.visible:nth-child(6) { animation-delay: 0.5s; }

.anm--slideleft.visible:nth-child(7) { animation-delay: 0.6s; }

.anm--slideleft.visible:nth-child(8) { animation-delay: 0.7s; }

.anm--slideleft.visible:nth-child(9) { animation-delay: 0.8s; }

.anm--slideleft.visible:nth-child(10) { animation-delay: 0.9s; }

.anm--slideleft.visible:nth-child(11) { animation-delay: 1s; }

@keyframes slideleft { 0% { transform: translateX(100px); opacity: 0; }
  100% { transform: translateX(0px); opacity: 1; } }
.anm--slideright { opacity: 0; }

.anm--slideright.visible { animation: slideright ease 0.75s forwards; }

.anm--slideright.visible:nth-child(1) { animation-delay: 0s; }

.anm--slideright.visible:nth-child(2) { animation-delay: 0.1s; }

.anm--slideright.visible:nth-child(3) { animation-delay: 0.2s; }

.anm--slideright.visible:nth-child(4) { animation-delay: 0.3s; }

.anm--slideright.visible:nth-child(5) { animation-delay: 0.4s; }

.anm--slideright.visible:nth-child(6) { animation-delay: 0.5s; }

.anm--slideright.visible:nth-child(7) { animation-delay: 0.6s; }

.anm--slideright.visible:nth-child(8) { animation-delay: 0.7s; }

.anm--slideright.visible:nth-child(9) { animation-delay: 0.8s; }

.anm--slideright.visible:nth-child(10) { animation-delay: 0.9s; }

.anm--slideright.visible:nth-child(11) { animation-delay: 1s; }

@keyframes slideright { 0% { transform: translateX(-100px); opacity: 0; }
  100% { transform: translateX(0px); opacity: 1; } }
.anm--fadein { opacity: 0; }

.anm--fadein.visible { animation: fadein ease 0.75s forwards; }

.anm--fadein.visible:nth-child(1) { animation-delay: 0s; }

.anm--fadein.visible:nth-child(2) { animation-delay: 0.1s; }

.anm--fadein.visible:nth-child(3) { animation-delay: 0.2s; }

.anm--fadein.visible:nth-child(4) { animation-delay: 0.3s; }

.anm--fadein.visible:nth-child(5) { animation-delay: 0.4s; }

.anm--fadein.visible:nth-child(6) { animation-delay: 0.5s; }

.anm--fadein.visible:nth-child(7) { animation-delay: 0.6s; }

.anm--fadein.visible:nth-child(8) { animation-delay: 0.7s; }

.anm--fadein.visible:nth-child(9) { animation-delay: 0.8s; }

.anm--fadein.visible:nth-child(10) { animation-delay: 0.9s; }

.anm--fadein.visible:nth-child(11) { animation-delay: 1s; }

@keyframes fadein { 0% { opacity: 0; filter: blur(10px); }
  100% { opacity: 1; } }
.anm--fadeout { opacity: 1; }

.anm--fadeout.visible { animation: fadeout ease 0.75s forwards; }

.anm--fadeout.visible:nth-child(1) { animation-delay: 0s; }

.anm--fadeout.visible:nth-child(2) { animation-delay: 0.1s; }

.anm--fadeout.visible:nth-child(3) { animation-delay: 0.2s; }

.anm--fadeout.visible:nth-child(4) { animation-delay: 0.3s; }

.anm--fadeout.visible:nth-child(5) { animation-delay: 0.4s; }

.anm--fadeout.visible:nth-child(6) { animation-delay: 0.5s; }

.anm--fadeout.visible:nth-child(7) { animation-delay: 0.6s; }

.anm--fadeout.visible:nth-child(8) { animation-delay: 0.7s; }

.anm--fadeout.visible:nth-child(9) { animation-delay: 0.8s; }

.anm--fadeout.visible:nth-child(10) { animation-delay: 0.9s; }

.anm--fadeout.visible:nth-child(11) { animation-delay: 1s; }

@keyframes fadeout { 0% { opacity: 1; }
  80% { opacity: 0.5; filter: blur(10px); }
  100% { opacity: 0; } }
/* animation delay */
.delay-a { animation-delay: 0.1s; }

.delay-b { animation-delay: 0.2s; }

.delay-c { animation-delay: 0.3s; }

.delay-d { animation-delay: 0.4s; }

.delay-e { animation-delay: 0.5s; }