@charset "UTF-8";
/*
    Template: swell
    Theme Name: 株式会社リフォーム屋
    Theme URI: https://swell-theme.com/
    Description: 株式会社リフォーム屋
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/
/*Break point*/
/*SP*/
/*tablet*/
/**PC**/
/*SWELL標準アコーディオンへの追加*/
.c-scrollHint span {
  color: #003705;
  font-weight: bold;
  font-size: 1.25rem;
}

.swell-block-accordion__title .swell-block-accordion__label {
  font-size: 1.25rem !important;
  text-align: center !important;
}
.swell-block-accordion__title .swell-block-accordion__icon {
  font-size: 1.5rem;
}

/*光るアニメーション**/
.glow-diagonal {
  position: relative;
  display: inline-block;
  overflow: hidden;
  padding: 1em 2em;
  border-radius: 8px;
}

.glow-diagonal::before {
  content: "";
  position: absolute;
  background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);
  transform: rotate(0deg);
  animation: diagonal-glow 2.5s infinite;
}

@keyframes diagonal-glow {
  0% {
    transform: translateX(-100%) translateY(-100%) rotate(45deg);
  }
  100% {
    transform: translateX(100%) translateY(100%) rotate(45deg);
  }
}
/* =====================================
  ボタン＆リンクのホバーアクション統一
===================================== */
.button, .btn, a.button, a.btn {
  transition: all 0.3s ease;
  transform: scale(1);
}
.button:hover, .btn:hover, a.button:hover, a.btn:hover {
  transform: scale(1.05);
  background-color: #00c256;
  color: #009944;
}

a:not(.button):not(.btn) {
  transition: color 0.3s ease, transform 0.3s ease;
}
a:not(.button):not(.btn):hover {
  transform: scale(1.02);
}

/*SWELLの標準デザインBTN*/
.is-style-btn_line a:hover {
  color: #f8faf5 !important;
  font-weight: 900 !important;
  transform: scale(1.1) !important;
}

/* =====================================
 サイト全体のフォント設定
===================================== */
html {
  font-family: "M PLUS 1p", sans-serif !important;
  font-weight: 400;
}

/* 特定タグへの上書き（必要な場合のみ） */
h1, h2, h3, h4, h5, h6,
p, li, ul, ol, a, strong, menu, div {
  /*  font-family: inherit !important;*/
  font-family: "M PLUS 1p", sans-serif !important;
}

/*SPメニュー*/
.p-spMenu a ::hover {
  color: #fedb63 !important;
}

/* =====================================
 全サイト共通 parts
===================================== */
.contents_box,
.top .contents_box {
  margin: 0 auto !important;
  padding-top: 0 !important;
}

#content,
.top #content {
  padding-top: 0 !important;
  margin: 0 auto !important;
}

/* =====================================
 各ページ共通 ヘッダータイトル
===================================== */
h1.original-pagetitle {
  display: block !important;
  padding: 2% !important;
  text-align: center !important;
  background: #a5d4ad !important;
  color: #003705 !important;
  letter-spacing: 0.15em !important;
  font-weight: 900;
  text-shadow: 1px 1px 0 #f8faf5, -1px -1px 0 #f8faf5, -1px 1px 0 #f8faf5, 1px -1px 0 #f8faf5, 0 1px 0 #f8faf5, 0 -1px 0 #f8faf5, -1px 0 0 #f8faf5, 1px 0 0 #f8faf5;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  h1.original-pagetitle {
    font-size: 6vw;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  h1.original-pagetitle {
    font-size: 6vw;
  }
}
@media only screen and (min-width: 1024px) {
  h1.original-pagetitle {
    font-size: 2vw;
  }
}

/* =====================================
 投稿タイトル非表示（ヘッダー内のみ）
===================================== */
#main_content .l-mainContent__inner h1.c-pageTitle {
  display: none !important;
}

/* ================================
 Header Logo（ヘッダーロゴ）
================================= */
.l-header__logo {
  text-align: start;
  margin: 2%;
}
@media screen and (min-width: 960px) {
  .l-header__logo {
    display: none;
  }
}

/* ================================
 ヘッダーメニュー お問い合わせアイコン
================================= 
  /*ヘッダーメニューPCでのサブメニュー背景*/
.c-gnav li.menu-item ul.sub-menu {
  font-weight: 900 !important;
}
.c-gnav li.menu-item ul.sub-menu li.menu-item {
  background-color: #009944 !important;
  color: #f7e100 !important;
}
.c-gnav li.menu-item ul.sub-menu li.menu-item ::hover {
  background-color: #003705 !important;
}
.c-gnav li.menu-item ul.sub-menu li.menu-item a {
  background-color: #009944 !important;
  color: #f7e100 !important;
}
.c-gnav li.menu-item ul.sub-menu li.menu-item a ::hover {
  background-color: #003705 !important;
}

.c-gnav {
  font-weight: 600;
}

.l-fixHeader__inner {
  font-weight: 600;
}

/* 7カラムレイアウト */
.seven-columns-container {
  width: 100vw;
  margin: 1.83vw 1.04vw 0.3vw 1.04vw !important;
  /* 35px/20pxをvwに変換 */
  background-color: #f8faf5 !important;
  position: relative;
}
.seven-columns-container > div {
  height: 100%;
  display: flex;
  align-items: center !important;
}

@media only screen and (min-width: 1700px) {
  .seven-columns-container > div {
    align-items: center !important;
  }
}
@media screen and (min-width: 960px) and (max-width: 1024px) {
  .seven-columns-container {
    display: none !important;
  }
}
.column-a {
  width: 18.4vw;
  /* 352px/1998px */
  height: 3.8vw;
  margin-right: 1.05vw;
  /* 21px/1998px */
  font-weight: 900;
  margin-top: 0.55vw;
}
.column-a .sentence {
  font-size: 1.3rem !important;
  font-weight: 900 !important;
  background-color: #a5d4ad !important;
}
.column-a .sentence span {
  font-size: 2.25rem !important;
}
.column-a .textbox {
  font-size: 1.25rem !important;
  font-weight: 900 !important;
}

