@charset "UTF-8";
/*============================
  サイト毎 汎用デフォルト設定関連
============================*/
:root {
  --font-scale: 1;
  /* デフォルト倍率 */
  /* 基本カラー設定 */
  --defaultColor-set01: #27400f;
  --defaultColor-set02: #0030b6;
  --defaultColor-set03: #016c01;
  --defaultColor-set04: #d00f0f;
  --defaultColor-set05: #0a2119;
  --defaultColor-set09: #ffffff;
  --fontColor-set01: #27400f;
  --fontColor-set02: #333333;
  --fontColor-set03: #cd0018;
  --fontColor-set09: #ffffff;
  /* コンテンツ幅 */
  --wrapper-width: 1200px;
  --wrapper-width_L: 1340px;
  --wrapper-in-width: 800px;
  /* 縦文字の幅 */
  --side-text-width: 40px;
  /* 共通コンテンツ間マージン設定 */
  --wrapper-padding: 30px;
  --wrapper-padding_sp: 15px;
  /* 共通角丸設定 */
  --border-radius_default: 10px;
  /* 共通フォントサイズ設定 */
  --contents_font_SS: 10px;
  --contents_font_S: 12px;
  --contents_font_M: 16px;
  --contents_font_L: 21px;
  --contents_font_LL: 26px;
  --contents_font_Ex: 36px;
}

@media screen and (max-width: 767px) {
  :root {
    /* 縦文字の幅 */
    --side-text-width: 20px;
    /* 共通コンテンツ間マージン設定 */
    --wrapper-padding: 10px;
  }
}
body {
  font-family: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif;
  font-feature-settings: "halt";
  font-weight: 500;
  /* =====
  100	Thin (Hairline)
  200	Extra Light (Ultra Light)
  300	Light
  400	Normal (Regular)
  500	Medium
  600	Semi Bold (Demi Bold)
  700	Bold
  800	Extra Bold (Ultra Bold)
  900	Black (Heavy)
  ===== */
  /* JavaScriptから渡ってきた高さ分、自動でpaddingをあける */
  /* 取得失敗時のフォールバックとして60pxを指定 */
}

img {
  height: auto;
  max-width: 100%;
  width: auto;
  margin-inline: auto;
}

a:hover {
  transition: 0.3s;
  filter: brightness(120%);
}

html,
body {
  height: 100%;
  /* 上記、入れておくと、子要素レベルで height: 100%; が効くようになる模様 */
}

/*============================
  共通 仕掛け関連CSS
============================*/
/* スクロール位置でヘッダーにフラグ start */
[data-position="target, no1"] {
  --data-position_color: var(--defaultColor-set09);
  transition: 0.4s;
}

/* 付与されるクラス */
[data-position="target, no1"].fade_in {
  --data-position_color: #333;
}

/* スクロール位置でヘッダーにフラグ end */
/* デフォルト ボタン start */
.button.defaultStyle {
  display: inline-block;
}

.button.defaultStyle a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: clamp(calc(2.5rem * var(--font-scale)), calc(1.312rem * var(--font-scale) + 4.32vw), calc(5rem * var(--font-scale)));
  padding: 0 55px 0 30px;
  color: #3d4f30;
  font-family: "Times New Roman", Georgia, serif;
  font-size: clamp(calc(0.625rem * var(--font-scale)), calc(0.328rem * var(--font-scale) + 1.08vw), calc(1.25rem * var(--font-scale)));
  text-decoration: none;
  box-sizing: border-box;
  transition: color 0.5s ease-in-out, width 0.5s ease-in-out;
  color: var(--defaultColor-set09);
  min-width: clamp(calc(12.5rem * var(--font-scale)), calc(6.561rem * var(--font-scale) + 21.598vw), calc(25rem * var(--font-scale)));
  background-color: #1b3211;
  border-radius: 80px;
}

.button.defaultStyle a:hover {
  opacity: 0.7;
}

.button.defaultStyle a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 40px;
  height: 1px;
  background-color: var(--defaultColor-set09);
  transition: background-color 0.4s ease;
}

.button.defaultStyle a::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 8px;
  height: 8px;
  border-top: 1px solid var(--defaultColor-set09);
  border-right: 1px solid var(--defaultColor-set09);
  transform: translateY(-50%) rotate(45deg);
  transition: border-color 0.4s ease;
}

/* デフォルト ボタン end */
/* view more ボタン */
.button.moreStyle {
  display: inline-block;
}

