/* =========================================================
 * OME HOJINKAI – Top Page Main Styles
 * ========================================================= */

/* ---------- 共通 ---------- */
:root {
  --space-s: 8px;
  --space-m: 16px;
  --space-l: 32px;
  --space-xxl: 80px;
}

/* =========================================================
 * Section Title（罫線ループ装飾付き／中央寄せ・5倍拡大）
 * ========================================================= */
.c-section-title {
  font-weight: 300;
  font-size: clamp(1.8rem, 2.9vw, 2.4rem); /* ★ 約80% */
  line-height: 1.25;
  position: relative;
  z-index: 1;
  margin:80px 0 0;
    color: var(--color-green);
  text-align: center;
  padding-bottom: 40px; /* タイトルと罫線の間 */
}

/* 下線ループ装飾 */
.c-section-title::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100%; /* ★ 以前の約5倍スケール */
  height: 190px; /* ★ 線画サイズもアップ */
  transform: translateX(-50%);
  background: url("../images/sec-lineart01.svg") repeat-x center bottom;
  background-size: auto 60px; /* 高さ基準でリピートサイズ調整 */
  opacity: 1;
  pointer-events: none;
}

/* ---------- Responsive（SP時は拡大しすぎないように調整） ---------- */
@media (max-width: 768px) {
  .c-section-title::after {
    width: 100%;
    height: 80px;
    opacity: 1;
  }
}

/* =========================================================
コンテナ調整
 * ========================================================= */
.l-container {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 20px 120px;
  background: var(--color-bg);
}

/* ---------- Tablet調整（左右余白を縮小） ---------- */
@media (max-width: 1200px) {
  .l-container {
    padding-left: 40px;
    padding-right: 40px;
  }
}

/* =========================================================
 * Responsive – SP調整（padding最小化）
 * ========================================================= */
@media (max-width: 768px) {
  .l-container {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* 共通ボタンの右寄せ解除（中央揃えでもOK） */
  .p-top-section__btn-wrap {
    text-align: center;
    margin-top: var(--space-m);
  }
}

/* =========================================================
 * 共通：一覧ボタン（右揃え）
 * ========================================================= */
.p-top-section__btn-wrap {
  text-align: right;
  margin-top: var(--space-l);
}

.p-top-section__btn {
  display: inline-block;
  border: 2px solid var(--color-green);
  color: var(--color-green);
  background: transparent;
  padding: 8px 24px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  transition: all 0.25s ease;
}

.p-top-section__btn:hover {
  background: var(--color-green);
  color: #fff;
  text-decoration: none;
}

/* =========================================================
 * イベント・セミナー（TOP）
 * ========================================================= */

.p-top-event__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 48px;
}

.p-top-event__item {
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  border-radius: 8px;
  overflow: hidden;
  transition: transform 0.2s;
}
.p-top-event__item:hover {
  transform: translateY(-4px);
}

.p-top-event__thumb {
  position: relative;
    display: block;
}
.p-top-event__thumb img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

/* カテゴリチップ */
.p-top-event__cat {
  position: absolute;
  top: 8px;
  left: 8px;
  font-size: 0.8rem;
  padding: 2px 8px;
  border-radius: 4px;
  color: #fff;
}
.p-top-event__cat.is-seminar {
  background: var(--color-primary); /* 青 */
}
.p-top-event__cat.is-event {
  background: var(--color-green); /* 緑 */
}

/* タイトル・開催日・抜粋 */
.p-top-event__ttl {
  margin: var(--space-s);
  font-size: 1.2em;
  font-weight: 300;
  line-height: 1.4;
}
.p-top-event__date {
  margin: 0 var(--space-s);
  font-size: 0.9rem;
  color: var(--color-muted);
}
.p-top-event__excerpt {
  color: var(--color-muted);
  font-size: 0.9rem;
  margin: 0 var(--space-s) var(--space-s);
}

