/* ==========================================================================
   共通の補助クラス
   囲み枠・文字色・幅・インデント・画像の著作権キャプション。読み込み順は維持。
   編集案内: CSS編集ガイド.md
   PC用とスマートフォン用は、このファイル内で一緒に管理します。
   ========================================================================== */

/*--------------------------------------------------------------
## 囲み枠・文字色・幅・キャプション
--------------------------------------------------------------*/
.red-box {
  border: 1px solid red;
  padding: 20px;
}
.red-box h3,
.red-box h4 {
  margin: 0 0 1rem;
}
.gray-box {
  border: 1px solid #ccc;
  padding: 20px;
}
.gray-box h3,
.gray-box h4 {
  margin: 0rem 0 1rem;
}
.back-yellow {
  background-color: #fffcdb;
}
.back-yellow h3,
.back-yellow h4 {
  margin: 0rem 0 1rem;
}
.back-yellow h4 {
  font-size: 120%;
}
.c1-indent {
  text-indent: -1em;
  padding-left: 1em;
}
.magin-0,
.magin-0 table {
  margin: 0px;
}
.underline-none {
  border-bottom-style: none !important;
}
.text-red {
  color: red;
}
:root :where(p.has-background) {
  padding: 1rem 1.5rem;
}
.w80rem {
  max-width: 80rem;
  margin: 0 auto;
}
.w85rem {
  max-width: 85rem;
  margin: 0 auto;
}
.w90rem {
  max-width: 90rem;
  margin: 0 auto;
}
.copyright-caption {
  position: relative;
}
.copyright-caption figcaption {
  width: 7rem !important;
  color: black !important;
  font-size: 1.2rem !important;
  margin-bottom: 0;
  margin-top: 0rem !important;
  text-align: right;
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: rgba(
    250,
    250,
    210,
    0.7
  ); /* 背景を半透明にして見やすくする */
  padding: 0.5rem;
}
.copyright-normal figcaption {
  width: 100% !important;
  color: black !important;
  font-size: 1.2rem !important;
  margin-bottom: 0;
  margin-top: 0rem !important;
  text-align: right;
  bottom: 0;
  right: 0;
}