@charset "utf-8";
/* ==================================================
汎用
================================================== */
/* ----- アイコン ----- */
.icon {
  --iconColor: var(--gradation01);
  width: 80px;
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
  display: flex;
  gap: 4px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  color: #fff;
  font-family: "Lato", sans-serif;
  font-weight: bold;
  font-size: 32px;
  line-height: 1;
  text-align: center;
  background: var(--iconColor);
  border-radius: 50%;
  overflow: hidden;
}
.icon_img {
  /* max-width: 40px; */
}
.icon_sub {
  font-size: 14px;
}
/* - オプション - */
/* 色 */
.icon-orange { --iconColor: var(--subColor); }
.icon-lGray { --iconColor: var(--colorLightGray); }

/* 金利系で使うマイナスアイコン */
.rateMinus {
  vertical-align: middle;
  margin: 0 4px;
  padding-bottom: .1em;
}

/* ----- リンクアイコン ----- */
.linkIcon {
  --linkIcon: url(/common_v3/images/icon/icon_link.svg);
  --linkIconColor: var(--mainColor);
  --linkIconWidth: .9em;
  --linkIconHeight: .9em;
  width: var(--linkIconWidth);
  height: var(--linkIconHeight);
  flex-shrink: 0;
  display: inline-block;
  position: relative;
  top: .1em;
  margin: 0 8px;
}
.linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background: var(--linkIconColor);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--linkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--linkIcon);
}
/* - オプション - */
/* 色 */
.linkIcon-orange { --linkIconColor: var(--subColor); }
.linkIcon-red { --linkIconColor: var(--colorRed); }
/* アイコン種類 */
.linkIcon-blank { --linkIcon: url(/common_v3/images/icon/icon_blank.svg); }
.linkIcon-down { --linkIcon: url(/common_v3/images/icon/icon_down.svg); }
.linkIcon-download { --linkIcon: url(/common_v3/images/icon/icon_download.svg); }
/* PDFはサイズ、仕様調整 */
.linkIcon-pdf {
  --linkIcon: url(/common_v3/images/icon/icon_pdf.svg);
  width: 37px;
  height: 18px;
}

/* ----- faqアイコン ----- */
.faqIcon {
  --faqIconSize: 56px;
  flex: 0 0 auto;
  width: var(--faqIconSize);
  height: var(--faqIconSize);
  color: #fff;
  font-family: "Lato", sans-serif;
  font-weight: bold;
  text-align: center;
  line-height: var(--faqIconSize);
  border-radius: 50%;
  transition:
    var(--transColor),
    var(--transBg);
  /* letter-spacing: -.06em; */
}
.faqIcon_text {
  font-size: 24px;
}
.faqIcon-q { background-color: var(--mainColor); }
.faqIcon-a { background-color: var(--subColor); }


/* ----- アコーディオン（共通） ----- */
.js-acd {
  --acdIconColor: var(--mainColor);
  --acdIconPos: 24px;
  overflow: hidden;
}
/* - ボタン - */
.js-acd_btn {
  width: 100%;
  position: relative;
  background-color: #fff;
  transition: var(--transOpac);
}
.js-acd_btn[summary] { cursor: pointer; }
/* - アイコン - */
.js-acd_btn_icon {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 0;
  right: var(--acdIconPos);
  bottom: 0;
  margin: auto;
}
.js-acd_btn_icon::before,
.js-acd_btn_icon::after {
  content: '';
  width: 18px;
  height: 2px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: var(--acdIconColor);
  margin: auto;
  transition:
    var(--transBg),
    transform var(--defaultTrans);
}
.js-acd_btn_icon::before { transform: rotate(-90deg); }
/* - コンテンツ - */
.js-acd_box {
  display: none;
}
/* - hover - */
.js-acd_btn:hover {
  opacity: var(--hoverOpac);
}
/* - 開閉 - */
.js-acd[open] .js-acd_btn_icon::before { transform: rotate(0); }
/* --- spのみアコーディオン --- */
.acd.acd-spOnly {
  border: none;
}
.acd.acd-spOnly > .acd_btn {
  padding: 0;
  cursor: auto;
}
.acd.acd-spOnly > .acd_btn .acd_btn_icon {
  display: none;
}
.acd.acd-spOnly > .acd_box {
  display: block;
  background: none;
  border: none;
  padding: 0;
  margin-top: 24px;
}
/* ----- アコーディオン（デフォルト） ----- */
.acd {
  border: 1px solid var(--mainColor);
  border-radius: 16px;
  margin-top: 40px;
  overflow: hidden;
}
.acd:first-child { margin-top: 0; }
.acd + .acd { margin-top: 32px; }
.acd .faqIcon { font-size: 22px; }
/* - ボタン - */
.acd_btn {
  display: flex;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.25;
  padding: 24px;
  transition:
    var(--transColor),
    var(--transBg),
    var(--transOpac);
}
.acd_btn_inner {
  width: 100%;
  display: flex;
  gap: 16px;
  align-items: center;
  padding-right: 50px;
}
div.acd_btn > .acd_btn_inner { padding-right: 0; }
.acd_btn_sub {
  font-size: 18px;
}
.acd_btn_icon {

}
/* - コンテンツ - */
.acd_box {
  position: relative;
  background: #fff;
  border-top: 1px solid var(--mainColor);
  padding: 24px;
}
.acd_box_inner {
  width: 100%;
}
.acd_box_inner > .faqIcon-a {
  position: absolute;
}
.acd_box_inner2 {
  margin-top: 24px;
}
.acd_box_main {
  width: 100%;
}
.faqIcon + .acd_box_main:has(> .nmlText:only-child) {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.faqIcon-a + .acd_box_main {
  min-height: 56px;
  padding-left: 72px;
}
.acd_box.wideBox .faqIcon-a + .acd_box_main,
.acd_box.pc_wideBox .faqIcon-a + .acd_box_main {
  padding-left: 0;
  padding-top: 60px;
}
/* - パターン2 - */
.acd-type2 {
  --acdIconColor: #fff;
  border: none;
  border-radius: 0;
}
.acd-type2 .acd_btn {
  width: 420px;
  color: #fff;
  font-size: 18px;
  text-align: center;
  background-color: var(--mainColor);
  border-radius: 12px;
  margin: auto;
}
.acd-type2 .acd_btn_inner {
  justify-content: center;
  padding: 0 24px;
}
.acd-type2 .acd_box {
  background: none;
  border-top: none;
  padding: 48px 0 0;
}

/* ----- 横スクロール（要素は動的生成される） ----- */
.scrollX-pc {
  width: 1600px;
}
.scrollX_container {
  width: 100%;
  position: relative;
  overflow-x: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  margin-top: 40px;
}
.scrollX_container:first-child { margin-top: 0; }
.scrollX_container::-webkit-scrollbar{
  display:none;
}
.scrollX_scrollOverlay {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
  display: block;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .7;
}
.scrollX_scrollIcon {
  position: absolute;
  left: 50%;
  top: 70px;
  z-index: 11;
  transform: translateX(-50%);
  padding-left: 72px;
}
.scrollX_scrollIcon span {
  font-weight: 600;
  font-size: 16px;
  color: #fff;
}
.scrollX_scrollIcon::after {
  position: absolute;
  left: 0;
  top: -15px;
  content: '';
  width: 56px;
  height: 62px;
  background: url(/common_v3/images/icon/icon_swipe.svg) no-repeat center center / contain;
  animation-name: scrollXAnime;
  animation-duration: 1.2s;
  animation-delay: 0s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-fill-mode: forwards;
  animation-direction: alternate;
}
@keyframes scrollXAnime {
  0% { transform: translateX(-5px); }
  50% { transform: translateX(5px); }
  100% { transform: translateX(-5px); }
}
.scrollX-sp { margin-top: 40px; }
.scrollX-sp:first-child { margin-top: 0; }

/* ----- マーカー表現 ----- */
.txtMarker {
  --markerColor: rgba(255, 153, 90, .35);
  background: linear-gradient(to top, var(--markerColor) 0, var(--markerColor) 40%, transparent 40%);
}
/* - マーカー表現色パターン - */
.txtMarker-yellow { --markerColor: #EDDD21; }


/* ==================================================
汎用のスクロールスライダー
================================================== */
.uniSlider_slide > .point {
  --pointH: 100%;
}
.uniSlider {
  --slideWidth: 328px;
  --slideGap: 48px;
  --swiper-navigation-size: 46px;
  --swiper-navigation-sides-offset: calc(var(--swiper-navigation-size) * -.5);
  position: relative;
  margin-top: 40px;
}
.uniSlider:first-child { margin-top: 0; }
.uniSlider_inner {
  margin: 0 calc(var(--slideGap) * -.5);
}
.uniSlider-wide .uniSlider_inner {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.uniSlider_list {
}
.uniSlider_slide {
  width: calc(var(--slideWidth) + var(--slideGap));
  height: auto;
  padding: 0 calc(var(--slideGap) * .5);
}
.uniSlider_slide > a {
  transition: var(--transOpac);
}
.uniSlider_slide > a:hover {
  opacity: var(--hoverOpac);
}
.uniSlider_navigation {
  --navigationColor_on: var(--mainColor);
  --navigationColor_off: #fff;
  width: auto;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  margin: 24px auto 0;
}
.uniSlider_navigation:has(.swiper-pagination-lock) { display: none; }
.uniSlider_pagination {
  width: auto !important;
  gap: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: static;
  z-index: 1;
}
.uniSlider_pagination span {
  width: 12px;
  height: 12px;
  display: block;
  background: var(--navigationColor_off);
  border: 1px solid var(--navigationColor_on);
  border-radius: 50%;
  margin: 0 !important;
  padding: 0;
  opacity: 1;
  cursor: pointer;
  transition: background-color .4s ease;
}
.uniSlider_pagination span:hover {
  background-color: var(--navigationColor_on);
  opacity: var(--hoverOpac);
}
.uniSlider_pagination span.swiper-pagination-bullet-active {
  background: var(--navigationColor_on);
  user-select: none;
  pointer-events: none;
}
/* 再生/停止ボタン */
.uniSlider_control {
  --controlIcon: url(/common_v3/images/icon/icon_stop.svg);
  --controlIconColor: var(--mainColor);
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  color: var(--navigationColor_on);
  text-align: center;
  background: transparent;
  border: 1px solid var(--navigationColor_on);
  border-radius: 50%;
  padding: 0;
  transition:
    var(--transColor),
    var(--transBg);
}
.uniSlider_control::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--controlIconColor);
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--controlIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--controlIcon);
}
.uniSlider_control.is-pause {
  --controlIcon: url(/common_v3/images/icon/icon_start.svg);
}
.uniSlider_control:hover {
  --controlIconColor: var(--navigationColor_off);
  background-color: var(--navigationColor_on);
}
/* 矢印 */
.uniSlider_arrows {
  --icon: url(/common_v3/images/icon/icon_slide_arrow.svg);
  --iconW: 100%;
  --iconH: 100%;
  width: 100%;
  max-width: var(--contentWidth);
  position: absolute;
  top: calc(50% - var(--swiper-navigation-size) * .5);
}
.uniSlider_arrow {
  width: var(--swiper-navigation-size);
  height: var(--swiper-navigation-size);
  border-radius: 50%;
  background-color: rgba(0, 0, 0, .5);
  opacity: 0;
  transition:
    var(--transBg),
    var(--transOpac);
}
.uniSlider_arrow::after {
  content: '';
  width: var(--iconW);
  height: var(--iconH);
  display: block;

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--icon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--icon);
  background-color: #fff;
}
/* ホバー */
.uniSlider_arrow:hover {
  background-color: #000;
}
.uniSlider:hover .uniSlider_arrow {
  opacity: 1;
}
/* アイコン違い */
.uniSlider_arrows-icon2 {
  --icon: url(/common_v3/images/icon/icon_down.svg);
  --iconW: 27px;
  --iconH: 18px;
}
.uniSlider_arrows-icon2 .swiper-button-prev { transform: rotate(90deg); }
.uniSlider_arrows-icon2 .swiper-button-next { transform: rotate(-90deg); }
/* スライドが1枚の時 */
.uniSlider_arrow.swiper-onlySlide .uniSlider_navigation {
  display: none;
}
/* - ナビ部分別パターン - */
.uniSlider-navType2 .uniSlider_navigation {
  gap: 20px;
}
.uniSlider-navType2 .uniSlider_arrow {
  --icon: url(/common_v3/images/icon/icon_down.svg);
  --iconW: 18px;
  --iconH: 12px;
  width: var(--iconW);
  height: var(--iconH);
  position: static;
  background: none;
  border-radius: 0;
  margin: 0;
  opacity: 1;
}
.uniSlider-navType2 .uniSlider_arrow::after {
  background-color: var(--mainColor);
}
.uniSlider-navType2 .swiper-button-prev { transform: rotate(90deg); }
.uniSlider-navType2 .swiper-button-next { transform: rotate(-90deg); }
.uniSlider-navType2 .uniSlider_arrow:hover { opacity: var(--hoverOpac); }
/* カード部分 */
.uniSlider_card {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  color: var(--defaultColor);
  background: #fff;
  border: 1px solid #bebebe;
  border-radius: 16px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
  padding: 16px;
}
a.uniSlider_card {
  transition: var(--transBg);
}
a.uniSlider_card:hover {
  background-color: var(--colorLightGreen);
  opacity: 1;
}
.uniSlider_card_thumb {
  aspect-ratio: 75 / 41;
  width: 100%;
  display: flex;
  align-items: center;
  border-radius: 12px;
  margin-top: 12px;
  overflow: hidden;
}
.uniSlider_card_thumb:first-child { margin-top: 0; }
.uniSlider_card_thumb > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.uniSlider_card_txt {
  font-weight: 500;
  font-size: 16px;
  letter-spacing: .03em;
  margin-top: 16px;
}
/* ----- スライダー化しなかったとき ----- */
.uniSlider.is-notSlider .uniSlider_navigation {
  display: none;
}
.uniSlider.is-notSlider .uniSlider_list {
  justify-content: center;
}


/* ==================================================
heading
================================================== */
/* ----- h1 ----- */
.heading1 {
  --heading1GapY: 0;
  --heading1GapX: 0;
  --heading1Rows: max-content;
  --heading1Columns: max-content;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  padding: 24px 0;
}
.heading1:has(.heading1_foot) {
  --heading1GapY: 24px;
  --heading1Rows: max-content 1fr;
}
.heading1:has(.heading1_extra) {
  --heading1GapX: 24px;
  --heading1Columns: max-content 1fr;
}
.heading1_inner {
  width: 100%;
  max-width: calc(1080px + var(--contentPaddingXDouble));
  display: grid;
  gap: var(--heading1GapY) var(--heading1GapX);
  grid-template-rows: var(--heading1Rows);
  grid-template-columns: var(--heading1Columns);
  margin: auto;
  padding: 0 var(--contentPaddingX);
}
/* 白枠部分 */
.heading1_head {
  display: flex;
  gap: 12px;
  flex-direction: column;
  line-height: 1.3;
  background-color: #fff;
  border-radius: 16px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
  padding: 40px;
}
.heading1_head_inner {
  display: flex;
  gap: 12px;
  flex-direction: column;
}
.heading1_ttl {
  display: flex;
  gap: 12px;
  align-items: center;
  color: var(--mainColor);
  font-size: 40px;
  font-weight: bold;
  letter-spacing: .05em;
}
.heading1_subTtl {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: .05em;
}
.heading1_ttl_icon {
  flex-shrink: 0;
}
/* 白枠外 */
.heading1_foot {
}
.heading1_foot .nmlBtn {
  --btnPos: flex-start;
  --nmlBtnMaxW: 320px;
  --nmlBtnMinH: 54px;
  row-gap: 16px;
  align-items: flex-start;
}
.heading1_foot .nmlBtn_text_sub {
  font-size: 16px;
}
.heading1_foot .nmlBtn_icon {
  left: 16px;
}
.heading1_foot .smlBtn {
  --smlBtnW: 320px;
}
.heading1_foot .smlBtn_text_main {
  font-size: 16px;
}
/* 追加エリア（右側） */
.heading1_extra {
  grid-row: 1 / span 2;
  grid-column: 2;
  width: 100%;
  justify-self: end;
  position: relative;
}

/* - h1（背景画像有り） - */
.heading1-typeImg {
  min-height: 385px;
}
.heading1-typeImg .heading1_inner {
}
.heading1-typeImg .heading1_head,
.heading1-typeImg .heading1_foot {
  min-width: 415px;
  max-width: 640px;
  position: relative;
}
.heading1-typeImg .heading1_head {
  grid-row: 1;
  grid-column: 1;
}
.heading1-typeImg .heading1_foot {
  grid-row: 2;
  grid-column: 1;
}
.heading1_img {
  width: 100%;
  height: 385px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  z-index: 0;
}
.heading1_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.heading1-imgOnly .heading1_img {
  height: auto;
  position: relative;
}