/* カレンダーボタン */
.p-top-event__calendar-wrap {
  text-align: center;
  margin-top: 48px;
}
.p-top-event__calendar-btn {
  display: inline-block;
  padding: 12px 36px;
  border: 2px solid var(--color-green);
  color: var(--color-green);
  font-weight: 500;
  border-radius: 9999px;
  transition: all 0.25s ease;
    text-decoration: none;
}
.p-top-event__calendar-btn:hover {
  background: var(--color-green);
  color: #fff;
    text-decoration: none;
}


/* =========================================================
 * お知らせ・税のトピック（上品なインライン枠付き）
 * ========================================================= */
.p-top-news__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-l);
}

.p-top-news__item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-m);
  background: var(--color-bg);
  border: 1px solid #ddd; /* 枠線を淡く */
  border-radius: 8px;
  padding: 15px; /* 内側に余白を確保 */
  box-shadow: 0 1px 2px rgba(0,0,0,0.03); /* ごく薄い影で立体感を軽く */
  transition: all 0.25s ease;
}

.p-top-news__item:hover {
  border-color: var(--color-border);
  transform: translateY(-2px);
}

.p-top-news__thumb img {
  width: 120px;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 4px;
}

.p-top-news__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.p-top-news__ttl {
  font-size: 1.2em;
  font-weight: 300;
  color: var(--color-text);
  margin-bottom: 4px;
}

.p-top-news__date {
  font-size: 0.9rem;
  color: var(--color-muted);
  margin-bottom: 6px;
}

.p-top-news__excerpt {
  font-size: 0.9rem;
  color: var(--color-muted);
  line-height: 1.6;
}

/* カード全体クリック */
.p-top-news__link {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  text-decoration: none;
  color: inherit;
}

/* サムネ */
.p-top-news__thumb img {
  width: 120px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 6px;
}

/* 本文（タイトル＋日付） */
.p-top-news__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.p-top-news__ttl {
  font-size: 1.1rem;
  margin-bottom: 6px;
  font-weight: 400;
}

.p-top-news__date {
  font-size: 0.9rem;
  color: var(--color-muted);
}

/* 抜粋は完全非表示 */
.p-top-news__excerpt {
  display: none !important;
}

/* =========================================================
 * TOP：法人会とは？（固定ページ4件）
 * ========================================================= */
.p-top-outline {
  margin-top: 0;
}

.p-top-outline__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px;
    margin-top: 20px;
}

.p-top-outline__item {
  width: calc(25% - 30px);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.p-top-outline__item:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}

.p-top-outline__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}
.p-top-outline__link:hover{
    text-decoration: none;
}

.p-top-outline__thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}

.p-top-outline__thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.p-top-outline__body {
  padding: 10px;
}

.p-top-outline__title {
  font-weight: 500;
  font-size: 1.1rem;
  margin-bottom: 8px;
  color: var(--color-text);
}

.p-top-outline__excerpt {
  font-size: 0.9rem;
  color: var(--color-muted);
  line-height: 1.6;
}

/* --- Tablet --- */
@media (max-width: 1024px) {
  .p-top-outline__item {
    width: calc(50% - 20px);
  }
}

/* --- Smartphone --- */
@media (max-width: 600px) {
  .p-top-outline__list {
    gap: 24px;
  }
  .p-top-outline__item {
    width: 100%;
  }
}

/* =========================================================
 * 活動報告
 * ========================================================= */
.p-top-activity__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: var(--space-l);
}
.p-top-activity__item {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  overflow: hidden;
}
.p-top-activity__item img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
}
.p-top-activity__item h3 {
  font-size: 1rem;
  margin: var(--space-s);
}
.p-top-activity__item time {
  font-size: 0.85rem;
  color: var(--color-muted);
  margin-left: var(--space-s);
}

/* =========================================================
 * 会報誌セクション（A4比率・縦長表紙対応）
 * ========================================================= */
.p-top-magazine__wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--space-l);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 24px;
  background: var(--color-surface);
}

/* --- A4縦長比率を反映 --- */
.p-top-magazine__img.-a4 {
  width: 100%;
  aspect-ratio: 1 / 1.414; /* A4縦比率 */
  object-fit: cover;
  border-radius: 4px;
  display: block;
}