.button.moreStyle a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(calc(8.125rem * var(--font-scale)), calc(4.264rem * var(--font-scale) + 14.039vw), calc(16.25rem * var(--font-scale)));
  padding: 0 clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
  position: relative;
  z-index: 1;
  height: clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
  color: #3d4f30;
  font-family: "Times New Roman", Georgia, serif;
  font-size: clamp(calc(0.625rem * var(--font-scale)), calc(0.328rem * var(--font-scale) + 1.08vw), calc(1.25rem * var(--font-scale)));
  text-decoration: none;
  box-sizing: border-box;
  transition: color 0.5s ease-in-out, width 0.5s ease-in-out;
}

.button.moreStyle a:hover {
  color: #ffffff;
  width: clamp(calc(10rem * var(--font-scale)), calc(5.248rem * var(--font-scale) + 17.279vw), calc(20rem * var(--font-scale)));
}

.button.moreStyle a::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  width: clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
  height: clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
  border: 1px solid #3d4f30;
  border-radius: clamp(calc(0.9375rem * var(--font-scale)), calc(0.492rem * var(--font-scale) + 1.62vw), calc(1.875rem * var(--font-scale))) clamp(calc(0.9375rem * var(--font-scale)), calc(0.492rem * var(--font-scale) + 1.62vw), calc(1.875rem * var(--font-scale)));
  background-color: transparent;
  box-sizing: border-box;
  transition: all 0.4s ease-in-out;
}

.button.moreStyle a:hover::before {
  width: 100%;
  background-color: #1b3211;
  border-color: #1b3211;
}

.button.moreStyle a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: clamp(calc(0.875rem * var(--font-scale)), calc(0.459rem * var(--font-scale) + 1.512vw), calc(1.75rem * var(--font-scale)));
  transform: translateY(-50%);
  width: clamp(calc(1.25rem * var(--font-scale)), calc(0.656rem * var(--font-scale) + 2.16vw), calc(2.5rem * var(--font-scale)));
  height: 1px;
  background-color: #3d4f30;
  transition: background-color 0.4s ease;
}

.button.moreStyle a:hover::after {
  background-color: #ffffff;
}

.button.moreStyle a span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: clamp(calc(0.875rem * var(--font-scale)), calc(0.459rem * var(--font-scale) + 1.512vw), calc(1.75rem * var(--font-scale)));
  width: clamp(calc(0.25rem * var(--font-scale)), calc(0.131rem * var(--font-scale) + 0.432vw), calc(0.5rem * var(--font-scale)));
  height: clamp(calc(0.25rem * var(--font-scale)), calc(0.131rem * var(--font-scale) + 0.432vw), calc(0.5rem * var(--font-scale)));
  border-top: 1px solid #3d4f30;
  border-right: 1px solid #3d4f30;
  transform: translateY(-50%) rotate(45deg);
  transition: border-color 0.4s ease;
}

.button.moreStyle a:hover span::after {
  border-color: #ffffff;
}

@media (max-width: 767px) {
  .button.moreStyle a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
    position: relative;
    z-index: 1;
    height: clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
    color: #3d4f30;
    font-family: "Times New Roman", Georgia, serif;
    font-size: clamp(calc(0.625rem * var(--font-scale)), calc(0.328rem * var(--font-scale) + 1.08vw), calc(1.25rem * var(--font-scale)));
    text-decoration: none;
    box-sizing: border-box;
    transition: color 0.5s ease-in-out, width 0.5s ease-in-out;
    color: #ffffff;
    width: clamp(calc(10rem * var(--font-scale)), calc(5.248rem * var(--font-scale) + 17.279vw), calc(20rem * var(--font-scale)));
  }
  .button.moreStyle a::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    width: clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
    height: clamp(calc(1.875rem * var(--font-scale)), calc(0.984rem * var(--font-scale) + 3.24vw), calc(3.75rem * var(--font-scale)));
    border: 1px solid #3d4f30;
    border-radius: clamp(calc(0.9375rem * var(--font-scale)), calc(0.492rem * var(--font-scale) + 1.62vw), calc(1.875rem * var(--font-scale))) clamp(calc(0.9375rem * var(--font-scale)), calc(0.492rem * var(--font-scale) + 1.62vw), calc(1.875rem * var(--font-scale)));
    box-sizing: border-box;
    transition: all 0.4s ease-in-out;
    width: 100%;
    background-color: #1b3211;
    border-color: #1b3211;
  }
  .button.moreStyle a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: clamp(calc(0.875rem * var(--font-scale)), calc(0.459rem * var(--font-scale) + 1.512vw), calc(1.75rem * var(--font-scale)));
    transform: translateY(-50%);
    width: clamp(calc(1.25rem * var(--font-scale)), calc(0.656rem * var(--font-scale) + 2.16vw), calc(2.5rem * var(--font-scale)));
    height: 1px;
    transition: background-color 0.4s ease;
    background-color: #ffffff;
  }
  .button.moreStyle a span::after {
    content: "";
    position: absolute;
    top: 50%;
    right: clamp(calc(0.875rem * var(--font-scale)), calc(0.459rem * var(--font-scale) + 1.512vw), calc(1.75rem * var(--font-scale)));
    width: clamp(calc(0.25rem * var(--font-scale)), calc(0.131rem * var(--font-scale) + 0.432vw), calc(0.5rem * var(--font-scale)));
    height: clamp(calc(0.25rem * var(--font-scale)), calc(0.131rem * var(--font-scale) + 0.432vw), calc(0.5rem * var(--font-scale)));
    border-top: 1px solid #3d4f30;
    border-right: 1px solid #3d4f30;
    transform: translateY(-50%) rotate(45deg);
    transition: border-color 0.4s ease;
    border-color: #ffffff;
  }
}
/* view more ボタン */
/*============================
  共通CSS
============================*/
/* 電話切り替え */
.js-tel {
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  .js-tel {
    pointer-events: auto;
  }
}
/* メイン設定 */
body {
  --wrapper_wide: 1200px;
  --wrapper_padding: 20px;
  --unit_wide: 1200px;
}

