@charset "UTF-8";

/* 企業版ふるさと納税ページ専用。共通ページのスタイルには影響させない。 */
body.kigyou-furusato-page,
.kigyou-furusato-page .l-body,
.kigyou-furusato-page header,
.kigyou-furusato-page .header { width: 100%; min-width: 0; }
.kigyou-furusato-page .main-menu { max-width: 100%; }
.kigyou-furusato-page a:focus-visible { outline: 3px solid #007cac; outline-offset: 5px; }

.kigyou-furusato {
  --p-kigyou-furusato-blue: #150f76;
  --p-kigyou-furusato-ink: #222c3c;
  --p-kigyou-furusato-green: #27852e;
  color: #252525;
  background: #fff;
  font-size: 16px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

.kigyou-furusato *,
.kigyou-furusato *::before,
.kigyou-furusato *::after { box-sizing: border-box; }
.kigyou-furusato figure,
.kigyou-furusato dl,
.kigyou-furusato dd { margin: 0; }
.kigyou-furusato strong { font-weight: 700; }
.kigyou-furusato img { max-width: 100%; }
.kigyou-furusato .p-kigyou-furusato-photo { min-width: 0; }
.kigyou-furusato .p-kigyou-furusato-photo img { display: block; }
.kigyou-furusato a { text-decoration: underline; text-underline-offset: 4px; }
.kigyou-furusato a:focus-visible,
.kigyou-furusato summary:focus-visible { outline: 3px solid #007cac; outline-offset: 5px; }
.kigyou-furusato .p-kigyou-furusato-container { width: min(100% - 48px, 1000px); margin-inline: auto; }
.kigyou-furusato .p-kigyou-furusato-body { padding-top: 60px; padding-bottom: 80px; }
.kigyou-furusato .p-kigyou-furusato-hero { position: relative; background-image: url(../img/join/kigyou-furusato/hero.jpg); background-position: center 35%; }

.kigyou-furusato .p-kigyou-furusato-hero__title {
  display: inline-block;
  padding: 28px 32px;
  background: var(--p-kigyou-furusato-blue);
  color: #fff;
  font-size: 28px;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: .08em;
}
.kigyou-furusato .p-kigyou-furusato-intro__title {
  margin-bottom: 24px;
  color: var(--p-kigyou-furusato-blue);
  text-align: center;
  font-size: 38px;
  font-weight: 500;
  line-height: 1.65;
  letter-spacing: .06em;
}
.kigyou-furusato .p-kigyou-furusato-intro__lead { text-align: center; font-size: 18px; font-weight: 500; }
.kigyou-furusato .p-kigyou-furusato-intro__photos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 36px 0; }
.kigyou-furusato .p-kigyou-furusato-intro__photos img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.kigyou-furusato .p-kigyou-furusato-copy p + p { margin-top: 20px; }
.kigyou-furusato .p-kigyou-furusato-intro__statement {
  margin-top: 40px;
  padding: 18px 0;
  border-block: 1px solid var(--p-kigyou-furusato-blue);
  color: var(--p-kigyou-furusato-blue);
  font-size: 21px;
  font-weight: 700;
  text-align: center;
}
.kigyou-furusato .p-kigyou-furusato-mobile-break { display: none; }
.kigyou-furusato .p-kigyou-furusato-section { margin-top: 68px; }
.kigyou-furusato .p-kigyou-furusato-heading {
  margin-bottom: 28px;
  padding: 2px 0 2px 20px;
  border-left: 3px solid var(--p-kigyou-furusato-blue);
  color: var(--p-kigyou-furusato-blue);
  font-size: 29px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: .025em;
}
.kigyou-furusato .p-kigyou-furusato-heading__sub { display: inline-block; font-size: inherit; }
.kigyou-furusato h3 { color: var(--p-kigyou-furusato-blue); font-size: 20px; font-weight: 700; line-height: 1.6; }

/* 繰り返し表示するお問い合わせ導線 */
.kigyou-furusato .p-kigyou-furusato-contact { margin-top: 36px; border: 2px solid #087ea8; background: #fff; text-align: center; }
.kigyou-furusato .p-kigyou-furusato-contact__title { margin: 0; padding: 14px 20px; background: #087ea8; color: #fff; font-size: 22px; font-weight: 700; }
.kigyou-furusato .p-kigyou-furusato-contact__methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 28px; }
.kigyou-furusato .p-kigyou-furusato-contact__methods > div { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 0; padding: 0 20px; }
.kigyou-furusato .p-kigyou-furusato-contact__phone { border-left: 1px solid #d4e4eb; }
.kigyou-furusato .p-kigyou-furusato-contact__label { margin: 0 0 16px; color: #08749b; font-size: 18px; font-weight: 700; }
.kigyou-furusato .p-kigyou-furusato-contact__button {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 24px;
  min-height: 56px;
  width: 340px;
  max-width: 100%;
  border-radius: 32px;
  background: #087ea8;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
  gap: 14px;
  transition: background-color .15s;
}
.kigyou-furusato .p-kigyou-furusato-contact__button:hover { background: #056080; }
.kigyou-furusato .p-kigyou-furusato-contact__button > span { font-size: 26px; line-height: 1; }
.kigyou-furusato .p-kigyou-furusato-contact__phone a { display: block; color: var(--p-kigyou-furusato-ink); font-size: 28px; font-weight: 700; line-height: 1.5; white-space: nowrap; text-decoration: none; }
.kigyou-furusato .p-kigyou-furusato-contact__phone-icon { margin-right: 10px; color: #007cac; }
.kigyou-furusato .p-kigyou-furusato-contact__hours { display: block; color: #586779; font-size: 14px; line-height: 1.6; }

/* 控除内訳。棒の比率を保ち、説明は小さな画面でも縮小しない。 */
.kigyou-furusato .p-kigyou-furusato-tax { margin-top: 28px; padding: 28px; background: #f5f7fa; }
.kigyou-furusato .p-kigyou-furusato-diagram-caption { margin-bottom: 20px; color: var(--p-kigyou-furusato-blue); font-size: 18px; font-weight: 700; }
.kigyou-furusato .p-kigyou-furusato-tax__total { margin-bottom: 14px; border-bottom: 1px solid #8a91a7; text-align: center; font-weight: 700; }
.kigyou-furusato .p-kigyou-furusato-tax__bar { display: grid; grid-template-columns: 3fr 6fr 1fr; height: 20px; gap: 3px; margin-bottom: 20px; }
.kigyou-furusato .p-kigyou-furusato-tax__bar > span:nth-child(1) { background: #a9d8d8; }
.kigyou-furusato .p-kigyou-furusato-tax__bar > span:nth-child(2) { background: #899edc; }
.kigyou-furusato .p-kigyou-furusato-tax__bar > span:nth-child(3) { background: #ced3dc; }
.kigyou-furusato .p-kigyou-furusato-tax__items { display: grid; grid-template-columns: 3fr 4fr 2fr; gap: 12px; }
.kigyou-furusato .p-kigyou-furusato-tax__item { display: flex; flex-direction: column; justify-content: center; padding: 18px 12px; text-align: center; }
.kigyou-furusato .p-kigyou-furusato-tax__item--ordinary { background: #e1f0f0; border-top: 4px solid #80bdbc; }
.kigyou-furusato .p-kigyou-furusato-tax__item--corporate { background: #e6ebfa; border-top: 4px solid #718ac9; }
.kigyou-furusato .p-kigyou-furusato-tax__item--cost { background: #eceef2; border-top: 4px solid #b7becb; }
.kigyou-furusato .p-kigyou-furusato-tax__type { margin-bottom: 8px; font-size: 14px; }
.kigyou-furusato .p-kigyou-furusato-tax__item h3 { font-size: 17px; }
.kigyou-furusato .p-kigyou-furusato-tax__item p { color: var(--p-kigyou-furusato-blue); font-size: 18px; }
.kigyou-furusato .p-kigyou-furusato-tax__item p strong { font-size: 38px; }
.kigyou-furusato .p-kigyou-furusato-tax__detail { font-size: 13px; line-height: 1.7; }

/* 提供図版は画面幅に合わせてPC版／スマートフォン版を切り替える。 */
.kigyou-furusato .p-kigyou-furusato-diagram { margin-top: 32px; }
.kigyou-furusato .p-kigyou-furusato-diagram img { display: block; width: 100%; height: auto; }
.kigyou-furusato .p-kigyou-furusato-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

.kigyou-furusato .p-kigyou-furusato-values { margin-top: 32px; }
.kigyou-furusato .p-kigyou-furusato-value { display: grid; grid-template-columns: 240px minmax(0, 1fr); grid-template-areas: "photo heading" "photo body"; grid-template-rows: auto 1fr; gap: 10px 28px; align-items: start; }
.kigyou-furusato .p-kigyou-furusato-value + .p-kigyou-furusato-value { margin-top: 36px; }
.kigyou-furusato .p-kigyou-furusato-value > figure { grid-area: photo; width: 100%; }
.kigyou-furusato .p-kigyou-furusato-value > figure img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.kigyou-furusato .p-kigyou-furusato-value > h3 { grid-area: heading; }
.kigyou-furusato .p-kigyou-furusato-value > p { grid-area: body; }

.kigyou-furusato .p-kigyou-furusato-amounts { margin-top: 28px; }
.kigyou-furusato .p-kigyou-furusato-amounts > li + li { margin-top: 28px; }
.kigyou-furusato .p-kigyou-furusato-amounts h3 { margin-bottom: 8px; font-size: 19px; }
.kigyou-furusato .p-kigyou-furusato-amounts__bridge { margin-top: 24px; color: #b52230; }
.kigyou-furusato .p-kigyou-furusato-note { margin-top: 26px; color: #b52230; font-size: 15px; }
.kigyou-furusato .p-kigyou-furusato-steps { margin-top: 30px; }
.kigyou-furusato .p-kigyou-furusato-steps > li { position: relative; padding: 0 0 34px 50px; }
.kigyou-furusato .p-kigyou-furusato-steps > li:not(:last-child)::before { position: absolute; top: 38px; bottom: 0; left: 16px; width: 1px; background: #ccd2e6; content: ""; }
.kigyou-furusato .p-kigyou-furusato-steps > li:last-child { padding-bottom: 0; }
.kigyou-furusato .p-kigyou-furusato-steps h3 { margin-bottom: 10px; }
.kigyou-furusato .p-kigyou-furusato-steps h3 > span { position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--p-kigyou-furusato-blue); color: #fff; font-size: 18px; }
.kigyou-furusato .p-kigyou-furusato-steps .p-kigyou-furusato-contact { margin-top: 24px; }
.kigyou-furusato .p-kigyou-furusato-steps__mail { margin-top: 18px; }
.kigyou-furusato .p-kigyou-furusato-small { margin-top: 8px; font-size: 14px; }
.kigyou-furusato .p-kigyou-furusato-message { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 36px; }
.kigyou-furusato .p-kigyou-furusato-message img { display: block; width: 100%; height: auto; }
.kigyou-furusato .p-kigyou-furusato-message figcaption { margin-top: 14px; font-size: 12px; }
.kigyou-furusato .p-kigyou-furusato-message__name { margin-left: 8px; font-size: 18px; }
.kigyou-furusato .p-kigyou-furusato-message h3 { margin-bottom: 20px; font-size: 23px; }

/* 標準のdetails/summaryで、JavaScriptなしでもキーボードで開閉可能。 */
.kigyou-furusato .p-kigyou-furusato-faq details { border-bottom: 1px solid #d4d8e8; }
.kigyou-furusato .p-kigyou-furusato-faq summary { position: relative; padding: 22px 42px 22px 42px; list-style: none; cursor: pointer; font-weight: 700; line-height: 1.7; }
.kigyou-furusato .p-kigyou-furusato-faq summary::-webkit-details-marker { display: none; }
.kigyou-furusato .p-kigyou-furusato-faq summary::before { position: absolute; top: 22px; left: 0; display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: var(--p-kigyou-furusato-blue); color: #fff; font-size: 16px; content: "Q"; }
.kigyou-furusato .p-kigyou-furusato-faq summary::after { position: absolute; right: 10px; top: 22px; color: var(--p-kigyou-furusato-blue); font-size: 22px; font-weight: 400; content: "+"; }
.kigyou-furusato .p-kigyou-furusato-faq details[open] summary::before { background: var(--p-kigyou-furusato-green); }
.kigyou-furusato .p-kigyou-furusato-faq details[open] summary::after { content: "−"; }
.kigyou-furusato .p-kigyou-furusato-faq details > div { padding: 0 28px 24px 42px; }
.kigyou-furusato .p-kigyou-furusato-faq summary:hover { color: var(--p-kigyou-furusato-blue); background: #f7f8fb; }

/* 共通ヘッダーの固定幅を解除した際、タブレットでは3段にして全導線を残す。 */
@media (min-width: 768px) and (max-width: 1099px) {
  .kigyou-furusato-page header,
  .kigyou-furusato-page .header { height: 128px; }
  .kigyou-furusato-page .main-menu { flex-direction: column; width: 100%; }
  .kigyou-furusato-page .header_logo_l { height: 50px; }
  .kigyou-furusato-page .header__logo { width: 160px; }
  .kigyou-furusato-page .sub__menu { height: 76px; justify-content: flex-start; }
  .kigyou-furusato-page .sub_menu_top { height: 28px; justify-content: center; }
  .kigyou-furusato-page .sub_menu_top .sub_menu { width: 100%; justify-content: space-between; }
  .kigyou-furusato-page .sub_menu_top .sns { position: absolute; top: 14px; right: 100px; }
  .kigyou-furusato-page .sub_menu_top .language { position: absolute; top: 14px; right: 20px; }
  .kigyou-furusato-page #dropmenu { justify-content: space-between; margin: 4px 0 0; }
  .kigyou-furusato-page #dropmenu > li { margin-inline: 0; }
  .kigyou-furusato .p-kigyou-furusato-hero { margin-top: 128px; }
}

@media (max-width: 767px) {
  .kigyou-furusato .p-kigyou-furusato-container { width: calc(100% - 40px); }
  .kigyou-furusato .p-kigyou-furusato-body { padding-top: 38px; padding-bottom: 48px; }
  .kigyou-furusato .p-kigyou-furusato-hero { height: 240px; }
  .kigyou-furusato .p-kigyou-furusato-hero__title { padding: 20px 24px; font-size: 23px; }
  .kigyou-furusato .p-kigyou-furusato-intro__title { font-size: 28px; letter-spacing: .02em; }
  .kigyou-furusato .p-kigyou-furusato-intro__lead { font-size: 16px; }
  .kigyou-furusato .p-kigyou-furusato-desktop-break { display: none; }
  .kigyou-furusato .p-kigyou-furusato-mobile-break { display: inline; }
  /* 個人版ふるさと納税の .row と同じ余白に揃える。 */
  .kigyou-furusato .p-kigyou-furusato-intro__photos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; margin: 26px -.75rem; }
  .kigyou-furusato .p-kigyou-furusato-intro__photos > figure:first-child { grid-column: 1 / -1; }
  .kigyou-furusato .p-kigyou-furusato-intro__statement { margin-top: 32px; font-size: 17px; }
  .kigyou-furusato .p-kigyou-furusato-section { margin-top: 48px; }
  .kigyou-furusato .p-kigyou-furusato-heading { padding-left: 14px; margin-bottom: 22px; font-size: 23px; }
  .kigyou-furusato .p-kigyou-furusato-heading__sub { display: block; margin-top: 4px; }
  .kigyou-furusato h3 { font-size: 19px; }
  .kigyou-furusato .p-kigyou-furusato-contact { margin-top: 28px; }
  .kigyou-furusato .p-kigyou-furusato-contact__title { padding: 12px; font-size: 20px; }
  .kigyou-furusato .p-kigyou-furusato-contact__methods { grid-template-columns: 1fr; padding: 22px 16px; }
  .kigyou-furusato .p-kigyou-furusato-contact__methods > div { padding: 0; }
  .kigyou-furusato .p-kigyou-furusato-contact__label { font-size: 17px; }
  .kigyou-furusato .p-kigyou-furusato-contact__methods > .p-kigyou-furusato-contact__phone { margin-top: 22px; padding-top: 22px; border-left: 0; border-top: 1px solid #d4e4eb; }
  .kigyou-furusato .p-kigyou-furusato-contact__button { width: 100%; max-width: 360px; padding: 14px 8px; font-size: 17px; }
  .kigyou-furusato .p-kigyou-furusato-contact__phone a { font-size: 26px; }
  .kigyou-furusato .p-kigyou-furusato-tax { padding: 20px 16px; }
  .kigyou-furusato .p-kigyou-furusato-tax__items { grid-template-columns: 1fr; gap: 10px; }
  .kigyou-furusato .p-kigyou-furusato-tax__item { padding: 16px; }
  .kigyou-furusato .p-kigyou-furusato-tax__item h3 br { display: none; }
  .kigyou-furusato .p-kigyou-furusato-tax__type { margin-bottom: 4px; }
  .kigyou-furusato .p-kigyou-furusato-tax__detail br { display: none; }
  .kigyou-furusato .p-kigyou-furusato-value { grid-template-columns: 1fr; grid-template-areas: "heading" "photo" "body"; grid-template-rows: auto; gap: 18px; }
  .kigyou-furusato .p-kigyou-furusato-value > figure { max-width: 480px; margin-inline: auto; }
  .kigyou-furusato .p-kigyou-furusato-amounts h3 { font-size: 18px; }
  .kigyou-furusato .p-kigyou-furusato-steps > li { padding-left: 42px; padding-bottom: 30px; }
  .kigyou-furusato .p-kigyou-furusato-steps .p-kigyou-furusato-contact { position: relative; margin-left: -42px; }
  .kigyou-furusato .p-kigyou-furusato-steps h3 > span { width: 30px; height: 30px; font-size: 16px; }
  .kigyou-furusato .p-kigyou-furusato-steps > li:not(:last-child)::before { left: 14px; }
  .kigyou-furusato .p-kigyou-furusato-message { grid-template-columns: 1fr; gap: 26px; }
  .kigyou-furusato .p-kigyou-furusato-message > figure { max-width: 300px; margin-inline: auto; }
  .kigyou-furusato .p-kigyou-furusato-message h3 { font-size: 21px; }
  .kigyou-furusato .p-kigyou-furusato-faq summary { padding: 20px 30px 20px 36px; font-size: 15px; }
  .kigyou-furusato .p-kigyou-furusato-faq summary::before { top: 20px; width: 25px; height: 25px; }
  .kigyou-furusato .p-kigyou-furusato-faq summary::after { right: 5px; top: 18px; }
  .kigyou-furusato .p-kigyou-furusato-faq details > div { padding: 0 0 20px 36px; font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .kigyou-furusato .p-kigyou-furusato-contact__button { transition: none; }
}
