.exam-hero { background: linear-gradient(115deg, rgba(209,227,230,.82), rgba(180,217,213,.48)), var(--base); }
.exam-page--nail .exam-hero { background: linear-gradient(115deg, rgba(242,235,240,.92), rgba(217,186,209,.45)), var(--base); }
.exam-hero .page-hero__inner { padding-block: 58px 66px; }
.exam-hero h1 { font-size: clamp(2.05rem, 4.8vw, 3.9rem); }
.exam-notice { padding: 42px 24px 0; }
.exam-notice__inner { width: min(1040px, 100%); margin: 0 auto; padding: 20px 24px; display: grid; grid-template-columns: auto 1fr; gap: 15px; border-left: 3px solid var(--web-main); background: rgba(242,230,167,.38); }
.exam-page--nail .exam-notice__inner { border-left-color: #b77991; }
.exam-notice__inner > span { margin-top: 2px; color: var(--web-action); }
.exam-notice h2 { margin: 0 0 5px; color: var(--web-ink); font-size: 1rem; }
.exam-notice p { margin: 0; color: #5e604e; font-size: .86rem; line-height: 1.7; }
.application-content { padding: 52px 24px 96px; }
.application-layout { width: min(1040px, 100%); margin: 0 auto; display: grid; grid-template-columns: minmax(260px,.72fr) minmax(0,1.28fr); gap: clamp(34px,6vw,72px); align-items: start; }
.course-selection { position: sticky; top: 110px; }
.application-label { margin: 0 0 8px; color: var(--web-action); font-size: .7rem; font-weight: 700; letter-spacing: .15em; }
.exam-page--nail .application-label { color: #98647a; }
.course-selection > h2, .exam-form-panel__head h2 { margin: 0; color: var(--web-ink); font-size: clamp(1.4rem,2.5vw,1.85rem); }
.selected-course { margin-top: 24px; padding: 24px; border: 1px solid rgba(3,140,140,.25); border-top: 4px solid var(--web-main); border-radius: 6px; background: #fff; box-shadow: 0 14px 36px rgba(74,89,84,.07); }
.selected-course--nail { border-color: rgba(183,121,145,.28); border-top-color: #b77991; }
.selected-course__status { display: flex; gap: 7px; align-items: center; color: var(--web-action); font-size: .74rem; font-weight: 700; }
.selected-course--nail .selected-course__status { color: #98647a; }
.selected-course__status span { font-size: 1rem; }
.selected-course > p { margin: 18px 0 4px; color: var(--muted); font-size: .78rem; }
.selected-course h3 { margin: 0; color: var(--web-ink); font-size: 1.16rem; line-height: 1.55; }
.selected-course dl { margin: 22px 0 0; border-top: 1px solid var(--line); }
.selected-course dl div { padding: 13px 0; border-bottom: 1px solid var(--line); }
.selected-course dt { color: var(--muted); font-size: .72rem; font-weight: 700; }
.selected-course dd { margin: 4px 0 0; color: var(--web-ink); font-size: .84rem; line-height: 1.65; }
.course-selection__help { margin: 16px 0 0; color: var(--muted); font-size: .75rem; line-height: 1.7; }
.exam-form-panel { padding: clamp(28px,5vw,52px); border: 1px solid rgba(74,89,84,.14); border-radius: 8px; background: #fff; box-shadow: 0 20px 60px rgba(74,89,84,.08); }
.exam-form-panel__head { margin-bottom: 36px; padding-bottom: 24px; border-bottom: 1px solid var(--line); }
.exam-form-panel__head > p:last-child { margin: 10px 0 0; color: var(--muted); font-size: .82rem; }
.exam-form { display: grid; gap: 28px; }
.address-fields { margin: 0; padding: 26px 0 0; display: grid; grid-template-columns: .72fr 1fr; gap: 22px 18px; border: 0; border-top: 1px solid var(--line); }
.address-fields legend { width: 100%; padding: 0 0 4px; color: var(--web-ink); font-weight: 700; }
.address-fields .form-field:nth-of-type(3), .address-fields .form-field:nth-of-type(4) { grid-column: 1 / -1; }
.exam-form .form-field { display: grid; gap: 9px; }
.exam-form .form-field label { color: var(--web-ink); font-size: .9rem; font-weight: 700; }
.exam-form input:not([type="checkbox"]), .exam-form textarea { width: 100%; min-height: 52px; padding: 12px 14px; border: 1px solid rgba(74,89,84,.3); border-radius: 4px; color: var(--ink); font: inherit; background: #fbfdfc; }
.exam-form textarea { min-height: 150px; resize: vertical; line-height: 1.7; }
.exam-form input:focus, .exam-form textarea:focus { outline: none; border-color: var(--web-main); box-shadow: 0 0 0 3px rgba(3,140,140,.11); background: #fff; }
.exam-page--nail .exam-form input:focus, .exam-page--nail .exam-form textarea:focus { border-color: #b77991; box-shadow: 0 0 0 3px rgba(183,121,145,.11); }

@media (max-width: 820px) { .application-layout { grid-template-columns: 1fr; } .course-selection { position: static; } }
@media (max-width: 560px) { .exam-hero .page-hero__inner { padding-block: 48px 54px; } .exam-notice { padding: 30px 18px 0; } .exam-notice__inner { padding: 18px; } .application-content { padding: 38px 18px 72px; } .application-layout { gap: 34px; } .exam-form-panel { padding: 28px 20px; } .address-fields { grid-template-columns: 1fr; } .address-fields .form-field { grid-column: 1 / -1; } }

/* WordPressでは講座選択とFluent Formsを専用プラグインがまとめて出力します。 */
.application-layout--plugin { display: block; max-width: 1180px; margin-inline: auto; }
.application-layout--plugin .exam-form-panel { width: 100%; max-width: none; }

.application-document-notice {
  margin-top: 36px;
  padding: 22px 24px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  border: 1px solid var(--exam-border);
  border-left: 4px solid var(--exam-main);
  border-radius: 6px;
  background: var(--exam-notice);
}

.application-document-notice > span {
  margin-top: 2px;
  color: var(--exam-accent);
}

.application-document-notice h2 {
  margin: 0 0 10px;
  color: var(--exam-heading);
  font-size: 1.05rem;
}

.application-document-notice p {
  margin: 0;
  color: #4f544e;
  font-size: .9rem;
  line-height: 1.85;
}

.application-document-notice .application-document-notice__email {
  margin-top: 12px;
  font-weight: 700;
}

.application-document-notice__email a {
  color: var(--exam-accent);
  overflow-wrap: anywhere;
}

.application-document-notice .application-document-notice__note {
  margin-top: 10px;
  font-size: .82rem;
}

@media (max-width: 560px) {
  .application-document-notice { margin-top: 28px; padding: 18px; }
}


/* 2026-07 申込みページ：講座紹介ページの配色と統一 */
.exam-page--web {
  --exam-main: #1e86c9;
  --exam-accent: #1e86c9;
  --exam-heading: #211b5b;
  --exam-pale: #bbe9fc;
  --exam-notice: #fff7db;
  --exam-border: rgba(30, 134, 201, 0.32);
  --exam-ring: rgba(30, 134, 201, 0.16);
}

.exam-page--nail {
  --exam-main: #36c3b2;
  --exam-accent: #168f83;
  --exam-heading: #211b5b;
  --exam-pale: #cbece7;
  --exam-notice: #fff4df;
  --exam-border: rgba(22, 143, 131, 0.3);
  --exam-ring: rgba(54, 195, 178, 0.18);
}

.exam-page--web .exam-hero {
  background: linear-gradient(115deg, rgba(187, 233, 252, 0.94), rgba(30, 134, 201, 0.2)), #fff;
}

.exam-page--nail .exam-hero {
  background: linear-gradient(115deg, rgba(203, 236, 231, 0.96), rgba(54, 195, 178, 0.24)), #fff;
}

.exam-page .exam-hero .page-hero__label,
.exam-page .application-label,
.exam-page .aca-course-choice__label {
  color: var(--exam-accent);
}

.exam-page .exam-hero h1,
.exam-page .exam-hero p,
.exam-page .course-selection > h2,
.exam-page .exam-form-panel__head h2,
.exam-page .aca-course-choice h2,
.exam-page .aca-course-card h3,
.exam-page .aca-course-card dd {
  color: var(--exam-heading);
}

.exam-page .exam-notice__inner {
  border-left-color: var(--exam-main);
  background: var(--exam-notice);
}

.exam-page .exam-notice__inner > span {
  color: var(--exam-accent);
}

.exam-page .selected-course,
.exam-page .aca-course-application .aca-course-card {
  border-color: var(--exam-border);
  border-top-color: var(--exam-main);
}

.exam-page .selected-course__status,
.exam-page .aca-course-card__selected {
  color: var(--exam-accent);
}

.exam-page .aca-course-card__radio {
  border-color: var(--exam-main);
}

.exam-page .aca-course-card.is-selected .aca-course-card__radio {
  border-color: var(--exam-accent);
}

.exam-page .aca-course-options legend span {
  background: var(--exam-accent);
}

.exam-page .exam-form input:focus,
.exam-page .exam-form textarea:focus {
  border-color: var(--exam-main);
  box-shadow: 0 0 0 3px var(--exam-ring);
}

.exam-page .aca-application-closed > .dashicons,
.exam-page .aca-application-closed > p:first-of-type {
  color: var(--exam-accent);
}

.exam-page .aca-application-closed a,
.exam-page .ff-btn-submit {
  border-color: var(--exam-accent) !important;
  background-color: var(--exam-accent) !important;
}

.exam-page .ff-btn-submit:hover,
.exam-page .ff-btn-submit:focus-visible {
  border-color: var(--exam-heading) !important;
  background-color: var(--exam-heading) !important;
}