.column-b {
  width: fit-content;
  height: 3.8vw;
  font-weight: 900;
  margin: auto 0;
  position: absolute;
  left: 20.01vw;
}
.column-b .sentence {
  display: block;
  text-align: center;
  font-size: 1rem;
  margin-bottom: 0px;
  height: 2.16vw;
  margin-top: 0.55vw;
  color: #003705 !important;
}
.column-b .textbox {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #003705;
  font-size: 0.7rem;
  height: 2.1vw;
  margin: 0 auto;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.column-b .textbox a {
  color: #ffe500;
}
.column-b .textbox:hover {
  background-color: #f7e100;
}
.column-b .textbox:hover a {
  color: #003705;
}

@media only screen and (min-width: 1700px) {
  .column-b {
    height: 4.26vw;
  }
  .column-b .textbox {
    height: 2.1vw;
  }
  .column-b .sentence {
    height: 2.16vw;
  }
}
.column-c {
  width: 7.9vw;
  height: 3.8vw;
  position: absolute;
  left: 30.7vw;
  margin: auto 0;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 900;
  background-color: #f7e100;
}
.column-c .wp-block-group {
  margin-bottom: 0 !important;
}
.column-c .sentence {
  font-size: 1.2rem;
  height: 2.16vw;
  color: #003705 !important;
}
.column-c .textbox {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #003705;
  font-size: 1.2rem;
  height: 2.1vw;
  margin: 0 auto;
  /* 43px/1998px */
}

@media only screen and (min-width: 1700px) {
  .column-c {
    left: 28.7vw;
    height: 4.26vw;
  }
  .column-c .textbox {
    height: 2.1vw;
  }
  .column-c .sentence {
    height: 2.16vw;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .column-c {
    width: 8.9vw;
    left: 32.7vw;
  }
  .column-c .textbox {
    font-size: 1rem;
  }
  .column-c .sentence {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
  .column-c {
    width: 8.9vw;
    left: 34.7vw;
  }
  .column-c .textbox {
    font-size: 1rem;
  }
  .column-c .sentence {
    font-size: 1rem;
  }
}
.column-d {
  width: 7.9vw;
  height: 3.8vw;
  position: absolute;
  left: 39.3vw;
  margin: auto 0;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 900;
  background-color: #f7e100;
}
.column-d .wp-block-group {
  margin-bottom: 0 !important;
}
.column-d .textbox {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background-color: #003705;
  font-size: 1.2rem;
  height: 2.16vw;
  margin: 0 auto;
}
.column-d .sentence {
  height: 2.1vw;
  color: #003705 !important;
}

@media only screen and (min-width: 1700px) {
  .column-d {
    left: 37.3vw;
    height: 4.26vw;
  }
  .column-d .textbox {
    height: 2.1vw;
  }
  .column-d .sentence {
    height: 2.16vw;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .column-d {
    width: 8.9vw;
    left: 42.3vw;
  }
  .column-d .textbox {
    font-size: 1rem;
  }
  .column-d .sentence {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
  .column-d {
    width: 8.9vw;
    left: 44.3vw;
  }
  .column-d .textbox {
    font-size: 1rem;
  }
  .column-d .sentence {
    font-size: 1rem;
  }
}
/* A-DとE-Gの間の余白 */
.column-d::after {
  content: "";
  position: absolute;
  right: 0;
  width: 19.6vw;
  /* 375px/1998px */
  height: 100%;
  background: transparent;
}

/* ===============================================
   汎用ボタンパーツ .column-e のスタイル定義
   -----------------------------------------------
   特徴：絶対位置、Flex中央配置、ホバーアニメあり
   用途：主にコールトゥアクションや目立たせたいリンク
=============================================== */
.column-e {
  position: absolute;
  right: 27.1vw;
  width: max-content;
  max-width: 19.6vw;
  height: auto;
  margin: auto 0;
  padding: 0.5% 0.5%;
  border: 1px solid #009944;
  border-radius: 1vw;
  background-color: #003705;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-weight: 900;
  font-size: 1.25rem;
  letter-spacing: 0.1em;
  transition: all 0.3s ease;
}
.column-e a {
  color: #f8faf5;
}
.column-e .text {
  text-align: center;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  font-weight: 900;
  margin-top: -10px !important;
  color: #003705;
}
.column-e .text:hover {
  color: #f7e100 !important;
}
.column-e:hover {
  color: #f7e100 !important;
}
.column-e .call {
  padding-bottom: 0.25rem;
}
.column-e .call:hover {
  color: #f7e100 !important;
}
.column-e:hover {
  background-color: #009944;
}
.column-e:hover a {
  color: #f7e100 !important;
}

/* -----------------------------------------------
   メディアクエリ：PC幅（幅広ディスプレイ対応）
   ブレイクポイント：media_pc5()
----------------------------------------------- */
@media only screen and (min-width: 1700px) {
  .column-e {
    display: block;
    padding: 0.5% 0.5%;
    right: 19.1vw;
  }
  .column-e .call {
    font-size: 1.5rem;
    letter-spacing: 0.05em;
  }
  .column-e .text {
    font-size: 0.8rem;
    letter-spacing: 0.05em;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1699px) {
  .column-e {
    width: 16.7vw;
    right: 20.6vw;
    font-size: 1rem;
  }
}
/* -----------------------------------------------
   メディアクエリ：PC中幅
   ブレイクポイント：media_pc3()
----------------------------------------------- */
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .column-e {
    width: 16.7vw;
    right: 25vw;
    font-size: 1rem;
  }
}
/* -----------------------------------------------
   メディアクエリ：PC小幅
   ブレイクポイント：media_pc2()
----------------------------------------------- */
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
  .column-e {
    width: 19.7vw;
    height: 4.8vw;
    right: 26.1vw;
    font-size: 0.9rem;
    border-radius: 0;
  }
}
.column-f {
  display: flex;
  align-content: center;
  justify-content: center;
  align-items: center;
  width: 5.6vw;
  height: 3.8vw;
  font-weight: 900 !important;
  margin: auto 0;
  /*border: $color-main-dark 2px solid;*/
  color: #003705;
  text-align: center;
  border-radius: 6%;
  position: absolute;
  right: 20vw;
}
.column-f .textbox {
  display: block;
  font-size: 0.75rem;
  line-height: 1.25;
  padding: 9%;
}

@media only screen and (min-width: 1700px) {
  .column-f {
    left: 75.7vw;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .column-f {
    right: 24vw;
    font-size: 0.8rem;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
  .column-f {
    display: none;
  }
}
.column-g {
  width: 19.2vw;
  height: 3.8vw;
  border-radius: 0.3vw;
  font-weight: 900;
  margin-top: 0.55vw;
  margin: 0 !important;
  position: absolute;
  right: 1vw;
  /*.swell-block-button .__icon:not(.-right) {

  }*/
}
.column-g a.swell-block-button__link {
  height: 3.8vw !important;
}

@media only screen and (min-width: 1700px) {
  .column-g {
    margin: 0 !important;
    width: auto;
    right: 3vw;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .column-g {
    width: 22.2vw;
    right: 2vw;
  }
}
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
  .column-g {
    width: 23vw;
    height: 4.8vw;
    right: 2vw;
    display: flex;
    align-items: center;
  }
  .column-g .swl-fz {
    font-size: 0.85rem !important;
  }
}
/*ヘッダーメニューここまで*/
/* =====================================
ヘッダーコピー部分（メニュー）
===================================== */
.l-header__bar {
  padding: 0.5%;
}

.headertop-catchcopy {
  display: block;
  position: relative;
  top: 0;
}
.headertop-catchcopy p {
  color: #f8faf5;
  font-weight: bold;
  width: max-content;
}
.headertop-catchcopy p strong a {
  font-size: 0.75rem;
  color: #f8faf5;
  transition: letter-spacing 0.6s cubic-bezier(0.25, 0.1, 0.25, 1);
}
.headertop-catchcopy p strong a:hover {
  letter-spacing: 0.15em;
  color: #f7e100 !important;
}
.headertop-catchcopy p strong a:visited, .headertop-catchcopy p strong a:active {
  color: #f8faf5;
}

/*サイト内共有パーツ*/
/* =======================================
  トラブルアーカイブエリア
======================================= */
.archive-box-trouble .maintext {
  margin: 0 auto;
  font-weight: 900;
  display: block;
  width: fit-content;
  text-overflow: ellipsis;
}
@media only screen and (min-width: 1024px) {
  .archive-box-trouble .maintext {
    font-size: 1.75vw;
    letter-spacing: 0.2em;
    max-width: 60vw;
    white-space: nowrap;
    text-align: center;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .archive-box-trouble .maintext {
    font-size: 1.25rem !important;
    letter-spacing: 0.1em !important;
    max-width: 90vw;
    white-space: normal;
    text-align: start !important;
  }
}
.archive-box-trouble .subtext {
  display: flex;
  width: fit-content;
  margin: 0 auto;
  font-size: 2vw;
  font-weight: 900;
  letter-spacing: 0.15em;
}
.archive-box-trouble .thirdtext {
  display: flex;
  width: fit-content;
  margin: 0 auto;
  font-size: 1.5vw;
  font-weight: 900;
}
.archive-box-trouble .itembox a {
  color: #003705;
}
.archive-box-trouble .itembox a:hover {
  color: #009944;
}
.archive-box-trouble .itembox img {
  border-radius: 1rem;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.archive-box-trouble .itembox img:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
.archive-box-trouble .itembox p {
  font-weight: 900 !important;
  font-size: 1.25rem;
  transition: text-shadow 0.3s ease;
}

@media only screen and (min-width: 1700px) {
  .archive-box-trouble .maintext {
    font-size: 1.75vw;
  }
  .archive-box-trouble .subtext {
    font-size: 1.75vw;
  }
  .archive-box-trouble .thirdtext {
    font-size: 1.5vw;
  }
  .archive-box-trouble .itembox p {
    color: #83c362;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .archive-box-trouble .maintext,
  .archive-box-trouble .subtext,
  .archive-box-trouble .thirdtext {
    font-size: 1.7rem;
    white-space: normal;
    overflow: auto;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .archive-box-trouble .maintext,
  .archive-box-trouble .subtext {
    font-size: 1.7rem;
    white-space: normal;
    overflow: auto;
  }
  .archive-box-trouble .thirdtext {
    font-size: 1.5rem;
    white-space: normal;
    overflow: auto;
  }
  .archive-box-trouble .thirdtext span {
    font-size: 1.7rem !important;
  }
}
/* ================================
サイト内共通一覧ボタン 
================================= */
.btn-common-archive-yellow a {
  font-size: 16px;
  font-weight: 900 !important;
  letter-spacing: 1px;
  padding: 13px 20px;
  outline: 0;
  border: 1px solid #003705;
  cursor: pointer;
  position: relative;
  background-color: transparent;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  color: #003705;
}
.btn-common-archive-yellow a::after {
  content: "";
  background-color: #f7e100;
  width: 100%;
  height: 100%;
  z-index: -1;
  position: absolute;
  top: 7px;
  left: 7px;
  transition: 0.2s;
}
.btn-common-archive-yellow a:hover::after {
  top: 0;
  left: 0;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .btn-common-archive-yellow {
    width: 81vw;
    margin: 1vw auto 6vw auto !important;
    display: flex !important;
    justify-content: center !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .btn-common-archive-yellow {
    width: 81vw;
    margin: 1vw auto 6vw auto !important;
    display: flex !important;
    justify-content: center !important;
  }
}
@media only screen and (min-width: 1024px) {
  .btn-common-archive-yellow {
    width: fit-content;
    margin: 0 auto !important;
    display: block !important;
  }
}

.not_hovertest a {
  color: var(--the-btn-color) !important;
}
.not_hovertest .swell-block-button__link .b .is-style-btn_line a:hover {
  color: white !important;
}
.not_hovertest .swell-block-button__link .c .is-style-btn_line a:hover {
  color: white !important;
}
.not_hovertest .a .swell-block-button__link {
  color: #003705 !important;
}

.btn-common-archive-blue { /* サイト内共通一覧ボタン Blue vet */
  font-size: 16px;
  font-weight: 900 !important;
  letter-spacing: 1px;
  padding: 13px 20px;
  outline: 0;
  border: 1px solid #003705;
  cursor: pointer;
  position: relative;
  background-color: transparent;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .btn-common-archive-blue {
    margin: 1vw auto 6vw auto !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .btn-common-archive-blue {
    margin: 1vw auto 6vw auto !important;
  }
}
@media only screen and (min-width: 1024px) {
  .btn-common-archive-blue {
    margin: 0 auto;
  }
}
.btn-common-archive-blue a {
  text-decoration: none;
  color: transparent !important;
}
.btn-common-archive-blue a strong {
  color: white !important;
}
.btn-common-archive-blue::after {
  content: "";
  background-color: #003705;
  width: 100%;
  height: 100%;
  z-index: -1;
  position: absolute;
  top: 7px;
  left: 7px;
  transition: 0.2s;
}
.btn-common-archive-blue:hover::after {
  top: 0;
  left: 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .btn-common-archive-blue {
    width: 81vw;
    display: block !important;
    font-size: 1rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .btn-common-archive-blue {
    width: 81vw;
    display: block !important;
    font-size: 1rem;
  }
}
@media only screen and (min-width: 1024px) {
  .btn-common-archive-blue {
    width: fit-content;
    display: block !important;
  }
}

/* ================================
 汎用：汎用h2box
================================= */
.header-box-blue {
  display: block;
  width: 60vw;
  margin: 0 auto;
  padding: 0px 3%;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .header-box-blue {
    width: 90vw;
    margin: 0 auto;
    display: contents;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .header-box-blue {
    width: 90vw;
    margin: 0 auto;
    display: contents;
  }
}

.archive-box-blue {
  background-color: #003705;
  display: block;
  width: fit-content;
  padding: 1% 2%;
}
.archive-box-blue p {
  color: #f7e100;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .archive-box-blue p {
    margin: 0 auto;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .archive-box-blue p {
    margin: 0 auto;
  }
}

/*各商品のタブ展開先の見出し*/
.h_shopitemtab {
  display: block;
  padding: 1% 2%;
}
.h_shopitemtab p {
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .h_shopitemtab p {
    margin: 0 auto;
    padding: 2% 3%;
    width: auto;
    font-size: 1.25rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .h_shopitemtab p {
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .h_shopitemtab p {
    width: fit-content;
    font-size: 1.5rem;
  }
}

/*汎用テキストボックス*/
.pre_contentsbox {
  text-align: justify;
  display: block;
  width: fit-content;
  font-weight: 600;
  margin: 0 auto;
  letter-spacing: 0.1em;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .pre_contentsbox {
    max-width: 80vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .pre_contentsbox {
    max-width: 80vw;
  }
}
@media only screen and (min-width: 1024px) {
  .pre_contentsbox {
    max-width: 60vw;
  }
}

/* ================================
 汎用：サービスエリア
================================= */
.common-servicearea {
  width: 74vw;
  margin: 0 auto;
}
.common-servicearea h2 {
  display: flex;
  width: fit-content;
  font-weight: 900;
  white-space: nowrap;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common-servicearea h2 {
    font-size: 1.9rem;
    white-space: normal;
    overflow: visible;
    text-align: center;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common-servicearea h2 {
    font-size: 1.9rem;
    white-space: normal;
    overflow: visible;
    text-align: center;
  }
}
@media only screen and (min-width: 1024px) {
  .common-servicearea h2 {
    font-size: 2.75vw;
  }
}
.common-servicearea .areabox {
  width: fit-content;
  padding: 4%;
  border-radius: 2%;
}

/* ================================
 汎用CTA：.cta-box-3column
=============================== */
.cta-box-3column {
  /* ---------------------------------
     タイトルブロック（h2＋補足p-box）
  --------------------------------- */
  /* ---------------------------------
     メインの3カラムテキストブロック
  --------------------------------- */
  /* ---------------------------------
     ステップボックス（アイコン＋説明）
  --------------------------------- */
  /* ---------------------------------
     CTAボタン（共通スタイル）
  --------------------------------- */
}
.cta-box-3column .p-box {
  display: block;
  margin: 0 auto;
  width: fit-content;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .p-box {
    max-width: 80vw !important;
    text-align: justify;
    ext-align-last: start;
    text-justify: inter-ideograph;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .p-box {
    width: 80vw !important;
  }
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .p-box {
    max-width: 60vw !important;
    text-align: justify !important;
  }
}
.cta-box-3column .title h2 {
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.2em;
  width: fit-content;
  margin: 0 auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .title h2 {
    font-size: 1.65rem;
    max-width: 90vw;
    letter-spacing: 0.2em;
    text-align: justify;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .title h2 {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .title h2 {
    font-size: 2.7vw !important;
    display: flex;
  }
}
.cta-box-3column .textcolumn-box {
  display: block;
  width: fit-content;
  margin: 0 auto;
  padding: 0.5% 2%;
  border-radius: 0.4rem;
  background-color: #f5a623 !important;
  color: #f8faf5 !important;
  font-weight: 900 !important;
  text-align: center !important;
  letter-spacing: 0.1em;
}
.cta-box-3column .textcolumn-box .swell-block-column {
  margin-left: 0 !important;
}
.cta-box-3column .textcolumn-box .swell-block-columns__inner {
  justify-content: space-evenly !important;
}
.cta-box-3column .textcolumn-box .has-white-color {
  color: #003705 !important;
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .textcolumn-box {
    font-size: 1.7vw !important;
    width: 60vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .textcolumn-box {
    font-size: 2rem !important;
    width: 80vw;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .textcolumn-box {
    font-size: 2rem !important;
    width: 80vw;
  }
}
.cta-box-3column .stepbox {
  margin: 0 auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .stepbox {
    width: 80vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .stepbox {
    width: 80vw;
  }
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .stepbox {
    width: 60vw;
    max-height: 70vh;
  }
}
.cta-box-3column .stepbox .wp-block-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 0.4rem;
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .stepbox .wp-block-column {
    position: relative;
  }
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .stepbox .wp-block-column {
    position: relative;
  }
  .cta-box-3column .stepbox .wp-block-column::after {
    content: "▶";
    position: absolute;
    top: 50%;
    right: -1rem;
    transform: translateY(-50%) rotate(1deg);
    font-size: 3rem;
    color: #009944;
    opacity: 0.8;
    pointer-events: none;
  }
  .cta-box-3column .stepbox .wp-block-column:last-child::after {
    display: none;
  }
}
.cta-box-3column .stepbox .box {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2%;
  margin-bottom: -4vw;
  border-radius: 4%;
  background: #f8faf5;
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .stepbox .box {
    background-color: transparent !important;
  }
}
.cta-box-3column .stepbox .box .contents {
  position: relative;
  top: -4vw;
  transform: translateX(-1%);
}
.cta-box-3column .stepbox .box .contents .circle {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  border: 4px solid #f8faf5;
  border-radius: 50%;
  background-color: transparent;
  width: 6.15vw;
  height: 6.15vw;
  top: 0;
  left: 0;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .stepbox .box .contents .circle {
    width: 30vw;
    height: 30vw;
    top: 5vw;
    left: -24vw;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .stepbox .box .contents .circle {
    width: 30vw;
    height: 30vw;
    top: 5vw;
    left: -24vw;
  }
}
.cta-box-3column .stepbox .box .contents .circle .num,
.cta-box-3column .stepbox .box .contents .circle .text {
  display: flex;
  width: fit-content;
  margin: 0 auto;
  font-weight: 900;
  color: #f8faf5 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.1em !important;
  line-height: 1.8;
}
.cta-box-3column .stepbox .box .contents .circle .num {
  font-size: 2vw !important;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .stepbox .box .contents .circle .num {
    font-size: 10vw !important;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .stepbox .box .contents .circle .num {
    font-size: 10vw !important;
  }
}
.cta-box-3column .stepbox .box .contents .circle .text {
  color: #83c362;
  margin-bottom: -1rem !important;
  font-size: 1vw !important;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .stepbox .box .contents .circle .text {
    font-size: 5vw !important;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .stepbox .box .contents .circle .text {
    font-size: 5vw !important;
  }
}
.cta-box-3column .stepbox .box .contents .icon {
  margin-top: 1rem !important;
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .stepbox .box .contents .icon img {
    object-fit: contain;
    width: 200px !important;
  }
}
.cta-box-3column .stepbox .box .contents .text {
  display: block;
  width: fit-content;
  margin: 0 auto;
  font-weight: 900;
  color: #009944;
  letter-spacing: 0.2em;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .stepbox .box .contents .text {
    font-size: 2rem !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .stepbox .box .contents .text {
    font-size: 10vw !important;
  }
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .stepbox .box .contents .text {
    font-size: 2.7vw !important;
  }
}
.cta-box-3column .ctabtn {
  margin: 0 auto;
  font-weight: 900;
  background-color: #f7e100;
  transition: background-color 0.3s ease;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .cta-box-3column .ctabtn {
    width: 80vw;
    font-size: 5vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .cta-box-3column .ctabtn {
    width: 80vw;
    font-size: 5vw;
  }
}
@media only screen and (min-width: 1024px) {
  .cta-box-3column .ctabtn {
    width: auto;
    font-size: 1.25vw;
  }
}
.cta-box-3column .ctabtn:hover {
  background-color: #83c362;
}
.cta-box-3column .ctabtn a {
  display: inline-block;
  padding: 1rem 2rem;
  background-color: transparent;
  color: #83c362;
  border: 2px solid #f7e100;
  text-align: center;
  transition: all 0.3s ease;
  cursor: pointer;
  text-decoration: none;
}
.cta-box-3column .ctabtn a:hover {
  color: #f7e100;
  border-color: #f7e100;
  text-shadow: none;
}

/* ================================
 汎用：弊社からのお約束
================================= */
.promise_columnbox img {
  border-radius: 4%;
}
.promise_columnbox p.title {
  display: block;
  width: fit-content;
  margin: 0 auto;
  letter-spacing: 0.2em;
  overflow: visible;
  font-weight: 900;
  text-align: center;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .promise_columnbox p.title {
    font-size: 1.5rem;
    letter-spacing: 0.2em;
    max-width: 90vw;
    font-weight: 900;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .promise_columnbox p.title {
    max-width: 90vw;
  }
}
@media only screen and (min-width: 1024px) {
  .promise_columnbox p.title {
    font-size: 1.25rem;
    max-width: 90vw;
  }
}
.promise_columnbox .contentsbox {
  display: block;
  margin: 0 auto;
  width: fit-content;
  max-width: 90vw;
  padding: 2%;
  line-height: 1.5;
  letter-spacing: 0.1em;
}
/* ================================
 汎用：4カラムボタン
================================= */
._4column-btnbox-yellow a.swell-block-button__link, ._4column-btnbox-white a.swell-block-button__link {
  border-radius: unset;
}

/* ================================
 汎用：ボタン角丸
================================= */
.btn-noradius a.swell-block-button__link {
  border-radius: unset !important;
}

#breadcrumb {
  margin-bottom: 2rem;
}

/* ================================
 汎用：画像角丸
================================= */
.img-borderradius img {
  border-radius: 4%;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .img-borderradius img {
    border-radius: 4%;
    width: 90%;
    margin: 0 auto;
  }
}
/* ================================
 汎用：汎用BIGフォントサイズbox
================================= */
.bigp-box {
  display: flex;
  width: fit-content;
  margin: 0 auto;
  font-weight: 900;
  text-align: justify;
  white-space: nowrap;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .bigp-box {
    font-size: 1.25rem;
    white-space: normal;
    max-width: 80vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .bigp-box {
    font-size: 1.25rem;
    white-space: normal;
    max-width: 80vw;
  }
}
@media only screen and (min-width: 1024px) {
  .bigp-box {
    font-size: 1.75rem;
    max-width: 60vw;
  }
}

/* ================================
 汎用：汎用h2用box
================================= */
.header-box {
  display: flex;
  width: fit-content;
  margin: 0 auto;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 2.7vw;
  white-space: nowrap;
}
@media only screen and (min-width: 1700px) {
  .header-box {
    font-size: 2.2vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .header-box {
    font-size: 1.7rem;
    white-space: normal;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .header-box {
    font-size: 1.5rem;
    white-space: normal;
  }
}

/*汎用：商品一覧*/
.shopitemheader-box {
  text-align: justify;
  width: fit-content;
  margin: 0 auto;
  letter-spacing: 0.2em;
  font-weight: 700;
  line-height: 1.3;
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .shopitemheader-box {
    max-width: 90vw;
    line-height: 1.6;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .shopitemheader-box {
    max-width: 90vw;
  }
}
@media only screen and (min-width: 1024px) {
  .shopitemheader-box {
    max-width: 50vw;
    letter-spacing: 0.2em;
    font-size: 1.25rem;
    line-height: 1.5;
  }
}

/*コミコミセットの保証内容*/
.item-iconbox {
  width: fit-content;
  margin: 0 auto;
}
@media only screen and (min-width: 1024px) {
  .item-iconbox {
    max-width: 80vw;
  }
}
.item-iconbox p {
  letter-spacing: 0.1em;
  font-weight: 600;
  color: #003705;
}
/* ================================
 汎用：汎用h2サイズ
================================= */
.original-h2 {
  display: flex;
  width: fit-content;
  font-weight: 900;
  white-space: nowrap;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .original-h2 {
    font-size: 1.9rem;
    white-space: normal;
    overflow: visible;
    text-align: center;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .original-h2 {
    font-size: 1.9rem;
    white-space: normal;
    overflow: visible;
    text-align: center;
  }
}
@media only screen and (min-width: 1024px) {
  .original-h2 {
    font-size: 2.75vw;
  }
}

/* ================================
 汎用：汎用PBOX
================================= */
.pbox-50w {
  margin: 0 auto;
  text-align: center;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .pbox-50w {
    width: 80vw;
    text-align: start;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .pbox-50w {
    width: 70vw;
  }
}
@media only screen and (min-width: 1024px) {
  .pbox-50w {
    width: fit-content;
  }
}

/* ================================
 汎用：SWELL標準タブブロック背景色+文字色
================================= */
button.c-tabList__button {
  background-color: #003705 !important;
  letter-spacing: 0.1em;
}
button.c-tabList__button::before {
  border-top: 8px solid #003705 !important;
}

.is-style-balloon > .c-tabList .c-tabList__button::before {
  border-top: 8px solid #003705 !important;
}

.c-tabList__button {
  color: white;
}

/* ================================
 汎用：縁取り見出し
================================= */
.border-h {
  text-shadow: 2px 2px 0 #f8faf5, -2px 2px 0 #f8faf5, 2px -2px 0 #f8faf5, -2px -2px 0 #f8faf5, 3px 0px 0 #f8faf5, -3px 0px 0 #f8faf5, 0px 3px 0 #f8faf5, 0px -3px 0 #f8faf5, 3px 3px 0 #f8faf5, -3px 3px 0 #f8faf5, 3px -3px 0 #f8faf5, -3px -3px 0 #f8faf5;
}
.border-h span.swl-inline-icon {
  text-shadow: 2px 2px 0 #f8faf5, -2px 2px 0 #f8faf5, 2px -2px 0 #f8faf5, -2px -2px 0 #f8faf5, 3px 0px 0 #f8faf5, -3px 0px 0 #f8faf5, 0px 3px 0 #f8faf5, 0px -3px 0 #f8faf5, 3px 3px 0 #f8faf5, -3px 3px 0 #f8faf5, 3px -3px 0 #f8faf5, -3px -3px 0 #f8faf5;
}

/* ================================
 汎用：汎用塗り潰し見出し
================================ */
/* --- 太字・中央寄せ：大見出し用 --- */
.labelheader-big {
  display: flex;
  justify-content: center;
  width: auto;
  margin: 0 auto;
  padding: 1%;
  background-color: #009944;
  color: #f8faf5;
  letter-spacing: 0.1em;
  font-weight: 900;
  white-space: nowrap;
}
.labelheader-big > .wp-block-group__inner-container {
  padding: 1% 0.25%;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .labelheader-big {
    font-size: 1.9rem;
    white-space: normal;
    overflow: visible;
    text-align: center;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .labelheader-big {
    font-size: 1.9rem;
    white-space: normal;
    overflow: visible;
    text-align: center;
  }
}
@media only screen and (min-width: 1024px) {
  .labelheader-big {
    font-size: 1.25vw;
    max-width: 28vw;
  }
}

/* --- 太字・中央寄せ：小見出し・ポイント強調用 --- 
.labelheader-point {
  display: flex;
  justify-content: center;
  background-color:$color-main;
  color: $color-white;
  padding: 1%;
  letter-spacing: 0.2em;
  width:auto;
  > .wp-block-group__inner-container {
    padding: 0;

    p.has-background {
      padding: 0;
    }
  }

  // --- Smartphone ---
  @include media_sphone {
    font-size: 1.5rem;
    margin: 3rem auto 2rem auto !important;
    max-width: 80vw;
  }

  // --- Tablet ---
  @include media_tablet {
    font-size: 1.9rem;
    margin: 3rem auto 2rem auto !important;
    max-width: 80vw;
  }

  // --- PC ---
  @include media_pc {
    font-size: 1.3vw;
    max-width: 15vw !important;
    margin: 1vw auto 1.25vw auto !important;

    > .wp-block-group__inner-container {
      padding: 0.25%;

      p.has-background {
        padding: 0;
      }
    }
  }
}*/
/* =====================================================
 * メリットリボン（ribbon10ベースの緑ver）
 * ===================================================== */
/* =====================================================
 * メリットリボン（立体＆ストライプ・フラットデザイン）
 * ===================================================== */
.labelheader-point {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 3rem 0 1.25rem;
  text-align: center;
  overflow: visible;
  margin-bottom: 1.5rem !important;
  /* --- スマホ対応 --- */
}
.labelheader-point .wp-block-group,
.labelheader-point .wp-block-group__inner-container {
  overflow: visible !important;
}
.labelheader-point .meritRibbon {
  display: inline-block;
  position: relative;
  text-align: center;
  box-sizing: border-box;
  z-index: 1;
}
.labelheader-point .meritRibbon::before, .labelheader-point .meritRibbon::after {
  content: "";
  position: absolute;
  width: 12px;
  bottom: -10px;
  z-index: -1;
  border: 20px solid #009944;
}
.labelheader-point .meritRibbon::before {
  left: -35px;
  border-left-color: transparent;
}
.labelheader-point .meritRibbon::after {
  right: -35px;
  border-right-color: transparent;
}
.labelheader-point .meritRibbon .meritRibbon__text {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0.25em 1.5em;
  line-height: 2.5em;
  font-size: clamp(1.3rem, 1.2vw, 1.8rem);
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-shadow: 0 0 2px rgba(255, 255, 255, 0.5);
  background: repeating-linear-gradient(-45deg, #00b15c, #00b15c 4px, #00a650 4px, #00a650 8px);
  border-radius: 2px 2px 0 0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.labelheader-point .meritRibbon .meritRibbon__text::before, .labelheader-point .meritRibbon .meritRibbon__text::after {
  position: absolute;
  content: "";
  top: 100%;
  border-bottom: solid 10px transparent;
}
.labelheader-point .meritRibbon .meritRibbon__text::before {
  left: 0;
  border-right: solid 15px #007a3a;
}
.labelheader-point .meritRibbon .meritRibbon__text::after {
  right: 0;
  border-left: solid 15px #007a3a;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .labelheader-point {
    margin: 0 auto !important;
    margin-bottom: 1.5rem !important;
  }
  .labelheader-point .meritRibbon {
    transform: scale(0.9);
  }
  .labelheader-point .meritRibbon::before {
    left: -25px;
    border-width: 15px;
    bottom: -8px;
  }
  .labelheader-point .meritRibbon::after {
    right: -25px;
    border-width: 15px;
    bottom: -8px;
    border-right-color: transparent;
  }
  .labelheader-point .meritRibbon .meritRibbon__text {
    font-size: 1.4rem;
    padding: 0.4em 1.2em;
    line-height: 2.2em;
  }
}

/* =====================================
 汎用：サービスの流れBOX
===================================== */
.serviceflow-stepbox {
  margin: 0 auto;
  text-align: start !important;
}
@media only screen and (min-width: 1024px) {
  .serviceflow-stepbox {
    width: 54vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .serviceflow-stepbox {
    width: 70vw;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .serviceflow-stepbox {
    width: 80vw;
  }
}
.serviceflow-stepbox h2 {
  color: #003705 !important;
  letter-spacing: 0.2em;
  width: fit-content;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .serviceflow-stepbox h2 {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .serviceflow-stepbox h2 {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 1024px) {
  .serviceflow-stepbox h2 {
    font-size: 2.75vw;
  }
}
.serviceflow-stepbox .h-box {
  margin: 0 auto;
  letter-spacing: 0.2em;
  color: #003705;
}
.serviceflow-stepbox .h-box h3 {
  text-align: start !important;
  margin-bottom: 1rem !important;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .serviceflow-stepbox .h-box h3 {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .serviceflow-stepbox .h-box h3 {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 1024px) {
  .serviceflow-stepbox .h-box h3 {
    font-size: 2vw;
  }
}

.common-ctabtn {
  /* ボタン全体のスタイル */
  font-weight: 900;
  background-color: #f7e100;
  transition: background-color 0.3s ease;
  width: fit-content;
  /* ホバー時の背景色変更 */
  /* 内部のリンクのスタイル */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common-ctabtn {
    margin: 0 auto !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common-ctabtn {
    margin: 0 auto !important;
  }
}
@media only screen and (min-width: 1024px) {
  .common-ctabtn {
    margin-left: 0 !important;
  }
}
.common-ctabtn:hover {
  background-color: #83c362;
}
.common-ctabtn a {
  /* リンクの基本レイアウト */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1%;
  /* ボーダーと角丸 */
  border: 2px solid #f7e100;
  border-radius: 0;
  /* 背景と文字色 */
  background-color: transparent;
  color: #83c362;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  /* トランジション効果 */
  transition: all 0.3s ease;
  /* ホバー時のスタイル変更 */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common-ctabtn a {
    width: 70vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common-ctabtn a {
    width: 70vw;
  }
}
@media only screen and (min-width: 1024px) {
  .common-ctabtn a {
    width: 22vw;
  }
}
.common-ctabtn a:hover {
  color: #f7e100 !important;
  border-color: #f7e100;
  text-shadow: none;
}

.page-common-ctabtn {
  /* ボタン全体のスタイル */
  font-weight: 900;
  background-color: #f7e100;
  transition: background-color 0.3s ease;
  width: fit-content;
  /* ホバー時の背景色変更 */
  /* 内部のリンクのスタイル */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .page-common-ctabtn {
    margin: 1.5rem auto !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .page-common-ctabtn {
    margin: 1.5rem auto !important;
  }
}
@media only screen and (min-width: 1024px) {
  .page-common-ctabtn {
    margin: 3% auto !important;
  }
}
.page-common-ctabtn:hover {
  background-color: #83c362;
}
.page-common-ctabtn a {
  /* リンクの基本レイアウト */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1%;
  /* ボーダーと角丸 */
  border: 2px solid #f7e100;
  border-radius: 0;
  /* 背景と文字色 */
  background-color: transparent;
  color: #83c362;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  /* トランジション効果 */
  transition: all 0.3s ease;
  /* ホバー時のスタイル変更 */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .page-common-ctabtn a {
    width: 90vw;
    padding: 4%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .page-common-ctabtn a {
    width: 90vw;
    padding: 4%;
  }
}
@media only screen and (min-width: 1024px) {
  .page-common-ctabtn a {
    padding: 4%;
    width: 22vw;
  }
}
.page-common-ctabtn a:hover {
  color: #f7e100;
  border-color: #f7e100;
  text-shadow: none;
}

/* =====================================
 会社概要BOXのみ：会社ロゴサイズ調整
===================================== */
@media only screen and (min-width: 1024px) {
  .logoimg-boxfix {
    display: block;
    margin-left: 0 !important;
    max-width: 27vw;
  }
}

/* =====================================
汎用：文字背景付きボックス
===================================== */
.common_labelheader-point {
  display: flex;
  justify-content: center;
  background: #83c362;
  color: white;
  border-radius: 2%;
  padding: 1%;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_labelheader-point {
    font-size: 1.9rem;
    margin: 0 auto !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common_labelheader-point {
    font-size: 1.9rem;
    margin: 0 auto !important;
  }
}
@media only screen and (min-width: 1024px) {
  .common_labelheader-point {
    font-size: 1.2vw;
    max-width: auto;
    margin: 1rem auto !important;
  }
  .common_labelheader-point > .wp-block-group__inner-container {
    padding: 0.25%;
  }
  .common_labelheader-point > .wp-block-group__inner-container p.has-background {
    padding: 0;
  }
}
.common_labelheader-point > .wp-block-group__inner-container {
  padding: 0;
}
.common_labelheader-point > .wp-block-group__inner-container p.has-background {
  padding: 0;
}
@media only screen and (min-width: 1700px) {
  .common_labelheader-point {
    font-size: 1.25vw;
    max-width: none;
    margin: 1vw auto !important;
    padding: 3%;
  }
  .common_labelheader-point > .wp-block-group__inner-container {
    padding: 0.25%;
  }
  .common_labelheader-point > .wp-block-group__inner-container p.has-background {
    padding: 0;
  }
}

/* =====================================*/
img.contact-imgheader {
  margin-top: 1rem !important;
}

/* =====================================
 汎用：メインビジュアルエリア
===================================== */
.topvisual_box {
  /* =====================================
   メインビジュアル：メインボックス
  ==================================== */
  /* =====================================
   サブボックスエリア
  ==================================== */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .swell-block-fullWide {
    padding-bottom: 20px !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .swell-block-columns__inner {
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .swell-block-fullWide {
    border-bottom-left-radius: 20% 20%;
    border-bottom-right-radius: 20% 20%;
  }
}
.topvisual_box .mainbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  padding: 2rem;
  /* 画像エリア */
  /* 価格・タイトル・赤バナーエリア */
  /* インフォメーションボックス */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox {
    flex-direction: column;
    margin-bottom: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox {
    flex-direction: row;
    margin-bottom: 0px;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox {
    flex-direction: row;
  }
}
.topvisual_box .mainbox .imgbox {
  text-align: center;
  order: 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .imgbox {
    order: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .imgbox {
    order: 0;
  }
}
.topvisual_box .mainbox .imgbox img {
  width: 100%;
  height: 100vh !important;
  max-width: 643px;
  max-height: 350px;
  height: auto;
  border-radius: 1rem;
}
.topvisual_box .mainbox .pricebox {
  font-weight: 900;
  text-align: center;
  order: 2;
  /* 通常価格帯（Before） */
  /* 特別価格帯（After） */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox {
    font-size: 2rem;
    order: 2;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .pricebox {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox .pricebox {
    font-size: 4rem;
    display: block;
  }
}
.topvisual_box .mainbox .pricebox .tablet_only {
  display: none;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .pricebox .tablet_only {
    display: block;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .header {
    display: block;
    text-align: center;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .pricebox .header {
    display: block;
    text-align: center;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox .pricebox .header {
    display: block;
    text-align: center;
    margin: 0;
  }
}
.topvisual_box .mainbox .pricebox .header p {
  font-size: 3.25rem;
  color: #009944;
  font-weight: bold;
  margin-bottom: 1rem;
  -webkit-text-stroke: 0px #f8faf5;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .header p {
    font-size: 2rem;
  }
}
.topvisual_box .mainbox .pricebox .comment {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 2rem;
}
.topvisual_box .mainbox .pricebox .comment > div {
  width: 100%;
}
.topvisual_box .mainbox .pricebox .comment .priceoff {
  display: flex;
  flex-direction: row-reverse;
  justify-content: center;
  /* 赤バナー（価格エリア） */
  /* 通常テキストエリア */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff {
    gap: 0 !important;
    flex-direction: column;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff {
    flex-direction: column;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff {
    gap: 0 !important;
  }
}
.topvisual_box .mainbox .pricebox .comment .priceoff .pricebox {
  background: red;
  color: #f8faf5;
  border-radius: 12px;
  border: 3px solid #f8faf5;
  display: flex;
  flex-basis: fit-content !important;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .pricebox {
    flex-direction: column;
    padding: 0;
    align-items: center;
    flex-direction: column;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .pricebox {
    flex-direction: column;
    padding: 0;
    align-items: center;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .pricebox {
    flex-direction: row;
    justify-content: center;
    padding: 1.2% 2%;
    height: auto;
    max-width: 30%;
  }
}
.topvisual_box .mainbox .pricebox .comment .priceoff .pricebox .prebox {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
}
.topvisual_box .mainbox .pricebox .comment .priceoff .pricebox .prebox p {
  margin: 0;
  display: block;
  height: auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .pricebox .prebox p {
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .pricebox .prebox p {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .pricebox .prebox > .wp-block-group__inner-container:first-of-type {
    display: flex;
    letter-spacing: 0.1em;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .guarantee {
    flex-basis: 70% !important;
  }
}
.topvisual_box .mainbox .pricebox .comment .priceoff .text {
  width: auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .text {
    flex-basis: 90%;
    padding: 2%;
    font-size: 1.9rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .text {
    flex-basis: 90%;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .text {
    flex-basis: 70% !important;
  }
}
.topvisual_box .mainbox .pricebox .comment .priceoff .text p {
  font-size: 2rem;
  font-weight: bold;
  color: #009944;
  -webkit-text-stroke: 0px #f8faf5;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .comment .priceoff .text p {
    font-size: 1.7rem;
  }
}
.topvisual_box .mainbox .pricebox .before {
  margin: 0;
}
.topvisual_box .mainbox .pricebox .before p {
  font-size: 4rem;
  font-weight: bold;
  color: #009944;
  text-align: right;
  display: flex;
  line-height: normal;
  justify-content: space-evenly;
  -webkit-text-stroke: 0px #f8faf5;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .before p {
    font-size: 4rem;
  }
}
.topvisual_box .mainbox .pricebox .before p strong {
  font-size: 1.2rem;
  font-weight: normal;
  background: #009944;
  color: #f8faf5;
  text-align: center;
  padding: 0.25rem;
  border-radius: 2%;
  text-shadow: none;
  margin-top: 1.625rem;
  height: fit-content;
}
.topvisual_box .mainbox .pricebox .after p {
  font-size: 5rem;
  font-weight: bold;
  color: red;
  -webkit-text-stroke: 0px #f8faf5;
  text-align: right;
  display: block;
  padding: 0;
  line-height: normal;
  letter-spacing: 0.15em;
}
.topvisual_box .mainbox .pricebox .after p strong {
  font-size: 2vw;
  display: block;
  text-align: left;
  letter-spacing: 0em;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .pricebox .after p {
    font-size: 4rem;
    display: inherit;
    padding: 0;
    padding-left: 20px;
    padding-right: 20px;
  }
  .topvisual_box .mainbox .pricebox .after p strong {
    font-size: 1.6rem;
  }
}
.topvisual_box .mainbox .infobox {
  text-align: center;
  order: 3;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .infobox {
    order: 1;
  }
}
.topvisual_box .mainbox .infobox .logo img {
  height: auto;
}
.topvisual_box .mainbox .infobox .prtext p {
  font-weight: bold;
  color: #009944;
  line-height: normal;
  margin: 1rem 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .infobox .prtext p {
    font-size: 3vh !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .topvisual_box .mainbox .infobox .prtext p {
    font-size: 1.3rem !important;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .mainbox .infobox .prtext p {
    font-size: 3vw !important;
  }
}
.topvisual_box .mainbox .infobox .prtext p strong {
  font-size: 4vw;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .infobox .prtext p strong {
    font-size: 5vh;
    margin-left: 10px;
  }
}
.topvisual_box .mainbox .infobox .reasonbox .top {
  background-color: #f7e100;
  color: #003705;
  margin-bottom: 0 !important;
}
.topvisual_box .mainbox .infobox .reasonbox .top p {
  font-weight: bold;
  font-size: 1.2rem;
}
.topvisual_box .mainbox .infobox .reasonbox .bottom {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 2rem;
  background-color: #009944;
}
.topvisual_box .mainbox .infobox .reasonbox .bottom > div {
  width: 100%;
}
.topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns {
  width: 100%;
}
.topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .year, .topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .case {
  width: 100%;
  flex-basis: 50%;
}
.topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .year .text, .topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .case .text {
  font-size: 1.3rem;
  font-weight: bold;
  color: #f7e100;
  margin-bottom: 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .year .text, .topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .case .text {
    font-size: 1rem;
  }
}
.topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .year .header, .topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .case .header {
  font-size: 2.4rem;
  font-weight: bold;
  color: #f7e100 !important;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .year .header, .topvisual_box .mainbox .infobox .reasonbox .bottom .wp-block-columns .case .header {
    font-size: 1.8rem;
  }
}
.topvisual_box .mainbox .infobox .btn {
  margin-top: 2rem;
}
.topvisual_box .mainbox .infobox .btn a.swell-block-button__link {
  display: inline-block;
  background: #009944;
  color: #f8faf5;
  padding: 1rem 2rem;
  border-radius: 0.5rem;
  font-weight: bold;
  font-size: 1.2rem;
  transition: background 0.3s;
}
.topvisual_box .mainbox .infobox .btn a.swell-block-button__link:hover {
  background: #83c362;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .mainbox .infobox .btn a.swell-block-button__link {
    font-size: 1.4rem;
    padding: 1.2rem 2.2rem;
  }
}
.topvisual_box .subbox {
  width: 100%;
  max-width: 1024px;
  margin: auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .subbox .maincopy {
    max-width: 350px;
    margin: auto;
    text-align: center;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .subbox .maincopy {
    width: auto;
    max-width: 62vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .subbox .maincopy strong {
    text-align: center !important;
    font-size: 1.5rem !important;
    display: block !important;
    white-space: pre-wrap !important;
    word-break: auto-phrase !important;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .subbox .maincopy strong {
    font-size: 2rem !important;
  }
}
.topvisual_box .subbox .title {
  text-align: center;
  color: #003705;
  font-weight: 900;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .subbox .title {
    font-size: 2rem;
    white-space: normal;
    overflow: auto;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .subbox .textcolumnbox {
    width: 90%;
    margin: 0 auto;
    --wp-column-gap:1rem;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .subbox .textcolumnbox {
    width: auto;
    max-width: 70vw;
    margin: 0 auto;
    font-size: 2rem;
    padding: 1%;
    white-space: normal;
    overflow: visible;
    text-align: center;
    gap: 0 !important;
    justify-content: space-evenly;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .topvisual_box .subbox .textcolumnbox .wp-block-column .box1 p strong,
  .topvisual_box .subbox .textcolumnbox .wp-block-column .box2 p strong,
  .topvisual_box .subbox .textcolumnbox .wp-block-column .box3 p strong {
    font-size: 2rem !important;
  }
}
@media only screen and (min-width: 1024px) {
  .topvisual_box .subbox .textcolumnbox .wp-block-column .box1 p strong,
  .topvisual_box .subbox .textcolumnbox .wp-block-column .box2 p strong,
  .topvisual_box .subbox .textcolumnbox .wp-block-column .box3 p strong {
    display: contents;
    width: auto;
  }
}

/* =======ここまで==============*/
/* =====================================*/
/* =====================================
 汎用：商品一覧*
===================================== */
@media only screen and (min-width: 1024px) {
  .itemindextab {
    width: 60vw;
    margin: 0 auto;
  }
}

/* =====================================
 汎用：商品・LP・プラン詳細の金額BOX
===================================== */
.common_item_date {
  /* -------------------------
     日付エリアのヘッダー部分
  ------------------------- */
  /* -------------------------
     価格情報のラッパー
  ------------------------- */
  /* -------------------------
     日付エリアの画像
  ------------------------- */
  /* -------------------------
     開催スケジュールエリア
  ------------------------- */
}
.common_item_date .date_header {
  display: block;
  font-weight: 900;
  text-align: center;
  color: #333333;
  margin: 2rem auto;
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_header {
    display: block;
    max-width: fit-content;
    text-align: center;
    padding: 1% 2%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common_item_date .date_header {
    text-align: center;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_header {
    text-align: center;
    padding-bottom: 1rem;
  }
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_header p {
    margin-bottom: 0;
  }
}
.common_item_date .date_price_box .date_title {
  display: block;
  font-weight: 900;
  text-align: end;
  margin: 2rem auto;
  color: #003705;
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_price_box .date_title {
    font-size: 1.5vw;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_price_box .date_title {
    font-size: 1.7rem;
    white-space: normal;
    overflow: auto;
    margin-bottom: 0;
  }
}
.common_item_date .date_price_box .columnbox .price_before {
  display: contents;
  text-align: end;
  font-weight: 900;
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_price_box .columnbox .price_before {
    font-size: 2.5rem !important;
    white-space: normal;
    overflow: auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common_item_date .date_price_box .columnbox .price_before {
    font-size: 3rem !important;
  }
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_price_box .columnbox .price_before {
    font-size: 3vw !important;
    margin-bottom: -3rem;
    letter-spacing: 0em;
  }
}
.common_item_date .date_price_box .columnbox .subtext01 p {
  background-color: #003705;
  color: #f8faf5;
  font-weight: bold;
  padding: 0.25em 0.5em;
  letter-spacing: 0.2em;
  border-radius: 2%;
  text-align: center;
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_price_box .columnbox .subtext01 {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_price_box .columnbox .subtext01 {
    font-size: 1.25rem;
  }
}
.common_item_date .date_price_box .columnbox .price_after {
  display: contents;
  text-align: end;
  font-weight: 900;
  color: red;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_price_box .columnbox .price_after {
    font-size: 3rem;
    white-space: normal;
    overflow: auto;
    margin-bottom: -3rem;
    letter-spacing: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common_item_date .date_price_box .columnbox .price_after {
    font-size: 3rem;
    white-space: normal;
    overflow: auto;
    margin-bottom: -3rem;
    letter-spacing: 0;
  }
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_price_box .columnbox .price_after {
    font-size: 3vw;
    letter-spacing: 0.1em;
  }
}
.common_item_date .date_price_box .columnbox .subtext02 p {
  background-color: red;
  color: #f8faf5;
  font-weight: bold;
  padding: 0.25em 0.5em;
  letter-spacing: 0.2em;
  border-radius: 2%;
  text-align: center;
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_price_box .columnbox .subtext02 p {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common_item_date .date_price_box .columnbox .subtext02 p {
    font-size: 1.25rem;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_price_box .columnbox .subtext02 p {
    font-size: 1.25rem;
    letter-spacing: 0.1em !important;
  }
}
.common_item_date .date_price_box .price_after_comment {
  color: #003705;
  font-weight: 900;
  text-align: center;
  letter-spacing: 0.1em;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_price_box .price_after_comment {
    font-size: 1.75rem;
    margin-bottom: 2rem 0 !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common_item_date .date_price_box .price_after_comment {
    font-size: 1.75rem;
    margin-bottom: 2rem 0 !important;
  }
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_price_box .price_after_comment {
    font-size: 1.5rem;
    margin: 1rem 0 !important;
  }
}
.common_item_date .date-img img {
  border-radius: 6% !important;
}
.common_item_date .date_schedule .wp-block-columns {
  display: block !important;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .common_item_date .date_schedule .wp-block-columns {
    gap: 0 !important;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_schedule .wp-block-columns {
    gap: 0 !important;
  }
}
.common_item_date .date_schedule .title {
  text-align: center;
  color: #003705;
  font-weight: 900;
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_schedule .title {
    font-size: 2.2rem;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_schedule .title {
    font-size: 2.2rem;
    white-space: normal;
    overflow: auto;
    margin-bottom: 0;
  }
}
.common_item_date .date_schedule .date {
  text-align: center;
  color: #003705;
  font-weight: 900;
}
@media only screen and (min-width: 1024px) {
  .common_item_date .date_schedule .date {
    font-size: 2rem;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common_item_date .date_schedule .date {
    font-size: 1.5rem;
    white-space: normal;
    overflow: auto;
    margin-bottom: 0;
  }
}
.common_item_date .date_schedule .date span {
  margin: 0 0.5rem;
}

/* -------------------------
特価表示バッジ（共通パーツ）
------------------------- */
.original-item-pricedownbox {
  display: block;
  border-radius: 4%;
  background-color: red;
  font-weight: 600;
  letter-spacing: 0.2em;
  color: white;
  width: fit-content;
  padding: 1%;
}
@media only screen and (min-width: 1024px) {
  .original-item-pricedownbox {
    width: 30vw;
  }
}
/* リボンバッジ  */
.ribbon-banner {
  background-color: #277b00;
  color: white;
  text-align: center;
  font-weight: 600;
  /* clip-path: polygon(0 0, 100% 0, 50% 100%); */
  clip-path: polygon(0% 0%, 100% 0, 100% 30%, 51% 65%, 0 30%);
  border-radius: 2%;
  text-align: center;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .ribbon-banner {
    padding: 0 6% 8% 6%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .ribbon-banner {
    padding: 0 6% 8% 6%;
  }
}
@media only screen and (min-width: 1024px) {
  .ribbon-banner {
    padding: 0 6% 5% 6%;
  }
}
.ribbon-banner p {
  letter-spacing: 0.3em !important;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .ribbon-banner p {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .ribbon-banner p {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 1024px) {
  .ribbon-banner p {
    font-size: 1.5rem;
  }
}

.ribbon-banner-text p {
  color: #f8faf5;
  font-weight: bold;
  padding: 0.25em 0.5em;
  letter-spacing: 0.3em;
  border-radius: 2%;
  text-align: center;
  color: #277b00;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .ribbon-banner-text p {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .ribbon-banner-text p {
    font-size: 1.5rem;
  }
}
@media only screen and (min-width: 1024px) {
  .ribbon-banner-text p {
    font-size: 1.5rem;
  }
}

/*サイト内共有パーツここまで*/
/* =====================================
個別事例LP
===================================== */
.lp_point_header-box {
  position: relative;
  background-color: #a6d4ad;
  color: white;
  font-weight: 900;
  border-radius: 2%;
  padding: 0.5% 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .lp_point_header-box {
    font-size: 1.5rem;
    white-space: normal;
    overflow: auto;
    padding: 2%;
    margin-bottom: 0.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .lp_point_header-box {
    font-size: 1.7rem;
    white-space: normal;
    overflow: auto;
    padding: 2%;
    margin-bottom: 0.5rem;
  }
}
@media only screen and (min-width: 1024px) {
  .lp_point_header-box {
    font-size: 2vw;
    max-width: 40vw;
    display: block;
    margin: 1rem auto;
  }
}

.lp_point_column .columnbox {
  padding: 0 2%;
}
.lp_point_column .columnbox .header {
  font-size: 1.4rem !important;
  font-weight: 900;
  white-space: normal;
  overflow: auto;
}
.lp_point_column .columnbox .point {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-weight: 900;
  background-color: #009944;
  color: #f8faf5;
  margin-left: 0;
}
@media only screen and (min-width: 1024px) {
  .lp_point_column .columnbox .point {
    width: 100%;
    max-width: 100px; /* PCでの最大サイズ */
    aspect-ratio: 1/1; /* 幅と高さを同じ比率に保つ */
    border-radius: 50%;
  }
}
.lp_point_column .columnbox .point p {
  margin: 0 auto !important;
}
.lp_point_column .columnbox .point p.num {
  margin-top: -1rem !important;
}
/* =====================================
カテゴリー一覧ページ カテゴリ表示名
===================================== */
.c-pageTitle__inner {
  color: #003705 !important;
  letter-spacing: 0.2em;
}

#lp-content .post_content, #main_content .post_content {
  margin-bottom: 0px !important;
}

/* =====================================
カテゴリー一覧ページ 一覧アイテムの表示
===================================== */
.p-postList__toiletprice {
  /* ——— スマホ（最小幅 320px 以上） ——— */
  /* ——— タブレット（最小幅 768px 以上） ——— */
  /* ——— PC（最小幅 1024px 以上） ——— */
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .p-postList__toiletprice {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
  }
  .p-postList__toiletprice::before {
    content: "特別価格";
    display: inline-block;
    background-color: red;
    color: #f8faf5;
    font-weight: 900;
    font-size: 0.875rem;
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    margin-bottom: 0.5rem;
    text-align: center;
    white-space: nowrap;
  }
  .p-postList__toiletprice p {
    margin: 0;
    font-weight: 900;
    font-size: 1.75rem;
    color: red;
    text-align: center;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .p-postList__toiletprice {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .p-postList__toiletprice::before {
    /* スマホと同じ縦並び */
    margin-bottom: 0.5rem;
  }
  .p-postList__toiletprice p {
    margin: 0;
    font-weight: 900;
    font-size: 2rem;
    color: red;
    text-align: center;
  }
}
@media only screen and (min-width: 1024px) {
  .p-postList__toiletprice {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    color: red;
    width: 100%;
  }
  .p-postList__toiletprice::before {
    /* 横並びに戻して右マージン */
    margin-right: 0.5rem;
    margin-bottom: 0;
  }
  .p-postList__toiletprice p {
    margin: 0;
    font-weight: 900;
    font-size: 2rem;
    color: red;
    text-align: center;
  }
}

.itemname {
  text-align: center;
  font-weight: 900;
}
@media only screen and (min-width: 1024px) {
  .itemname {
    display: block;
    font-size: 1.25rem;
    width: 75%;
    margin: 0 auto !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .itemname {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .itemname {
    font-size: 1rem;
  }
}

.itemexcerpt {
  font-weight: 900;
}
@media only screen and (min-width: 1024px) {
  .itemexcerpt {
    font-size: 1.25rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .itemexcerpt {
    font-size: 1rem;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .itemexcerpt {
    font-size: 1rem;
  }
}

/* =====================================
 Contact Form（コンタクトフォーム）
===================================== */
form {
  display: inline-block;
  width: 100%;
  margin: 0 auto;
}
form button,
form input,
form select,
form textarea {
  width: 100%;
}

label {
  color: #333333;
  font-weight: bold;
}

input[type=checkbox] {
  width: fit-content;
  margin: 1% auto;
}

.wpcf7-list-item {
  overflow: visible;
  width: 100%;
  margin: 1% auto;
  text-align: center;
}

.form_commoncontact { /*一般的なお問い合わせ*/
  display: contents;
  width: fit-content;
  max-width: 80vw;
  margin: 0 auto;
  font-weight: 900;
}
.form_commoncontact .column {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column {
    flex-direction: column;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .column {
    flex-direction: column;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .column {
    flex-wrap: wrap !important;
    margin-bottom: 1rem;
    flex-direction: row !important;
  }
}
.form_commoncontact .column span.small {
  font-size: 0.75rem;
  margin-left: 1rem;
  color: red;
}
.form_commoncontact .column .left {
  flex: 0 0 30%;
  max-width: 30%;
  display: block;
  background-color: #a5d4ad;
  color: #333333;
  border-radius: 2%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column .left {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .column .left {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .column .left {
    max-width: 30%;
    align-content: center;
  }
}
.form_commoncontact .column .left p {
  margin-left: 1rem;
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column .left p.main {
    width: 90vw;
    padding: 2%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .column .left p.main {
    width: 90vw;
    padding: 2%;
  }
}
.form_commoncontact .column .left p.main span.required { /*必須*/ }
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column .left p.main span.required {
    color: red;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .column .left p.main span.required {
    color: red;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .column .left p.main span.required {
    color: red;
  }
}
.form_commoncontact .column .left p.main span.any { /*任意*/ }
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column .left p.main span.any {
    color: #003705;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .column .left p.main span.any {
    color: #003705;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .column .left p.main span.any {
    color: #003705;
  }
}
.form_commoncontact .column .left p.sub {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem !important;
  font-weight: 500;
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column .left p.sub {
    color: #003705;
    width: 90vw;
    font-weight: bold;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .column .left p.sub {
    color: #003705;
    width: 90vw;
    font-weight: bold;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .column .left p.sub {
    font-weight: 500;
  }
}
.form_commoncontact .column .right {
  flex: 0 0 70%;
  max-width: 70%;
  display: block;
  border-radius: 4%;
  padding-left: 1rem;
}
.form_commoncontact .column .right p {
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column .right {
    max-width: 90vw;
    margin: 0 auto;
    padding-left: 0 !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .column .right {
    max-width: 90vw;
    margin: 0 auto;
    padding-left: 0 !important;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .column .right {
    padding-left: 1rem !important;
  }
}
.form_commoncontact .column .right input,
.form_commoncontact .column .right textarea,
.form_commoncontact .column .right select {
  width: 100%;
  border-radius: 1%;
  margin: 1% 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .column .right textarea,
  .form_commoncontact .column .right select {
    width: 90vw;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .column .right textarea,
  .form_commoncontact .column .right select {
    width: 100%;
  }
}
.form_commoncontact .column .right .box {
  margin-bottom: 0.75rem;
}
.form_commoncontact .column .right .box p.main {
  margin-bottom: 0.25rem;
}
.form_commoncontact .column .flex { /*フレックスボックス用*/ }
.form_commoncontact .column .flex label {
  display: flex;
}
.form_commoncontact .column .flex label span {
  width: fit-content;
}
.form_commoncontact .column .flex label input {
  width: auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact .btn_submit {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact .btn_submit {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact .btn_submit {
    margin-top: 1rem;
  }
}
.form_commoncontact [type=submit] {
  background-color: #009944;
  color: #f8faf5;
  border-radius: 2%;
  font-weight: 900;
  transition: background-color 0.3s, color 0.3s;
  margin-top: 1rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_commoncontact [type=submit] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_commoncontact [type=submit] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_commoncontact [type=submit] {
    display: block;
    width: 60vw;
    margin: 0 auto;
    padding: 1%;
  }
}
.form_commoncontact [type=submit]:hover {
  background-color: #003705;
  color: #f8faf5;
}
.form_commoncontact .wpcf7-acceptance a {
  color: #009944;
}

/* ================================
標準のグラフの背景色変更
================================= */
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background-color: #f1f9ee;
}

/* =======================================
お見積り依頼フォームスタイル (.form_requestaquotecontact)
======================================= */
.form_requestaquotecontact {
  display: contents;
  width: fit-content;
  max-width: 80vw;
  margin: 0 auto;
  font-weight: 900;
  /* セクションタイトル */
  /* 3カラム版 (左右+画像) */
  /* 写真アップロード全体グリッド */
  /* 注意書き */
}
.form_requestaquotecontact h4.wp-block-heading,
.form_requestaquotecontact h3.wp-block-heading {
  font-weight: bold;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact h4.wp-block-heading,
  .form_requestaquotecontact h3.wp-block-heading {
    text-align: center;
    margin-bottom: 1.5rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact h4.wp-block-heading,
  .form_requestaquotecontact h3.wp-block-heading {
    text-align: center;
    margin-bottom: 1.5rem;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact h4.wp-block-heading,
  .form_requestaquotecontact h3.wp-block-heading {
    text-align: start;
    margin-bottom: 1rem;
  }
}
.form_requestaquotecontact .column {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column {
    flex-direction: column;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column {
    flex-direction: column;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column {
    flex-wrap: wrap !important;
    margin-bottom: 1rem;
    flex-direction: row !important;
  }
}
.form_requestaquotecontact .column span.small {
  font-size: 0.75rem;
  margin-left: 1rem;
  color: red;
}
.form_requestaquotecontact .column .left {
  flex: 0 0 30%;
  max-width: 30%;
  display: block;
  background-color: #a5d4ad;
  color: #333333;
  border-radius: 2%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column .left {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column .left {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column .left {
    max-width: 30%;
    align-content: center;
    padding: 1rem;
  }
}
.form_requestaquotecontact .column .left p {
  margin-left: 1rem;
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column .left p.main {
    width: 90vw;
    padding: 2%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column .left p.main {
    width: 90vw;
    padding: 2%;
  }
}
.form_requestaquotecontact .column .left p.main span.required { /*必須*/
  color: red;
}
.form_requestaquotecontact .column .left p.main span.any { /*任意*/ }
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column .left p.main span.any {
    color: #003705;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column .left p.main span.any {
    color: #003705;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column .left p.main span.any {
    color: #003705;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column .left p.sub {
    width: 90vw;
    color: #003705;
    background-color: white;
    font-weight: 900;
    padding: 1%;
    margin: 0 auto !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column .left p.sub {
    width: 90vw;
    color: #003705;
    background-color: white;
    font-weight: 900;
    padding: 1%;
    margin: 0 auto !important;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column .left p.sub {
    background-color: #a5d4ad;
    color: #003705;
    font-weight: 900;
    margin: 0.5rem auto !important;
  }
}
.form_requestaquotecontact .column .right {
  flex: 0 0 70%;
  max-width: 70%;
  display: block;
  border-radius: 4%;
}
.form_requestaquotecontact .column .right p {
  color: #009944;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column .right {
    max-width: 90vw;
    margin: 0 auto;
    padding-left: 0 !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column .right {
    max-width: 90vw;
    margin: 0 auto;
    padding-left: 0 !important;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column .right {
    padding-left: 1rem !important;
  }
}
.form_requestaquotecontact .column .right input,
.form_requestaquotecontact .column .right textarea,
.form_requestaquotecontact .column .right select {
  width: 100%;
  border-radius: 1%;
  margin: 1% 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column .right textarea,
  .form_requestaquotecontact .column .right select {
    width: 90vw;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column .right textarea,
  .form_requestaquotecontact .column .right select {
    width: 100%;
  }
}
.form_requestaquotecontact .column .right .box {
  margin-bottom: 0.75rem;
}
.form_requestaquotecontact .column .right .box p.main {
  margin-bottom: 0.25rem;
}
.form_requestaquotecontact .column .flex { /*フレックスボックス用*/ }
.form_requestaquotecontact .column .flex label {
  display: flex;
  color: #009944;
}
.form_requestaquotecontact .column .flex label span {
  width: fit-content;
}
.form_requestaquotecontact .column .flex label input {
  width: auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .btn_submit {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .btn_submit {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .btn_submit {
    margin-top: 1rem;
  }
}
.form_requestaquotecontact .btn_submit [type=previous] {
  background-color: #009944;
  color: #f8faf5;
  border-radius: 2%;
  font-weight: 900;
  transition: background-color 0.3s, color 0.3s;
  margin-top: 1rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .btn_submit [type=previous] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .btn_submit [type=previous] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .btn_submit [type=previous] {
    display: block;
    width: 60vw;
    margin: 0 auto;
    padding: 1%;
  }
}
.form_requestaquotecontact .btn_submit [type=previous]:hover {
  background-color: #003705;
  color: #f8faf5;
}
.form_requestaquotecontact [type=submit] {
  background-color: #009944 !important;
  color: #f8faf5 !important;
  border-radius: 2%;
  font-weight: 900;
  transition: background-color 0.3s, color 0.3s;
  margin-top: 1rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact [type=submit] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact [type=submit] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact [type=submit] {
    display: block;
    width: 60vw;
    margin: 0 auto;
    padding: 1%;
  }
}
.form_requestaquotecontact [type=submit]:hover {
  background-color: #003705 !important;
  color: #f8faf5 !important;
}
.form_requestaquotecontact [type=previous] {
  background-color: #009944;
  color: #f8faf5;
  border-radius: 2%;
  font-weight: 900;
  transition: background-color 0.3s, color 0.3s;
  margin-top: 1rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact [type=previous] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact [type=previous] {
    max-width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact [type=previous] {
    display: block;
    width: 60vw;
    margin: 0 auto;
    padding: 1%;
  }
}
.form_requestaquotecontact [type=previous]:hover {
  background-color: #003705;
  color: #f8faf5;
}
.form_requestaquotecontact .wpcf7-acceptance a {
  color: #009944;
}
.form_requestaquotecontact .column_3 {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 {
    flex-direction: column;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 {
    flex-direction: column;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 {
    flex-direction: row;
  }
}
.form_requestaquotecontact .column_3 .left {
  flex: 0 0 30%;
  background-color: #a5d4ad;
  border-radius: 2%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .left {
    max-width: 90vw;
    margin: 0 auto;
    padding: 1rem;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .left {
    max-width: 90vw;
    margin: 0 auto;
    padding: 1rem;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .left {
    max-width: 30%;
    margin: 0 auto;
    padding: 1rem;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .left p.main {
    width: 90vw;
    padding: 2%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .left p.main {
    width: 90vw;
    padding: 2%;
  }
}
.form_requestaquotecontact .column_3 .left p.main span.required { /*必須*/ }
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .left p.main span.required {
    color: red;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .left p.main span.required {
    color: red;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .left p.main span.required {
    color: red;
  }
}
.form_requestaquotecontact .column_3 .left p.main span.any { /*任意*/ }
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .left p.main span.any {
    color: #003705;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .left p.main span.any {
    color: #003705;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .left p.main span.any {
    color: #003705;
  }
}
.form_requestaquotecontact .column_3 .left p.sub {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem !important;
  font-weight: 500;
  color: #003705;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .left p.sub {
    width: 90vw;
    font-weight: bold;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .left p.sub {
    width: 90vw;
    font-weight: bold;
  }
}
.form_requestaquotecontact .column_3 .right {
  flex: 0 0 70%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 1rem;
  background-color: #f8faf5;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .right {
    max-width: 90vw;
    margin: 0 auto;
    padding: 1rem;
    width: 90vw;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .right {
    max-width: 90vw;
    margin: 0 auto;
    padding: 1rem;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .right {
    max-width: 70%;
    margin: 0 auto;
    padding: 1rem;
  }
}
.form_requestaquotecontact .column_3 .right .img {
  flex: 0 0 40%;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .right .img {
    width: 90vw !important;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .right .img {
    width: 90vw;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .right .img {
    padding: 1%;
    max-width: 40%;
  }
}
.form_requestaquotecontact .column_3 .right .img p {
  height: auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .right .img p {
    width: 80vw !important;
    margin: 1% auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .right .img p {
    width: 80vw !important;
    margin: 1% auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .right .img p {
    width: auto !important;
  }
}
.form_requestaquotecontact .column_3 .right .img p img {
  height: auto;
  border-radius: 4px;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .right .img p img {
    width: 90vw !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .right .img p img {
    width: 90vw !important;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .right .img p img {
    width: auto !important;
  }
}
.form_requestaquotecontact .column_3 .right .inputbox {
  flex: 1;
  margin-left: 1rem;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .column_3 .right .inputbox {
    min-width: 90%;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .column_3 .right .inputbox {
    min-width: 90%;
    margin: 0 auto;
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .column_3 .right .inputbox {
    min-width: 50%;
  }
}
.form_requestaquotecontact .column_3 .right .inputbox textarea {
  width: 100%;
  min-height: 150px;
}
.form_requestaquotecontact .photo-upload-grid {
  display: grid;
  gap: 1rem;
  margin: 2rem auto;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form_requestaquotecontact .photo-upload-grid {
    grid-template-columns: 1fr;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .form_requestaquotecontact .photo-upload-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 1024px) {
  .form_requestaquotecontact .photo-upload-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item {
  background-color: #a5d4ad;
  border: 2px solid #009944;
  border-radius: 8px;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-img img {
  width: 100%;
  height: auto;
  border-radius: 4px;
  margin-bottom: 0.5rem;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-title {
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 0.5rem;
  color: #003705;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-desc {
  font-size: 0.875rem;
  margin-bottom: 1rem;
  text-align: start;
  color: #003705;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap label.custom-file-upload {
  display: inline-block;
  background-color: #f7e100;
  color: #003705;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap label.custom-file-upload:hover {
  background-color: #003705;
  color: #f7e100;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap label.custom-file-upload input[type=file] {
  display: none;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap .file-name,
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap .error-message {
  font-size: 0.75rem;
  color: red !important;
}
.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap .error-message {
  color: red;
}
.form_requestaquotecontact .photo-upload-note {
  text-align: center;
  margin-top: 2rem;
  font-size: 0.875rem;
}
.form_requestaquotecontact .multiform-check:empty::after {
  content: "入力されていません";
  color: red;
  font-weight: bold;
  display: block;
}
.form_requestaquotecontact label.radiobox {
  display: flex;
  gap: 1rem;
  margin-left: 1rem;
}
.form_requestaquotecontact label.radiobox input[type=radio] {
  width: auto;
}

/* プライバシーポリシー同意チェックボックスだけに適用 */
.privacy-acceptance .privacy-check {
  width: auto !important;
  margin: 1% 0 !important;
}

/* プライバシーポリシー同意部分の label.radiobox を中央寄せ */
.privacy-acceptance label.radiobox {
  display: flex; /* フレックスにする */
  justify-content: center; /* 中央寄せ */
}

.form_requestaquotecontact .photo-upload-grid .photo-upload-item .photo-upload-buttons .photo-upload-wrap label.custom-file-upload > br {
  display: none;
}

.w-beforeFooter {
  margin: 0 auto;
}

.copyright {
  font-weight: 900 !important;
}

/*スマホハンバーガーメニュー*/
.p-spMenu__body {
  font-weight: 900 !important;
}

.c-submenuToggleBtn {
  color: #f7e100;
  border: #f7e100 1px solid !important;
}

.p-spMenu__nav .c-spnav li a {
  color: #f7e100 !important;
}

.c-widget__title.-spmenu {
  color: #f7e100 !important;
}

.p-spMenu__closeBtn .c-iconBtn__icon {
  color: #f7e100 !important;
}

/* ================================
 Footer Menu Hover Effect
================================= */
.footermenu a {
  transition: all 0.3s ease;
  color: #f8faf5;
}
.footermenu a:hover {
  color: #f7e100 !important;
  letter-spacing: 0.15em;
}

.btn-border a.swell-block-button__link {
  border-radius: 4% !important;
}

.tabandcolumnbox-spaceplus {
  width: 80%;
  margin: 0 auto;
  left: 0;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .common-textbox-justy {
    font-size: 1.4rem;
    padding: 1rem;
    text-align: justify;
    text-align-last: justify;
    text-justify: inter-ideograph;
  }
}
.c-thumbWrap {
  position: relative;
  display: block;
  line-height: 0;
}

.c-thumb__logo {
  position: absolute;
  right: 8px;
  bottom: 8px;
  width: 150px;
  height: auto;
  max-width: 30%;
  z-index: 5;
  pointer-events: none;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.25));
  background: white;
  padding: 0.5rem 1rem;
}

.c-balloon .c-balloon__iconImg {
  height: 100px;
  width: fit-content;
  border: none;
  border-radius: 0;
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  .c-balloon .c-balloon__iconImg {
    height: 100px;
    width: fit-content;
    border: none;
    border-radius: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .c-balloon .c-balloon__iconImg {
    height: 100px;
    width: fit-content;
    border: none;
    border-radius: 0;
  }
}

.c-balloon__text {
  color: white;
  font-size: 1.2rem;
}

/* 枠なしアコーディオンのボディ部分の枠線を消す */
.accordion-noborder .swell-block-accordion__body {
  border: none !important;
  padding-top: 0;
}
.accordion-noborder .padding-space {
  padding: 5%;
}

/*よくあるお問い合わせページ*/
.qandapage {
  /*アコーディオン内のテキストを右端に*/
}
.qandapage .swell-block-accordion__label {
  text-align: start !important;
}

/* =====================================================
 * 便座オーバーレイ + 緑のプラスマーク
 * 対象: カテゴリー products-and-plans の投稿
 * 表示先: 一覧カードのサムネイル（.c-thumbWrap内）
 * ===================================================== */
.c-thumbWrap {
  position: relative;
}

.c-thumb__seatWrap {
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
  display: flex;
  align-items: center;
  z-index: 5;
  pointer-events: none;
}

/* スマホ幅では少し小さくする */
@media (max-width: 480px) {
  .c-thumb__seatWrap {
    left: 0;
    top: 0;
  }
}
.c-thumb__seatImg {
  width: 120px;
  height: 120px;
  background: #000;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}
.c-thumb__seatImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.c-thumb__plusBadge {
  width: 77px;
  height: 77px;
  margin-left: 8px;
  border-radius: 50%;
  background: #0a8f2a;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 48px;
  color: #fff;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}
.c-thumb__plusBadge span {
  line-height: 1;
  display: block;
  transform: translateY(-11%);
}

/* スマホ幅では少し小さくする */
@media (max-width: 480px) {
  .c-thumb__seatImg {
    width: 60px;
    height: 60px;
  }
  .c-thumb__plusBadge {
    width: 30px;
    height: 30px;
    font-size: 1.5rem;
  }
}
/* 右下に出すメーカーアイコンの想定レイアウト
   （もし既に .c-thumb__logo の指定があるなら、そっち優先でOK。
    なければこれを使う。）
*/
.c-thumb__logo {
  position: absolute;
  right: 0.5rem;
  bottom: 0.5rem;
  max-width: 80px;
  max-height: 80px;
  width: auto;
  height: auto;
  object-fit: contain;
  background: #fff;
  border-radius: 4px;
  padding: 0.25rem 0.5rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  z-index: 4;
}

/* =====================================================
 * 商品特徴（一覧表示用）
 * ===================================================== */
.p-postList__features {
  margin: 0.5em 0 1em;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #333;
}
.p-postList__features p {
  margin: 0;
}

/* =====================================================
 * アコーディオンボックス（当店で購入するメリット）
 * ===================================================== */
.grennborder-accordion {
  border: 4px solid #009944;
  /* ▼クリック後（開いた状態）タイトル部分の反転 */
}
.grennborder-accordion .swell-block-accordion__item {
  transition: background 0.3s ease;
  /* ▼開いた時（背景に斜めストライプ） */
}
.grennborder-accordion .swell-block-accordion__item.is-open, .grennborder-accordion .swell-block-accordion__item.is-opened, .grennborder-accordion .swell-block-accordion__item[open] {
  background: repeating-linear-gradient(135deg, #fffff8, #fffff8 50px, #fffde8 50px, #fffde8 100px);
}
.grennborder-accordion .swell-block-accordion__title {
  color: #009944;
  background: #fff;
  transition: all 0.3s ease;
}
.grennborder-accordion .swell-block-accordion__body {
  border-top: none !important;
}
.grennborder-accordion .swell-block-accordion__item.is-open .swell-block-accordion__title,
.grennborder-accordion .swell-block-accordion__item.is-opened .swell-block-accordion__title,
.grennborder-accordion .swell-block-accordion__item[open] .swell-block-accordion__title {
  background-color: #009944;
  color: #fff;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .grennborder-accordion {
    max-width: 90vw;
    margin: 0 auto;
  }
}
.singleMainImageWrap {
  position: relative;
  display: inline-block;
}
.singleMainImageWrap .singleMainImage .main-product-img {
  display: block;
  width: 100%;
  height: auto;
}
.singleMainImageWrap .c-thumb__seatWrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
}

/*汎用パーツ*/
.center-box {
  display: block;
  margin: 0 auto;
  width: fit-content;
  max-width: 80vw;
}/*# sourceMappingURL=style.css.map */