@charset "UTF-8";

/* --- Global UI --- */
*,::after,::before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  font-family: 'Noto Sans JP', sans-serif;
  color: var(--dark-navy);
  background-color: #fff;
  line-height: 1.6;
  overflow-x: hidden;
  overflow-wrap: anywhere;
  word-break: normal;
  line-break: strict;
}
#wrap {
  position: relative;
  z-index: 10;
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
}
div, dl, dt, dd, ul, ol,
li, h1, h2, h3, h4, h5,
h6, pre, code, form, fieldset, legend,
input, textarea, p, blockquote,
th, td {
  margin: 0;
  padding: 0;
  word-break: break-word;
}
.text-left {
  text-align: left
}
.text-center {
  text-align: center
}
.text-right {
  text-align: right
}

[hidden]:where(:not([hidden=until-found])) {
  display: none
}

.absolute {
  position: absolute
}

.relative {
  position: relative
}

img {
  display: block;
  max-width: 100%;
  width:100%;
  height: auto
}
.contentsSection {
  margin: 0;
  padding: 0;
  line-height: 0;
}

.l-inner {
  max-width: 980px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  position: relative;
}
@media (max-width: 1200px) {
  .l-inner {
    padding: 0 15px;
  }
}
@media (max-width: 1180px) {
  .l-container {
    padding: 0;
    margin-left: 0px;
  }
  .l-inner {
    padding: 0 15px;
  }
}

.btn {
  width: 75%;
  left: 12%;
  bottom: 7%;
  position: absolute;
  animation: fluff-active 2.5s infinite ease-in-out;
}
.btn_02 {
  width: 80%;
  left: 10%;
  bottom: 15%;
  position: absolute;
  animation: fluff-active 2.5s infinite ease-in-out;
}
.btn_03{
  width: 80%;
  left: 10%;
  bottom: 17.7%;
  position: absolute;
}
.btn_04{
  width: 80%;
  left: 10%;
  bottom: 5%;
  position: absolute;
  animation: fluff-active 2.5s infinite ease-in-out;
}

/* --- ボタンのアニメーション設定 --- */
@keyframes fluff-active {
  0% { transform: translateY(0); }
  45% { transform: translateY(-7px); }
  50% { transform: translateY(-7px); }
  100% { transform: translateY(0); }
}

.bot_open:active {
  transform: scale(0.92);
  transition: 0.1s;
}

/* --- footer --- */
.l-footer-bottom {
  padding: 20px 0 60px;
  margin: 0;
  background: #f4f4f4;
}
.footer-bottom {
  padding: 15px 0;
  overflow: hidden;
  line-height: 1;
  text-align: center;
}
.footer-bottom .copyright {
  color: #9ca3af;
  font-size: 10px;
  letter-spacing: 0.08em;
}

.footer-logo {
  display: block;
  width: 35%;
  height: auto;
  margin: 0 auto;
}

/* --- faq --- */
.faq {
  background: #fffccc;
  padding: 60px 40px;
}

.faq__inner {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
}

.faq__title {
  margin: 0 0 40px;
  text-align: center;
}

.faq__title img {
  display: block;
  width: 300px;
  max-width: 80%;
  height: auto;
  margin: 0 auto;
  transform: translateX(30px);
  margin-top: 20px;
}

/* FAQカテゴリー */
.faq .service,
.faq .campaign {
  margin-bottom: 50px;
}

/* カテゴリータイトル */
.faq__title-lv03 {
  margin-bottom: 20px;
  padding-top: 20px;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}

/* FAQリスト */
.faq__list-container {
  border-top: none;
}

.faq__list {
  margin: 0 0 10px;
  border: none;
  overflow: visible;

}

/* 質問 */
.faq__question {
  position: relative;
  margin: 0;
  padding: 35px 65px 35px 35px;
  background: #ffb42d;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.6;
  border-radius: 80px;
  cursor: pointer;
}

.faq__question:hover {
  opacity: 0.8;
}

/* ＋／−アイコン */
.detail__icon {
  position: absolute;
  top: 50%;
  right: 35px;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
}

/* 横棒 */
.detail__icon::before,
/* 縦棒 */
.detail__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 2px;
  background: #111;
  transform: translate(-50%, -50%);
}

/* 縦棒 */
.detail__icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* 開いたとき：＋ → − */
.faq__question.is-open .detail__icon::after {
  transform: translate(-50%, -50%) rotate(0deg);
}


