@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&family=Sawarabi+Mincho&family=Montserrat:wght@300;400&display=swap');

/* ==========================================================================
   ONLINE CONFERENCE LP - Style
   Breakpoints: PC > 1024px / TAB <= 1024px / MB <= 600px
   ========================================================================== */
/* ---------- 既存のヘッダーフッターを非表示 ---------- */

#header-content ,
footer ,
#toTOP {
	display: none;
}

:root {
  /* Fonts */
  --font-heading: 'Sawarabi Mincho', serif;
  --font-body: 'Sawarabi Gothic', sans-serif;
  --font-en: 'Montserrat', sans-serif;

  /* Colors - neutral */
  --color-neutral-900: #17181A;
  --color-white: #FFFFFF;

  /* Colors - primary (blue) */
  --color-blue-50: #EEF5FF;
  --color-blue-200: #BCD8FF;
  --color-blue-300: #8EC0FF;
  --color-blue-500: #387EFF;
  --color-blue-900: #19348F;
  --color-blue-950: #070F2C;

  /* Colors - secondary (apricot) */
  --color-apricot-50: #FCF5F0;
  --color-apricot-300: #E7AE8A;
  --color-apricot-400: #DB8155;
  --color-apricot-600: #C65130;
  --color-apricot-900: #6B2D23;

  /* Gradients */
  --gradient-duo: linear-gradient(90deg, #387EFF 0%, #A48DCE 50%, #DB8155 100%);
  --gradient-hero-to-concept: linear-gradient(180deg, var(--color-blue-950) 0%, var(--color-blue-300) 100%);
  --gradient-concept-to-keynote: linear-gradient(180deg, var(--color-blue-300) 0%, var(--color-apricot-50) 100%);
  --gradient-keynote-to-programs: linear-gradient(180deg, var(--color-apricot-50) 0%, var(--color-white) 100%);

  --max-width: 1080px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body, h1, h2, h3, h4, p, dl, dd, dt, figure, button { margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font-body);
  color: var(--color-neutral-900);
  background: var(--color-white);
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
button { font: inherit; border: none; background: none; cursor: pointer; }
ul, ol { list-style: none; }
a { color: inherit; text-decoration: none; }
.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
body.no-scroll { overflow: hidden; }

/* ---------- Shared layout ---------- */
.max1080 {
  max-width: var(--max-width);
  margin: 0 auto;
  width: 100%;
}
section { position: relative; }

/* Gradient headings ("Keynote" / "All Programs" / "FAQ" / "Overview" / "Registration") */
.en-heading {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 96px;
  line-height: 1.3;
  background: var(--gradient-duo);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-align: center;
  opacity: .85;
}

/* ---------- Buttons ---------- */
.btn-cta {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  max-width: 400px;
  padding: 24px 56px;
  border-radius: 999px;
  background: var(--color-apricot-400);
  border: 1px solid var(--color-blue-300);
  box-shadow: 0 4px 40px -10px rgba(0,0,0,.5);
  color: var(--color-white);
  font-family: var(--font-heading);
  font-size: 20px;
  line-height: 1.3;
}
.btn-cta::before {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 140%;
  z-index: 0;
  /* solid color reaches past the button's right edge (75% of this 140%-wide box = 105% of the button)
     so the fade-out only ever shows in the overflow-hidden area, never inside the visible button */
  background: linear-gradient(to right, var(--color-blue-950) 0%, var(--color-blue-950) 75%, rgba(7, 15, 44, 0) 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s ease;
}
.btn-cta:hover::before { transform: scaleX(1); }
.btn-cta span, .btn-cta img { position: relative; z-index: 1; }
.btn-cta img { width: 24px; height: 24px; }
.btn-cta.is-disabled { opacity: .5; pointer-events: none; }

.btn-sm {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 24px;
  padding: 0 8px;
  border-radius: 24px;
  color: var(--color-blue-500);
  font-size: 14px;
}
.btn-sm img { width: 8px; height: auto; }
.btn-sm:hover { background: var(--color-blue-50); }

/* ---------- Schedule badge ---------- */
.schedule { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.schedule__date { display: flex; align-items: baseline; flex-wrap: wrap; row-gap: 4px; gap: 16px; line-height:1; }
.schedule__date-num {
  font-family: var(--font-en); font-weight: 200; font-size: 48px;
  letter-spacing: 2.4px; color: var(--color-white);
}
.schedule__day {
  display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border: 1px solid var(--color-white);
  border-radius: 4px; color: var(--color-white); font-size: 22px;
  transform: translateY(-4px);
}
.schedule__time {
  font-family: var(--font-en); font-weight: 300; font-size: 32px;
  letter-spacing: 1.6px; color: var(--color-white);
}
.schedule__tags { display: flex; gap: 4px; width: 100%; }
.schedule__tags span {
  display: flex; align-items: center; justify-content: center;
  background: var(--color-white); color: var(--color-blue-900);
  font-size: 14px; padding: 0 16px; line-height: 1.6; text-align: center;
}
.schedule.is-dark .schedule__date-num,
.schedule.is-dark .schedule__day,
.schedule.is-dark .schedule__time { color: var(--color-neutral-900); }
.schedule.is-dark .schedule__day { border-color: var(--color-neutral-900); }
.schedule.is-blue .schedule__date-num,
.schedule.is-blue .schedule__day,
.schedule.is-blue .schedule__time { color: var(--color-blue-900); }
.schedule.is-blue .schedule__day { border-color: var(--color-blue-900); }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 24px 56px;
}
.site-header__logo { height: 24px; }
.site-header .btn-cta {
  width: auto; padding: 12px 32px; box-shadow: none;
  border-color: transparent;
  background: linear-gradient(var(--color-neutral-900), var(--color-neutral-900)) padding-box, var(--gradient-duo) border-box;
  font-family: var(--font-body); font-size: 16px;
}
.site-header .btn-cta:hover::before { transform: scaleX(1); }
.site-header .btn-cta img { display: none; }

/* ==========================================================================
   Hero (KV)
   ========================================================================== */
.hero {
  background: var(--color-blue-950) url('/wp-content/themes/loov-video2025/img/seminar/2026-09-15_conference/images/bg_pc-tab.jpg') fixed center / cover no-repeat;
  padding: 160px 80px 80px;
  overflow: hidden;
}
.hero__inner {
  max-width: 1440px; margin: 0 auto;
  display: flex; align-items: center; justify-content: center; gap: 40px;
}
.hero__text { flex: 1 1 0; max-width: 620px; }
.hero__lead { color: var(--color-white); font-family: var(--font-heading); font-size: min(2vw, 30px); margin-bottom: 24px; }
.hero__title { display: flex; flex-direction: column; gap: 30px; width: 100%; max-width: 588px; margin-bottom: 24px; }
.hero__title img { display: block; height: auto; }
.hero__title-1 { width: 95%; }
.hero__title-2 { width: 70%; }
.hero__sub { display: flex; flex-wrap: wrap; gap: 8px; color: var(--color-white); font-size: 20px; margin-bottom: 96px; }
.hero__cv { display: flex; flex-direction: column; align-items: flex-start; gap: 40px; }
.hero .btn-cta { width: 100%; }
.hero__image { flex: 1 1 0; max-width: 620px; }
.hero__kv { width: 100%; height: auto; }

/* ==========================================================================
   Partners
   ========================================================================== */
.partners {
  --marquee-gap: 40px;
  background: var(--color-blue-950);
  padding: 0 0 100px;
  margin-bottom: -1px;
  overflow: hidden;
}
.partners__marquee { overflow: hidden; width: 100%; }
.partners__marquee--double { display: none; }
.partners__marquee--double .partners__track:not(:last-child) { margin-bottom: 24px; }
.partners__track {
  display: flex; gap: var(--marquee-gap); width: max-content;
  animation: partners-scroll 50s linear infinite;
}
.partners__list { display: flex; align-items: center; flex-shrink: 0; gap: var(--marquee-gap); }
.partners__list img {
  flex-shrink: 0; width: 160px; height: 90px; background: var(--color-white);
  border-radius: 8px; object-fit: contain; padding: 12px;
}
@keyframes partners-scroll {
  from { transform: translateX(-50%); }
  to { transform: translateX(0%); }
}

/* ==========================================================================
   Concept / Benefits
   ========================================================================== */
.concept-benefits { background: var(--gradient-hero-to-concept); margin-bottom: -1px; }
.concept {
  padding: 120px 80px;
  display: flex; justify-content: center;
}
.concept .max1080 { display: flex; gap: 56px; }
.concept__heading { flex-shrink: 0; display: flex; flex-direction: column; gap: 16px; }
.concept__heading span {
  display: block; background: var(--color-white); color: var(--color-blue-950);
  font-family: var(--font-heading); font-size: 48px; line-height: 1.3; padding: 0 20px; width: fit-content;
}
.concept__body { flex: 1 1 0; color: var(--color-blue-50); font-size: 16px; display: flex; flex-direction: column; gap: 24px; }
.concept__body em { color: var(--color-apricot-300); font-style: normal; }

.benefits { padding: 80px; display: flex; justify-content: center; }
.benefits .max1080 { display: flex; flex-direction: column; align-items: center; gap: 56px; }
.benefits__title { color: var(--color-white); font-family: var(--font-heading); font-size: 32px; width: 100%; }
.benefits__grid { display: flex; gap: 24px; width: 100%; }
.benefit {
  flex: 1 1 0; padding: 0 32px; border-left: 1px solid var(--color-blue-200);
  display: flex; flex-direction: column; gap: 24px; color: var(--color-white);
}
.benefit__icon { width: 64px; height: 64px; border-radius: 8px; }
.benefit__title { font-family: var(--font-heading); font-size: 24px; line-height: 1.3; }
.benefit__text { font-size: 14px; line-height: 1.6; }

.cv-area { padding: 80px; display: flex; justify-content: center; }
.cv-area__inner { display: flex; align-items: center; justify-content: center; gap: 40px; max-width: var(--max-width); width: 100%; }

/* ==========================================================================
   Keynote
   ========================================================================== */
.keynote {
  background: var(--gradient-concept-to-keynote);
  padding: 200px 80px 120px;
  display: flex; flex-direction: column; align-items: center; gap: 40px;
  position: relative;
}
.keynote .en-heading {
  position: absolute; top: 60px;
  left: calc(50% - 620px);
  font-size: 152px; text-align: left;
  white-space: nowrap;
}
.keynote-card {
  display: flex; gap: 40px; align-items: center; width: 100%; max-width: 980px;
  background: rgba(255,255,255,.2); border: solid 2px #fff; border-radius: 8px; padding: 24px 40px;
  z-index: 1;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.keynote-card__text { flex: 1 1 0; display: flex; flex-direction: column; gap: 32px; }
.keynote-card__category {
  display: inline-flex; padding: 2px 16px; border-radius: 40px;
  background: var(--color-blue-500); color: var(--color-white); font-size: 14px; line-height: 1.6; width: fit-content;
}
.keynote-card__title { font-family: var(--font-heading); font-size: 32px; line-height: 1.3; margin-bottom: 8px; }
.keynote-card__subtitle { font-size: 16px; color: rgba(23,24,26,.5); }
.keynote-card__speaker img { height: 54px; width: auto; margin-bottom: 8px; }
.keynote-card__speaker-info p:first-of-type { font-size: 14px; color: rgba(23,24,26,.5); padding-top: 8px; border-top: 1px solid rgba(23,24,26,.2); }
.keynote-card__speaker-info p:last-of-type { font-size: 16px; }
.keynote-card__visual { flex: 0 0 360px; }
.keynote-card__visual img { width: 100%; height: auto; border-radius: 8px; }
.keynote-card--reverse { flex-direction: row-reverse; }

/* ==========================================================================
   All Programs
   ========================================================================== */
.all-programs {
  background: var(--gradient-keynote-to-programs);
  padding: 80px; display: flex; justify-content: center;
}
.all-programs .max1080 { display: flex; flex-direction: column; align-items: center; gap: 40px; text-align: center; }
.all-programs .en-heading { font-size: 48px; }
.all-programs__lead { font-family: var(--font-heading); font-size: 32px; }
.all-programs__stats { display: flex; align-items: center; justify-content: center; }
.all-programs__stat { display: flex; flex-direction: column; align-items: center; padding: 0 40px; }
.all-programs__stat + .all-programs__stat { border-left: 1px solid rgba(23,24,26,.2); }
.all-programs__stat b { font-family: var(--font-en); font-weight: 300; font-size: 48px; color: var(--color-blue-500); font-variant-numeric: tabular-nums; }
.all-programs__stat span { font-size: 16px; }
.all-programs__desc { font-size: 22px; color: rgba(23,24,26,.5); }

/* ==========================================================================
   Program (Timetable)
   ========================================================================== */
.program { background: var(--color-white); padding: 80px; display: flex; justify-content: center; }
.program .max1080 { width: 100%; }
.program__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.program__head h2 {
  font-family: var(--font-en);
  font-weight: 300;
  font-size: 32px;
  background: var(--gradient-duo);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  opacity: .85;
}
.program__head span { font-size: 14px; color: rgba(23,24,26,.5); }

.timetable { display: flex; flex-direction: column; }
.timetable__break { display: flex; align-items: center; gap: 8px; padding: 24px 0; }
.timetable__break-time { font-family: var(--font-en); font-weight: 300; font-size: 32px; color: var(--color-blue-900); width: 104px; font-variant-numeric: tabular-nums; }
.timetable__break-label {
  flex: 1 0 0; display: flex; align-items: center; justify-content: center;
  height: 42px; background: var(--color-blue-50); color: var(--color-blue-900); font-size: 16px; text-align: center;
}

.session-card { display: flex; flex-direction: column; gap: 8px; padding: 24px 0 16px; width: 100%; }
.session-card__time { display: flex; align-items: center; gap: 8px; }
.session-card__time span { font-family: var(--font-en); font-weight: 300; font-size: 32px; color: var(--color-blue-900); width: 104px; font-variant-numeric: tabular-nums; }
.session-card__time hr { flex: 1; border: none; border-top: 1px solid rgba(23,24,26,.4); }
.session-card__body { display: flex; align-items: center; gap: 40px; padding-left: 120px; }
.session-card__thumb { flex: 0 0 400px; width: 400px; border-radius: 8px; overflow: hidden; }
.session-card__thumb img { width: 100%; height: auto; display: block; }
.session-card__content { flex: 1 1 0; display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.session-card__category {
  display: inline-flex; padding: 0 16px; line-height: 1.6; border-radius: 40px;
  background: rgba(23,24,26,.2); font-size: 12px; width: fit-content;
}
.session-card__category--keynote { background: var(--color-blue-500); color: var(--color-white); }
.session-card__title { font-family: var(--font-heading); font-size: 24px; line-height: 1.3; margin-top: 16px; }
.session-card__subtitle { font-size: 16px; color: rgba(23,24,26,.5); }
.session-card__speakers {
  display: flex; align-items: stretch; gap: 16px; border: 1px solid var(--color-blue-900);
  border-radius: 8px; background: var(--color-white); padding-right: 8px;
  width: 100%; text-align: left; cursor: pointer;
}
.session-card__speakers:hover { background: var(--color-blue-50); }
.session-card__type {
  flex: 0 0 auto; display: flex; align-items: center; background: var(--color-blue-900);
  color: var(--color-white); font-size: 14px; padding: 4px 8px; border-radius: 8px 0 0 8px;
}
.session-card__names { flex: 1 1 0; display: flex; flex-direction: column; gap: 8px; padding: 8px 0; color: var(--color-blue-900); min-width: 0; }
.session-card__names > div { display: flex; flex-direction: column; line-height: 1.6; }
.session-card__names > div + div { border-top: 1px solid rgba(23,24,26,.2); padding-top: 8px; }
.session-card__names p:first-child { font-size: 14px; }
.session-card__names p:last-child { font-size: 12px; }
.session-card__icon { flex: 0 0 auto; align-self: center; width: 24px; height: 24px; }

.program .cv-area { padding: 80px 0; }
.program .schedule__tags span { background: var(--color-blue-900); color: var(--color-white); }

/* ---------- Dialogue / Keynote modal ---------- */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(7,15,44,.7); z-index: 1000;
  display: flex; align-items: center; justify-content: center; padding: 24px;
  opacity: 0; visibility: hidden; transition: opacity .2s ease;
}
.modal-overlay.is-open { opacity: 1; visibility: visible; }
.modal__wrap {
  display: flex; flex-direction: column; align-items: flex-end; gap: 16px;
  width: 100%; max-width: 864px; max-height: 90vh;
  transform: translateY(12px); transition: transform .2s ease;
}
.modal-overlay.is-open .modal__wrap { transform: translateY(0); }
.modal__close { flex-shrink: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; }
.modal__close img { width: 22px; height: 22px; }
.modal {
  background: var(--color-white); border-radius: 16px; width: 100%;
  min-height: 0; overflow-y: auto; padding: 56px;
  display: flex; flex-direction: column; align-items: center; gap: 56px;
}
.modal__text { display: flex; flex-direction: column; align-items: center; gap: 24px; width: 100%; text-align: center; }
.modal__heading { display: flex; flex-direction: column; gap: 8px; }
.modal__category {
  display: inline-flex; padding: 0 16px; line-height: 1.6; border-radius: 40px;
  background: rgba(23,24,26,.2); color: var(--color-neutral-900); font-size: 12px;
}
.modal__title { font-family: var(--font-heading); font-size: 24px; line-height: 1.3; }
.modal__subtitle { font-size: 16px; color: rgba(23,24,26,.5); }

/* Dialogue-type: two speakers side by side */
.modal__speakers { display: flex; gap: 56px; width: 100%; }
.modal-speaker { flex: 1 1 0; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.modal-speaker__top { display: flex; gap: 16px; width: 100%; }
.modal-speaker__logo {
  flex-shrink: 0; align-self: stretch; display: flex; align-items: center;
  padding-right: 16px; border-right: 1px solid rgba(23,24,26,.4);
}
.modal-speaker__logo img { width: 80px; height: 45px; border-radius: 8px; object-fit: contain; background: var(--color-white); }
.modal-speaker__logo--placeholder {
  width: 80px; height: 45px; display: flex; align-items: center; justify-content: center;
  font-size: 10px; line-height: 1.3; text-align: center; color: rgba(23,24,26,.4);
}
.modal-speaker__photo { flex-shrink: 0; width: 72px; height: 72px; border-radius: 999px; overflow: hidden; background: var(--color-blue-50); }
.modal-speaker__photo img { width: 100%; height: 100%; object-fit: cover; }
.modal-speaker__photo--soon { display: flex; align-items: center; justify-content: center; font-size: 10px; line-height: 1.3; text-align: center; color: var(--color-blue-500); }
.modal-speaker__info { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; }
.modal-speaker__info p:nth-child(1) { font-size: 12px; color: rgba(23,24,26,.5); }
.modal-speaker__info p:nth-child(2) { font-size: 14px; color: rgba(23,24,26,.5); }
.modal-speaker__info p:nth-child(3) { font-size: 22px; color: var(--color-neutral-900); }
.modal-speaker__profile { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; width: 100%; }
.modal-speaker__bio {
  font-size: 14px; line-height: 1.6; color: var(--color-neutral-900); width: 100%;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.modal-speaker.is-expanded .modal-speaker__bio { -webkit-line-clamp: unset; overflow: visible; }
.modal-speaker__more .accordion__icon-up { display: none; }
.modal-speaker.is-expanded .modal-speaker__more .accordion__icon-down { display: none; }
.modal-speaker.is-expanded .modal-speaker__more .accordion__icon-up { display: block; }

/* Keynote-type: centered, stacked */
.modal-keynote { display: flex; flex-direction: column; align-items: center; gap: 24px; width: 100%; }
.modal-keynote__visual { width: 320px; }
.modal-keynote__visual img { width: 100%; height: auto; border-radius: 8px; }
.modal-keynote__info { display: flex; align-items: center; justify-content: center; width: 100%; }
.modal-keynote__logo { flex: 1 1 0; display: flex; justify-content: flex-end; padding-right: 40px; }
.modal-keynote__logo img { width: 160px; height: 90px; border-radius: 8px; object-fit: contain; background: var(--color-white); }
.modal-keynote__text { flex: 1 1 0; border-left: 1px solid rgba(23,24,26,.2); padding-left: 40px; }
.modal-keynote__text p:nth-child(1) { font-size: 14px; color: rgba(23,24,26,.5); }
.modal-keynote__text p:nth-child(2) { font-size: 14px; color: rgba(23,24,26,.5); }
.modal-keynote__text p:nth-child(3) { font-size: 22px; color: var(--color-neutral-900); }
.modal-keynote__bio { width: 100%; font-size: 14px; line-height: 1.6; color: var(--color-neutral-900); }

/* ==========================================================================
   Overview / FAQ / Registration / Footer
   ========================================================================== */
.overview {
  background-image: linear-gradient(rgba(23,24,26,.4), rgba(23,24,26,.4)), url('/wp-content/themes/loov-video2025/img/seminar/2026-09-15_conference/images/bg_pc-tab.jpg');
  background-attachment: fixed, fixed;
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
  padding: 120px 80px; display: flex; justify-content: center;
}
.overview .max1080 { display: flex; flex-direction: column; align-items: center; gap: 40px; width: 100%; }
.overview__panel {
  background: rgba(255,255,255,.2); border-radius: 8px; padding: 56px 80px;
  max-width: 980px; width: 100%; display: flex; flex-direction: column; gap: 16px;
}
.overview dl { display: flex; align-items: flex-start; }
.overview dt { flex: 0 0 160px; border-right: 1px solid var(--color-blue-200); color: var(--color-blue-200); font-size: 14px; align-self: stretch; }
.overview dd { flex: 1 1 0; padding-left: 24px; color: var(--color-white); font-size: 14px; }
.overview dd p + p { margin-top: 0; }

.faq { background: var(--color-white); padding: 80px; display: flex; justify-content: center; }
.faq .max1080 { display: flex; flex-direction: column; align-items: center; gap: 40px; width: 100%; }
.faq-list { max-width: 980px; width: 100%; }
.accordion { border-bottom: 1px solid var(--color-blue-200); width: 100%; }
.accordion__q {
  width: 100%; display: flex; align-items: center; gap: 24px; padding: 24px 0;
  text-align: left; color: var(--color-neutral-900); font-size: 22px;
}
.accordion__q-icon {
  flex-shrink: 0; width: 40px; height: 40px; border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
}
.accordion__q-icon .accordion__icon-down,
.accordion__q-icon .accordion__icon-up { width: 11px; height: auto; }
.accordion__q:hover .accordion__q-icon { background: var(--color-blue-50); }
.accordion__q:hover { color: var(--color-blue-900); }
.accordion__icon-up { display: none; }
.accordion.is-open .accordion__icon-down { display: none; }
.accordion.is-open .accordion__icon-up { display: block; }
.accordion__a {
  max-height: 0; overflow: hidden;
  background: var(--color-blue-50); border-radius: 8px; font-size: 16px;
  transition: max-height .4s ease;
}
.accordion.is-open .accordion__a { max-height: 320px; }
.accordion__a > div { display: flex; gap: 24px; align-items: center; padding: 24px; }
.accordion__a-mark { font-family: var(--font-en); font-weight: 300; font-size: 32px; color: var(--color-blue-500); flex-shrink: 0; }

.registration {
  background-image: linear-gradient(rgba(23,24,26,.4), rgba(23,24,26,.4)), url('/wp-content/themes/loov-video2025/img/seminar/2026-09-15_conference/images/bg_pc-tab.jpg');
  background-attachment: fixed, fixed;
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
  padding: 120px 80px; display: flex; justify-content: center;
}
.registration .max1080 { display: flex; flex-direction: column; align-items: center; gap: 40px; width: 100%; }
.registration__info { display: flex; align-items: center; justify-content: center; gap: 40px; padding: 40px 0; }
.registration__free { color: var(--color-white); font-family: var(--font-heading); font-size: 32px; }
.registration__info .schedule { padding-left: 40px; border-left: 1px solid rgba(255,255,255,.4); }
.registration__form {
  background: var(--color-white); border-radius: 8px; width: 100%; max-width: 980px;
  min-height: 480px; padding: 40px;
}

.site-footer {
  background-image: linear-gradient(rgba(23,24,26,.4), rgba(23,24,26,.4)), url('/wp-content/themes/loov-video2025/img/seminar/2026-09-15_conference/images/bg_pc-tab.jpg');
  background-attachment: fixed, fixed;
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
  padding: 40px; display: flex; justify-content: center;
}
.site-footer__inner { display: flex; gap: 40px; flex-wrap: wrap; color: var(--color-white); font-size: 12px; justify-content: center; }
.site-footer a:hover { text-decoration: underline; }

/* ==========================================================================
   Tablet (<= 1024px)
   ========================================================================== */
@media (max-width: 1024px) {
  .site-header { padding: 16px 24px; }
  .hero { padding: 120px 40px 60px; }
  .hero__inner { flex-direction: column; gap: 60px; }
  .hero__text { max-width: 720px; width: 100%; }
  .hero__image { display: none; }
  .hero__lead { font-size: 22px; }
  .hero__title { max-width: 478px; gap: 20px; }
  .hero__title-1, .hero__title-2 { width: 100%; }
  .hero__sub { margin-bottom: 96px; }

  .partners { --marquee-gap: 24px; padding-bottom: 48px; }
  .partners__marquee--single { display: none; }
  .partners__marquee--double { display: block; }
  .partners__list img { width: 134px; height: 75px; }

  .en-heading { font-size: 48px; }

  .concept { padding: 80px 40px; }
  .concept .max1080 { flex-direction: column; gap: 32px; }
  .benefits { padding: 40px; }
  .benefits__grid { flex-wrap: wrap; gap: 40px; }
  .benefit { min-width: 240px; }
  .cv-area { padding: 40px; }
  .cv-area__inner { flex-direction: column; gap: 24px; }

  .keynote { padding: 160px 40px 80px; }
  .keynote .en-heading { left: 0; top: 20px; }
  .keynote-card__visual { flex: 1 1 0; max-width: 320px; }

  .all-programs, .program, .overview, .faq, .registration { padding-left: 40px; padding-right: 40px; }
  .program { padding-top: 0; }
  .all-programs { padding-top: 40px; }
  .session-card__body { flex-wrap: wrap; gap: 24px; padding-left: 40px; }
  .session-card__content { display: contents; }
  .session-card__text { flex: 1 1 0; min-width: 200px; }
  .session-card__thumb { flex: 1 1 0; width: auto; min-width: 200px; }
  .session-card__time span { font-size: 28px; }
  .timetable__break-time { font-size: 28px; }

  .overview__panel { padding: 40px; }
  .registration__form { padding: 24px; }

  .modal { padding: 40px; gap: 40px; }
  .modal__speakers { flex-direction: column; gap: 40px; }
  .modal-speaker__logo img { width: 128px; height: 72px; }
}

/* ==========================================================================
   Mobile (<= 600px)
   ========================================================================== */
@media (max-width: 600px) {
  .site-header { padding: 12px 16px; }
  .site-header__logo { height: 16px; }
  .site-header .btn-cta { padding: 8px 16px; font-size: 14px; }

  .hero { padding: 136px 20px 80px; background-image: url('/wp-content/themes/loov-video2025/img/seminar/2026-09-15_conference/images/bg_mb.jpg'); }
  .hero__inner { text-align: center; }
  .hero__lead { font-size: 14px; }
  .hero__title { align-items: center; }
  .hero__title img { max-width: 256px; }
  .hero__sub { font-size: 16px; margin-bottom: 80px; justify-content: center; gap: 0; }
  .hero__cv { width: 100%; gap: 24px; align-items: center; }
  .hero__cv .btn-cta { max-width: none; padding: 16px 48px; }
  .schedule__date-num { font-size: 40px; }
  .schedule__day { width: 28px; height: 28px; font-size: 16px; }
  .schedule__time { font-size: 24px; }
  .schedule { align-items: center; }
  .schedule__date { gap: 8px; }
  .schedule__tags span { font-size: 12px; padding: 0 8px; }
  .schedule__tags span:nth-child(1), .schedule__tags span:nth-child(3) { padding: 0 12px; }

  .partners { --marquee-gap: 16px; padding-bottom: 32px; }
  .partners__list img { width: 83px; height: 47px; padding: 8px; }

  .concept { padding: 48px 20px; }
  .concept__heading span { font-size: 28px; }
  .concept__body { font-size: 14px; }
  .benefits { padding: 40px 20px; }
  .benefits__title { font-size: 24px; text-align: center; }
  .benefits__grid { flex-direction: column; flex-wrap: nowrap; gap: 24px; }
  .benefit {
    flex-direction: row; flex-wrap: wrap; align-items: center;
    border-left: none; border-top: none; border-bottom: 1px solid var(--color-blue-200);
    padding: 0 0 16px; gap: 16px; min-width: 0;
  }
  .benefit__icon { flex: 0 0 48px; width: 48px; height: 48px; }
  .benefit__title { flex: 1 1 0; min-width: 0; font-size: 18px; }
  .benefit__text { flex: 1 1 100%; width: 100%; }
  .cv-area { padding: 40px 20px; }
  .cv-area .btn-cta { width: 100%; padding: 16px 48px; }

  .keynote { padding: 120px 20px 40px; gap: 24px; }
  .keynote .en-heading { left: 0; top: 40px; font-size: 80px; line-height: 1; text-align: left; }
  .keynote-card, .keynote-card--reverse { flex-direction: column; }
  .keynote-card { padding: 24px; gap: 24px; }
  .keynote-card__text { gap: 16px; align-items: center; text-align: center; }
  .keynote-card__title { font-size: 24px; text-align: left; }
  .keynote-card__subtitle { text-align: left; }
  .keynote-card__speaker { display: flex; align-items: center; gap: 16px; }
  .keynote-card__speaker img { height: 40px; margin-bottom: 0; }
  .keynote-card__speaker-info { border-left: 1px solid rgba(23,24,26,.2); padding-left: 16px; flex: 1 1 0; min-width: 0; text-align: left; }
  .keynote-card__speaker-info p:first-of-type { padding-top: 0; border-top: none; }
  .keynote-card__visual { flex: none; width: 100%; max-width: none; display: flex; justify-content: center; padding-bottom: 16px; }
  .keynote-card__visual img { max-width: 300px; }

  .all-programs { padding: 40px 20px; }
  .all-programs .max1080 { gap: 16px; }
  .all-programs .en-heading { font-size: 32px; }
  .all-programs__lead { font-size: 24px; }
  .all-programs__stat { padding: 0 25px; }
  .all-programs__stat b { font-size: 32px; }
  .all-programs__desc { font-size: 16px; }

  .program { padding: 40px 20px; }
  .program__head { gap: 4px; }
  .timetable__break-time { font-size: 24px; }
  .session-card { gap: 16px; padding: 16px 0 8px; }
  .session-card__time span { font-size: 24px; width: 80px; }
  .session-card__body { flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 16px; padding-left: 40px; }
  .session-card__content { display: flex; flex-direction: column; gap: 12px; }
  .session-card__text { flex: none; width: 100%; min-width: 0; display: flex; flex-direction: column; gap: 0; }
  .session-card__title { font-size: 18px; margin-top: 12px; }
  .session-card__subtitle { font-size: 14px; margin-top: 4px; }
  .session-card__thumb { width: 100%; flex: none; min-width: 0; aspect-ratio: 1080 / 608; }
  .session-card__thumb img { width: 100%; height: 100%; object-fit: cover; }

  .overview, .registration, .site-footer {
    background-image: linear-gradient(rgba(23,24,26,.4), rgba(23,24,26,.4)), url('/wp-content/themes/loov-video2025/img/seminar/2026-09-15_conference/images/bg_mb.jpg');
  }
  .overview, .registration {
    padding: 60px 20px;
  }
  .overview__panel { padding: 40px 24px; }
  .overview dl { flex-direction: column; }
  .overview dt { border-right: none; flex: none; }
  .overview dd { padding-left: 0; }
  .faq { padding: 40px 20px; }
  .accordion__q { font-size: 16px; gap: 8px; }
  .accordion__q-icon { width: 24px; height: 24px; }
  .accordion__a > div { padding: 12px 16px; gap: 8px; }

  .registration__info { flex-direction: column; gap: 16px; padding: 24px 0; }
  .registration__info .schedule { border-left: none; padding-left: 0; align-items: center; }
  .registration__form { min-height: 320px; }

  .site-footer__inner { flex-direction: column; gap: 12px; text-align: center; }

  .modal { padding: 32px 20px; gap: 32px; }
  .modal__speakers { flex-direction: column; gap: 32px; }
  .modal-speaker__logo img { width: 80px; height: 45px; }
  .modal-keynote__info { flex-direction: column; align-items: center; gap: 16px; }
  .modal-keynote__logo { padding-right: 0; justify-content: center; }
  .modal-keynote__text { border-left: none; padding-left: 0; text-align: center; }
}