/* - h1 スライダー - */
.heading1_slider {
  --swiper-navigation-sides-offset: 10px;
  --swiper-navigation-size: 46px;
  width: 100%;
  max-width: 400px;
  position: absolute;
  top: 0;
  right: 0;
}
.heading1_slider_inner {
  border-radius: 16px;
}
.heading1_slider_slide {
  background: #ccc;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}
a.heading1_slider_slide_inner {
  transition: opacity .4s ease;
}
a.heading1_slider_slide_inner:hover { opacity: .7; }
/* ページネーションや矢印などを内包している */
.heading1_slider_navigation {
  --navigationColor_on: var(--mainColor);
  --navigationColor_off: #fff;
  width: auto;
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
  margin: 8px auto 0;
}
/* ページネーション */
.heading1_slider_pagination {
  width: auto !important;
  gap: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: static;
  z-index: 1;
}
.heading1_slider_pagination span {
  width: 12px;
  height: 12px;
  display: block;
  background: var(--navigationColor_off);
  border: 1px solid var(--navigationColor_on);
  border-radius: 50%;
  margin: 0 !important;
  padding: 0;
  opacity: 1;
  cursor: pointer;
  transition: background-color .4s ease;
}
.heading1_slider_pagination span:hover {
  background-color: var(--navigationColor_on);
  opacity: var(--hoverOpac);
}
.heading1_slider_pagination span.swiper-pagination-bullet-active {
  background: var(--navigationColor_on);
  user-select: none;
  pointer-events: none;
}
/* 再生/停止ボタン */
.heading1_slider_control {
  --controlIcon: url(/common_v3/images/icon/icon_stop.svg);
  --controlIconColor: var(--mainColor);
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  color: var(--navigationColor_on);
  text-align: center;
  background: transparent;
  border: 1px solid var(--navigationColor_on);
  border-radius: 50%;
  padding: 0;
  transition:
    var(--transColor),
    var(--transBg);
}
.heading1_slider_control::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--controlIconColor);
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--controlIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--controlIcon);
}
.heading1_slider_control.is-pause {
  --controlIcon: url(/common_v3/images/icon/icon_start.svg);
}
.heading1_slider_control:hover {
  --controlIconColor: var(--navigationColor_off);
  background-color: var(--navigationColor_on);
}
/* 矢印 */
.heading1_slider_arrow {
  width: var(--swiper-navigation-size);
  height: var(--swiper-navigation-size);
  opacity: 0;
  border-radius: 50%;
  background-color: rgba(0, 0, 0, .5);
  transition:
    var(--transBg),
    var(--transOpac);
}
.heading1_slider_arrow::after {
  width: 100%;
  height: 100%;
  font-size: 0;
  background: url(/common_v3/images/icon/icon_slide_arrow.svg) no-repeat center / contain;
}
.swiper-button-prev {
  transform: scale(-1, 1);
}
/* ホバー */
.heading1_slider:hover .heading1_slider_arrow {
  opacity: 1;
}
.heading1_slider_arrow:hover {
  background-color: var(--mainColor);
}
/* スライドが1枚の時 */
.heading1_slider.swiper-onlySlide .heading1_slider_navigation {
  display: none;
}
/* 背景色があるパターン（secondviewが続けてあるパターン） */
.bgMain .heading1_slider_navigation {
  --navigationColor_on: #fff;
  --navigationColor_off: var(--mainColor);
}
.bgMain .heading1_slider_control {
  --controlIconColor: #fff;
}
.bgMain .heading1_slider_control:hover {
  --controlIconColor: var(--mainColor);
  background-color: #fff;
}
/* - h1（背景画像無し） - */
.heading1-typeTxt {
  --heading1Columns: 1fr;
  background: #F7F7F7;
  /* margin-bottom: 80px; */
  padding: 24px 0;
}

/* footがなくてスライダーがあるパターン */
.heading1-pattern2 {
  height: 385px;
  padding-top: 0;
  padding-bottom: 0;
}
.heading1-pattern2 .heading1_inner {
  height: 100%;
  display: flex;
  align-items: center;
  position: relative;
  padding-top: 24px;
  padding-bottom: 24px;
}
.heading1-pattern2 .heading1_extra {
  position: absolute;
  top: 12px;
  right: var(--contentPaddingX);
}

/* ----- secondView ----- */
.secondView {
  position: relative;
  padding: 40px 0 0;
}
.heading1:has(.heading1_extra) + .secondView { padding-top: 148px; }
.secondView_bg {
  --icon2Margin: 60px 0 0 0;
  width: 100%;
  height: 430px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  z-index: -1;
  background-color: var(--mainColor);
  padding: 32px 48px;
}
.secondView_bg_icon {
  width: 200px;
  height: 200px;
  display: flex;
}
.secondView_bg_icon:nth-child(2) { margin: var(--icon2Margin); }
.secondView_bg-iconTop {
  --icon2Margin: auto 0 0 0;
  align-items: flex-start;
}
.secondView_bg-iconBottom {
  --icon2Margin: 0 0 auto 0;
  align-items: flex-end;
}
.secondView_inner {
  max-width: var(--contentMaxWidth);
  margin: auto;
  padding: 0 var(--contentPaddingX);
}
/* - 見出し部分 - */
.secondView_heading {
  --color: #fff;
  position: relative;
  display: flex;
  justify-content: center;
  color: var(--color);
  font-size: 26px;
  font-weight: bold;
  letter-spacing: .05em;
  line-height: 1.7;
  text-align: center;
  margin-top: 24px;
  padding-bottom: 22px;
}
.secondView_heading:first-child { margin-top: 0; }
.secondView_heading_txt {
  position: relative;
  padding-bottom: 8px;
}
.secondView_heading::before {
  content: '';
  width: 19px;
  height: 26px;
  position: absolute;
  left: 4px;
  right: 0;
  bottom: 0;
  background-color: var(--color);
  margin: auto;
  clip-path: polygon(calc(100% - 4px) 0, 100% 0, 4px 100%, 0 100%);
}
.secondView_heading_txt::after {
  content: '';
  height: 4px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(to right, var(--color), var(--color) calc(50% - 5px), transparent calc(50% - 5px), transparent calc(50% + 10px), var(--color) calc(50% + 10px), var(--color));
}
.secondView_heading.fcMain,
.secondView_heading.fcGreen { --color: var(--mainColor); }
.secondView_heading_highlight {
  font-size: 72px;
  font-family: "Lato", sans-serif;
  line-height: 1;
}
.secondView_list {
  --col: 4;
  --gapY: 24px;
  --gapX: 24px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: var(--gapY) var(--gapX);
  text-align: center;
  margin-top: 16px;
}
.secondView_list:first-child { margin-top: 0; }
.secondView_list .icon {
  width: 56px;
  font-size: 28px;
  margin-inline: auto;
  margin-bottom: -28px;
}
.secondView_list_item {
  --tmp1: calc(calc(var(--col) - 1) * var(--gapX));
  --tmp2: calc(100% - var(--tmp1));
  --itemWidth: calc(var(--tmp2) / var(--col));
  width: var(--itemWidth);
  max-width: 560px;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
}
.secondView_list_item.w100p { width: 100%; }
.secondView_list_item.w100p .secondView_list_item_inner,
.secondView_list_item.pc_w100p .secondView_list_item_inner { min-height: auto; }
.secondView_list_item_inner {
  flex: 1 1 auto;
  min-height: 150px;
  display: flex;
  gap: 8px;
  flex-direction: column;
  align-items: center;
  background-color: #FDFBEB;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  padding: 20px 8px;
}
.icon + .secondView_list_item_inner { padding-top: 40px; }
.secondView_ttl {
  --defaultLineHeight: 1.55;
  min-height: calc(2em * 1.55);
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 18px;
  line-height: var(--defaultLineHeight);
  letter-spacing: .05em;
}
.secondView_label {
  color: var(--mainColor);
  font-weight: bold;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.875;
  border: 2px solid var(--mainColor);
  border-radius: 20px;
  margin-inline: auto;
  padding: 2px 24px;
}
.secondView_highlight {
  color: var(--mainColor);
  font-size: 21px;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0;
}
.secondView_highlight-large {
  font-size: 34px;
}
.secondView_highlight:only-child {
  margin: auto;
}
.secondView_txt {
  font-size: 14px;
}
.secondView_time {
  font-size: 24px;
  font-weight: bold;
  line-height: 1;
}
.secondView_time_highlight {
  color: var(--mainColor);
  font-size: 48px;
}
.secondView_txt2 {
  color: var(--mainColor);
  font-size: 32px;
  font-weight: bold;
  line-height: 1;
}
.secondView_txt2 > span {
  font-size: 75px;
}
.secondView_txt3 {
  font-size: 24px;
  font-weight: bold;
  line-height: 1;
}


/* ----- sv2 ----- */
.sv2 {
  overflow: hidden;
}
.sv2_top {
  width: 100%;
  position: relative;
  background:
    url(/common_v3/images/sv2_bg_item_01.svg) no-repeat right top / auto,
    url(/common_v3/images/sv2_bg_item_02.svg) no-repeat left bottom / auto,
    #FDFBEB;
  padding: 48px 0 56px;
}
.sv2_top::after {
  content: '';
  width: 122px;
  height: 46px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -24px;
  background: url(/common_v3/images/sv2_triangle.svg) no-repeat center / contain;
  margin: auto;
}
.sv2_btm {
  padding: 80px 0 0;
}
.sv2_top_inner,
.sv2_btm_inner {
  width: calc(var(--contentWidth) + var(--contentPaddingXDouble));
  margin: 0 auto;
  padding: 0 var(--contentPaddingX);
}
.sv2_heading {
  font-size: 34px;
  font-weight: bold;
  letter-spacing: .03em;
  line-height: 1.5;
  text-align: center;
}
.sv2_commentBox {
  display: flex;
  gap: var(--gapY, 24px) var(--gapX, 36px);
  text-align: center;
  margin-top: 48px;
}
.sv2_commentBox_item {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.sv2_comment_head {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  font-size: 20px;
  letter-spacing: .03em;
  line-height: 1.6;
}
.sv2_comment_foot {}
.sv2_comment_foot::before {
  content: '';
  width: 296px;
  height: 70px;
  display: block;
  background: url(/common_v3/images/sv2_comment_item.svg) no-repeat center / contain;
  margin: -8px auto 16px;
}
.sv2_comment_icon {
  width: 150px;
  height: 150px;
  display: flex;
  position: relative;
  margin: auto;
}
.sv2_comment_icon::before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  top: 8px;
  left: 8px;
  background: url(/common_v3/images/sv2_comment_iconbg.svg) no-repeat center / contain;
}
.sv2_comment_icon img {
  position: relative;
}
.sv2_msg {
  width: 850px;
  margin: auto;
}
.sv2_msg_head {
  display: flex;
}
.sv2_msg_human {
  width: 240px;
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  padding-left: 20px;
}
.sv2_msg_ttl {
  flex: 1 1 auto;
  display: flex;
  gap: 24px;
  flex-direction: column;
  text-align: center;
  padding-bottom: 32px;
}
.sv2_msg_ttl_sub {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mainColor);
  font-size: 24px;
  font-weight: bold;
  line-height: 1.5;
  border: 1px solid var(--mainColor);
  border-radius: 28px;
  margin: 0 auto;
  padding: 4px 24px;
}
.sv2_msg_ttl_main {
  position: relative;
  font-size: 40px;
  font-weight: bold;
  letter-spacing: .03em;
  line-height: 1.525;
  margin: 0 auto;
  padding-right: 34px;
}
.sv2_msg_ttl_main_txt {
  background: linear-gradient(to bottom, transparent 65%, #EDDD21 65%);
}
.sv2_msg_ttl_main_txt img {
  width: 34px;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -12px;
  margin: auto;
}
.sv2_msg_foot {
  background-color: var(--mainColor);
  border-radius: 16px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  padding: 24px 32px;
}
.sv2_msg_foot_txt {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.6;
  letter-spacing: .03em;
}


/* ----- h2 ----- */
.heading2 {
  --heading2IconSize: 100px;
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: center;
  font-size: 36px;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: .05em;
  text-align: center;
  margin: 80px 0 72px;
}
.heading2:first-child { margin-top: 0px; }
.heading2:last-child { margin-bottom: 0px; }
.heading2::before,
.heading2::after {
  content: '';
  flex: 1 0 120px;
  height: 1px;
  display: block;
  background-color: var(--defaultColor);
}
.heading2_txt_sub {
  font-size: 28px;
}
.heading2:has(.heading2_icon) {
  position: relative;
  padding-top: calc(var(--heading2IconSize) + 16px);
}
.heading2_icon {
  width: var(--heading2IconSize);
  height: var(--heading2IconSize);
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  font-size: 40px;
  font-family: "Lato", sans-serif;
  font-weight: bold;
  margin: auto;
}

/* ----- h3 ----- */
.heading3 {
  font-size: 32px;
  font-weight: 500;
  letter-spacing: .03em;
  line-height: 1.5;
  border-left: 8px solid var(--mainColor);
  margin: 64px 0 40px;
  padding-left: 10px;
}
.heading3:first-child { margin-top: 0px; }
.heading3:last-child { margin-bottom: 0px; }
.heading3_sub {
  font-size: 24px;
}

/* ----- h4 ----- */
.heading4 {
  font-size: 28px;
  font-weight: 500;
  letter-spacing: .03em;
  line-height: 1.5;
  margin: 40px 0 32px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--mainColor);
}
.heading4:first-child { margin-top: 0px; }
.heading4:last-child { margin-bottom: 0px; }

/* ----- h5 ----- */
.heading5 {
  font-weight: 500;
  font-size: 26px;
  letter-spacing: .03em;
  line-height: 1.5;
  margin: 32px 0 24px;
}
.heading5:first-child { margin-top: 0px; }
.heading5:last-child { margin-bottom: 0px; }

/* ----- 特殊見出し ----- */
.headingSp {
  text-align: center;
  margin: 36px auto 24px;
}
.headingSp:first-child { margin-top: 0; }
.headingSp:last-child { margin-bottom: 0; }
.headingSp + .headingSp { margin-top: 24px; }
.headingSp_head {
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: center;
}
.headingSp_foot {
  display: flex;
  gap: 12px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.5;
  text-align: center;
  margin-top: 12px;
}
.headingSp_ttl {
  place-content: center;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: .05em;
  text-align: center;
}
.headingSp_head.jcS .headingSp_ttl { text-align: left; }
.headingSp_read {
  font-size: 16px;
  letter-spacing: .03em;
}
/* - オレンジ色 - */
.headingSp-color2 .numIcon {
  background : var(--subColor);
}
.headingSp-color2 .headingSp_text_main {
  color: var(--subColor);
}
/* 横パターン */
.headingSp-horiz {
  display: flex;
  gap: 12px;
  margin-left: 0;
}
.headingSp-horiz .headingSp_foot {
  margin-top: 0;
}
.headingSp-horiz .headingSp_ttl {
  font-size: 22px;
  text-align: left;
}