/* 回答 */
.faq__answer {
  display: none;
  margin: 0;
  background: #fff;
}

/* 回答が開いている状態 */
.faq__answer.is-open {
  display: block;
  background: #fff;
  border-radius: 0 0 40px 40px;
  margin-top: -60px;
  padding-top: 60px;
}

.faq__answer-inner {
  padding: 25px 40px 40px;
}

.faq__answer-text {
  margin: 0;
  font-size: 1.5rem;
  line-height: 1.5;
}


/* その他のよくある質問はこちら */
.faq .link-container {
  margin-top: 30px;
  text-align: center;
}

.faq .button {
  display: inline-block;
  padding: 14px 40px;
  border: 1px solid #111;
  background: #fff;
  color: #111;
  text-decoration: none;
  font-size: 14px;
  line-height: 1.5;
}


/* FAQ - スマートフォン */
@media (max-width: 767px) {

  .faq {
    padding: 40px 40px;
  }

  .faq__title {
    margin-bottom: 0;
    font-size: 1.8rem;
  }

  .faq__title img {
    width: 150px;
    transform: translateX(15px);
    margin-top: 10px; 
  }

  .faq .service,
  .faq .campaign {
    margin-bottom: 40px;
  }

  .faq__title-lv03 {
    margin-bottom: 15px;
    font-size: 1.5rem;
  }

  .faq__question {
    padding: 30px 60px 30px 20px;
    font-size: 1.25rem;
    border-radius: 40px;
  }

  .detail__icon {
    right: 15px;
  }

  .faq__answer {
    border-radius: 0;
  }

  .faq__answer-inner {
    padding: 20px 35px 35px;
  }

  .faq__answer-text {
    font-size: 0.9375rem;
  }

  .faq .button {
    width: 100%;
    padding: 14px 20px;
  }
}
/* --- /faq --- */

/* --- ポップアップボタン --- */
.popup-section {
  position: relative;
}