.p-top-magazine__thumb {
  flex: 0 0 300px; /* 若干スリムにしてA4縦長でも収まりよく */
  text-align: center;
}
.p-top-magazine__thumb .mag-ttl {
  margin-top: 12px;
  font-weight: 300;
  font-size: 1.1rem;
}

.p-top-magazine__body {
  flex: 1;
  min-width: 260px;
  line-height: var(--lh-loose);
}

/* --- ボタン共通 --- */
.p-top-magazine__btn-wrap {
  margin-top: 24px;
    text-align: center;
}
.p-top-magazine__btn {
  display: inline-block;
  border: 1px solid var(--color-green);
  color: var(--color-green);
  padding: 10px 28px;
  border-radius: 4px;
  transition: all 0.2s ease;
  font-weight: 400;
}
.p-top-magazine__btn:hover {
  background: var(--color-green);
  color: #fff;
  text-decoration: none;
}

/* --- PC/SP切り替え --- */
.is-pc { display: block; }
.is-sp { display: none; }

@media (max-width: 768px) {
  .p-top-magazine__wrap {
    flex-direction: column;
    padding: 16px;
  }
  .p-top-magazine__thumb {
    width: 100%;
    margin: 0 auto;
  }
  .is-pc { display: none; }
  .is-sp { display: block; }
}


/* =========================================================
 * アクセスマップ
 * ========================================================= */
.p-top-map {
  text-align: center;
}

.p-top-map__info {
  color: var(--color-muted);
  font-size: 0.95rem;
}
.p-top-map__actions {
  display: flex;
  justify-content: center;
  gap: var(--space-m);
  margin-top: var(--space-m);
  flex-wrap: wrap;
}

/* =========================================================
 * ボタン（TOP専用UI）
 * ========================================================= */
.c-btn {
  display: inline-block;
  padding: 10px 24px;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--color-green);
  border: 2px solid var(--color-green);
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.25s ease;
  background-color: #fff;
}

.c-btn:hover {
  background-color: var(--color-green);
  color: #fff;
}

.c-btn:focus-visible {
  outline: 3px solid rgba(0, 123, 67, 0.3);
  outline-offset: 3px;
}

.u-text-center .c-btn {
  margin-inline: auto;
}

/* =========================================================
 * SP時 2カラム化（お知らせ以外のTOPコンテンツ）
 * ========================================================= */