/* ----- キャッチコピー ----- */
.catch {
  font-size: 34px;
  font-weight: 500;
  letter-spacing: .03em;
  line-height: 1.5;
  text-align: center;
  margin-top: 64px;
}
.catch:first-child { margin-top: 0; }
.catch_highlight {
  color: var(--defaultColor);
  background: linear-gradient(to bottom, transparent 65%, #EDDD21 65%);
}
.catch strong {
  color: var(--mainColor);
}
/* 文字サイズ */
.catch-small {
  font-size: 24px;
}
/* 斜線有りのキャッチ */
.catch-type2 {
  display: grid;
  place-content: center;
}
.catch-type2 > span {
  position: relative;
  padding: 0 1.5em;
}
.catch-type2 > span::before,
.catch-type2 > span::after {
  content: "";
  width: 1.5em;
  height: 2px;
  bottom: .6em;
  display: block;
  position: absolute;
  background-color: var(--defaultColor);
}
.catch-type2 > span::before {
  left: 0;
  transform: rotate(45deg);
}
.catch-type2 > span::after {
  right: 0;
  transform: rotate(-45deg);
}
/* ロゴ画像 */
.catch_logoList {
  --gap: 40px;
  display: flex;
  gap: var(--gap);
  align-items: center;
  margin: 28px 0;
}
.catch_logoList:first-child { margin-top: 0; }
.catch_logoList:last-child { margin-bottom: 0; }
.catch_logoList > li {
  display: flex;
  align-items: center;
  position: relative;
}
.catch_logoList > li::after {
  content: '';
  width: 1px;
  height: 48px;
  display: block;
  background-color: var(--defaultColor);
  margin-left: var(--gap);
}
.catch_logoList > li:last-child::after { content: none; }


/* ==================================================
Text
================================================== */
/* ----- 通常テキスト ----- */
.nmlText {
  font-size: var(--defaultFontSize);
  margin-top: 16px;
}
.nmlText:first-child { margin-top: 0; }
.nmlText img {
  max-width: 100%;
}
/* - 大きいサイズの通常テキスト - */
.nmlText_large {
  font-size: var(--largeFontSize);
  font-weight: bold;
  margin-top: 12px;
}
.nmlText_large:first-child { margin-top: 0; }

/* - 背景色あり - */
.nmlText_accent {
  font-weight: bold;
  text-align: center;
  background-color: var(--colorLightGreen);
  border-radius: 10px;
  margin-top: 16px;
  padding: 8px 12px;
}
.nmlText_accent:first-child { margin-top: 0; }

/* ----- 通常タイトル ----- */
.nmlTitle {
  font-size: 20px;
  text-align: center;
  line-height: 1.5;
  margin-top: 32px;
}
.nmlTitle:first-child { margin-top: 0; }

/* ----- バナー ----- */
.nmlBanner {
  text-align: center;
  margin-top: 32px;
}
.nmlBanner:first-child { margin-top: 0; }
.nmlBanner img { max-width: 100%; }
.nmlBanner a { transition: var(--transOpac); }
.nmlBanner a:hover,
.nmlBanner a:focus { opacity: var(--hoverOpac); }

/* ----- 金利テキスト ----- */
.rateTtl {
  width: fit-content;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: .05em;
  line-height: 1.5;
  text-align: center;
  border-bottom: 1px solid var(--mainColor);
  margin: 12px auto;
  padding-bottom: 4px;
}
.rateTtl:first-child { margin-top: 0; }
.rateLabel {
  color: var(--mainColor);
  font-weight: bold;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.875;
  border: 2px solid var(--mainColor);
  border-radius: 20px;
  margin-inline: auto;
  padding: 2px 24px;
  margin: 8px auto;
}
.rateLabel:first-child { margin-top: 0; }
.rateLabel:last-child { margin-bottom: 0; }
.rateInfo {
  --strongSize: 40px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: center;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0;
  text-align: center;
}
.rateInfo_txt {
  position: relative;
  margin: 0;
}
.rateInfo_txt:has(.rateInfo_txt_sub) {
  padding-top: 18px;
}
.rateInfo_txt_sub {
  position: absolute;
  top: 0;
  left: -1em;
  right: -1em;
  font-size: 14px;
  text-align: center;
  white-space:nowrap;
}
.rateInfo_txt_main {
}
.rateInfo_txt_strong {
  color: var(--mainColor);
  font-family: var(--latoFont);
  font-weight: bold;
  font-size: var(--strongSize);
  line-height: 1.25;
}
.rateInfo_wave {
  height: calc(var(--strongSize) * 1.25);
  display: flex;
  align-items: center;
  margin: 0;
}
.rateInfo_arrow {
  --lineHeight: 1.25;
  font-size: 14px;
}
.rateInfo_arrow > span {
  width: 5.5em;
  height: calc(5em * var(--lineHeight));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 12px;
  line-height: var(--lineHeight);
  background-color: var(--mainColor);
  padding-right: .5em;
  clip-path: polygon(0% 20%, 60% 20%, 60% 0%, 100% 50%, 60% 100%, 60% 80%, 0% 80%);
}
.rateInfo_subTxt {
  width: 100%;
  display: block;
  font-size: 14px;
  font-weight: var(--defaultFontWeight);
  letter-spacing: .03em;
  line-height: 1.5;
  text-align: center;
}
/* - 特定のコンポネ内でのスタイル調整 - */
.secondView .rateInfo_subTxt { margin-top: -4px; }
/* - 文字小さいパターン - */
.rateInfo-small {
  --strongSize: 34px;
}
/* - 縦パターン= */
.rateInfo-vertical,
.rateInfo-pcVertical {
  gap: 0;
  flex-direction: column;
  align-items: center;
}
.rateInfo-vertical .rateInfo_wave,
.rateInfo-pcVertical .rateInfo_wave {
  height: auto;
  margin: 0 auto;
  writing-mode: vertical-rl;
  text-orientation: mixed;
}

/* ----- 金利テキスト2 ----- */
.rateInfo2 {
  font-size: 22px;
  font-weight: bold;
  letter-spacing: 0.03em;
  line-height: 1.45;
}
.rateInfo2_strong {
  font-size: 32px;
}

/* ----- メール ----- */
.emailTxt {
  font-weight: bold;
  font-size: 20px;
  letter-spacing: .03em;
  line-height: 1.5;
}
.emailTxt span {
  min-height: 60px;
  display: flex;
  align-items: center;
  background: url(/common_v3/images/icon/icon_mail.svg) no-repeat left center / 60px auto;
  padding-left: 72px;
}
.emailTxt:not(.emailTxt-simple) {
  display: flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  text-align: center;
}


/* ==================================================
List
================================================== */
/* ----- 通常リスト ----- */
.cirList {
  --cirColor: var(--mainColor);
  margin-top: 20px;
}
.cirList:first-child { margin-top: 0; }
li > .cirList:first-child { margin-top: 12px; }
.cirList > li {
  position: relative;
  margin-top: 12px;
  padding-left: 1.75em;
}
.cirList > li:first-child { margin-top: 0; }
.cirList > li::before {
  content: "";
  width: .4em;
  height: .4em;
  position: absolute;
  left: .4em;
  top: calc(.4em * var(--defaultLineHeight));
  background: var(--cirColor);
  border-radius: 50%;
}
/* - オプション - */
/* 点の色 */
.cirList-orange { --cirColor: var(--subColor); }
.cirList-black { --cirColor: var(--defaultColor); }
.cirList-red { --cirColor: var(--colorRed); }
/* fcRed時だけ特殊 */
.cirList > li.fcRed::before {
  --cirColor: var(--colorRed);
}
/* ●なし */
.cirList-cirNone > li {
  padding-left: 0;
}
.cirList-cirNone > li::before {
  content: none;
}
/*  */
.cirList.col2 {
  display: grid;
  gap: 12px;
  grid-template-columns: 1fr 1fr;
}
.cirList.col2 > li {
  margin-top: 0;
}

/* ----- 数字リスト ----- */
.numList {
  --numListColor: var(--mainColor);
  counter-reset: num1;
  margin-top: 20px;
}
.numList:first-child { margin-top: 0; }
li > .numList:first-child { margin-top: 12px; }
.numList > li {
  counter-increment: num1;
  position: relative;
  list-style-type: none;
  list-style-position: inside;
  margin-top: 12px;
  padding-left: 1.75em;
}
.numList > li:first-child { margin-top: 0; }
.numList > li::before {
  content: counter(num1) ".";
  display: marker;
  position: absolute;
  left: 0;
  top: 0;
  color: var(--numListColor);
  font-weight: bold;
}
/* - 色 - */
.numList-orange { --numListColor: var(--subColor); }
.numList-red { --numListColor: var(--colorRed); }
.numList-black { --numListColor: var(--defaultColor); }


/* ----- 数字リスト2 ----- */
.numList2 {
  --numList2Color: var(--mainColor);
  counter-reset: num2;
  margin-top: 20px;
}
.numList2:first-child { margin-top: 0; }
li > .numList2:first-child { margin-top: 12px; }
.numList2 > li {
  counter-increment: num2;
  position: relative;
  list-style-type: none;
  list-style-position: inside;
  margin-top: 12px;
  padding-left: 1.75em;
}
.numList2 > li:first-child { margin-top: 0; }
.numList2 > li::before {
  content: "("counter(num2)")";
  display: marker;
  position: absolute;
  left: 0;
  top: 0;
  color: var(--numList2Color);
  font-weight: bold;
  letter-spacing: -.01em;
}
/* - 色 - */
.numList2-orange { --numList2Color: var(--subColor); }
.numList2-red { --numList2Color: var(--colorRed); }
.numList2-black { --numList2Color: var(--defaultColor); }


/* ----- チェックアイコンリスト ----- */
.checkList {
  text-align: left;
  margin-top: 20px;
}
.checkList:first-child { margin-top: 0; }
li > .checkList:first-child { margin-top: 12px; }
.checkList > li {
  position: relative;
  margin-top: 12px;
  padding-left: 1.75em;
}
.checkList > li:first-child { margin-top: 0; }
.checkList > li::before {
  content: "";
  width: 1.25em;
  height: 1.25em;
  position: absolute;
  left: 0;
  top: calc(.15em * var(--defaultLineHeight));
  background: url(/common_v3/images/icon/icon_check_green.svg) no-repeat center / contain;
  border-radius: 50%;
}
.checkList-inline {
  --gapY: 20px;
  --gapX: 32px;
  display: flex;
  gap: var(--gapY) var(--gapX);
  flex-wrap: wrap;
}
.checkList-inline > li { margin-top: 0; }

/* ----- 注釈リスト ----- */
.noteList {
  --noteListColor: var(--colorRed);
  font-size: 14px;
  text-align: left;
  margin-top: 8px;
}
.noteList:first-child { margin-top: 0; }
li > .noteList:first-child { margin-top: 8px; }
.noteList > li {
  position: relative;
  margin-top: 8px;
  padding-left: 2em;
}
.noteList > li:first-child { margin-top: 0; }
.noteList > li::before {
  content: "\203B";
  width: 1.65em;
  position: absolute;
  left: 0;
  top: 0;
  color: var(--noteListColor);
  font-weight: bold;
  text-align: center;
}
/* - オプション - */
/* 注釈文字色 */
.noteList-green { --noteListColor: var(--mainColor); }
.noteList-white { --noteListColor: #fff; }

/* ----- 注釈リスト 数字 ----- */
.noteNumList {
  --noteNumListColor: var(--colorRed);
  counter-reset: noteNum;
  font-size: 14px;
  text-align: left;
  margin-top: 16px;
}
.noteNumList:first-child { margin-top: 0; }
li > .noteNumList:first-child { margin-top: 8px; }
.noteNumList > li {
  counter-increment: noteNum;
  position: relative;
  list-style-type: none;
  list-style-position: inside;
  margin-top: 8px;
  padding-left: 2em;
}
.noteNumList > li:first-child { margin-top: 0; }
.noteNumList > li::before {
  content: "\203B"counter(noteNum);
  width: 1.65em;
  position: absolute;
  left: 0;
  top: 0;
  color: var(--noteNumListColor);
  font-weight: bold;
  letter-spacing: -.01em;
  text-align: center;
}
/* - オプション - */
/* 注釈文字色 */
.noteNumList-green { --noteNumListColor: var(--mainColor); }

/* ----- 定義リスト ----- */
.nmlDList {
  --dlGap: 24px;
  margin-top: 32px;
}
.nmlDList:first-child { margin-top: 0; }
.nmlDList dt {
  color: var(--mainColor);
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4;
}
.nmlDList dt:not(:first-child) { margin-top: var(--dlGap); }
.nmlDList dt > a { color: inherit; }
.nmlDList dd {
  border-bottom: 1px solid var(--colorGray);
  margin-top: calc(var(--dlGap) * .5);
  padding-bottom: calc(var(--dlGap) - 4px);
}
.nmlDList dd.borderNone {
  border-bottom: none;
  padding-bottom: 0;
}
/* - 文字サイズ（小） - */
.nmlDList-small {
  --dlGap: 12px;
  margin-top: 16px;
}
.nmlDList-small dt,
.nmlDList-small dd {
  font-size: var(--defaultFontSize);
  line-height: var(--defaultLineHeight);
}

/* ----- 定義リスト（横） ----- */
.floatDList {
  --floatDListCol: auto;
  --dlGap: 24px;
  display: grid;
  gap: var(--dlGap) 0;
  grid-template-columns: var(--floatDListCol) 1fr;
  margin-top: 32px;
}
.floatDList:first-child { margin-top: 0; }
.floatDList dt:not(.borderNone),
.floatDList dd:not(.borderNone) {
  padding-bottom: calc(var(--dlGap) - 4px);
  border-bottom: 1px solid var(--colorGray);
}
.floatDList dt {
  color: var(--mainColor);
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4;
  padding-right: 8px;
}
.floatDList dt > a { color: inherit; }
.floatDList dd {
  line-height: 1.75;
  padding-left: 16px;
}
.floatDList-per05 { --floatDListCol:  5%; }
.floatDList-per10 { --floatDListCol: 10%; }
.floatDList-per15 { --floatDListCol: 15%; }
.floatDList-per20 { --floatDListCol: 20%; }
.floatDList-per25 { --floatDListCol: 25%; }
.floatDList-per30 { --floatDListCol: 30%; }
.floatDList-per35 { --floatDListCol: 35%; }
.floatDList-per40 { --floatDListCol: 40%; }
.floatDList-per45 { --floatDListCol: 45%; }
.floatDList-per50 { --floatDListCol: 50%; }
.floatDList-per55 { --floatDListCol: 55%; }
.floatDList-per60 { --floatDListCol: 60%; }
.floatDList-per65 { --floatDListCol: 65%; }
.floatDList-per70 { --floatDListCol: 70%; }
.floatDList-per75 { --floatDListCol: 75%; }
.floatDList-per80 { --floatDListCol: 80%; }
.floatDList-per85 { --floatDListCol: 85%; }
.floatDList-per90 { --floatDListCol: 90%; }
.floatDList-per95 { --floatDListCol: 95%; }
/* - 文字サイズ（小） - */
.floatDList-small {
  --dlGap: 12px;
  margin-top: 16px;
}
.floatDList-small dt,
.floatDList-small dd {
  font-size: var(--defaultFontSize);
  line-height: var(--defaultLineHeight);
}


/* ==================================================
テーブル
================================================== */
.nmlTable {
  --paddingY: 16px;
  --paddingX: 20px;
  width: 100%;
  table-layout: fixed;
  margin-top: 40px;
}
.nmlTable:first-child { margin-top: 0; }
.nmlTable caption {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: .03em;
  line-height: 1.4;
  text-align: center;
  margin-bottom: 12px;
}
.nmlTable caption img {
  vertical-align: middle;
}
/* - th & td - */
.nmlTable th,
.nmlTable td {
  vertical-align: middle;
  border: 1px solid #DDDDDD;
  padding: var(--paddingY) var(--paddingX);
}
/* - th - */
.nmlTable th {
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-align: left;
  background-color: var(--mainColor);
}
.nmlTable th.bgLGray {
  color: var(--defaultColor);
}
/* thead内のth */
.nmlTable thead th {
  height: 80px;
  text-align: center;
}
/* thead有り tbody内のth */
.nmlTable thead + tbody > tr > th {
  color: inherit;
  text-align: center;
  background-color: #F2F2F2;
}
/* thead無し tbody内のth */
.nmlTable colgroup + tbody > tr > th {
  color: #fff;
}
/* - td - */
.nmlTable td {
  min-height: 60px;
  background: #fff;
}
/* - オプション - */
/* thのテキストを左右中央 */
.nmlTable.taC tbody th { text-align: center; }
/* - 小さいパターン（テーブル内にテーブルがある場合に使用） - */
.nmlTable-small {
  --paddingY: 8px;
  --paddingX: 8px;
}
.nmlTable-small th { font-size: 16px; }
.nmlTable-small td { font-size: 14px; }
.nmlTable-small thead th { height: auto; }
/* 別色グレーテーブル */
.nmlTable-type2 th {
  background-color: #6E6E6E;
}


/* ==================================================
ボックス
================================================== */
.box1 .headingSp { margin-bottom: 0; }
/* ----- ボックス1 ----- */
.box1 {
  display: flex;
  gap: 16px;
  flex-direction: column;
  background-color: #fff;
  border: 1px solid var(--mainColor);
  border-radius: 16px;
  margin-top: 24px;
  padding: 20px;
}
.box1:first-child { margin-top: 0; }
.box1_head {
  display: flex;
  gap: 16px;
  align-items: center;
  color: var(--defaultColor);
  font-size: 24px;
  font-weight: bold;
}
.box1_body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
/* 色 */
.box1-gray { border-color: var(--colorGray); }
.box1-red { border-color: var(--colorRed); }

/* ----- ボックス2 ----- */
.box2 {
  --box2Color: var(--mainColor);
  margin-top: 24px;
}
.box2:first-child { margin-top: 0; }
.box2_head {
  display: flex;
  gap: 16px;
  align-items: center;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.25;
  background: var(--box2Color);
  border-radius: 16px 16px 0 0;
  padding: 24px;
}
.box2_head.js-acd_btn { padding-right: 44px; }
.box2_body {
  background-color: #fff;
  border: 1px solid var(--box2Color);
  border-radius: 0 0 16px 16px;
  padding: 16px 24px 24px;
}
/* - 色 - */
.box2-orange {
  --box2Color: var(--subColor);
}
/* - アイコン画像 - */
.box2_head_icon {
  width: 32px;
  height: auto;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* - アコーディオンパターン - */
.box2.js-acd {
  --acdIconColor: #fff;
}
.box2.js-acd:not([open]) .box2_head {
  border-radius: 16px;
}

/* ----- ボックス3 ----- */
.box3 {
  --box3Color: var(--colorLightGray);
  --box3TtlColor: var(--defaultColor);
  margin-top: 24px;
}
.box3:first-child { margin-top: 0; }
.box3_inner {
  background-color: var(--box3Color);
  border-radius: 16px;
  padding: 24px;
}
.box3_ttl {
  color: var(--box3TtlColor);
  font-size: 24px;
  font-weight: bold;
}
/* - ボックス3 色 - */
.box3-white { --box3Color: #fff; }
.box3-lYellow { --box3Color: #FDFBEB; }
.box3-lGreen { --box3Color: var(--colorLightGreen); }
/* - ボックス3 影 - */
.box3-shadow {
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.05);
}
.box3-shadow + .box3-shadow { margin-top: 32px; }
/* - ボックス3 特殊な見出し - */
.box3_spTtl {
  display: flex;
  gap: 20px;
  align-items: center;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.16;
  letter-spacing: .05em;
}
.box3_spTtl .icon {
  width: 56px;
  font-size: 28px;
}
/* - ボックス3 金利 - */
.box3_rate {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-top: 24px;
}
.box3_rate:first-child { margin-top: 0; }
.box3_rate_label {
  min-width: 98px;
  flex-shrink: 0;
  color: var(--mainColor);
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  border: 2px solid var(--mainColor);
  border-radius: 8px;
  line-height: 1.33;
  letter-spacing: .1em;
  padding: 4px 8px;
}
.box3_rate_txt {
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 1;
}
.box3_rate_txt > span {
  color: var(--mainColor);
  font-size: 52px;
}
.box3_rate_note {
  position: relative;
  font-size: 14px;
  line-height: 1.2;
  margin-top: auto;
  padding-left: 1.25em;
  padding-bottom: 4px;
}
.box3_rate_note::before {
  content: "\203B";
  width: 1em;
  position: absolute;
  left: 0;
  top: 0;
  color: var(--colorRed);
  font-weight: bold;
  text-align: center;
}

/* ----- 注意喚起用ボックス ----- */
.cautionBox {
  --acdIconColor: #fff;
  --acdIconPos: 8px;
  margin-top: 24px;
}
.cautionBox:first-child { margin-top: 0; }
.cautionBox_head {
  display: flex;
  gap: 16px;
  align-items: center;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  background: var(--colorRed);
  border-radius: 16px 16px 0 0;
  padding: 24px;
}
.cautionBox_head:only-child { border-radius: 16px; }
.cautionBox_body {
  border: 1px solid var(--colorRed);
  border-radius: 0 0 16px 16px;
  padding: 16px 24px 20px;
}
.cautionBox_body:only-child { border-radius: 16px; }
/* - アイコン画像 - */
.cautionBox_head_icon {
  width: 28px;
  height: auto;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* - アコーディオンパターン - */
.cautionBox_head.js-acd_btn {
  padding-right: 44px;
}
.cautionBox:not([open]) .js-acd_btn {
  border-radius: 16px;
}

/* ----- シンプルボックス ----- */
.simpleBox {
  background-color: var(--colorLightGray);
  border-radius: 24px;
  margin-top: 32px;
  padding: 24px;
}
.simpleBox:first-child { margin-top: 0; }
.simpleBox_head {
  color: var(--mainColor);
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}
.simpleBox_body {
}
.simpleBox_body:not(:first-child) {
  margin-top: 16px;
}
/* 色 */
.simpleBox-red { background-color: var(--colorRed); }
.simpleBox-white { background-color: #fff; }

/* ----- 特殊なボックス ----- */
.uniqBox .catch {
  font-size: 30px;
  margin-top: 0;
}
.uniqBox .catch_highlight {
  font-size: 38px;
}
.uniqBox .catch_logoList {
  --gap: 32px;
  justify-content: center;
  margin: 24px auto 12px;
}
.uniqBox .emphBtn {
  --btnMarginTop: 24px;
}
.uniqBox {
  background-color: #FFF8DB;
  border-radius: 40px;
  padding: 10px;
}
.uniqBox_inner {
  display: flex;
  border: 2px dashed #DEB778;
  border-radius: 30px;
  padding: 32px 28px;
}
/* - atm - */
.uniqBox_atm {
  width: 900px;
  display: grid;
  gap: 80px;
  grid-template-columns: auto 1fr;
  align-items: end;
  margin: auto;
}
.uniqBox_atm_img {
}
.uniqBox_atm_body {
  position: relative;
}
.uniqBox_atm_bubble {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -72px;
  color: #fff;
  font-size: 26px;
  font-weight: bold;
  line-height: 1;
  background-color: #ff7e39;
  border-radius: 8px;
  padding: 8px 16px 12px 24px;
  filter: drop-shadow(0px 3px 6px rgba(0, 0, 0, 0.1));
}
.uniqBox_atm_bubble::after {
  content: "";
  width: 22px;
  height: 49px;
  position: absolute;
  top: 38px;
  left: 30px;
  background-color: #ff7e39;
  clip-path: polygon(0 100%, 100% 100%, 50% 0);
  transform: rotate(143deg);
}
.uniqBox_atm_bubble_txt {
}
/* - ご相談 - */
.uniqBox_consult {
  --gapY: 32px;
  --gapX: 168px;
  width: 100%;
  padding: 0 66px;
}
.uniqBox_consult_ttl {
  color: var(--mainColor);
  font-size: 32px;
  font-weight: bold;
  letter-spacing: .03em;
  line-height: 1;
  text-align: center;
}
.uniqBox_consult_read {
  font-weight: 500;
  font-size: 18px;
  letter-spacing: .03em;
  text-align: center;
  margin-top: 20px;
}
.uniqBox_consult_grid {
  display: grid;
  gap: var(--gapY) var(--gapX);
  grid-template-columns: 1fr 1fr;
  margin-top: 32px;
}
.uniqBox_consult_grid_item {
  position: relative;
}
.uniqBox_consult_grid_item::before {
  content: '';
  width: 1px;
  height: 100%;
  position: absolute;
  left: calc(var(--gapX) * -.5);
  background-color: var(--defaultColor);
}
.uniqBox_consult_grid_item:nth-child(odd)::before { content: none; }


/* --------------------------------------------------
画像＋テキストコンポーネント
-------------------------------------------------- */
/* ----- テキスト回り込みなし ----- */
.imgTxt {
  --gapY: 32px;
  --gapX: 32px;
  display: flex;
  gap: var(--gapY) var(--gapX);
  margin-top: 40px;
}
.imgTxt:first-child { margin-top: 0; }
.imgTxt_img {
  flex: 0 0 auto;
  position: relative;
}
.imgTxt_img:not([class*="pc_w"]) {
  max-width: 400px;
}
.imgTxt_txt {
  flex: 1 1 50%;
}
.imgTxt_order1 { order: 1; }
.imgTxt_order2 { order: 2; }

/* ----- テキスト回り込みあり ----- */
.imgTxtFloat {
  margin-top: 40px;
}
.imgTxtFloat:first-child { margin-top: 0; }
.imgTxtFloat_left {
  float: left;
  margin: 0 32px 8px 0;
}
.imgTxtFloat_right {
  float: right;
  margin: 0 0 8px 32px;
}
.imgTxtFloat::after {
  display: block;
  clear: both;
  content: '';
}


/* --------------------------------------------------
吹き出しコンポーネント
-------------------------------------------------- */
.balloonBox {
  --balloonSize: 24px;
  --balloonIconSize: 112px;
  --balloonBgColor: #fff;
  --balloonBorderColor: #fff;
  --balloonBorderWidth: 2px;
  --balloonBorderWidthDouble: calc(var(--balloonBorderWidth) * 2);
  display: flex;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  margin-top: 40px;
}
.balloonBox:first-child { margin-top: 0; }
.balloonBox + .balloonBox { margin-top: 32px; }
.balloonBox_icon {
  flex: 0 0 auto;
  width: var(--balloonIconSize);
  height: var(--balloonIconSize);
}
.balloonBox_icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.balloonBox_txt {
  flex: 0 1 auto;
  position: relative;
  filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.15));
  padding-left: var(--balloonSize);
}
.balloonBox_txt::before,
.balloonBox_txt::after {
  content: "";
  width: var(--balloonSize);
  height: var(--balloonSize);
  position: absolute;
  top: 40px;
  top: calc(var(--balloonIconSize) * .5 - 12px);
  left: -20px;
  clip-path: polygon(0 50%, 100% 0, 100% 100%);
}
.balloonBox_txt::before {
  left: 0;
  background-color: var(--balloonBorderColor);
}
.balloonBox_txt::after {
  left: var(--balloonBorderWidthDouble);
  background-color: var(--balloonBgColor);
}
.balloonBox_txt_inner {
  position: relative;
  width: 690px;
  min-height: var(--balloonIconSize);
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr;
  align-items: center;
  border-radius: 16px;
  background-color: var(--balloonBgColor);
  border: var(--balloonBorderWidth) solid var(--balloonBorderColor);
  padding: 16px 20px 16px 24px;
}
/* - オプション - */
/* アイコン位置変更 */
.balloonBox-reverse { flex-direction: row-reverse; }
.balloonBox-reverse .balloonBox_txt { padding-left: 0; padding-right: var(--balloonSize); }
.balloonBox-reverse .balloonBox_txt::before,
.balloonBox-reverse .balloonBox_txt::after {
  left: auto;
  transform: scale(-1, 1);
}
.balloonBox-reverse .balloonBox_txt::before { right: 0; }
.balloonBox-reverse .balloonBox_txt::after { right: var(--balloonBorderWidthDouble); }
/* 色変更 */
.balloonBox-green {
  --balloonBgColor: var(--colorLightGreen);
  --balloonBorderColor: var(--mainColor);
}


/* --------------------------------------------------
パネルコンポーネント
-------------------------------------------------- */
.panel {
  --gapY: 24px;
  --gapX: 24px;
  --col: 2;
  --panelPosition: flex-start;
  --paddingX: 24px;
  margin-top: 40px;
}
.panel:first-child { margin-top: 0; }
.panel + .panel { margin-top: 24px; }
.panel_list {
  min-width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: var(--panelPosition);
  gap: var(--gapY) var(--gapX);
  margin: 0;
}
.panel_item {
  --tPanelGap: calc(calc(var(--col) - 1) * var(--gapX));
  --tPanelWrap: calc(100% - var(--tPanelGap));
  --tPanelW: calc(var(--tPanelWrap) / var(--col));
  width: var(--tPanelW);
  flex: 0 0 auto;
}
.panel_inner {
  width: 100%;
  height: 100%;
  display: flex;
  gap: 14px;
  flex-direction: column;
  position: relative;
  background-color: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 16px;
  padding: 20px var(--paddingX) 12px;
}
.panel_head {
  display: flex;
  gap: 4px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.panel_foot {
  padding-bottom: 12px;
}
.panel_img {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin-top: 12px;
}
.panel_img:first-child { margin-top: 0; }
.panel_txt_main {
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0.05em;
  line-height: 1.3;
  text-align: center;
  margin-top: 12px;
}
.panel_txt_main:first-child { margin-top: 0; }
.panel_txt_sub:not(:first-child) {
  margin-top: 14px;
}
/* - リンクパターン - */
.panel_item {
  --panelLinkIcon: url(/common_v3/images/icon/icon_link.svg);
  --panelLinkIconColor: var(--mainColor);
  --panelLinkIconColorTxt: transparent;
  --panelLinkIconWidth: 12px;
  --panelLinkIconHeight: 10px;
}
a.panel_inner {
  color: inherit;
  text-decoration: none;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
  padding-bottom: 24px;
  transition: var(--transBg);
}
a.panel_inner:hover {
  background-color: var(--colorLightGreen);
}
.panel_linkIcon {
  width: var(--panelLinkIconWidth);
  height: var(--panelLinkIconHeight);
  position: absolute;
  right: 14px;
  bottom: 14px;
  background-color: var(--panelLinkIconColorTxt);
}
.panel_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--panelLinkIconColor);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--panelLinkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--panelLinkIcon);
}
/* アイコンの種類 */
a.panel_inner[target="_blank"] {
  --panelLinkIcon: url(/common_v3/images/icon/icon_blank.svg);
}
a.panel_inner[href$=".pdf"] {
  --panelLinkIcon: url(/common_v3/images/icon/icon_pdf.svg);
  --panelLinkIconWidth: 37px;
  --panelLinkIconHeight: 18px;
}
/* - 左下配置のラベル - */
.panel_label {
  position: absolute;
  left: 12px;
  bottom: 12px;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  letter-spacing: .05em;
  line-height: 1.14;
  text-align: center;
  background-color: var(--mainColor);
  border-radius: 8px;
  padding: 4px 8px;
}
/* - オプション - */
/* 位置 */
.panel-center { --panelPosition: center; }
/* カラム数 */
.panel-col1 { --col: 1; }
.panel-col2 { --col: 2; }
.panel-col3 { --col: 3; }
.panel-col4 { --col: 4; }
.panel-col5 { --col: 5; }
.panel-col3-static .panel_item { width: 344px; }


/* --------------------------------------------------
ポイント・特徴コンポーネント
-------------------------------------------------- */
.point {
  --gapY: 24px;
  --gapX: 24px;
  --col: 2;
  --pointH: auto;
  --pointPosition: flex-start;
  --pointIconSize: 56px;
  height: var(--pointH);
  margin-top: 40px;
}
.point:first-child { margin-top: 0; }
.point + .point { margin-top: 24px; }
.point_list {
  min-width: 100%;
  height: var(--pointH);
  display: flex;
  flex-wrap: wrap;
  justify-content: var(--pointPosition);
  gap: var(--gapY) var(--gapX);
  margin: 0;
}
.point_item {
  --tpointGap: calc(calc(var(--col) - 1) * var(--gapX));
  --tpointWrap: calc(100% - var(--tpointGap));
  --tpointW: calc(var(--tpointWrap) / var(--col));
  width: var(--tpointW);
  height: var(--pointH);
  flex: 0 0 auto;
}
.point_item:has(.point_head > .icon) {
  padding-top: 28px;
}
.point_inner {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  background-color: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 16px;
  padding: 24px 24px 12px;
}
.point_inner:has(.point_head > .icon) {
  padding-top: 40px;
}
.point_head:only-child {
  padding-bottom: 12px;
}
.point_foot {
  margin-top: 12px;
  padding-bottom: 12px;
}
.point_foot:only-child { margin-top: 0; }
.point_img {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.point_txt_main {
  font-size: 20px;
  font-weight: bold;
  letter-spacing: 0.03em;
  line-height: 1.3;
  text-align: center;
}
.point_txt_sub:not(:first-child) {
  margin-top: 14px;
}
/* - 汎用クラス使用 - */
.point_head .icon {
  width: var(--pointIconSize);
  position: absolute;
  left: 0;
  right: 0;
  top: calc(var(--pointIconSize) * -.5);
  font-size: 28px;
  margin: auto;
}
/* - リンクパターン - */
.point_item {
  --pointLinkIcon: url(/common_v3/images/icon/icon_link.svg);
  --pointLinkIconColor: var(--mainColor);
  --pointLinkIconColorTxt: transparent;
  --pointLinkIconWidth: 16px;
  --pointLinkIconHeight: 12px;
}
a.point_inner {
  color: inherit;
  text-decoration: none;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
  padding-bottom: 24px;
  transition: var(--transBg);
}
a.point_inner:hover {
  background-color: var(--colorLightGreen);
}
.point_linkIcon {
  width: var(--pointLinkIconWidth);
  height: var(--pointLinkIconHeight);
  position: absolute;
  right: 14px;
  bottom: 14px;
  background-color: var(--pointLinkIconColorTxt);
}
.point_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--pointLinkIconColor);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--pointLinkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--pointLinkIcon);
}
/* アイコンの種類 */
a.point_inner[target="_blank"] {
  --pointLinkIcon: url(/common_v3/images/icon/icon_blank.svg);
}
a.point_inner[href$=".pdf"] {
  --pointLinkIcon: url(/common_v3/images/icon/icon_pdf.svg);
  --pointLinkIconWidth: 24px;
}
a.point_inner[href^="#"] .point_linkIcon {
  left: 0;
  right: 0;
  margin: auto;
  transform: rotate(90deg);
}
/* - オプション - */
/* 位置 */
.point-center { --pointPosition: center; }
/* カラム数 */
.col3-static .point_item,
.pc_col3-static .point_item { width: 344px; }