/* 拡張wrapper start */
.wrapper_outer {
  /*  */
  width: calc(100vw - max(0px, 50vw - var(--wrapper_wide) / 2 - var(--wrapper_padding)));
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-wrap: nowrap;
  position: relative;
  height: 100%;
}

.wrapper_outer.right {
  margin-left: max(0px, 50vw - var(--wrapper_wide) / 2 - var(--wrapper_padding));
  margin-right: 0;
}

.wrapper_outer.left {
  margin-right: max(0px, 50vw - var(--wrapper_wide) / 2 - var(--wrapper_padding));
  margin-left: 0;
}

.wrapper_outer.center {
  margin-inline: auto;
  width: 100%;
}

.wrapper {
  width: 100%;
  margin-inline: auto;
  box-sizing: border-box;
  /*  */
  max-width: min(100% + var(--wrapper_padding) * 2, var(--wrapper-width) + var(--wrapper-padding) * 2);
  padding-inline: var(--wrapper-padding);
}
@media (max-width: 767px) {
  .wrapper {
    padding-inline: var(--wrapper-padding_sp);
  }
}

/* wrapper */
.wrapper.right_full {
  max-width: initial;
  padding-right: 0;
  margin-right: 0;
}

.wrapper.left_full {
  max-width: initial;
  padding-left: 0;
  margin-left: 0;
}

.right .wrapper {
  margin-left: 0;
}

.left .wrapper {
  margin-right: 0;
}

/* option [.wrapper.full_right, .wrapper.full_left との併用不可]*/
.side_area {
  background-color: rgb(0, 150, 37);
  flex: 1 1 auto;
  height: 20px;
  min-width: 200px;
}

/* 拡張wrapper内 初期階層 */
.item_intro {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(calc(0rem * var(--font-scale)), calc(-1.782rem * var(--font-scale) + 6.479vw), calc(3.75rem * var(--font-scale)));
  align-items: start;
}

.item_intro_title {
  margin-left: clamp(calc(0.9375rem * var(--font-scale)), calc(-0.696rem * var(--font-scale) + 5.94vw), calc(4.375rem * var(--font-scale)));
  padding-right: clamp(calc(0.625rem * var(--font-scale)), calc(0.328rem * var(--font-scale) + 1.08vw), calc(1.25rem * var(--font-scale)));
  writing-mode: vertical-rl;
  text-orientation: mixed;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  z-index: 10;
}
@media (max-width: 767px) {
  .item_intro_title {
    margin-left: 0;
  }
}

.item_intro_title::before {
  content: "";
  display: inline-block;
  width: clamp(calc(1.25rem * var(--font-scale)), calc(0.656rem * var(--font-scale) + 2.16vw), calc(2.5rem * var(--font-scale)));
  aspect-ratio: 1/1;
  background-image: url(../image/title_icon.png);
  background-repeat: no-repeat;
  background-size: contain;
  margin-bottom: clamp(calc(0.625rem * var(--font-scale)), calc(0.328rem * var(--font-scale) + 1.08vw), calc(1.25rem * var(--font-scale)));
}

.item_intro_title.noicon::before {
  display: none;
}

.item_intro_title img {
  width: clamp(calc(2.28125rem * var(--font-scale)), calc(1.197rem * var(--font-scale) + 3.942vw), calc(4.5625rem * var(--font-scale)));
}

.item_intro_body {
  width: 100%;
}

.title_deco {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
}

.title_deco img {
  width: clamp(calc(1.9375rem * var(--font-scale)), calc(0.72rem * var(--font-scale) + 4.428vw), calc(4.5rem * var(--font-scale)));
}

/* 拡張wrapper end *//*# sourceMappingURL=common.css.map */