@charset "UTF-8";
/* ==========================================================================
   サポート欄（.supportInfo）2026-10-01 ／ 製品に関するお問い合わせ（.productContact）2026-10-05
   コーポレートサイト /ja/assets/css/common.css のうち
   .supportInfo / .cmn-menuCard / @keyframes arrowMove だけを抜粋したもの。
   common.css を丸ごと読み込むと body 等のリセットが製品サイトに波及するため、
   必要なルールのみをここに置き、製品サイト側の既定スタイルとの差は
   「製品サイト向けの補正」で .supportInfo 配下に限定して吸収する。
   矢印は Material Symbols Outlined（製品サイトでも共通ヘッダーが読込済み）。
   ========================================================================== */

/* --- 製品サイト向けの補正（.supportInfo 配下のみ） ----------------------- */
.supportInfo {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
  line-height: 1;
  color: #222;
  text-align: left;
  box-sizing: border-box;
}
.supportInfo *, .supportInfo *::before, .supportInfo *::after { box-sizing: border-box; }
.supportInfo h2, .supportInfo h3, .supportInfo p { margin: 0; padding: 0; }
.supportInfo ul { margin: 0; padding: 0; list-style: none; }
.supportInfo li { margin: 0; padding: 0; list-style: none; }
.supportInfo a { text-decoration: none; }
.supportInfo a:hover { text-decoration: none; opacity: 1; }
.supportInfo img { vertical-align: middle; }