/* ==================================================
テキストリンク
================================================== */
.textLink {
  /* color: var(--mainColor);
  text-decoration: underline;
  text-underline-offset: 2px; */
}
.textLink:hover {
  text-decoration: none;
}


/* ==================================================
リンクボタン
================================================== */
/* ----- 通常ボタン ----- */
/* - 変数用 - */
.nmlBtn {
  /* カラム・幅など */
  --col: 1;
  --gapY: 24px;
  --gapX: 24px;
  --marginTop: 40px;
  --nmlBtnMaxW: 420px;
  --nmlBtnMinH: 68px;
  --nmlBtnRadius: 34px;
  --nmlBtnPadding: 36px;
  --nmlBtnItemGap: 8px;
  --btnPos: center;
  /* 色 */
  --nmlBtnColor: var(--mainColor);
  --nmlBtnBoderColor: var(--mainColor);
  --nmlBtnColor_hover: #fff;
  /* アイコン */
  --svgIconColor: #fff;
  --nmlBtnLinkIcon: url(/common_v3/images/icon/icon_link.svg);
  --nmlBtnLinkIconWidth: 14px;
  --nmlBtnLinkIconHeight: 14px;
}
/* - メイン - */
.nmlBtn {
  max-width: 100%;
  display: flex;
  gap: var(--gapY) var(--gapX);
  flex-wrap: wrap;
  justify-content: var(--btnPos);
  text-align: center;
  margin-top: var(--marginTop);
}
.nmlBtn:first-child { margin-top: 0; }
.nmlBtn_item {
  /* ボタン色 */
  --nmlBtnIcoColor: var(--nmlBtnColor_hover);
  --nmlBtnTxtColor: var(--nmlBtnColor_hover);
  --nmlBtnBgColor: var(--nmlBtnColor);
  /* 幅 */
  --tNmlBtnGapX: calc(calc(var(--col) - 1) * var(--gapX));
  --tNmlBtnWrap: calc(100% - var(--tNmlBtnGapX));
  --tNmlBtnW: calc(var(--tNmlBtnWrap) / var(--col));
  flex: 0 0 auto;
  width: var(--tNmlBtnW);
  max-width: var(--nmlBtnMaxW);
  display: flex;
  gap: var(--nmlBtnItemGap);
  flex-direction: column;
}
.nmlBtn_item_inner {
  width: 100%;
  height: 100%;
  min-height: var(--nmlBtnMinH);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  color: var(--nmlBtnTxtColor);
  background: var(--nmlBtnBgColor);
  border: 1px solid var(--nmlBtnBoderColor);
  border-radius: var(--nmlBtnRadius);
  padding: 8px var(--nmlBtnPadding) 8px 36px;
  text-decoration: none;
  cursor: pointer;
  transition:
    var(--transColor),
    var(--transBg);
}
.nmlBtn_item_inner:not(:has(.nmlBtn_linkIcon)) {
  padding-left: calc(var(--nmlBtnPadding) * .5);
  padding-right: calc(var(--nmlBtnPadding) * .5);
}
.nmlBtn_text {
  display: flex;
  gap: 0;
  flex-direction: column;
}
.nmlBtn_text_main {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.45;
}
.nmlBtn_text_main:only-child {
  font-size: var(--defaultFontSize);
}
.nmlBtn_text_sub {
  font-size: 14px;
  line-height: 1.2;
}
.nmlBtn_caption {
  display: flex;
  justify-content: center;
  position: relative;
  font-size: var(--defaultFontSize);
  color: var(--nmlBtnColor);
  font-weight: 500;
  margin: auto auto 0;
  padding: 0 32px;
}
.nmlBtn_caption::before,
.nmlBtn_caption::after {
  content: "";
  position: absolute;
  width: 30px;
  height:2px;
  bottom: 12px;
  background-color: var(--nmlBtnColor);
}
.nmlBtn_caption::before {
  left: 0;
  transform: rotate(45deg);
}
.nmlBtn_caption::after {
  right: 0;
  transform: rotate(-45deg);
}
.nmlBtn_caption-simple {
  align-items: center;
  color: var(--defaultColor);
  font-weight: bold;
  line-height: 1.3;
  padding: 0;
}
.nmlBtn_caption-simple::before,
.nmlBtn_caption-simple::after { content: none; }
.nmlBtn_caption + .nmlBtn_item_inner {
  height: auto;
}
.nmlBtn_caption + .nmlBtn {
  margin-top: var(--nmlBtnItemGap);
}
/* - 位置 - */
.nmlBtn-left { justify-content: flex-start; }
.nmlBtn-center { justify-content: center; }
.nmlBtn-right { justify-content: flex-end; }
/* - カラム - */
.nmlBtn.col1 { flex-direction: column; align-items: var(--btnPos); }
.nmlBtn.col2 { --nmlBtnGapX: 32px; }
.nmlBtn.col3-static,
.nmlBtn.pc_col3-static { --nmlBtnMaxW: 344px; }
/* - 色 - */
.nmlBtn_item-orange {
  --nmlBtnColor: var(--subColor);
  --nmlBtnBoderColor: var(--subColor);
}
.nmlBtn_icon {
  width: 28px;
  height: 28px;
  position: absolute;
  top: 0;
  left: 20px;
  bottom: 0;
  margin: auto;
}
.nmlBtn_icon::after {
  background-color: var(--nmlBtnIcoColor);
  transition: var(--transBg);
}
.nmlBtn_item_inner:has(.nmlBtn_icon) {
  padding-left: 52px;
}
/* - リンクアイコン - */
.nmlBtn_linkIcon {
  width: var(--nmlBtnLinkIconWidth);
  height: var(--nmlBtnLinkIconHeight);
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  margin: auto;
}
.nmlBtn_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--nmlBtnIcoColor);
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--nmlBtnLinkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--nmlBtnLinkIcon);
}
/* 文字で来るアイコン用（pdfなど共通部分） */
.nmlBtn_item_inner:has(.nmlBtn_linkIcon-pdf) {
  --nmlBtnPadding: 56px;
}
/* アイコンの種類 */
.nmlBtn_linkIcon-down { --nmlBtnLinkIcon: url(/common_v3/images/icon/icon_anchor.svg); }
.nmlBtn_linkIcon-download { --nmlBtnLinkIcon: url(/common_v3/images/icon/icon_download.svg); }
.nmlBtn_linkIcon-blank { --nmlBtnLinkIcon: url(/common_v3/images/icon/icon_blank.svg); }
.nmlBtn_linkIcon-pdf {
  --nmlBtnLinkIcon: url(/common_v3/images/icon/icon_pdf.svg);
  --nmlBtnLinkIconWidth: 37px;
  --nmlBtnLinkIconHeight: 18px;
}
/* - ホバー - */
a.nmlBtn_item_inner:hover {
  --nmlBtnIcoColor: var(--nmlBtnColor);
  --nmlBtnTxtColor: var(--nmlBtnColor);
  --nmlBtnBgColor: var(--nmlBtnColor_hover);
  --svgIconColor: var(--nmlBtnColor);
}
/* - 色の反転（サブカラー） - */
.nmlBtn_item-reverseColor {
  --nmlBtnIcoColor: var(--nmlBtnColor);
  --nmlBtnTxtColor: var(--defaultColor);
  --nmlBtnBgColor: var(--nmlBtnColor_hover);
  --svgIconColor: var(--nmlBtnColor);
}
.nmlBtn_item-reverseColor a.nmlBtn_item_inner:hover {
  --nmlBtnIcoColor: var(--nmlBtnColor_hover);
  --nmlBtnTxtColor: var(--nmlBtnColor_hover);
  --nmlBtnBgColor: var(--nmlBtnColor);
  --svgIconColor: var(--nmlBtnColor_hover);
}
/* - 角丸調整 - */
.nmlBtn_item-roundSmall {
  --nmlBtnRadius: 8px;
}
/* - 非活性ボタン - */
.nmlBtn_item-disabled {
  --nmlBtnTxtColor: var(--defaultColor);
  --nmlBtnColor: var(--colorGray);
  --nmlBtnBgColor: var(--colorGray);
  --nmlBtnBoderColor: var(--colorGray);

  pointer-events: none;
  user-select: none;
}
.nmlBtn_item-disabled .nmlBtn-linkIcon {
  display: none;
}
/* - 選択済み - */
.nmlBtn_item-selected {
  --nmlBtnTxtColor: var(--nmlBtnColor_hover);
  --nmlBtnBgColor: var(--nmlBtnColor);
  pointer-events: none;
  user-select: none;
}
.nmlBtn_item-selected .nmlBtn-linkIcon {
  display: none;
}
/* - 見た目だけボタン - */
div.nmlBtn_item_inner:not([data-modalclass]) {
  user-select: none;
  pointer-events: none;
}
/* step内にあるボタン */
.nmlBtn-step {
  --nmlBtnMaxW: 480px;
  --nmlBtnMinH: 54px;
  font-size: 18px;
  margin-top: 16px;
}