.popup-trigger {
  position: absolute;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

.popup-trigger img {
  display: block;
  height: auto;
}

/* 詳細ボタン① */
.popup-trigger01 {
  width: 6%;
  right: 13%;
  top: 24.5%;
}

/* 詳細ボタン② */
.popup-trigger02 {
  width: 6%;
  right: 13%;
  top: 89%;
}

/* 詳細ボタン②用注釈 */
.price-list-note {
  margin-top: 15px;
  padding: 0 20px;
  font-size: 14px;
  line-height: 1.6;
  color: #666;
}

.price-list-note p {
  margin: 0;
}

.price-list-note p + p {
  margin-top: 5px;
}

/* 詳細ボタン③ */
.popup-trigger03 {
  position: absolute;
  width: 6%;
  right: 8.5%;
  bottom: 1.7%;
}

/* --- ポップアップCSS --- */
.popup {
  display: none;
  position: fixed;
  z-index: 99999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* 表示状態 */
.popup.is-open {
  display: block;
}

/* ポップアップ用背景 */
.popup-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}

/* ポップアップ本体 */
.popup-content {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 90%;
  max-height: 90vh;
  transform: translate(-50%, -50%);
  background: #fff;
  overflow-y: auto;
  border-radius: 40px;
}

/* 閉じるボタン */
.popup-close {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 2;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #c3c3c3;
  color: #5e5e5e;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}

.popup-body {
  padding: 40px 40px;
}

.popup-body img {
  display: block;
  width: 100%;
  height: auto;
}
/* --- ポップアップ内共通画像 --- */
.popup-common {
  padding-top: 30px;
  padding-bottom: 40px;
}
.popup-common img {
  width: 80%;
  margin: 0 auto;
}
/* --- ポップアップ内タブ --- */
.popup-tabs {
  display: flex;
  width: 100%;
  margin-bottom: 30px;
}

.popup-tab {
  flex: 1;
  padding: 15px 15px;
  border: none;
  background: #eee;
  font-size: 1.25rem;
  font-weight: bold;
  cursor: pointer;
}

/* 選択中のタブ */
.popup-tab.is-active {
  background: #fa7e01;
  color: #fff;
}

/* --- タブの内容 --- */
.popup-panel {
  display: none;
  margin-top: 50px;
  margin-bottom: 40px;
}
.popup-panel img {
  width: 85%;
  margin: 0 auto;
}

/* 選択中の内容だけ表示 */
.popup-panel.is-active {
  display: block;
}

/* --- お得額グラフのポップアップ内コンテンツ --- */
.popup-text-title {
  margin-bottom: 20px;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
}

.popup-text-body {
  margin-bottom: 20px;
  font-size: 1rem;
  line-height: 1.8;
  text-align: center;
}

.popup-text-highlight {
  margin: 20px 0;
  padding: 15px;
  background: #fff6ee;
  border-radius: 20px;
  text-align: center;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.2;
  color: #ff7e00;
}

.popup-text-total {
  margin-bottom: 20px;
  color: #ff7e00;
  font-weight: 700;
}

.popup-order-list {
  padding-left: 1.5em;
  margin-bottom: 20px;
}

.popup-order-list li {
  margin-bottom: 12px;
  font-size: 1rem;
  line-height: 1.7;
}

.popup-note-list {
  list-style: none;
  padding: 0;
}

.popup-note-list li {
  position: relative;
  padding-left: 1.2em;
  font-size: 0.8rem;
  color: #777;
  line-height: 1.6;
}

.popup-note-list li::before {
  content: "・";
  position: absolute;
  left: 0;
}

@media (max-width: 767px) {
  .popup-text-title {
    font-size: 1.4rem;
    line-height: 1.4;
  }
  .popup-text-body,
  .popup-order-list li {
    font-size: 0.9rem;
  }
}

.popup-note-list--plain li::before {
  content: none;
}

.popup-note-list--plain li {
  padding-left: 0;
}

.popup-trigger04 {
  left: 32%;
  top: 60.5%;
  width: 3%;
}

.popup-trigger05 {
  left: 32%;
  top: 69.5%;
  width: 3%;
}

.popup-trigger06 {
  left: 32%;
  top: 77.5%;
  width: 3%;
}
/* --- /お得額グラフのポップアップ内コンテンツ --- */

.popup-trigger07 {
  width: 6%;
  right: 13%;
  top: 62.5%;
}
/* --- /ポップアップCSS --- */


/* --- 申し込みポップアップ --- */
.service-select-popup {
  max-width: 700px;
}

.service-select-popup .popup-body {
  padding: 60px 60px;
  margin: 20px 0;
}

.service-select-title {
  margin-bottom: 35px;
  text-align: center;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.6;
  color: #333;
}

.service-select-buttons {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.service-select-button {
  width: 100%;
  padding: 30px 25px;
  border: none;
  border-radius: 10px;
  background: #FF7E00;
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.5;
  cursor: pointer;
}

.service-select-button:hover {
  opacity: 0.8;
}


/* スマートフォン */

@media (max-width: 767px) {

  .service-select-popup {
    width: 90%;
  }

  .service-select-popup .popup-body {
    padding: 50px 20px 30px;
  }

  .service-select-title {
    margin-bottom: 25px;
    font-size: 18px;
  }

  .service-select-button {
    padding: 16px 15px;
    font-size: 15px;
  }

}
/* --- /申し込みポップアップ --- */

/* --- キャンペーン適用条件 アコーディオン --- */
.campaign-conditions {
  background: #f4f4f4;
  padding: 60px 40px;
  font-size: 16px;
  line-height: 1.6;
  color: #666;
}

.campaign-conditions__inner {
  max-width: 980px;
  margin: 0 auto;
}

.campaign-conditions__title {
  margin-bottom: 40px;
  text-align: center;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.4;
  color: #000;
}

/* 通常の項目 */
.campaign-conditions__box {
  padding: 0;
  margin-bottom: 30px;
}

.campaign-conditions__box-title {
  margin-bottom: 15px;
  font-size: 20px;
  font-weight: 700;
  color: #333;
}

.campaign-conditions__box p {
  margin-bottom: 10px;
}

/* アコーディオンボタン */
.campaign-accordion-button {
  position: relative;
  display: block;
  width: 100%;
  padding: 20px 60px 20px 20px;
  border: 0;
  background: #fff;
  color: #333;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
  border-radius: 6px;
}

/* ＋／−アイコン */
.campaign-accordion-icon {
  position: absolute;
  top: 50%;
  right: 20px;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
}

.campaign-accordion-icon::before,
.campaign-accordion-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 2px;
  background: #111;
  transform: translate(-50%, -50%);
}

/* 縦棒 */
.campaign-accordion-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* 開いたら「＋」→「−」 */
.campaign-accordion-button.is-open .campaign-accordion-icon::after {
  transform: translate(-50%, -50%) rotate(0deg);
}

/* 開閉する中身 */
.campaign-accordion-content {
  display: none;
  background: #fff;
  padding: 25px;
  border-radius: 0 0 6px 6px;
}

/* 開いた状態 */
.campaign-accordion-content.is-open {
  display: block;
}

/* 中身の見出し */
.campaign-accordion-content h3 {
  margin: 25px 0 10px;
  font-size: 20px;
  font-weight: 700;
  color: #333;
}

.campaign-accordion-content h3:first-child {
  margin-top: 0;
}

/* リスト */
.campaign-accordion-content ul,
.campaign-accordion-content ol {
  padding-left: 1.5em;
  margin: 10px 0;
}

.campaign-accordion-content li {
  margin-bottom: 8px;
}

/* スマートフォン */
@media (max-width: 767px) {

  .campaign-conditions {
    padding: 40px 40px;
    font-size: 14px;
  }

  .campaign-conditions__title {
    margin-bottom: 30px;
    font-size: 26px;
  }

  .campaign-conditions__box {
    margin-bottom: 15px;
  }

  .campaign-conditions__box-title {
    font-size: 18px;
  }

  .campaign-accordion-button {
    padding: 18px 50px 18px 15px;
    font-size: 15px;
  }

  .campaign-accordion-icon {
    right: 15px;
  }

  .campaign-accordion-content {
    padding: 20px 15px;
  }

  .campaign-accordion-content h3 {
    font-size: 17px;
  }

}
/* --- /キャンペーン適用条件 アコーディオン --- */

/* --- ページ下部ボタン --- */
.page-tools {
  width: 100%;
  padding: 40px 20px;
  background: #f4f4f4;
}

.page-tools__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;

  width: 100%;
  max-width: 700px;
  margin: 0 auto;
}

/* --- ページトップ --- */
.page-tools__top {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 120px;
  height: 120px;

  padding: 0;
  border: none;
  background: none;

  cursor: pointer;
}

.page-tools__top img {
  display: block;
  width: 56px;
  height: auto;
  max-width: 100%;
}


/* --- QRコード --- */
.page-tools__qr {
  width: 150px;
  max-width: 100%;
  aspect-ratio: 1 / 1;
}

.page-tools__qr img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* --- ページ下部 リンクコピーボタン --- */
.page-tools__copy {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;

  width: 350px;
  height: 110px;

  padding: 0;

  border: none;
  border-radius: 10px;

  background: #959595;
  color: #fff;

  font-size: 16px;
  font-weight: 500;

  cursor: pointer;
  overflow: hidden;
}

.page-tools__copy-icon {
  width: 14px;
  height: 14px;
  object-fit: contain;
  flex-shrink: 0;
}

.page-tools__copy-text {
  color: #fff;
  font-size: 20px;
  line-height: 1;
}

@media (max-width: 700px) {

  .page-tools {
    padding: 30px 15px;
  }

  .page-tools__inner {
    gap: 10px;
  }

  /* ページトップ */
  .page-tools__top {
    width: 90px;
    height: 90px;
  }

  .page-tools__top img {
    width: 45px;
    height: auto;
    max-width: 100%;
}

  /* QRコード */
  .page-tools__qr {
    width: 110px;
    height: 110px;
  }

  /* リンクコピー */
  .page-tools__copy {
    width: 280px;
    height: 90px;
  }

  .page-tools__copy-text {
    font-size: 16px;
  }

}

@media (max-width: 550px) {

  .page-tools {
    padding: 25px 10px;
  }

  .page-tools__inner {
    gap: 5px;
  }

  /* ページトップ */
  .page-tools__top {
    width: 70px;
    height: 70px;
  }

  .page-tools__top img {
    width: 40px;
    height: auto;
  }

  /* QRコード */
  .page-tools__qr {
    width: 90px;
    height: 90px;
  }

  /* リンクコピー */
  .page-tools__copy {
    width: 230px;
    height: 75px;
  }

  .page-tools__copy-text {
    font-size: 14px;
  }

  .page-tools__copy-icon {
    width: 12px;
    height: 12px;
  }

	/* BP追記 */
	
	main#str-contents {
	   padding: 0;
	}


}
/* --- /ページ下部ボタン --- */

/* BP追記 */
a .pdficon,a .newwindowicon{
	display: none;
}