/* --- 以下 コーポレート common.css より ----------------------------------- */
.cmn-menuCard { display: flex; align-items: center; justify-content: space-between; gap: clamp(0px, 0.694444vw, 10px); padding: clamp(0px, 1.04167vw, 15px) clamp(0px, 1.38889vw, 20px) clamp(0px, 1.04167vw, 15px) clamp(0px, 0.694444vw, 10px); width: 100%; background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 5px; color: #222; box-sizing: border-box; transition: color 0.3s, background-color 0.3s, border-color 0.3s; --arrowAnime: none; }
@media (max-width: 767px) { .cmn-menuCard { gap: 2.5641vw; padding: 3.07692vw 3.84615vw 3.07692vw 2.05128vw; } }
.cmn-menuCard::after { content: "\e5c8"; font-family: "Material Symbols Outlined"; font-size: clamp(0px, 1.38889vw, 20px); font-weight: 200; line-height: 1; color: #00a0e9; flex-shrink: 0; animation: var(--arrowAnime); transition: color 0.3s; }
@media (max-width: 767px) { .cmn-menuCard::after { font-size: 4.61538vw; } }
@media (hover: hover) and (pointer: fine) {
  .cmn-menuCard:hover { background-color: #00a0e9; border-color: #00a0e9; color: #fff; --arrowAnime: arrowMove 0.3s forwards; }
  .cmn-menuCard:hover::after { color: #fff; }
  .cmn-menuCard:hover .cmn-menuCard__icon { background-color: #fff; }
}
.cmn-menuCard__inner { display: flex; align-items: center; gap: clamp(0px, 0.694444vw, 10px); min-width: 0; }
@media (max-width: 767px) { .cmn-menuCard__inner { gap: 2.05128vw; } }
.cmn-menuCard__icon { flex-shrink: 0; width: clamp(0px, 3.47222vw, 50px); height: clamp(0px, 3.47222vw, 50px); background-color: #00a0e9; -webkit-mask-image: var(--icon); mask-image: var(--icon); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center center; mask-position: center center; transition: background-color 0.3s; }
@media (max-width: 767px) { .cmn-menuCard__icon { width: 10.2564vw; height: 10.2564vw; } }
.cmn-menuCard__label { display: inline-flex; align-items: center; gap: clamp(0px, 0.555556vw, 8px); font-size: clamp(0px, 1.11111vw, 16px); font-weight: 700; line-height: 1.4; }
@media (max-width: 767px) { .cmn-menuCard__label { gap: 1.53846vw; font-size: 3.58974vw; } }

.supportInfo { padding: clamp(0px, 4.16667vw, 60px) clamp(0px, 8.33333vw, 120px); background-color: #f5f5f5; }
@media (max-width: 767px) { .supportInfo { padding: 10.2564vw 5.12821vw; } }
.supportInfo__inner { display: flex; flex-direction: column; gap: clamp(0px, 3.47222vw, 50px); max-width: clamp(0px, 83.3333vw, 1200px); margin: 0 auto; }
@media (max-width: 767px) { .supportInfo__inner { gap: 7.69231vw; } }
.supportInfo__section { display: flex; flex-direction: column; gap: clamp(0px, 2.08333vw, 30px); }
@media (max-width: 767px) { .supportInfo__section { gap: 5.12821vw; } }
.supportInfo__title { color: #00a0e9; font-size: clamp(0px, 1.66667vw, 24px); font-weight: 700; line-height: 1.2; }
@media (max-width: 767px) { .supportInfo__title { font-size: 5.12821vw; } }
.supportInfo__list { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(0px, 0.694444vw, 10px); }
@media (max-width: 767px) { .supportInfo__list { grid-template-columns: 1fr; gap: 2.5641vw; } }
.supportInfo__more { display: flex; justify-content: flex-end; }
.supportInfo__moreLink { display: inline-flex; align-items: center; gap: clamp(0px, 0.347222vw, 5px); padding-bottom: clamp(0px, 0.347222vw, 5px); color: #00a0e9; font-size: clamp(0px, 1.11111vw, 16px); line-height: 1.4; border-bottom: 1px solid #00a0e9; transition: color 0.3s, border-color 0.3s; --arrowAnime: none; }
@media (max-width: 767px) { .supportInfo__moreLink { gap: 1.28205vw; padding-bottom: 1.02564vw; font-size: 3.58974vw; } }
.supportInfo__moreLink::after { content: "\e5c8"; font-family: "Material Symbols Outlined"; font-size: clamp(0px, 1.11111vw, 16px); font-weight: 200; line-height: 1; color: #00a0e9; flex-shrink: 0; animation: var(--arrowAnime); }
@media (max-width: 767px) { .supportInfo__moreLink::after { font-size: 3.58974vw; } }
@media (hover: hover) and (pointer: fine) {
  .supportInfo__moreLink:hover { color: #00437c; border-color: #00437c; --arrowAnime: arrowMove 0.3s forwards; }
  .supportInfo__moreLink:hover::after { color: #00437c; }
}

.supportInfo__premium { padding: clamp(0px, 4.16667vw, 60px) clamp(0px, 2.77778vw, 40px); background-color: #fff; border: 1px solid #d7a32e; box-sizing: border-box; }
@media (max-width: 767px) { .supportInfo__premium { padding: 7.69231vw 5.12821vw; } }
.supportInfo__premiumBody { display: flex; justify-content: space-between; gap: clamp(0px, 2.56944vw, 37px); }
@media (max-width: 767px) { .supportInfo__premiumBody { flex-direction: column; align-items: stretch; gap: 6.15385vw; } }
.supportInfo__premiumIntro { display: flex; flex-direction: column; justify-content: space-between; width: clamp(0px, 23.8194vw, 343px); flex-shrink: 0; }
@media (max-width: 767px) { .supportInfo__premiumIntro { width: 100%; gap: 5.12821vw; } }
.supportInfo__premiumCopy { display: flex; flex-direction: column; gap: clamp(0px, 1.04167vw, 15px); }
@media (max-width: 767px) { .supportInfo__premiumCopy { gap: 2.5641vw; } }
.supportInfo__premiumTitle { color: #d7a32e; font-size: clamp(0px, 1.38889vw, 20px); font-weight: 700; line-height: 1.4; }
@media (max-width: 767px) { .supportInfo__premiumTitle { font-size: 4.10256vw; text-align: center; } }
.supportInfo__premiumTitle__brand { font-size: calc(1em + 3px); }
.supportInfo__premiumText { font-size: clamp(0px, 1.04167vw, 15px); line-height: 1.6; }
@media (max-width: 767px) { .supportInfo__premiumText { font-size: 3.33333vw; line-height: 1.8; } }
.supportInfo__premiumBtn { display: flex; align-items: center; justify-content: center; padding: 0 clamp(0px, 2.77778vw, 40px) 0 clamp(0px, 1.38889vw, 20px); width: clamp(0px, 19.1667vw, 276px); min-height: clamp(0px, 3.47222vw, 50px); background-color: #d7a32e; border-radius: 100vw; color: #fff; font-size: clamp(0px, 1.11111vw, 16px); font-weight: 700; line-height: 1.2; text-align: center; box-sizing: border-box; position: relative; transition: background-color 0.3s; --arrowAnime: none; }
@media (max-width: 767px) { .supportInfo__premiumBtn { padding: 0 9.23077vw 0 4.10256vw; width: 100%; min-height: 12.3077vw; font-size: 3.58974vw; } }
.supportInfo__premiumBtn::after { content: "\e5c8"; font-family: "Material Symbols Outlined"; font-size: clamp(0px, 1.11111vw, 16px); font-weight: 400; line-height: 1; color: #fff; position: absolute; right: clamp(0px, 1.38889vw, 20px); animation: var(--arrowAnime); }
@media (max-width: 767px) { .supportInfo__premiumBtn::after { font-size: 4.10256vw; right: 4.10256vw; } }
@media (hover: hover) and (pointer: fine) { .supportInfo__premiumBtn:hover { background-color: #c49228; --arrowAnime: arrowMove 0.3s forwards; } }
.supportInfo a.supportInfo__premiumBtn, .supportInfo a.supportInfo__premiumBtn:hover { color: #fff; }
.supportInfo__premiumCards { display: flex; gap: clamp(0px, 1.38889vw, 20px); }
@media (max-width: 767px) { .supportInfo__premiumCards { flex-direction: column; gap: 3.07692vw; } }
.supportInfo__premiumCard { display: flex; flex-direction: column; align-items: center; padding: clamp(0px, 0.694444vw, 10px) clamp(0px, 1.38889vw, 20px) clamp(0px, 1.38889vw, 20px); width: clamp(0px, 25vw, 360px); min-height: clamp(0px, 13.6111vw, 196px); background-color: #fff; border: 1px solid rgba(0, 0, 0, 0.05); border-radius: 5px; color: #222; box-sizing: border-box; transition: border-color 0.3s, background-color 0.3s; --arrowAnime: none; }
@media (max-width: 767px) { .supportInfo__premiumCard { padding: 2.5641vw 4.10256vw 4.10256vw; width: 100%; min-height: 41.0256vw; } }
@media (hover: hover) and (pointer: fine) { .supportInfo__premiumCard:hover { border-color: #d7a32e; --arrowAnime: arrowMove 0.3s forwards; } }
.supportInfo__premiumCard__icon { flex-shrink: 0; width: clamp(0px, 8.33333vw, 120px); height: clamp(0px, 8.33333vw, 120px); overflow: hidden; background-color: #d7a32e; -webkit-mask-image: var(--icon); mask-image: var(--icon); -webkit-mask-size: contain; mask-size: contain; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center center; mask-position: center center; }
@media (max-width: 767px) { .supportInfo__premiumCard__icon { width: 23.0769vw; height: 23.0769vw; } }
.supportInfo__premiumCard__row { display: flex; align-items: center; gap: clamp(0px, 0.694444vw, 10px); width: 100%; min-height: clamp(0px, 3.19444vw, 46px); }
@media (max-width: 767px) { .supportInfo__premiumCard__row { gap: 2.05128vw; min-height: 10.2564vw; } }
.supportInfo__premiumCard__row::after { content: "\e5c8"; font-family: "Material Symbols Outlined"; font-size: clamp(0px, 1.11111vw, 16px); font-weight: 200; line-height: 1; color: #d7a32e; flex-shrink: 0; animation: var(--arrowAnime); }
@media (max-width: 767px) { .supportInfo__premiumCard__row::after { font-size: 4.10256vw; } }
.supportInfo__premiumCard__label { display: flex; align-items: center; gap: clamp(0px, 0.138889vw, 2px); flex: 1 1 auto; min-width: 0; }
.supportInfo__premiumCard__text { flex: 0 1 auto; min-width: 0; font-size: clamp(0px, 1.11111vw, 16px); font-weight: 700; line-height: 1.4; text-align: left; }
@media (max-width: 767px) { .supportInfo__premiumCard__text { font-size: 3.33333vw; } }
.supportInfo__premiumCard__lock { flex-shrink: 0; width: clamp(0px, 1.38889vw, 20px); height: clamp(0px, 1.38889vw, 20px); }
@media (max-width: 767px) { .supportInfo__premiumCard__lock { width: 4.10256vw; height: 4.10256vw; } }

/* --- 製品に関するお問い合わせ（コーポレート common.css / contents.css / supportCalculator.css より） --- */
/* 外枠：.supportCalculator__bottom（上下 60px）＋ .container 相当。下側の margin がフッターとの間隔 */
.productContactArea { margin: clamp(0px, 4.16667vw, 60px) 0; }
@media (max-width: 767px) { .productContactArea { margin: 10.2564vw 0; } }
.productContactArea__container { margin: 0 auto; padding: 0 clamp(0px, 8.33333vw, 120px); max-width: clamp(0px, 83.3333vw, 1200px); position: relative; }
@media (max-width: 767px) { .productContactArea__container { padding: 0 5.12821vw; max-width: none; } }

/* 製品サイト向けの補正（.productContact 配下のみ） */
.productContact { font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif; line-height: 1; color: #222; text-align: left; box-sizing: border-box; }
.productContact *, .productContact *::before, .productContact *::after { box-sizing: border-box; }
.productContact h2, .productContact p, .productContact ul, .productContact li { margin: 0; padding: 0; list-style: none; }
.productContact a, .productContact a:hover { text-decoration: none; opacity: 1; }
.productContact .is-mb { display: none; }
@media (max-width: 767px) { .productContact .is-mb { display: block; } }

.productContact { padding: clamp(0px, 2.77778vw, 40px) clamp(0px, 4.16667vw, 60px); background-color: #f5f5f5; }
@media (max-width: 767px) { .productContact { padding: 7.69231vw 5.12821vw; } }
.productContact__inner { display: flex; flex-direction: column; align-items: center; gap: clamp(0px, 2.77778vw, 40px); max-width: clamp(0px, 75vw, 1080px); margin: 0 auto; }
@media (max-width: 767px) { .productContact__inner { gap: 7.69231vw; } }
.productContact__title { color: #00a0e9; font-size: clamp(0px, 1.38889vw, 20px); font-weight: 700; line-height: 1.2; text-align: center; }
@media (max-width: 767px) { .productContact__title { font-size: 4.61538vw; } }
.productContact__body { display: flex; flex-direction: column; align-items: center; gap: clamp(0px, 2.08333vw, 30px); width: 100%; }
@media (max-width: 767px) { .productContact__body { gap: 5.12821vw; } }
.productContact__primary { display: flex; flex-direction: column; align-items: center; gap: clamp(0px, 0.694444vw, 10px); padding-bottom: clamp(0px, 2.08333vw, 30px); width: 100%; max-width: clamp(0px, 52.0833vw, 750px); border-bottom: 1px solid rgba(0, 0, 0, 0.15); }
@media (max-width: 767px) { .productContact__primary { gap: 2.5641vw; padding-bottom: 5.12821vw; width: 100%; max-width: 100%; } }
.productContact__memberBtn { display: flex; align-items: center; justify-content: center; gap: clamp(0px, 0.694444vw, 10px); padding: clamp(0px, 1.38889vw, 20px) clamp(0px, 2.77778vw, 40px); width: 100%; min-height: clamp(0px, 4.44444vw, 64px); border: 0; background-color: #d7a32e; border-radius: 100vw; color: #fff; font-family: inherit; box-sizing: border-box; position: relative; cursor: pointer; -webkit-appearance: none; appearance: none; transition: background-color 0.3s; --arrowAnime: none; }
@media (max-width: 767px) { .productContact__memberBtn { gap: 2.05128vw; padding: 2.5641vw 9.23077vw 2.5641vw 4.10256vw; min-height: 14.359vw; } }
.productContact a.productContact__memberBtn, .productContact a.productContact__memberBtn:hover { color: #fff; }
.productContact__memberBtn::after { content: "\e5c8"; font-family: "Material Symbols Outlined"; font-size: clamp(0px, 1.38889vw, 20px); font-weight: 400; line-height: 1; color: #fff; position: absolute; right: clamp(0px, 1.38889vw, 20px); animation: var(--arrowAnime); }
@media (max-width: 767px) { .productContact__memberBtn::after { font-size: 4.10256vw; right: 4.10256vw; } }
@media (hover: hover) and (pointer: fine) {
  .productContact__memberBtn:hover { background-color: #c49228; color: #fff; --arrowAnime: arrowMove 0.3s forwards; }
  .productContact__memberBtn:hover img { opacity: 1; }
}
.productContact__memberBtn__lock { flex-shrink: 0; width: clamp(0px, 0.833333vw, 12px); height: clamp(0px, 1.18056vw, 17px); }
@media (max-width: 767px) { .productContact__memberBtn__lock { width: 3.07692vw; height: 4.35897vw; } }
.productContact__memberBtn__label { display: inline-flex; align-items: baseline; flex-wrap: wrap; justify-content: center; text-align: center; gap: clamp(0px, 0.277778vw, 4px) 0; }
.productContact__memberBtn__text { font-size: clamp(0px, 1.38889vw, 20px); font-weight: 700; line-height: 1.2; }
@media (max-width: 767px) { .productContact__memberBtn__text { font-size: 3.58974vw; } }
.productContact__memberBtn__sub { font-size: clamp(0px, 0.833333vw, 12px); font-weight: 700; line-height: 1.2; }
@media (max-width: 767px) { .productContact__memberBtn__sub { font-size: 2.5641vw; } }
.productContact__note { width: 100%; font-size: clamp(0px, 0.972222vw, 14px); line-height: 1.2; text-align: center; }
@media (max-width: 767px) { .productContact__note { font-size: 3.07692vw; } }
.productContact__links { display: flex; align-items: center; justify-content: center; gap: clamp(0px, 2.77778vw, 40px); }
@media (max-width: 767px) { .productContact__links { flex-direction: column; align-items: flex-start; gap: 3.84615vw; width: 100%; } }
@media (max-width: 767px) { .productContact__links__item { width: 100%; } }
.productContact__link { display: inline-flex; align-items: center; gap: clamp(0px, 0.694444vw, 10px); color: #222; font-size: clamp(0px, 1.11111vw, 16px); line-height: 1.2; transition: color 0.3s; --arrowAnime: none; }
@media (max-width: 767px) { .productContact__link { gap: 2.05128vw; font-size: 3.58974vw; width: 100%; } }
.productContact__link::after { content: "\e5c8"; font-family: "Material Symbols Outlined"; font-size: clamp(0px, 1.11111vw, 16px); font-weight: 400; line-height: 1; color: #00a0e9; flex-shrink: 0; animation: var(--arrowAnime); }
@media (max-width: 767px) { .productContact__link::after { margin-left: auto; font-size: 4.61538vw; } }
@media (hover: hover) and (pointer: fine) { .productContact__link:hover { color: #00a0e9; --arrowAnime: arrowMove 0.3s forwards; } }
.productContact__link--accent { color: #00a0e9; }
.productContact__link--accent span { text-decoration: underline; text-underline-offset: 0.15em; }
@media (hover: hover) and (pointer: fine) {
  .productContact__link--accent:hover { color: #00437c; }
  .productContact__link--accent:hover::after { color: #00437c; }
}

@keyframes arrowMove {
  0%   { transform: translateX(0);    opacity: 1; }
  50%  { transform: translateX(1em);  opacity: 0; }
  51%  { transform: translateX(-1em); opacity: 0; }
  100% { transform: translateX(0);    opacity: 1; }
}