/* ----- コンバージョンボタン ----- */
/* - 変数用 - */
.cnvBtn {
  /* 色 */
  --cnvBtnColor: linear-gradient(#1eb581 0%, #107c6a 100%);
  /* アイコン */
  --cnvBtnLinkIcon: url(/common_v3/images/icon/icon_link.svg);
}
/* - メイン - */
.cnvBtn {
  max-width: 100%;
  display: flex;
  gap: 24px 32px;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  margin-top: 48px;
}
.cnvBtn:first-child { margin-top: 0; }
.cnvBtn_item {
  flex: 0 0 auto;
  width: 420px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
}
.cnvBtn_item_inner {
  width: 100%;
  height: 100%;
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  color: #fff;
  background: var(--cnvBtnColor);
  border-radius: 40px;
  padding: 8px 44px;
  text-decoration: none;
  cursor: pointer;
  transition: var(--transOpac);
}
.cnvBtn_text {
  display: flex;
  gap: 4px;
  flex-direction: column;
}
.cnvBtn_text_main {
  font-size: 22px;
  font-weight: bold;
}
.cnvBtn_text_sub {
  font-size: 14px;
}
.cnvBtn_caption {
  font-weight: 500;
  line-height: 1.5;
  margin-bottom: 8px;
}
.cnvBtn_caption strong,
.cnvBtn_caption2 strong {
  color: var(--defaultColor);
  font-size: 20px;
}
.cnvBtn_caption2 {
  display: flex;
  justify-content: center;
  position: relative;
  color: var(--cnvBtnColor);
  font-weight: bold;
  line-height: 1.5;
  margin: auto auto 8px;
  padding: 0 32px;
}
.cnvBtn_caption2::before,
.cnvBtn_caption2::after {
  content: "";
  position: absolute;
  width: 30px;
  height:2px;
  bottom: 12px;
  background-color: var(--cnvBtnColor);
}
.cnvBtn_caption2::before {
  left: 0;
  transform: rotate(45deg);
}
.cnvBtn_caption2::after {
  right: 0;
  transform: rotate(-45deg);
}
.cnvBtn_caption.fcWhite,
.cnvBtn_caption2.fcWhite,
.cnvBtn_caption.pc_fcWhite,
.cnvBtn_caption2.pc_fcWhite { --cnvBtnColor: #fff; }
/* - 色 - */
.cnvBtn_item-orange {
  --cnvBtnColor: var(--subColor);
}
/* - 左側に置く（かもしれない）アイコン - */
.cnvBtn_icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-content: center;
  position: absolute;
  top: 0;
  left: 20px;
  bottom: 0;
  margin: auto;
}
.cnvBtn_icon::after {
  background-color: var(--cnvBtnTxtColor);
  transition: var(--transBg);
}
/* - リンクアイコン - */
.cnvBtn_linkIcon {
  width: 14px;
  height: 14px;
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  margin: auto;
}
.cnvBtn_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: #fff;
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--cnvBtnLinkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--cnvBtnLinkIcon);
}
/* アイコンの種類 */
.cnvBtn_linkIcon-down {
  transform: rotate(90deg);
}
.cnvBtn_linkIcon-blank {
  --cnvBtnLinkIcon: url(/common_v3/images/icon/icon_blank.svg);
}
/* - ホバー - */
a.cnvBtn_item_inner:hover {
  opacity: var(--hoverOpac);
}

/* ----- 注意喚起ボタン ----- */
/* - 変数用 - */
.cautionBtn {
  /* カラム・幅など */
  --cautionBtnCol: 1;
  --cautionBtnMaxW: 344px;
  --cautionBtnPadding: 40px;
  /* 色 */
  --cautionBtnColor: var(--colorRed);
  --cautionBtnBoderColor: var(--colorRed);
  --cautionBtnColor_hover: #fff;
  /* アイコン */
  --cautionBtnLinkIcon: url(/common_v3/images/icon/icon_link.svg);
  --cautionBtnLinkIconWidth: 14px;
  --cautionBtnLinkIconHeight: 14px;
}
/* - メイン - */
.cautionBtn {
  max-width: 100%;
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  margin-top: 40px;
}
.cautionBtn:first-child { margin-top: 0; }
.cautionBtn_item {
  --cautionBtnTxtColor: var(--cautionBtnColor_hover);
  --cautionBtnBgColor: var(--cautionBtnColor);

  flex: 0 0 auto;
  width: 344px;
  max-width: 100%;
  display: flex;
  flex-direction: column;
}
.cautionBtn_item_inner {
  width: 100%;
  height: 100%;
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  color: var(--cautionBtnTxtColor);
  background: var(--cautionBtnBgColor);
  border: 1px solid var(--cautionBtnBoderColor);
  border-radius: 8px;
  padding: 8px var(--cautionBtnPadding);
  text-decoration: none;
  cursor: pointer;
  transition:
    var(--transColor),
    var(--transBg);
}
.cautionBtn_text {
  display: flex;
  gap: 4px;
  flex-direction: column;
}
.cautionBtn_text_main {
  font-weight: bold;
}
.cautionBtn_text_sub {
  font-size: 14px;
}
/* - リンクアイコン - */
.cautionBtn_linkIcon {
  width: var(--cautionBtnLinkIconWidth);
  height: var(--cautionBtnLinkIconHeight);
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  margin: auto;
}
.cautionBtn_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--cautionBtnTxtColor);
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--cautionBtnLinkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--cautionBtnLinkIcon);
}
/* アイコンの種類 */
.cautionBtn_linkIcon-down {
  transform: rotate(90deg);
}
.cautionBtn_linkIcon-blank {
  --cautionBtnLinkIcon: url(/common_v3/images/icon/icon_blank.svg);
}
.cautionBtn_linkIcon-pdf {
  --cautionBtnLinkIcon: url(/common_v3/images/icon/icon_pdf.svg);
  --cautionBtnLinkIconWidth: 37px;
  --cautionBtnLinkIconHeight: 18px;
}
/* - ホバー - */
a.cautionBtn_item_inner:hover {
  --cautionBtnTxtColor: var(--cautionBtnColor);
  --cautionBtnBgColor: var(--cautionBtnColor_hover);
}
/* 反転 */
.cautionBtn_item-reverseColor {
  --cautionBtnTxtColor: var(--cautionBtnColor);
  --cautionBtnBgColor: var(--cautionBtnColor_hover);
}
.cautionBtn_item-reverseColor a.cautionBtn_item_inner:hover {
  --cautionBtnTxtColor: var(--cautionBtnColor_hover);
  --cautionBtnBgColor: var(--cautionBtnColor);
}

/* ----- 小ボタン ----- */
/* - 変数用 - */
.smlBtn {
  /* カラム・幅など */
  --smlBtnW: 200px;
  --gapY: 20px;
  --gapX: 20px;
  --smlBtnRadius: 24px;
  --smlBtnPadding: 28px;
  /* 色 */
  --smlBtnColor: var(--defaultColor);
  --smlBtnBoderColor: var(--colorGray);
  /* アイコン */
  --smlBtnLinkIcon: url(/common_v3/images/icon/icon_link.svg);
  --smlBtnLinkIconWidth: 14px;
  --smlBtnLinkIconHeight: 10px;
}
/* - メイン - */
.smlBtn {
  max-width: 100%;
  display: flex;
  gap: var(--gapY) var(--gapX);
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  margin-top: 24px;
}
.smlBtn:first-child { margin-top: 0; }
.smlBtn_item {
  flex: 0 0 auto;
  width: var(--smlBtnW);
  max-width: 100%;
  display: flex;
  flex-direction: column;
}
.smlBtn_item_inner {
  width: 100%;
  height: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  color: var(--smlBtnColor);
  background: #fff;
  border: 1px solid var(--colorGray);
  border-radius: var(--smlBtnRadius);
  padding: 8px var(--smlBtnPadding);
  text-decoration: none;
  cursor: pointer;
  transition: var(--transOpac);
}
.smlBtn_text {
  display: flex;
  gap: 4px;
  flex-direction: column;
}
.smlBtn_text_main {
  font-size: 14px;
  font-weight: bold;
}
.smlBtn_text_sub {
  font-size: 12px;
}
/* - 位置 - */
.smlBtn-left { justify-content: flex-start; }
.smlBtn-center { justify-content: center; }
.smlBtn-right { justify-content: flex-end; }
/* - 幅 - */
.smlBtn-col3,
.smlBtn.col3,
.smlBtn.pc_col3 { --smlBtnW: 346px; }
/* - リンクアイコン - */
.smlBtn_linkIcon {
  width: var(--smlBtnLinkIconWidth);
  height: var(--smlBtnLinkIconHeight);
  position: absolute;
  top: 0;
  right: 14px;
  bottom: 0;
  margin: auto;
}
.smlBtn_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--mainColor);
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--smlBtnLinkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--smlBtnLinkIcon);
}
.smlBtn_item_inner:has(.smlBtn_linkIcon-pdf) {
  --smlBtnPadding: 44px;
}
/* アイコンの種類 */
.smlBtn_linkIcon-down {
  --smlBtnLinkIcon: url(/common_v3/images/icon/icon_anchor.svg);
}
.smlBtn_linkIcon-blank {
  --smlBtnLinkIcon: url(/common_v3/images/icon/icon_blank.svg);
}
.smlBtn_linkIcon-pdf {
  --smlBtnPadding: 38px;
  --smlBtnLinkIcon: url(/common_v3/images/icon/icon_pdf.svg);
  --smlBtnLinkIconWidth: 31px;
  --smlBtnLinkIconHeight: 14px;
}
/* - ホバー - */
a.smlBtn_item_inner:hover {
  opacity: var(--hoverOpac);
}
/* - 非活性ボタン - */
.smlBtn_item-disabled {
  --smlBtnColor: var(--colorGray);
  --smlBtnBoderColor: var(--colorGray);
  --smlBtnTxtColor: var(--defaultColor);

  pointer-events: none;
  user-select: none;
}
.smlBtn_item-disabled .smlBtn-linkIcon {
  display: none;
}
/* - 見た目だけボタン - */
div.smlBtn_item_inner:not([data-modalclass]) {
  user-select: none;
  pointer-events: none;
}