@media (max-width: 768px) {

  /* ▼ イベント・セミナー */
  .p-top-event__grid {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  /* SPでは excerpt 非表示 */
  .p-top-event__excerpt {
    display: none !important;
  }

  /* ▼ 活動報告 */
  .p-top-activity__grid {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }

  /* ▼ 法人会とは？（固定ページ4件） */
  .p-top-outline__list {
    display: grid;
    grid-template-columns: 1fr 1fr; 
    gap: 16px;
  }
}
/* =========================================================
   TOP：3メニュー（p-front-menu）
   カード背景＝緑、丸＝白、ピクト＝緑、文字＝白（PC/TAB/SP 共通）
========================================================= */

.p-front-menu {
  margin: 0 0 40px;
}

@media (max-width: 768px) {
  .p-front-menu {
    margin: 10px 0 32px;
  }
}

/* グリッドレイアウト */
.p-front-menu__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

@media (max-width: 768px) {
  .p-front-menu__grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

/* カード本体（PC/TAB/SP共通） */
.p-front-menu__item {
  display: flex;
  align-items: center;
  gap: 18px;
  /* ★ padding を 30% 減らし気味に */
  padding: 10px 14px;         /* 旧 14px 18px → 約 30% 減 */
  min-height: 90px;
  border-radius: 45px;
  border: 2px solid var(--color-green);
  background: var(--color-green);
  text-decoration: none;
  color: #fff;
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

/* タイトル・説明文も必ず白 */
.p-front-menu__item h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
}

.p-front-menu__item p {
  margin: 0;
  font-size: 14px;
  color: #fff;
  opacity: 0.95;
}

/* PC hover（背景だけほんの少し明るく） */
@media (hover:hover) {
  .p-front-menu__item:hover {
    background: #038c4b;        /* 常盤色よりわずかに明るい程度 */
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    text-decoration: none;
  }
}

/* アイコン：白丸＋中のピクトが緑 */
.p-front-menu__icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  flex-shrink: 0;
  background-color: #ffffff;     /* ★ 丸は常に白 */
  background-repeat: no-repeat;
  background-position: center;
  background-size: 65%;
}

/* --- SVG アイコン（fill を緑に変更） --- */
/* イベント・セミナー */
.p-icon-event {
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' fill='%23007B43' viewBox='0 0 256 256'>\
<path d='M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-68-76a12,12,0,1,1-12-12A12,12,0,0,1,140,132Zm44,0a12,12,0,1,1-12-12A12,12,0,0,1,184,132ZM96,172a12,12,0,1,1-12-12A12,12,0,0,1,96,172Zm44,0a12,12,0,1,1-12-12A12,12,0,0,1,140,172Zm44,0a12,12,0,1,1-12-12A12,12,0,0,1,184,172Z'/>\
</svg>");
}

/* 入会のご案内（会員案内） */
.p-icon-member {
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' fill='%23007B43' viewBox='0 0 256 256'>\
<path d='M152,80a8,8,0,0,1,8-8h88a8,8,0,0,1,0,16H160A8,8,0,0,1,152,80Zm96,40H160a8,8,0,0,0,0,16h88a8,8,0,0,0,0-16Zm0,48H184a8,8,0,0,0,0,16h64a8,8,0,0,0,0-16Zm-96.25,22a8,8,0,0,1-5.76,9.74,7.55,7.55,0,0,1-2,.26,8,8,0,0,1-7.75-6c-6.16-23.94-30.34-42-56.25-42s-50.09,18.05-56.25,42a8,8,0,0,1-15.5-4c5.59-21.71,21.84-39.29,42.46-48a48,48,0,1,1,58.58,0C129.91,150.71,146.16,168.29,151.75,190ZM80,136a32,32,0,1,0-32-32A32,32,0,0,0,80,136Z'/>\
</svg>");
}

/* 活動報告 */
.p-icon-activity {
  background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' fill='%23007B43' viewBox='0 0 256 256'>\
<path d='M244.8,150.4a8,8,0,0,1-11.2-1.6A51.6,51.6,0,0,0,192,128a8,8,0,0,1-7.37-4.89,8,8,0,0,1,0-6.22A8,8,0,0,1,192,112a24,24,0,1,0-23.24-30,8,8,0,1,1-15.5-4A40,40,0,1,1,219,117.51a67.94,67.94,0,0,1,27.43,21.68A8,8,0,0,1,244.8,150.4ZM190.92,212a8,8,0,1,1-13.84,8,57,57,0,0,0-98.16,0,8,8,0,1,1-13.84-8,72.06,72.06,0,0,1,33.74-29.92,48,48,0,1,1,58.36,0A72.06,72.06,0,0,1,190.92,212ZM128,176a32,32,0,1,0-32-32A32,32,0,0,0,128,176ZM72,120a8,8,0,0,0-8-8A24,24,0,1,1,87.24,82a8,8,0,1,0,15.5-4A40,40,0,1,0,37,117.51,67.94,67.94,0,0,0,9.6,139.19a8,8,0,1,0,12.8,9.61A51.6,51.6,0,0,1,64,128,8,8,0,0,0,72,120Z'/>\
</svg>");
}

/* SP 固有の hover 無効化などは不要
   （背景色も PC と統一なので、@media (hover:hover) だけで十分） */


/* =========================================================
   TOP：税に関するお知らせ（p-front-tax）
========================================================= */

.p-front-tax {
  margin: 24px 0 40px;
}
@media (max-width: 768px) {
  .p-front-tax {
    margin-top: 2em;
  }
}

/* タイトル帯 */
.p-front-tax__titlewrap {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
}

.p-front-tax__icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: var(--color-green);
  background-size: 60%;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 256 256'><path d='M224,200h-8V40a8,8,0,0,0-8-8H152a8,8,0,0,0-8,8V80H96a8,8,0,0,0-8,8v40H48a8,8,0,0,0-8,8v64H32a8,8,0,0,0,0,16H224a8,8,0,0,0,0-16ZM160,48h40V200H160ZM104,96h40V200H104ZM56,144H88v56H56Z'/></svg>");
}

