@charset "UTF-8";

/* =========================================================
   page.css
   固定ページ共通
   外枠は right-layout.css に任せる
========================================================= */

.page-standard-body{
  margin: 0;
  padding: 0;
  background: #fff;
  color: #333;
}

/* ---------------------------------
   固定ページ本文
--------------------------------- */

.page-standard-article{
  width: 100%;
  margin: 0;
  padding: 0;
}

.page-standard-content{
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 0 90px;
  color: #333;
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif !important;
  font-size: 14px;
  line-height: 2.1;
  letter-spacing: 0.06em;
  overflow-wrap: break-word;
  word-break: normal;
}

.page-standard-content > *:first-child{
  margin-top: 0 !important;
}

.page-standard-content > *:last-child{
  margin-bottom: 0 !important;
}

/* ---------------------------------
   見出し
--------------------------------- */

.page-standard-content h1,
.page-standard-content h2,
.page-standard-content h3,
.page-standard-content h4,
.page-standard-content h5,
.page-standard-content h6{
  color: #2a241f;
  font-family: "Noto Serif JP", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", serif !important;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.08em;
  background: none;
  border: none;
}

.page-standard-content h1{
  margin: 0 0 34px;
  font-size: 26px;
  text-align: center;
}

.page-standard-content h2{
  margin: 58px 0 26px;
  font-size: 24px;
  text-align: center;
}

.page-standard-content h3{
  margin: 44px 0 18px;
  font-size: 20px;
}

.page-standard-content h4{
  margin: 34px 0 14px;
  font-size: 17px;
}

/* ---------------------------------
   テキスト
--------------------------------- */

.page-standard-content p{
  margin: 0 0 24px;
}

.page-standard-content a{
  color: #758034;
  text-decoration: none;
  /*border-bottom: 1px solid rgba(117, 128, 52, 0.55);*/
}

.page-standard-content a:hover{
  color: #2a241f;
  border-bottom-color: #2a241f;
}

/* ---------------------------------
   画像
--------------------------------- */

.page-standard-content img{
  max-width: 100%;
  height: auto;
}

.page-standard-content figure{
  margin: 0 0 34px;
}

.page-standard-content figure img{
  display: block;
}

.page-standard-content .aligncenter,
.page-standard-content div.aligncenter{
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.page-standard-content img.aligncenter{
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* ---------------------------------
   リスト
--------------------------------- */

.page-standard-content ul,
.page-standard-content ol{
  margin: 0 0 28px 1.5em;
  padding: 0;
}

.page-standard-content li{
  margin: 0 0 8px;
}

/* ---------------------------------
   テーブル
--------------------------------- */

.page-standard-content table{
  width: 100%;
  max-width: 100%;
  margin: 0 0 34px;
  border-collapse: collapse;
}

.page-standard-content th,
.page-standard-content td{
  padding: 13px 16px;
  border: 1px solid #e8e2d8;
  font-size: 14px;
  line-height: 1.8;
  vertical-align: top;
}

.page-standard-content th{
  background: #faf9f5;
  color: #758034;
  font-weight: 500;
}

/* ---------------------------------
   iframe / YouTube
--------------------------------- */

.page-standard-content iframe{
  display: block;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* ---------------------------------
   上部サブナビ
   旧固定ページの <p class="sub"> 用
--------------------------------- */

.page-standard-content .sub{
  max-width: 1120px;
  margin: 0 auto 28px !important;
  text-align: center !important;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.06em;
  color: #8a8d35;
}

.page-standard-content .sub a{
  color: #8a8d35;
  text-decoration: none;
  border-bottom: none;
}

.page-standard-content .sub a:hover{
  color: #2a241f;
}

.page-standard-content .sub .active a{
  border-bottom: 2px solid #8a8d35;
}

/* ---------------------------------
   Gutenberg 幅崩れ対策
--------------------------------- */

.page-standard-content .alignwide,
.page-standard-content .alignfull{
  max-width: 100%;
}

/* ---------------------------------
   Cocoon / 共通指定に勝たせる
--------------------------------- */

.right-layout-content .page-standard-content{
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 0 90px;
}

.right-layout-content .page-standard-content h1,
.right-layout-content .page-standard-content h2,
.right-layout-content .page-standard-content h3{
  background: none;
  border: none;
}

/* =========================================================
   Responsive
========================================================= */

@media screen and (max-width: 767px){

  .page-standard-content{
    max-width: none;
    padding: 0 0 70px;
    font-size: 13px;
    line-height: 2;
  }

  .page-standard-content h1{
    font-size: 22px;
  }

  .page-standard-content h2{
    margin-top: 46px;
    font-size: 21px;
  }

  .page-standard-content h3{
    margin-top: 36px;
    font-size: 18px;
  }

  .page-standard-content .sub{
    font-size: 13px;
    line-height: 2.1;
  }

  .page-standard-content th,
  .page-standard-content td{
    padding: 11px 12px;
    font-size: 13px;
  }

}


/* =========================================================
   固定ページ共通：本文セクション用クラス
   追加のみ。既存の page-standard-content は変更しない
========================================================= */

.page-content-body{
  width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.page-section{
  width: 100%;
  margin: 0;
  padding: 60px 0;
  box-sizing: border-box;
}

.page-section__inner{
  width: 90%;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* ---------------------------------
   右側エリアいっぱいに広げるセクション
   hero / 黒帯 / 背景画像セクション用
--------------------------------- */

.page-section--wide{
  position: relative;
  left: 50%;
  width: calc(100vw - var(--side-w, 250px));
  max-width: none;
  margin-left: calc((100vw - var(--side-w, 250px)) / -2);
  margin-right: 0;
  box-sizing: border-box;
}

/* wideセクションの中身だけ中央寄せしたい場合 */
.page-section--wide > .page-section__inner{
  width: 90%;
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

/* スマホ：左ナビがないので画面幅いっぱい */
@media screen and (max-width: 900px){

  .page-section--wide{
    width: 100vw;
    margin-left: -50vw;
  }

  .page-section--wide > .page-section__inner{
    width: calc(100% - 32px);
    max-width: none;
  }

}

/* ---------------------------------
   right-layout固定ページ用：wideセクション補正
   page-content-body直下のwideだけに限定
--------------------------------- */

.page-content-body > .page-section--wide {
  position: relative !important;
  left: 50% !important;
  width: calc(100vw - 250px) !important;
  max-width: none !important;
  margin-left: calc((100vw - 250px) / -2) !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

.page-content-body > .page-section--wide > .page-section__inner {
  width: 90% !important;
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

@media screen and (max-width: 900px) {
  .page-content-body > .page-section--wide {
    left: 50% !important;
    width: 100vw !important;
    margin-left: -50vw !important;
  }

  .page-content-body > .page-section--wide > .page-section__inner {
    width: calc(100% - 32px) !important;
    max-width: none !important;
  }
}