/* ----- 強調ボタン（ヘッダーやトップなどで使用） ----- */
/* - 変数用 - */
.emphBtn {
  /* カラム・幅など */
  --col: 1;
  --gapY: 20px;
  --gapX: 28px;
  --btnMaxW: auto;
  --btnMinW: auto;
  --btnMinH: 64px;
  --btnRadius: 8px;
  --btnPaddingL: 44px;
  --btnPaddingR: 32px;
  --btnItemGap: 4px;
  --btnMarginTop: 40px;
  --btnFontSize: 16px;
  /* 色 */
  --btnColor: var(--mainColor);
  --btnShadow: #167157;
  /* アイコン */
  --svgIconColor: #fff;
  --btnLinkIcon: url(/common_v3/images/icon/icon_link.svg);
  --btnLinkIconWidth: 14px;
  --btnLinkIconHeight: 14px;
}
/* - メイン - */
.emphBtn {
  max-width: 100%;
  display: flex;
  gap: var(--gapY) var(--gapX);
  flex-wrap: wrap;
  text-align: center;
  margin-top: var(--btnMarginTop);
}
.emphBtn:first-child { margin-top: 0; }
.emphBtn_item {
  /* 幅 */
  --tmp1: calc(calc(var(--col) - 1) * var(--gapX));
  --tmp2: calc(100% - var(--tmp1));
  --btnW: calc(var(--tmp2) / var(--col));
  flex: 0 0 auto;
  width: var(--btnW);
  max-width: var(--btnMaxW);
  min-width: var(--btnMinW);
  display: flex;
  gap: var(--btnItemGap);
  flex-direction: column;
}
.emphBtn_item_inner {
  width: 100%;
  height: 100%;
  min-height: var(--btnMinH);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  top: 0;
  left: 0;
  color: #fff;
  background: var(--btnColor);
  box-shadow: 4px 4px var(--btnShadow);
  border-radius: var(--btnRadius);
  padding: 8px var(--btnPaddingR) 8px var(--btnPaddingL);
  text-decoration: none;
  cursor: pointer;
  transition:
    transform var(--defaultTrans),
    box-shadow var(--defaultTrans);
}
.emphBtn_text {
  display: flex;
  gap: 0;
  flex-direction: column;
}
.emphBtn_text_main {
  font-size: var(--btnFontSize);
  font-weight: bold;
  line-height: 1.45;
}
.emphBtn_text_sub {
  font-size: 14px;
  line-height: 1.2;
}
.emphBtn_caption {
  display: flex;
  justify-content: center;
  position: relative;
  font-weight: bold;
  margin: auto auto 0;
  padding: 0 32px;
}
.emphBtn_caption::before,
.emphBtn_caption::after {
  content: "";
  position: absolute;
  width: 2px;
  height:30px;
  bottom: 0;
  background-color: var(--btnColor);
}
.emphBtn_caption::before {
  left: 0;
  transform: rotate(-30deg);
}
.emphBtn_caption::after {
  right: 0;
  transform: rotate(30deg);
}
/* - 人イラスト - */
.emphBtn_deco {
  display: flex;
  align-items: flex-end;
  position: relative;
}
.emphBtn_human {
  width: 140px;
  position: absolute;
  left: 0;
  bottom: calc(var(--btnItemGap) * -2);
}
.emphBtn_deco .emphBtn_caption {
  right: 40px;
  font-size: 18px;
}
.emphBtn_caption + .emphBtn_human {
  left: auto;
  right: 8px;
}
.emphBtn_human + .emphBtn_caption {
  left: 40px;
  right: auto;
}
.emphBtn_deco + .emphBtn_item_inner {
  --btnFontSize: 22px;
}
/* - アイコン - */
.emphBtn_item:not(:has(.emphBtn_icon)) {
  --btnPaddingL: var(--btnPaddingR);
}
.emphBtn_icon {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 0;
  left: 16px;
  bottom: 0;
  margin: auto;
}
.emphBtn_icon::after {
  background-color: #fff;
}
/* - リンクアイコン - */
.emphBtn_linkIcon {
  width: var(--btnLinkIconWidth);
  height: var(--btnLinkIconHeight);
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  margin: auto;
}
.emphBtn_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--svgIconColor);
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--btnLinkIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--btnLinkIcon);
}
/* 文字で来るアイコン用（pdfなど共通部分） */
.emphBtn_item_inner:has(.nmlBtn_linkIcon-pdf) {
  --btnPaddingR: 56px;
}
.emphBtn_linkIcon-down { --btnLinkIcon: url(/common_v3/images/icon/icon_anchor.svg); }
.emphBtn_linkIcon-download { --btnLinkIcon: url(/common_v3/images/icon/icon_download.svg); }
.emphBtn_linkIcon-blank { --btnLinkIcon: url(/common_v3/images/icon/icon_blank.svg); }
.emphBtn_linkIcon-pdf {
  --btnLinkIcon: url(/common_v3/images/icon/icon_pdf.svg);
  --btnLinkIconWidth: 37px;
  --btnLinkIconHeight: 18px;
}
/* 背景パターン */
.emphBtn_item:has(.emphBtn_bgIcon) {
  --btnMinH: 84px;
  --btnPaddingL: 12px;
  --btnPaddingR: 12px;
}
.emphBtn_bgIcon {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: grid;
  place-content: center;
  margin: auto;
  opacity: .2;
}
/* - 色 - */
.emphBtn_item-orange {
  --btnColor: #FF7E39;
  --btnShadow: #CE5C1C;
}
.emphBtn_item-blue {
  --btnColor: var(--colorBlue);
  --btnShadow: #0E4C79;
}
/* - ホバー - */
.emphBtn_item_inner:hover {
  box-shadow: 0 0;
  transform: translate(4px, 4px);
}


/* ==================================================
ページ内アンカー
================================================== */
.anchorNav {
  --gapY: 24px;
  --gapX: 24px;
  --paddingX: 12px;
  --col: 4;
  --ancNavPosition: flex-start;
  --ancColor: #f2f2f2;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  line-height: 1.4;
  margin-top: 80px;
}
.anchorNav:first-child { margin-top: 0; }
.secondView_heading + .anchorNav { margin-top: 40px; }
.anchorNav_list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gapY) var(--gapX);
  justify-content: var(--ancNavPosition);
}
.anchorNav_item {
  --tAncNavGap: calc(calc(var(--col) - 1) * var(--gapX));
  --tAncNavWrap: calc(100% - var(--tAncNavGap));
  --tAncNavW: calc(var(--tAncNavWrap) / var(--col));
  flex: 0 0 auto;
  width: var(--tAncNavW);
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
}
.anchorNav_item_inner {
  width: 100%;
  height: 100%;
  min-height: 92px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--defaultColor);
  background-color: var(--ancColor);
  border-radius: 8px;
  text-decoration: none;
  padding: 8px var(--paddingX) 28px;
  transition: var(--transOpac);
}
.anchorNav_item_inner::after {
  content: '';
  width: 16px;
  height: 12px;
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 11px;
  background: url(/common_v3/images/icon/icon_anchor.svg) no-repeat center / contain;
  margin: auto;
}
/* - ホバー - */
.anchorNav_item_inner:hover {
  opacity: var(--hoverOpac);
}
/* - オプション - */
.anchorNav_item-right {
  --ancColor: #fff;
}
.anchorNav_item-right .anchorNav_item_inner {
  border: 1px solid var(--mainColor);
  padding: 8px 28px;
}
.anchorNav_item-right .anchorNav_item_inner::after {
  top: 0;
  right: 12px;
  bottom: 0;
  left: auto;
  transform: rotate(-90deg);
}
/* 位置 */
.anchorNav-center { --ancNavPosition: center; }
.anchorNav-right { --ancNavPosition: flex-end; }
/* カラム数5の時はgapをデフォルト20に */
.anchorNav.col5 { --gapY: 20px; --gapX: 20px; }
/* ボタン背景色 */
.anchorNav-white { --ancColor: #fff; }

/* ==================================================
タブ
================================================== */
/* 他コンポーネント上書き */
.stdTab .cntSec {
  margin: 0 calc(50% - 50vw);
  padding: 0 calc(50vw - 50%);
}
.stdTab .cntSec_inner {
  padding-left: 0;
  padding-right: 0;
}
/* タブメイン */
.stdTab {
  --tabColor: var(--mainColor);
  --gapY: 24px;
  --gapX: 24px;
  width: 100%;
  margin-top: 32px;
}
.stdTab:first-child { margin-top: 0; }
.stdTab_btnWrap {
  position: relative;
  display: flex;
  gap: var(--gapY) var(--gapX);
  align-items: stretch;
  justify-content: space-around;
  border-bottom: 2px solid var(--mainColor);
  margin: 0 calc(50% - 50vw);
  padding: 0 calc(50vw - 50%);
}
.stdTab_btn {
  width: 100%;
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex: 1 1 auto;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  border-radius: 16px 16px 0 0;
  border: 2px solid var(--tabColor);
  border-bottom: none;
  background-color: var(--tabColor);
  margin: 0;
  padding: 8px 12px;
  cursor: pointer;
  transition:
    var(--transColor),
    var(--transBg);
}
.stdTab_btn::after {
  content: '';
  width: 100%;
  height: 2px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  background-color: #fff;
  opacity: 0;
  transition: var(--transOpac);
}
.stdTab_btn.is-active::after {
  opacity: 1;
}
.stdTab_btn.is-active, .stdTab_btn:hover, .stdTab_btn:focus {
  background-color: #fff;
  color: var(--tabColor);
}
.stdTab_bodyWrap {
  position: relative;
}
.stdTab_body {
  width: 100%;
  padding: 48px 0 0;
  z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
}
.stdTab_body.is-active {
  position: static;
}
.stdTab_body > *:first-child { margin-top: 0; }
.stdTab_body > *:last-child { margin-bottom: 0; }
/* - 色 - */
.stdTab_btn-orange { --tabColor: var(--subColor); }
/* ----- ボックスタイプ ----- */
.stdTab-typeBox {
  overflow: hidden;
}
.stdTab-typeBox > .stdTab_bodyWrap {
  border: 2px solid var(--tabColor);
  border-top: none;
  border-radius: 0 0 16px 16px;
  padding: 24px 32px 32px;
}


/* ==================================================
お問い合わせ
================================================== */
/* ----- 背景あり ----- */
.inquirySec {
  background: #f2f2f2 no-repeat center center / cover;
  text-align: center;
  letter-spacing: .05em;
}
.inquirySec_inner {
  position: relative;
  width: calc(var(--contentWidth) + var(--contentPaddingXDouble));
  margin: auto;
  padding: 80px var(--contentPaddingX);
}
.inquirySec .nmlBtn {
  --nmlBtnMaxW: 480px;
  margin-top: 0;
}
.inquiry_head {
  font-size: 32px;
  font-weight: 600;
  line-height: 1.125;
  margin-bottom: 40px;
}
.inquiry_body {
  display: flex;
  gap: 0 40px;
  margin-top: 40px;
}
.inquiry_item {
  width: 50%;
  flex: 1 1 auto;
  position: relative;
}
.inquiry_item:not(:first-child)::before {
  content: '';
  width: 1px;
  height: 100%;
  position: absolute;
  left: -20px;
  top: 0;
  bottom: 0;
  background-color: #333333;
}
.inquiry_ttl {
  font-size: 24px;
  line-height: 1;
  margin-bottom: 16px;
}
.inquiry_ttl:not(:first-child) { margin-top: 28px; }
.inquiry_subTxt {
  margin-top: 20px;
}
.inquiry_telNumber {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
}
.telNumber {
  color: var(--mainColor);
  font-size: 56px;
  font-weight: bold;
  font-family: "Lato", sans-serif;
  font-style: normal;
  line-height: 1;
  letter-spacing: 0;
  margin-top: 20px;
}
.telNumber:first-child { margin-top: 0; }
.telNumber:not(.telNumber-simple) {
  display: flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  text-align: center;
}
/* - 文字サイズ（小） - */
.telNumber-medium { font-size: 48px; }
.telNumber-small { font-size: 40px; }
/* - 文字色、文字サイズを通常テキストに近づける - */
.telNumber-simple {
  color: var(--defaultColor);
  font-size: 18px;
}
.inquiry_ipTel {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  line-height: 1;
  margin: 20px auto 0;
}
.inquiry_ipTel_txt {
  font-size: 28px;
  font-weight: bold;
  font-family: "Lato", sans-serif;
}
/* - アイコン - */
/* フリーダイヤル */
.telNumber-freedial > span {
  padding-left: 1.55em;
  background: url(/common_v3/images/icon/icon_freedial.svg) no-repeat left center / 1.4em 1em;
}
/* 電話 */
.telNumber-tel > span {
  padding-left: 1.25em;
  background: url(/common_v3/images/icon/icon_tel.svg) no-repeat left center / 1em 1em;
}
/* - 2カラムパターン - */
.inquiry_body-col2 .inquiry_ttl {
  font-size: 18px;
  margin-bottom: 20px;
}
.inquiry_body-col2 .inquiry_subTxt {
  margin-top: 12px;
}

/* ----- 背景なし シンプルパターン ----- */
.simpleInquiry {
  background-color: #F2F2F2;
  border-radius: 24px;
  margin-top: 32px;
  padding: 32px;
}
.simpleInquiry:first-child { margin-top: 0; }
.simpleInquiry + .simpleInquiry { margin-top: 24px; }
.simpleInquiry .nmlBtn {
  --nmlBtnMinH: 54px;
  font-size: 18px;
}
.simpleInquiry .nmlBtn:not(:first-child) {
  margin-top: 20px;
}
.simpleInquiry .telNumber {
  color: var(--defaultColor);
  font-size: 40px;
}
.simpleInquiry_ttl {
  font-weight: bold;
  font-size: 22px;
  letter-spacing: .05em;
  text-align: center;
  margin-top: 80px;
}
.simpleInquiry_ttl:first-child { margin-top: 0; }
.simpleInquiry_head {
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: .05em;
  text-align: center;
}
.simpleInquiry_body {
  margin-top: 20px;
}
.simpleInquiry_box {
  --gapY: 20px;
  --gapX: 20px;
  display: flex;
  gap: var(--gapY) var(--gapX);
  align-items: center;
  justify-content: center;
}
.simpleInquiry_box_item {
}
.simpleInquiry_txt {
  font-weight: 500;
  font-size: 18px;
  letter-spacing: .03em;
  line-height: 1.5;
}
.simpleInquiry_hours {
  display: flex;
  gap: 4px;
  font-size: 14px;
  line-height: 1.5;
  margin-top: 4px;
  margin-left: auto;
}
.simpleInquiry_subTxt {
  font-size: 14px;
  line-height: 1.5;
  margin-top: 4px;
}

/* ----- パネル型 ----- */
.inquiryPanel {
  background-color: #F2F2F2;
  border-radius: 24px;
  margin-top: 32px;
  padding: 24px;
}
.inquiryPanel:first-child { margin-top: 0; }
.inquiryPanel + .inquiryPanel { margin-top: 24px; }
.inquiryPanel_list {
  /* flex */
  --col: 3;
  --gapY: 24px;
  --gapX: 24px;
  /* アイコン */
  --pInquiryIcon: url(/common_v3/images/icon/icon_link.svg);
  --pInquiryIconColor: var(--mainColor);
  --pInquiryIconColorTxt: transparent;
  --pInquiryIconWidth: 12px;
  --pInquiryIconHeight: 10px;

  min-width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: var(--gapY) var(--gapX);
  text-align: center;
  margin: 0;
}
.inquiryPanel_item {
  --tPInquiryGap: calc(calc(var(--col) - 1) * var(--gapX));
  --tPInquiryWrap: calc(100% - var(--tPInquiryGap));
  --tPInquiryW: calc(var(--tPInquiryWrap) / var(--col));
  width: var(--tPInquiryW);
  flex: 0 0 auto;
}
.inquiryPanel_link {
  width: 100%;
  height: 100%;
  display: flex;
  gap: 14px;
  flex-direction: column;
  position: relative;
  color: inherit;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #BEBEBE;
  border-radius: 16px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
  padding: 20px 24px 36px;
  transition: var(--transBg);
}
.inquiryPanel_head {
  display: flex;
  gap: 4px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.inquiryPanel_txt_main {
  font-size: 20px;
  font-weight: bold;
  letter-spacing: .05em;
  line-height: 1.3;
  text-align: center;
}
/* - ホバー - */
.inquiryPanel_link:hover {
  background-color: var(--colorLightGreen);
}
/* - 画像 - */
.inquiryPanel_img {
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* - リンクアイコン - */
.inquiryPanel_linkIcon {
  width: var(--pInquiryIconWidth);
  height: var(--pInquiryIconHeight);
  position: absolute;
  right: 14px;
  bottom: 14px;
  background-color: var(--pInquiryIconColorTxt);
}
.inquiryPanel_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--pInquiryIconColor);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--pInquiryIcon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--pInquiryIcon);
}
/* - アイコンの種類 - */
.inquiryPanel_link[target="_blank"] {
  --pInquiryIcon: url(/common_v3/images/icon/icon_blank.svg);
}
.inquiryPanel_link[href$=".pdf"] {
  --pInquiryIcon: url(/common_v3/images/icon/icon_pdf.svg);
  --pInquiryIconWidth: 24px;
  --pInquiryIconHeight: 12px;
}
/* - 左下配置のラベル - */
.inquiryPanel_label {
  position: absolute;
  left: 12px;
  bottom: 12px;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  letter-spacing: .05em;
  line-height: 1.14;
  text-align: center;
  background-color: var(--mainColor);
  border-radius: 8px;
  padding: 4px 8px;
}
.inquiryPanel_list-col3-static .inquiryPanel_item { width: 344px; }

