@charset "UTF-8";

/**
 * Version: 1.1.1
 * Updated: 2026-08-03
 * Release: NCB-IMAGE-CARDS-ARROW-SPACING-FIX-V4-20260803
 * キャンペーンKV／キャンペーン概要と同じ全幅・ブランド変数方式。
 */

.nicole-three-image-cards {
  box-sizing: border-box;
  position: relative;
  width: 100vw;
  max-width: 100vw;
  margin-top: 0;
  margin-right: calc(50% - 50vw);
  margin-bottom: 0;
  margin-left: calc(50% - 50vw);
  padding: 64px var(--nicole-content-padding, 24px);
  color: var(--nicole-text-color, #262626);
  background-color: var(--ncb-section-bg, transparent);
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
  font-weight: var(--nicole-body-weight, 400);
}

body:not(.wp-admin) .nicole-three-image-cards.alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
}

.nicole-three-image-cards *,
.nicole-three-image-cards *::before,
.nicole-three-image-cards *::after {
  box-sizing: border-box;
}

.nicole-three-image-cards button,
.nicole-three-image-cards input,
.nicole-three-image-cards select,
.nicole-three-image-cards textarea {
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
}

.nicole-three-image-cards__inner {
  width: 100%;
  max-width: 1140px;
  margin-right: auto;
  margin-left: auto;
}

.nicole-three-image-cards__intro { margin: 0 0 40px; }

.nicole-three-image-cards__section-heading,
.nicole-three-image-cards__card-heading {
  font-family: var(--nicole-font-heading, Arial, sans-serif) !important;
  font-weight: var(--nicole-heading-weight, 600) !important;
  overflow-wrap: anywhere;
}