.p-front-tax__title {
  font-size: 20px;
  font-weight: 600;
  color: var(--color-green-dark);
}

/* リスト */
.p-front-tax__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.p-front-tax__item {
  display: flex;
  align-items: center;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1px solid #ddd;
  background: #fff;
  text-decoration: none;
  transition: background 0.15s ease;
}

/* PC hover */
@media (hover:hover) {
  .p-front-tax__item:hover {
    background: #f5f8f6;
  }
}

.p-front-tax__left {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 14px;
}

.p-front-tax__date {
  font-size: 13px;
  color: #777;
  white-space: nowrap;
}

.p-front-tax__titletext {
  font-size: 15px;
  font-weight: 500;
  color: var(--color-green-dark);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1.35;
  max-width: 420px;
}

.p-front-tax__arrow {
  color: #999;
  font-size: 18px;
}

/* 一覧ボタン */
.p-front-tax__btn-wrap {
  text-align: right;
  margin-top: 20px;
}

.p-front-tax__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 26px;
  border-radius: 999px;
  border: 2px solid var(--color-green);
  background: #fff;
  color: var(--color-green);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}

@media (hover:hover) {
  .p-front-tax__btn:hover {
    background: var(--color-green);
    color: #fff;
  }
}

@media (max-width: 768px) {
  .p-front-tax__btn-wrap {
    text-align: center;
  }
  .p-front-tax__btn {
    width: 100%;
    padding: 10px 0;
  }
}


/* =========================================================
   TOP：税に関するお知らせ（p-front-tax）
   PC/SPともに hover → 背景だけ微反応
========================================================= */

.p-front-tax {
  margin: 20px 0 40px;
}

@media (max-width: 768px) {
  .p-front-tax {
    margin-top: 2em;
  }
}

/* --- タイトル帯 --- */
.p-front-tax__titlewrap {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.p-front-tax__icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: var(--color-green);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60%;
  flex-shrink: 0;
  background-image:url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='white' stroke-width='2' viewBox='0 0 24 24'>\
<line x1='6' y1='18' x2='6' y2='12'/>\
<line x1='12' y1='18' x2='12' y2='8'/>\
<line x1='18' y1='18' x2='18' y2='4'/>\
</svg>");
}

.p-front-tax__title {
  font-size: 20px;
  font-weight: 600;
  color: var(--color-green-dark);
}

/* --- リスト --- */
.p-front-tax__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.p-front-tax__item {
  display: flex;
  align-items: center;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1px solid #ddd;
  background: #fff;
  text-decoration: none;
  transition: background 0.15s ease;
}

/* --- PC hover（スマホは無効） --- */
@media (hover:hover) {
  .p-front-tax__item:hover {
    background: #f9fbfa !important;
    text-decoration: none !important;
  }
}

/* --- SP hover 無効化 --- */
@media (max-width:768px) {
  .p-front-tax__item:hover {
    background: #fff !important;
  }
}

.p-front-tax__left {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 14px;
}

.p-front-tax__date {
  font-size: 13px;
  color: #777;
  white-space: nowrap;
}

.p-front-tax__titletext {
  font-size: 15px;
  font-weight: 500;
  color: var(--color-green-dark);
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1.35;
  max-width: 420px;
}

/* --- SP調整 --- */
@media (max-width: 768px) {
  .p-front-tax__titletext {
    max-width: 200px;
  }
}

/* --- 一覧ボタン --- */
.p-front-tax__btn-wrap {
  text-align: right;
  margin-top: 20px;
}

.p-front-tax__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 28px;
  border-radius: 999px;
  border: 2px solid var(--color-green);
  background: #fff;
  color: var(--color-green);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}

/* PC hover */
@media (hover:hover) {
  .p-front-tax__btn:hover {
    background: var(--color-green);
    color: #fff;
  }
}

/* SP */
@media (max-width: 768px) {
  .p-front-tax__btn-wrap {
    text-align: center;
    margin-top: 16px;
  }
  .p-front-tax__btn {
    width: 100%;
    padding: 10px 0;
  }
}