/* --------------------------------------------------
ステップコンポーネント
-------------------------------------------------- */
/* ----- メイン ----- */
.stepBox {
  margin-top: 40px;
}
.stepBox:first-child { margin-top: 0; }
.stepBox_item {
}
.stepBox_item:not(:last-child) { margin-bottom: 64px; }
.stepBox_label_outer {
  position: relative;
}
.stepBox_label_outer::before {
  content: '';
  width: 100%;
  height: 1px;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: var(--mainColor);
  margin: auto;
}
.stepBox_label {
  width: 160px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  background-color: var(--mainColor);
  border-radius: 100px;
  margin: auto;
}
.stepBox_label:has(.stepBox_label_no) {
  align-items: baseline;
}
.stepBox_label_no {
  font-size: 28px;
}
.stepBox_head {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.stepBox_head .noteList { margin-top: 8px; }
.stepBox_head_main {
  color: var(--mainColor);
  font-size: 22px;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: .03em;
  text-align: center;
}
.stepBox_head:not(:first-child) {
  margin-top: 40px;
}
.stepBox_body {
  margin-top: 40px;
}
.stepBox_body:first-child { margin-top: 0; }

/* ----- 横並び ----- */
/* - 別コンオネ - */
/* - メイン - */
.stepBox2 {
  --col: 3;
  --gap: 40px;
  --paddingX: 16px;
  width: 100%;
  display: flex;
  gap: var(--gap);
  flex-wrap: wrap;
  margin-top: 32px;
}
.stepBox2:first-child { margin-top: 0; }
.stepBox2_item {
  --stepBox2IconSize: 56px;
  --tmp: calc(calc(var(--col) - 1) * var(--gap));
  --tmp2: calc(100% - var(--tmp));
  --itemW: calc(var(--tmp2) / var(--col));
  flex: 0 0 auto;
  width: var(--itemW);
  position: relative;
  padding-top: calc(var(--stepBox2IconSize) * .5);
}
.stepBox2_item:not(:last-child)::after {
  content: "";
  width: 24px;
  height: 56px;
  position: absolute;
  top: calc(50% - 28px);
  left: 100%;
  background-color: var(--colorGray);
  clip-path: polygon(0 0, 0 100%, 100% 50%);
}
.stepBox2_icon {
  width: var(--stepBox2IconSize);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  font-size: 28px;
  margin: auto;
}
.stepBox2_item_inner {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 16px;
  padding: 40px var(--paddingX);
}
.stepBox2_head {
  display: flex;
  gap: 4px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.stepBox2_head_txt {
  font-size: 20px;
  font-weight: bold;
  line-height: 1.5;
}
.stepBox2_head_subTxt {
  color: var(--mainColor);
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
}
.stepBox2_body {
  margin-top: 16px;
}
.stepBox2_body:first-child { margin-top: 0; }
.stepBox2_body_icon {
  text-align: center;
  margin-bottom: 16px;
}
.stepBox2_body_icon:last-child { margin-bottom: 0; }
.stepBox2_body_thumb {
  width: auto;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stepBox2_body_thumb > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.stepBox2.col2 .stepBox2_item:nth-child(2)::after { content: none; }
.stepBox2.col3 .stepBox2_item:nth-child(3)::after { content: none; }
.stepBox2.col4 .stepBox2_item:nth-child(4)::after { content: none; }
.stepBox2.col5 .stepBox2_item:nth-child(5)::after { content: none; }


/* --------------------------------------------------
selectChart
-------------------------------------------------- */
.selectChart {
  overflow: hidden;
  margin-top: 40px;
}
.selectChart:first-child { margin-top: 0; }
.selectChart_inner {}
.selectChart_item {
}
.selectChart_item:not(:first-child)::before {
  content: "";
  width: 64px;
  height: 24px;
  display: block;
  background-color: var(--colorGray);
  clip-path: polygon(0 0, 50% 100%, 100% 0);
  margin: 0 auto 24px;
}
.selectChart_item:not(:first-child),
.selectChart_item:not(:first-child) .selectChart_branch {
  display: none;
}
/* - head部分 - */
.selectChart_head {
  display: flex;
  gap: 20px;
  align-items: center;
  color: #fff;
  font-weight: bold;
  line-height: 1.4;
  background-color: var(--mainColor);
  border-radius: 16px 16px 0 0;
}
.selectChart_head_no {
  width: 80px;
  aspect-ratio: 1 / 1;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-size: 28px;
  font-family: "Lato", sans-serif;
  font-style: normal;
  text-align: center;
}
.selectChart_head_no::after {
  content: '';
  width: 1px;
  height: 56px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  margin: auto;
}
.selectChart_head_txt {
  font-size: 24px;
  padding-right: 16px;
}
/* - body部分 - */
.selectChart_body {
  background-color: var(--colorLightGray);
  border-radius: 0 0 16px 16px;
  padding: 32px 48px;
}
/* - 白枠部分 - */
.selectChart_dataBox {
  display: none;
  margin: 0;
}
.selectChart_dataBox_item {
  background-color: #fff;
  margin-top: 32px;
  padding: 32px;
}
.selectChart_dataBox_head {
  font-size: 22px;
  font-weight: bold;
  text-align: center;
}
.selectChart_dataBox {
  display: none;
}
.selectChart_dataBox_item {
  display: none;
}
/* - 一つ前に戻るボタン - */
.selectChart_backbranch {
  display: none;
  margin-top: 24px;
}
.selectChart_backbranch_item {
  margin: auto;
}


/* --------------------------------------------------
formTable
-------------------------------------------------- */
::-webkit-input-placeholder,
::placeholder,
:placeholder-shown,
:-ms-input-placeholder {
  color: rgba(#333, .5);
}
.formTable {
  width: 100%;
}
.formTable_req {
  display: inline-block;
  color: var(--colorRed);
  margin-left: 12px;
  vertical-align: middle;
}
.formTable th,
.formTable td {
  vertical-align: middle;
  padding: 16px 0;
}
.formTable th {
  font-weight: bold;
  text-align: left;
}
.formTable th label {
  line-height: 1;
  vertical-align: middle;
}
.formTable td {

}
.form_text,
.form_select,
.form_textarea {
  width: 100%;
  max-width: 100%;
  height: 64px;
  background: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 8px;
  line-height: 1;
  letter-spacing: 0;
  padding: 12px 20px;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  margin: 0 12px;
}
.form_text:first-child,
.form_select:first-child,
.form_textarea:first-child { margin-left: 0; }
.form_text:last-child,
.form_select:last-child,
.form_textarea:last-child { margin-right: 0; }
.form_text.entered,
.form_select.entered,
.form_textarea.entered {
  background: #fff;
}
/* - 通常 - */
.form_text-smallW {
  width: 172px;
}
/* - セレクト - */
.form_selectWrap {
  display: inline-block;
  position: relative;
}
.form_selectWrap::after {
  content: "";
  width: 16px;
  height: 12px;
  display: block;
  position: absolute;
  right: 24px;
  top: calc(50% - 6px);
  background-color: var(--mainColor);
  clip-path: polygon(0 0, 50% 100%, 100% 0);
}
.form_select {
  width: 430px;
  padding-right: 44px;
}
.form_select::-ms-expand {
  display: none;
}
/* - ラジオボタン、チェックボックス - */
.form_label_list {
  display: flex;
  gap: 24px 32px;
  flex-wrap: wrap;
}
.form_label {
  cursor: pointer;
}
.form_checkbox,
.form_radio {
  accent-color: var(--mainColor);
  inline-size: 20px;
  block-size: 20px;
  margin: 0;
  margin-right: 8px;
  vertical-align: middle;
  cursor: pointer;
}
/* - テキストエリア - */
.form_textarea {
  min-height: 192px;
}
/* - エラー - */
.is-error[class*="form_"] {
  background-color: #F9EBEB;
  border-color: var(--colorRed);
}
/* ----- 個人情報保護方針 ----- */
.privacyPolicy {
  height: 284px;
  background-color: var(--colorLightGray);
  border-radius: 8px;
  margin: 48px auto 0;
  padding: 32px 24px;
  overflow: auto;
}
.privacyPolicy .title {
  color: var(--mainColor);
  font-size: 24px;
  font-weight: bold;
}
.privacyPolicy p:not(:first-child) {
  margin-top: 16px;
}
.privacyPolicy .title:not(:first-child) {
  margin-top: 24px;
}
/* 同意する */
.agreeWrap {
  text-align: center;
}
.agreeInner {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 40px;
}
.agreeCheck {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}
.agreeCheck a {
  text-decoration: underline;
  text-underline-offset: 8px;
}
.agreeText {
  font-size: 14px;
  margin-top: 24px;
}
/* 送信ボタン */
.form_agree_btn_wrap {
  width: 420px;
  display: flex;
  position: relative;
  margin: 24px auto 0;
}
.form_agree_btn {
  width: 100%;
  max-width: 100%;
  min-height: 68px;
  background: var(--mainColor);
  border: 1px solid var(--mainColor);
  border-radius: 34px;
  color: #fff;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  transition:
    var(--transColor),
    var(--transBg);
  display: block;
  margin: 0;
}
.form_agree_btn_icon {
  width: 16px;
  height: 12px;
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  margin: auto;
}
.form_agree_btn_icon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: #fff;
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: url(/common_v3/images/icon/icon_link.svg);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: url(/common_v3/images/icon/icon_link.svg)
}
.form_submit[disabled=""] {
  cursor: default;
  user-select: none;
  pointer-events: none;
  background-color: var(--colorGray);
  border-color: var(--colorGray);;
}
.form_agree_btn:hover {
  color: var(--mainColor);
  background-color: #fff;
}
.form_agree_btn:hover + .form_agree_btn_icon::after {
  background-color: var(--mainColor);
}
/* - シミュレーション - */
.nmlTable-simulator th {
  height: 85px;
}
.nmlTable-simulator input,
.nmlTable-simulator label {
  vertical-align: middle;
}
.nmlTable-simulator input[type="text"] {
  width: 172px;
  height: 45px;
  margin: 0 12px;
  border: 1px solid #E8E8E8;
  padding: 0 8px;
}
.nmlTable-simulator input[type="text"]:first-child { margin-left: 0; }
.nmlTable-simulator input[type="text"]:last-child { margin-right: 0; }
.nmlTable-simulator input[type="text"]:not(:disabled):focus-visible,
.nmlTable-simulator input[type="text"]:not(:disabled):hover {
  outline: 1px solid #0AA365;
}
.nmlTable-simulator input[type="radio"] {
  -webkit-appearance: none;
  appearance: none;
  margin: 0 10px 0 0;
}
.nmlTable-simulator input[type="radio"]::before {
  content: "";
  display: flex;
  width: 26px;
  height: 26px;
  background: #fff;
  border: 1px solid #E8E8E8;
  border-radius: 50%;
}
.nmlTable-simulator input[type="radio"]::after {
  content: '';
  width: 20px;
  height: 20px;
  position: absolute;
  background-color: #0AA365;
  border-radius: 50%;
  transform: translate(3px, -23px);
  opacity: 0;
  transition: opacity .4s ease;
}
.nmlTable-simulator input[type="radio"]:checked::after {
  opacity: 1;
}
.simulator_radio > span:nth-child(n+2) {
  margin-left: 32px;
}
.simulationBalloon_wrap {
  position: relative;
}
.simulationBalloon {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -1em;
  transform: translateY(-50%);
  right: 32px;
  margin: 0;
}
.simulationBalloon_inner {
  position: relative;
  margin-right: 0;
}
.simulationBalloon_inner::before {
  content: "";
  position: absolute;
  left: -35px;
  top: 47%;
  z-index: 1;
  transform: translateY(-50%);
  border-style: solid;
  border-width: 15px 0 15px 24px;
  transform: scaleY(1) translate(50%, -50%) rotate(180deg);
  border-color: transparent transparent transparent #0AA365;
  box-shadow: none;
}
.simulationBalloon_inner::after {
  position: absolute;
  top: 47%;
  left: -21px;
  transform: translateY(-50%);
  z-index: 2;
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  background-color: transparent;
  border-width: 16px 26px 16px 0px;
  border-color: transparent #fff transparent transparent;
}
.simulationBalloon_txt {
  width: 332px;
  min-height: 120px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: start;
  background-color: #fff;
  border: 1px solid #0AA365;
  border-radius: 16px;
  box-shadow: none;
  padding: 22px;
}
.submitBox {
  margin-bottom: 24px;
  margin-top: 32px;
  display: flex;
  justify-content: center;
  gap: 32px;
}
.submitBox_item {
  width: 420px;
  min-height: 68px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  border: none;
  font-family: inherit;
  font-size: 18px;
  line-height: 1.5;
  border-radius: 34px;
  padding: 7.5px 54px;
  cursor: pointer;
}
.submitBox_item_icon {
  width: 28px;
  height: 36px;
  position: absolute;
  top: 0;
  left: 24px;
  bottom: 0;
  margin: auto;
}
.submitBox_item_icon::after {
  background-color: #fff;
  transition: var(--transBg);
}
.submitBox_item_linkIcon {
  --icon: url(/common_v3/images/icon/icon_link.svg);
  width: 12px;
  height: 16px;
  position: absolute;
  top: 0;
  right: 24px;
  bottom: 0;
  margin: auto;
}
.submitBox_item_linkIcon::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: #fff;
  transition: var(--transBg);

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--icon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--icon);
}
.submitBox_item-calc {
  --svgIconColor: #fff;
  position: relative;
  transition:
    var(--transBg),
    var(--transColor);
  overflow: hidden;
  border: 1px solid #FF995A;
  color: #fff;
  background-color: #FF995A;
}
.submitBox_item-calc:hover {
  color: #FF995A;
  background-color: #fff;
}
.submitBox_item-calc:hover .submitBox_item_icon::after,
.submitBox_item-calc:hover .submitBox_item_linkIcon::after {
  background-color: #FF995A;
}
.submitBox_item-clear {
  color: #333333;
  font-weight: 500;
  background-color: #F2F2F2;
  transition: var(--transOpac);
}
.submitBox_item-clear:hover {
  opacity: .75;
}
#resultBox{
  display: none;
}
.explanationBox {
  display: none;
}
.resultBoxElements {
  display: none;
  margin-top: 48px;
}
.nmlTable-simulator p.error {
  display: none;
  color: #F54F4F;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: 0.025em;
}
.nmlTable-simulator input.error {
  border: 1px solid #cc0000;
  background: #F7CFCF;
}


/* --------------------------------------------------
adobeReaderGet
-------------------------------------------------- */
.adobeReaderGet {
  margin-top: 40px;
  display: table;
  width: 100%;
  background: var(--colorLightGray) url(/common_v3/images/adobe_reader_get.png) no-repeat 40px center;
  transition: var(--transOpac);
}
.adobeReaderGet:first-child { margin-top: 0; }
.adobeReaderGet:hover,
.adobeReaderGet:focus {
  opacity: var(--hoverOpac);
}
.adobeReaderGet a {
  display: table-cell;
  width: 100%;
  height: 100%;
  padding: 20px 40px 20px 239px;
  text-decoration: none;
  color: inherit;
}
.adobeReaderGet_main {
  font-size: var(--defaultFontSize);
}
.adobeReaderGet_note {
  margin-top: 8px;
  font-size: 14px;
}


/* --------------------------------------------------
ニュースリスト
-------------------------------------------------- */
.newsTitle {
  border-bottom: 1px solid var(--colorGray);
  margin-top: 40px;
  padding-bottom: 24px;
  font-size: 24px;
  text-align: center;
}
.newsList:first-child { margin-top: 0; }
.newsTitle + .newsList { margin-top: 12px; }
.newsList {
  margin: 40px auto;
}
.newsList:first-child { margin-top: 0; }
.newsList:last-child { margin-bottom: 0; }
.newsList_item {
  display: flex;
  flex-direction: column;
  position: relative;
  border-bottom: 1px solid var(--colorGray);
  padding: 20px 40px 18px 0;
  line-height: 1.5;
}
.newsList_item:first-of-type {
  padding-top: 0;
}
.newsList_item_inner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  font-size: var(--defaultFontSize);
  color: var(--defaultColor);
  text-decoration: none;
  transition: all .2s ease;
  background-repeat: no-repeat;
  letter-spacing: 0.025em;
}
.newsList_date {
  flex: 0 0 auto;
  text-align: left;
  color: var(--mainColor);
  margin-right: 20px;
}
/* - hover - */
a.newsList_item_inner:hover .newsList_title span:not([class]),
a.newsList_item_inner:focus .newsList_title span:not([class]) {
  opacity: var(--hoverOpac);
}