.nicole-three-image-cards__section-heading {
  margin: 0 !important;
  color: var(--ncb-section-heading-color, var(--nicole-text-color, #262626));
  line-height: 1.3;
}

.nicole-three-image-cards__section-subtitle {
  margin: 0 !important;
  color: var(--ncb-section-subtitle-color, var(--nicole-primary-color, #003b5c));
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
  font-weight: 600;
  line-height: 1.4;
}

.nicole-three-image-cards__section-heading +
.nicole-three-image-cards__section-subtitle {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.nicole-three-image-cards__section-text {
  margin-top: 16px;
  color: var(--ncb-section-text-color, var(--nicole-text-light, #4d4d4d));
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

.nicole-three-image-cards__section-text a,
.nicole-three-image-cards__card-text a { color: var(--nicole-primary-color, #003b5c); }
.nicole-three-image-cards__section-text *,
.nicole-three-image-cards__card-text * { font-family: inherit !important; }
.nicole-three-image-cards__section-text > :first-child,
.nicole-three-image-cards__card-text > :first-child { margin-top: 0; }
.nicole-three-image-cards__section-text > :last-child,
.nicole-three-image-cards__card-text > :last-child { margin-bottom: 0; }

.nicole-three-image-cards__grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 48px 32px;
  width: 100%;
  align-items: stretch;
}

.nicole-three-image-cards__card {
  position: relative;
  grid-column: span 2;
  display: flex;
  min-width: 0;
  flex-direction: column;
  margin: 0;
  background: var(--ncb-card-bg, transparent);
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
}

.nicole-three-image-cards.has-2-cards .nicole-three-image-cards__card,
.nicole-three-image-cards.has-4-cards .nicole-three-image-cards__card { grid-column: span 3; }
.nicole-three-image-cards.has-5-cards .nicole-three-image-cards__card:nth-of-type(n + 4) { grid-column: span 3; }

.nicole-three-image-cards__media,
.nicole-three-image-cards__placeholder { width: 100%; aspect-ratio: 3 / 2; margin: 0; background: #f2f2f2; }
.nicole-three-image-cards__media { overflow: hidden; }
.nicole-three-image-cards__image { display: block; width: 100% !important; max-width: none !important; height: 100% !important; object-fit: cover; }
.nicole-three-image-cards__placeholder { display: flex; align-items: center; justify-content: center; padding: 24px; border: 1px dashed #999; color: #666; text-align: center; }

.nicole-three-image-cards__content {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  padding: 24px;
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
}

.nicole-three-image-cards__card-heading {
  margin: 0 !important;
  color: var(--ncb-card-heading-color, var(--nicole-text-color, #262626));
  line-height: 1.4;
}

.nicole-three-image-cards__card-subtitle {
  margin: 0 !important;
  color: var(--ncb-card-subtitle-color, var(--nicole-primary-color, #003b5c));
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
  font-weight: 600;
  line-height: 1.4;
}

.nicole-three-image-cards__card-heading +
.nicole-three-image-cards__card-subtitle {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.nicole-three-image-cards__card-text {
  margin-top: 14px;
  margin-bottom: 20px;
  color: var(--ncb-card-text-color, var(--nicole-text-light, #4d4d4d));
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

.nicole-three-image-cards__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  min-height: 48px;
  margin-top: auto;
  padding: 12px 24px;
  border: 1px solid var(--nicole-button-background, var(--nicole-primary-color, #003b5c));
  border-radius: var(--nicole-button-radius, 0);
  background: var(--nicole-button-background, var(--nicole-primary-color, #003b5c));
  color: var(--nicole-button-text, #fff) !important;
  font-family: var(--nicole-font-body, Arial, sans-serif) !important;
  font-weight: 600;
  text-decoration: none;
  transition: 0.2s;
}

.nicole-three-image-cards__button:hover,
.nicole-three-image-cards__button:focus-visible {
  border-color: var(--nicole-button-hover-background, #002a41);
  background: var(--nicole-button-hover-background, #002a41);
  color: var(--nicole-button-hover-text, #fff) !important;
}

.nicole-three-image-cards__overall-button { display: flex; justify-content: center; margin-top: 40px; }
.nicole-three-image-cards__arrow { position: absolute; z-index: 2; top: 50%; right: -16px; display: block; width: 0; color: var(--ncb-arrow-color, var(--nicole-primary-color, #003b5c)); text-align: center; transform: translateY(-50%); }
.nicole-three-image-cards__arrow::before { content: "→"; display: inline-block; font-size: 30px; transform: translateX(-50%); }
.nicole-three-image-cards__arrow.arrow-long::before { content: "⟶"; }
.nicole-three-image-cards__arrow.arrow-circle::before { content: "➜"; display: grid; width: 42px; height: 42px; place-items: center; border: 1px solid currentColor; border-radius: 50%; }
.nicole-three-image-cards__arrow.arrow-chevron::before { content: "›"; font-size: 46px; }
.nicole-three-image-cards__arrow.arrow-step::before { content: "▶"; font-size: 28px; }

[class*="section_heading-align-"] .nicole-three-image-cards__section-heading,
[class*="section_subtitle-align-"] .nicole-three-image-cards__section-subtitle,
[class*="section_text-align-"] .nicole-three-image-cards__section-text,
[class*="card_heading-align-"] .nicole-three-image-cards__card-heading,
[class*="card_subtitle-align-"] .nicole-three-image-cards__card-subtitle,
[class*="card_text-align-"] .nicole-three-image-cards__card-text { text-align: left; }
.section_heading-align-center .nicole-three-image-cards__section-heading,
.section_subtitle-align-center .nicole-three-image-cards__section-subtitle,
.section_text-align-center .nicole-three-image-cards__section-text,
.card_heading-align-center .nicole-three-image-cards__card-heading,
.card_subtitle-align-center .nicole-three-image-cards__card-subtitle,
.card_text-align-center .nicole-three-image-cards__card-text { text-align: center; }
.section_heading-align-right .nicole-three-image-cards__section-heading,
.section_subtitle-align-right .nicole-three-image-cards__section-subtitle,
.section_text-align-right .nicole-three-image-cards__section-text,
.card_heading-align-right .nicole-three-image-cards__card-heading,
.card_subtitle-align-right .nicole-three-image-cards__card-subtitle,
.card_text-align-right .nicole-three-image-cards__card-text { text-align: right; }

.section_heading-size-small .nicole-three-image-cards__section-heading { font-size: clamp(24px, 3vw, 32px); }
.section_heading-size-standard .nicole-three-image-cards__section-heading { font-size: clamp(28px, 3vw, 42px); }
.section_heading-size-large .nicole-three-image-cards__section-heading { font-size: clamp(32px, 4vw, 50px); }
.section_heading-size-xlarge .nicole-three-image-cards__section-heading { font-size: clamp(38px, 5vw, 60px); }
.section_subtitle-size-small .nicole-three-image-cards__section-subtitle,
.section_text-size-small .nicole-three-image-cards__section-text,
.card_subtitle-size-small .nicole-three-image-cards__card-subtitle,
.card_text-size-small .nicole-three-image-cards__card-text { font-size: 14px; }
.section_subtitle-size-standard .nicole-three-image-cards__section-subtitle,
.section_text-size-standard .nicole-three-image-cards__section-text,
.card_subtitle-size-standard .nicole-three-image-cards__card-subtitle,
.card_text-size-standard .nicole-three-image-cards__card-text { font-size: 16px; }
.section_subtitle-size-large .nicole-three-image-cards__section-subtitle,
.section_text-size-large .nicole-three-image-cards__section-text,
.card_subtitle-size-large .nicole-three-image-cards__card-subtitle,
.card_text-size-large .nicole-three-image-cards__card-text { font-size: 18px; }
.section_subtitle-size-xlarge .nicole-three-image-cards__section-subtitle,
.section_text-size-xlarge .nicole-three-image-cards__section-text,
.card_subtitle-size-xlarge .nicole-three-image-cards__card-subtitle,
.card_text-size-xlarge .nicole-three-image-cards__card-text { font-size: 20px; }
.card_heading-size-small .nicole-three-image-cards__card-heading { font-size: 18px; }
.card_heading-size-standard .nicole-three-image-cards__card-heading { font-size: 21px; }
.card_heading-size-large .nicole-three-image-cards__card-heading { font-size: 25px; }
.card_heading-size-xlarge .nicole-three-image-cards__card-heading { font-size: 30px; }

/* Gutenbergはキャンペーン概要と同じく編集キャンバス幅を全幅として扱います。 */
.editor-styles-wrapper .nicole-three-image-cards,
.editor-styles-wrapper .nicole-three-image-cards.alignfull {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

@media (max-width: 1024px) {
  .nicole-three-image-cards__card,
  .nicole-three-image-cards.has-5-cards .nicole-three-image-cards__card:nth-of-type(n + 4) { grid-column: span 3; }
}

@media (max-width: 767px) {
  .nicole-three-image-cards { padding-top: 40px; padding-bottom: 40px; }
  .nicole-three-image-cards__intro { margin-bottom: 32px; }
  .nicole-three-image-cards__grid { grid-template-columns: 1fr; gap: 40px; }
  .nicole-three-image-cards__card,
  .nicole-three-image-cards.has-2-cards .nicole-three-image-cards__card,
  .nicole-three-image-cards.has-4-cards .nicole-three-image-cards__card,
  .nicole-three-image-cards.has-5-cards .nicole-three-image-cards__card:nth-of-type(n + 4) { grid-column: auto; }
  .nicole-three-image-cards__content { padding: 20px; }
  .nicole-three-image-cards__arrow { top: auto; right: 50%; bottom: -34px; transform: rotate(90deg); }
  .nicole-three-image-cards__overall-button { margin-top: 32px; }
}