/* ==================================================
usagePanel
================================================== */
.usagePanel {
  --col: 3;
  --gapY: 24px;
  --gapX: 24px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--gapY) var(--gapX);
  justify-content: center;
  margin-top: 32px;
}
.usagePanel:first-child { margin-top: 0; }
.usagePanel_item {
  --tmp: calc(calc(var(--col) - 1) * var(--gapX));
  --tmp2: calc(100% - var(--tmp));
  --width: calc(var(--tmp2) / var(--col));
  flex: 0 0 auto;
  width: var(--width);
  display: flex;
  gap: 16px;
  align-items: center;
  background-color: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 12px;
  padding: 24px 16px;
}
.usagePanel_icon {
  width: 76px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.usagePanel_txt {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: .03em;
  line-height: 1.4;
}


/* ==================================================
比較テーブル
================================================== */
.comparisonTable {
  width: 100%;
  background-color: #fff;
  border: 1px solid #E8E8E8;
  border-collapse: collapse;
  table-layout: fixed;
}
.comparisonTable th,
.comparisonTable td {
  line-height: 1.5;
  letter-spacing: 0.03em;
  border: 1px solid #fff;
  padding: 16px;
}
/* th */
.comparisonTable th {
  height: 85px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  background-color: var(--colorLightGray);
}
/* thead内のth */
.comparisonTable thead th { color: #fff;  }
.comparisonTable thead th:nth-child(2) { background-color: #FF995A; }
.comparisonTable thead th:nth-child(3) { background-color: #6E6E6E; }
/* td */
.comparisonTable td {
  padding-bottom: 20px;
}
.comparisonTable td:nth-child(2) { background-color: #FFE8D9; }


/* ==================================================
Video
================================================== */
.video {
  aspect-ratio: 16 / 9;
  width: 560px;
  max-width: 100%;
  position: relative;
  margin: 32px auto 0;
}
.video:first-child { margin-top: 0; }
.video > iframe,
.video > video {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
/* サイズ違い */
.video-medium {
  max-width: 480px;
}


/* ==================================================
装飾
================================================== */
.adorn {
  position: relative;
}
.adorn_img {
  position: absolute;
  right: 20px;
  top: 0;
  transform: translateY(-100%);
}



/* ==================================================
appDLBox
================================================== */
.appDLBox {
  margin-top: 40px;
  text-align: center;
}
.appDLBox :first-child { margin-top: 0; }
.appDLBox_ttl {
  font-size: 24px;
  font-weight: 500;
}
.appDLBox_list {
  display: grid;
  gap: 24px;
  grid-template-columns: 1fr 1fr;
  margin-top: 16px;
}
.appDLBox_item {
  background-color: #fff;
  border: 1px solid var(--colorGray);
  padding: 24px;
}
.appDLBox_head {
  font-size: 20px;
  line-height: 1;
}
.appDLBox_body {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 16px;
  margin-top: 16px;
}
.appDLBox_storeBtn {
  width: 150px;
  height: auto;
  display: flex;
  justify-content: center;
  transition: var(--transOpac);
}
.appDLBox_storeBtn:hover { opacity: var(--hoverOpac); }
.appDLBox_storeBtn img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.appDLBox_txt {
  width: 100%;
}


/* ==================================================
arrowBox
================================================== */
.arrowBox {
  margin: 64px 0 0;
}
.arrowBox:first-child { margin-top: 0; }
.arrowBox::after {
  content: '';
  width: 100%;
  height: 80px;
  display: block;
  background-color: #fff;
  clip-path: polygon(0% 0%, 50% 100%, 100% 0%);
}
.arrowBox_inner {
  background-color: #fff;
  padding: 40px 40px 24px;
}
.arrowBox_head {
  display: flex;
  gap: 40px;
}
.arrowBox_head_item {
  flex: 1 1 auto;
  display: flex;
  gap: 16px;
  align-items: center;
  position: relative;
  background-color: var(--subColor);
  border-radius: 12px;
  padding: 20px;
}
.arrowBox_head_item::after {
  content: '';
  width: 24px;
  height: 24px;
  position: absolute;
  right: -32px;
  top: 0;
  bottom: 0;
  background: url(/common_v3/images/arrowbox_icon_plus.svg) no-repeat center / contain;
  margin: auto;
}
.arrowBox_head_item:last-child::after { content: none; }
.arrowBox_head_sub {
  width: 70px;
  flex-shrink: 0;
}
.arrowBox_head_main {
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: .03em;
  line-height: 1.45;
}
.arrowBox_foot {
  margin-top: 24px;
}


/* ==================================================

================================================== */
.cirBox {
  width: 328px;
  max-width: 100%;
  min-height: 328px;
  position: relative;
  z-index: 0;
  font-weight: bold;
  letter-spacing: 0.03em;
  text-align: center;
  padding-bottom: 24px;
}
.cirBox::before {
  content: '';
  width: 100%;
  aspect-ratio: 1 / 1;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background: #fff;
  border-radius: 50%;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.1);
  margin: auto;
}
.cirBox_head {
}
.cirBox_img {
  height: 100px;
  display: flex;
  justify-content: center;
}
.cirBox_head_ttl {
  min-height: calc(2em * 1.5);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  line-height: 1.5;
}
.cirBox_head_ttl_sub {
  font-size: 16px;
}
.cirBox_foot_ttl {
  color: var(--mainColor);
  font-size: 14px;
}
.cirBox_rate {
  display: flex;
  gap: 4px 8px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.cirBox_rate_label {
  width: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 22px;
  line-height: 1.25;
  background-color: var(--mainColor);
  border-radius: 4px;
  padding: 4px 4px 8px;
}
.cirBox_rate_main {
  color: var(--mainColor);
  font-family: var(--latoFont);
  font-size: 80px;
}
.cirBox_rate_per {
  color: var(--defaultColor);
  font-size: 56px;
  margin-left: 2px;
}
.cirBox_rate_to {
  font-size: 26px;
}
.cirBox_rate_sub {
  flex: 1 0 100%;
  font-size: 14px;
}
.cirBox_foot_unit {
  display: flex;
  gap: 28px;
  justify-content: center;
  line-height: 1;
  margin-top: 12px;
}
.cirBox_foot_unit_item {
  flex: 0 1 auto;
  position: relative;
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: center;
  background-color: var(--subColor);
  border-radius: 8px;
  padding: 4px;
}
.cirBox_foot_unit_item::after {
  content: '';
  width: 12px;
  height: 12px;
  position: absolute;
  right: -20px;
  top: 0;
  bottom: 0;
  background: url(/common_v3/images/arrowbox_icon_plus.svg) no-repeat center / contain;
  margin: auto;
}
.cirBox_foot_unit_item:last-child::after { content: none; }
.cirBox_foot_unit_num {
  width: 24px;
  height: 24px;
}
.cirBox_foot_unit_txt {
  display: flex;
  align-items: center;
  color: #fff;
  font-size: 20px;
}
.cirBox_foot_unit_txt span {
  font-size: 12px;
  margin-top: auto;
}
.cirBox_foot_unit_txt::before {
  content: '';
  width: 16px;
  height: 14px;
  display: block;
  background-color: #fff;
  clip-path: polygon(0% 100%, 50% 0%, 100% 100%);
  margin-right: 2px;
}


/* ==================================================
カテゴリ毎リンク
================================================== */
.catLink_ttl {
  color: var(--mainColor);
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.03em;
  line-height: 1.33;
  border-bottom: 1px solid var(--mainColor);
  padding-bottom: 14px;
  margin-top: 32px;
}
.catLink_ttl:first-child { margin-top: 0; }
.catLink_ttl_link {
  width: 100%;
  display: flex;
  text-decoration: none;
  transition: var(--transOpac);
}
.catLink_ttl_link:hover { opacity: var(--hoverOpac); }
.catLink_ttl_link .linkIcon { margin: 0 0 0 auto; }
.catLink_list_ttl {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.4;
  margin-top: 16px;
}
.catLink_list_ttl:first-child { margin-top: 0; }
.catLink_list {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 1.4;
  margin-top: 16px;
}
.catLink_list:first-child { margin-top: 0; }
.catLink_list_itme {
  margin-top: 16px;
}
.catLink_list_itme:first-child { margin-top: 0; }
.catLink_list_txt {
  display: inline-flex;
  color: var(--defaultColor);
  text-decoration: none;
}
a.catLink_list_txt:hover {
  text-decoration: underline;
}
.catLink_list_txt .linkIcon {
  top: .2em;
  margin-right: 0;
}

/* ==================================================
商品・サービス
================================================== */
.prodSec {
}
.prodSec .cntSec_inner {
  padding-top: 56px;
}
/* ----- タブ ----- */
.prod_tab {
  --swiper-pagination-bullet-size: 10px;
  --fontSize: 16px;
  margin-top: 48px;
  overflow: hidden;
}
.prod_tab_inner {
  padding: 0 64px;
  overflow: visible;
}
.prod_tab_inner::before,
.prod_tab_inner::after {
  content: '';
  width: 62px;
  height: calc(100% - 2px);
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 5;
  background-color: #fff;
}
.prod_tab_inner::before { left: 0; }
.prod_tab_inner::after { right: 0; }
/* 背景色グレーのセクション内使用の場合 */
.bgLGray .prod_tab_inner::before,
.bgLGray .prod_tab_inner::after {
  background-color: var(--colorLightGray);
}
.prod_tab-fontSmall {
  --fontSize: 14px;
}
/* - タブ（ボタン部分） - */
.prod_tab_list {
}
.prod_tab_list_item {
  height: auto;
  position: relative;
  padding: 0 4px 4px 0;
}
.prod_tab_list_item::before,
.prod_tab_list_item::after {
  content: '';
  width: 52px;
  height: 35px;
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 53px);
  margin: auto;
  clip-path: polygon(0 100%, 100% 100%, 50% 0);
  opacity: 0;
  visibility: hidden;
}
.prod_tab_list_item::before {
  background-color: var(--colorGray);
  margin-top: -1px;
}
.prod_tab_list_item::after {
  background-color: #fff;
}
.prod_tab_btn {
  width: 100%;
  height: 100%;
  display: flex;
  gap: 8px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--defaultColor);
  font-size: var(--fontSize, var(--defaultFontSize));
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 8px;
  box-shadow: 4px 4px var(--colorGray);
  padding: 20px 12px 12px;
  transition:
    box-shadow var(--defaultTrans),
    transform var(--defaultTrans),
    var(--transOpac);
}
.prod_tab_btn:hover {
  opacity: var(--hoverOpac);
}
.prod_tab_btn_icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.prod_tab_btn_txt {
  min-height: calc(3em * 1.5);
  display: flex;
  align-items: center;
  justify-content: center;
}
.prod_tab_navigation {
  margin-top: 28px;
}
.prod_tab_pagination {
  position: static;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
}
.prod_tab_pagination > span {
  background-color: transparent;
  border: 1px solid var(--mainColor);
  border-radius: 50%;
  margin: 0 !important;
  opacity: 1;
  transition:
    var(--transBg),
    var(--transOpac);
}
.prod_tab_pagination .swiper-pagination-bullet-active {
  background-color: var(--mainColor);
}
.prod_tab_arrow {
  --icon: url(/common_v3/images/icon/icon_down.svg);
  width: 35px;
  height: 24px;
  margin-top: -26px;
  transition: var(--transOpac);
}
.prod_tab_arrow::after {
  content: '';
  width: 100%;
  height: 100%;
  display: block;

  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  -webkit-mask-image: var(--icon);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  mask-image: var(--icon);
  background-color: var(--defaultColor);
}
.prod_tab_arrow.swiper-button-prev { left: 0; transform: rotate(90deg); }
.prod_tab_arrow.swiper-button-next { right: 0; transform: rotate(-90deg); }
.prod_tab_arrow:hover { opacity: var(--hoverOpac); }
/* アクティブ時 */
.prod_tab_list_item:has(.prod_tab_btn.is-active)::before,
.prod_tab_list_item:has(.prod_tab_btn.is-active)::after {
  opacity: 1;
  visibility: visible;
}
.prod_tab_btn.is-active {
  box-shadow: 0 0;
  transform: translate(4px, 4px);
}
/* - タブ（コンテンツ部分） - */
.prod_tab_contentWrap {
  display: none;
  position: relative;
  padding: 48px 0 20px;
}
.prod_tab_contentWrap:has(.prod_tab_content.is-active) { display: block; }
.prod_tab_content {
  display: none;
  width: 100%;
  z-index: 1;
  position: absolute;
  left: 0;
  top: 0;
  background-color: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 24px;
  padding: 40px 32px 60px;
}
.prod_tab_content.is-active { position: static; }
.prod_tab_content .nmlBtn {
  --defaultFontSize: 14px;
  --smallFontSize: 12px;
  --marginTop: 24px;
  --nmlBtnMinH: 60px;
}
.prod_tab_content .nmlBtn_text_main {
  font-size: var(--defaultFontSize);
}
.prod_tab_content .nmlBtn_text_sub {
  font-size: var(--smallFontSize);
}
/* - 一覧以外のコンテツ領域1 - */
.prod_tab_content_fst {
  border-bottom: 1px solid var(--colorGray);
  padding-bottom: 28px;
}
.prod_tab_content_fst:only-child {
  border-bottom: none;
  padding-bottom: 0;
}
.prod_tab_content_fst_body {
  font-weight: 500;
}
.prod_tab_content_fst_ttl {
  color: var(--mainColor);
  font-size: 18px;
  font-weight: bold;
  line-height: 1.33;
  letter-spacing: .03em;
}
.prod_tab_content_fst_ttl > a {
  text-decoration: none;
}
.prod_tab_content_fst_ttl > a:hover {
  text-decoration: underline;
}
.prod_tab_content_fst_txt {
  margin-top: 16px;
}
.prod_tab_content_fst_txt:first-child { margin-top: 0; }
/* - 一覧以外のコンテツ領域2 - */
.prod_tab_content_snd {
  display: grid;
  gap: 32px 24px;
  grid-template-columns: repeat(3, 1fr);
  align-items: start;
  margin-top: 32px;
}
.prod_tab_content_snd_item {}
/* アイテム幅 */
.prod_tab_content_snd_item-w2 { grid-column: span 2; }
.prod_tab_content_snd_item-w3 { grid-column: span 3; }
/* 別レイアウト */
.prod_tab_content_snd_item-type2 {
  background-color: #fff;
  border: 1px solid var(--colorGray);
  border-radius: 16px;
  padding: 24px;
}
.prod_tab_content_snd_ttl {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: .03em;
  line-height: 1.3;
  border-left: 5px solid var(--mainColor);
  margin-top: 32px;
  padding-left: 10px;
}
.prod_tab_content_snd_ttl:first-child { margin-top: 0; }
/* - 閉じるボタン - */
.prod_tab_closeBtn {
  display: none;
  width: 120px;
  height: 38px;
  gap: 10px;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  letter-spacing: 0.03em;
  line-height: 1.5;
  text-align: center;
  background-color: var(--defaultColor);
  border-radius: 24px;
  margin: auto;
  transition: var(--transOpac);
}
.prod_tab_closeBtn::before {
  content: '';
  width: 16px;
  height: 16px;
  display: block;
  background: url(/common_v3/images/icon/icon_close_white.svg) no-repeat center center / contain;
}
.prod_tab_content.is-active ~ .prod_tab_closeBtn {
  display: flex;
}
.prod_tab_closeBtn:hover {
  opacity: var(--hoverOpac);
}
.prod_bnr_slider {
  --slideWidth: 292px:
}


/* ==================================================
比率
================================================== */
.ratioBox {
  display: grid;
  gap: var(--gapY, 24px) var(--gapX, 24px);
  grid-template-columns: var(--gTCol, 1fr 1fr);
  margin-top: 32px;
}
.ratioBox:first-child { margin-top: 0; }
.ratioBox_item {}



/* ==================================================
モーダル
================================================== */
.modal {
  --modalRadius: 32px;
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 9999;
  width: 100%;
  min-width: var(--contentWidth);
  height: 100%;
  background: rgba(0, 0, 0, .7);
  padding: 30px;
  text-align: center;
  overflow: hidden;
}
.modal::before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.05em;
}
.modal_inner {
  display: inline-block;
  position: relative;
  vertical-align: middle;
  text-align: left;
  width: 90%;
}
.modal_scroll {
  max-height: calc(100vh - 60px);
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.modal_scroll::-webkit-scrollbar {
  display: none;
}
.modal_scroll_inner {
  background: #fff;
  border-radius: var(--modalRadius);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding: 60px;
}
.modal_close {
  width: 100%;
  height: 50px;
  display: flex;
  justify-content: center;
  background-color: var(--defaultColor);
  border-radius: var(--modalRadius);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding: 16px;
  cursor: pointer;
  transition: var(--transOpac);
}
.modal_close:hover,
.modal_close:focus {
  opacity: var(--hoverOpac);
}
.modal_close_txt {
  position: relative;
  color: #fff;
  font-weight: bold;
  padding-left: 28px;
}
.modal_close_txt::before {
  content: '';
  width: 16px;
  height: 16px;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: url(/common_v3/images/icon/icon_close_white.svg) no-repeat center center / contain;
  margin: auto;
}

