@charset "UTF-8";

@font-face {
  font-family: "noto-sans-jp";
  src: url(./fonts/Noto_Sans_JP/NotoSansJP-Regular.woff) format("woff");
  font-weight: normal;
  font-display: swap;
}
@font-face {
  font-family: "noto-sans-jp";
  src: url(./fonts/Noto_Sans_JP/NotoSansJP-Bold.woff) format("woff");
  font-weight: bold;
  font-display: swap;
}
/* ビジュアルエディタのフォント変更 */
#tinymce {
  font-family: "noto-sans-jp", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.bl_post_ttl {
  font-size: min(calc(32 / 1280 * 100vw), 32px);
  font-weight: 400;
  line-height: calc(51.2 / 32);
  margin-bottom: min(calc(24 / 1280 * 100vw), 24px);
}
.bl_post_date {
  display: block;
  font-size: min(calc(14 / 1280 * 100vw), 14px);
  margin-bottom: min(calc(40 / 1280 * 100vw), 40px);
}
/* 記事内見出し */
.bl_post_lv2Heading {
  font-size: min(calc(22 / 1280 * 100vw), 22px);
  letter-spacing: 0.06em;
  line-height: calc(32 / 22);
  font-weight: 700;
  padding-bottom: min(calc(10 / 1280 * 100vw), 10px);
  border-bottom: min(calc(2 / 1280 * 100vw), 2px) solid #d8b787;
}
.bl_post_lv2Heading + * {
  margin-top: 1em;
}
* + .bl_post_lv2Heading,
* + .bl_post_lv3Heading,
* + .bl_post_lv4Heading {
  margin-top: 2em;
}
/* 記事内小見出し */
.bl_post_lv3Heading {
  font-size: min(calc(20 / 1280 * 100vw), 20px);
  letter-spacing: 0.06em;
  line-height: calc(29 / 20);
  color: #b28a50;
  font-weight: 400;
}

.bl_post_lv3Heading + * {
  margin-top: 0.5em;
}
/* 記事内h4見出し */
.bl_post_lv4Heading {
  font-size: min(calc(20 / 1280 * 100vw), 20px);
  letter-spacing: 0.06em;
  line-height: calc(29 / 20);
  font-weight: 400;
}

.bl_post_lv4Heading + * {
  margin-top: 0.5em;
}
/* テキスト */
#tinymce p,
.bl_post_cont p {
  margin-bottom: 1em;
}
#tinymce ul,
.bl_post_cont ul {
  list-style: disc;
  padding-left: 1.5em;
  margin-bottom: 1em;
}
#tinymce ol,
.bl_post_cont ol {
  list-style: num;
  padding-left: 1.5em;
  margin-bottom: 1em;
}
.bl_post_sTxt {
  font-size: 0.8em;
}
.bl_post_lTxt {
  font-size: 1.2em;
}
.bl_post_llTxt {
  font-size: 1.4em;
}
.bl_post_xlTxt {
  font-size: 1.8em;
}
/* リンクタグ */
#tinymce a,
.bl_post_cont a {
  color: blue;
  text-decoration: underline;
}
/* イタリック文字 */
#tinymce em,
.bl_post_cont em {
  font-family: "游ゴシック", "游ゴシック体";
  font-weight: 500;
  font-style: italic;
}
/* 蛍光マーカー */
.underline_red {
  background: linear-gradient(transparent 60%, #ff7f7f 60%);
}
.underline_blue {
  background: linear-gradient(transparent 60%, #66ccff 60%);
}
.underline_green {
  background: linear-gradient(transparent 60%, #66ffcc 60%);
}
.underline_yellow {
  background: linear-gradient(transparent 60%, #ffff66 60%);
}
/* インデント */
.txt_indent {
  display: inline-block;
  padding: 0 0 0 1em;
}
/* マージン */
.m_20 {
  margin-bottom: 20px !important;
}
.m_30 {
  margin-bottom: 30px !important;
}
.m_40 {
  margin-bottom: 40px !important;
}
/* 画像 */
#tinymce img,
.bl_post img {
  max-width: 100%;
  width: auto;
  height: auto;
  display: block;
  float: none !important;
  margin-bottom: 1.5em;
}
#tinymce img.alignright,
.bl_post img.alignright {
  margin: 0 0 0 auto;
}
#tinymce img.alignleft,
.bl_post img.alignleft {
  margin: 0 auto 0 0;
}
#tinymce img.aligncente,
.bl_post img.aligncenter {
  margin: 0 auto;
}
.bl_post_btnWrapper {
  margin: 1.5em 0;
  text-align: center;
}
#tinymce .bl_post_btn,
.bl_post_cont .bl_post_btn {
  cursor: pointer;
  min-width: min(calc(400 / 1280 * 100vw), 400px);
  border-radius: min(calc(36 / 1280 * 100vw), 36px);
  background: #d8b787;
  color: #fff;
  padding: min(calc(11 / 1280 * 100vw), 11px) min(calc(60 / 1280 * 100vw), 60px) min(calc(12 / 1280 * 100vw), 12px);
  font-size: min(calc(16 / 1280 * 100vw), 16px);
  font-weight: 700;
  line-height: calc(25 / 16);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  text-align: center;
  position: relative;
}
#tinymce .bl_post_btn::after,
.bl_post_cont .bl_post_btn::after {
  position: absolute;
  content: "";
  width: min(calc(12 / 1280 * 100vw), 12px);
  height: min(calc(24 / 1280 * 100vw), 24px);
  top: 50%;
  right: min(calc(24 / 1280 * 100vw), 24px);
  transform: translateY(-50%);
  background: url("./images/common/btn_arrow.svg") top center / contain no-repeat;
}
.bl_post_floating-bnr {
  display: flex;
  margin-top: min(calc(48 / 1280 * 100vw), 48px);
}
.bl_post_floating-bnr.sp {
  display: none;
}
.bl_post_floating-bnr img {
  margin-bottom: 0;
}
.bl_post_writer {
  display: grid;
  gap: 16px 40px;
  grid-template-areas:
    "imgWrapper ttl"
    "imgWrapper name"
    "imgWrapper conts";
  margin-top: min(calc(48 / 1280 * 100vw), 48px);
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(2, auto) 1fr;
}
.bl_post_writer .bl_writer_imgWrapper {
  grid-area: imgWrapper;
}
.bl_post_writer .bl_writer_imgWrapper > img {
  margin-bottom: 0;
}
.bl_post_writer .bl_writer_ttl {
  grid-area: ttl;
}
.bl_post_writer .bl_writer_name {
  grid-area: name;
}
.bl_post_writer .bl_writer_conts {
  grid-area: conts;
}
.bl_post_tag_list {
  display: flex;
  flex-wrap: wrap;
  gap: min(calc(16 / 1280 * 100vw), 16px);
  margin-top: min(calc(48 / 1280 * 100vw), 48px);
}
.bl_post_tag_item {
  display: flex;
}
.bl_post_tag {
  color: #a0a0a0;
  padding-left: 0.6em;
  position: relative;
  line-height: calc(21 / 15);
}
.bl_post_tag::before {
  position: absolute;
  content: "#";
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

@media screen and (max-width: 750px) {
  .bl_post_ttl {
    font-size: 40px;
    margin-bottom: 36px;
  }
  .bl_post_date {
    font-size: 24px;
    margin-bottom: 60px;
  }
  /* 記事内見出し */
  .bl_post_lv2Heading {
    font-size: 32px;
    padding-bottom: 15px;
    border-width: 3px;
  }
  /* 記事内小見出し */
  .bl_post_lv3Heading {
    font-size: 30px;
  }
  /* h4見出し */
  .bl_post_lv4Heading {
    font-size: 30px;
  }
  #tinymce .bl_post_btn,
  .bl_post_cont .bl_post_btn {
    width: 600px;
    border-radius: 54px;
    padding: 16.5px 90px 18px;
    font-size: 26px;
  }
  #tinymce .bl_post_btn::after,
  .bl_post_cont .bl_post_btn::after {
    width: 18px;
    height: 36px;
    right: 36px;
  }
  .bl_post_floating-bnr.pc {
    display: none;
  }
  .bl_post_floating-bnr.sp {
    display: block;
  }
  .bl_post_floating-bnr {
    margin-top: 0;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9999;
    width: 100vw;
  }
  .bl_post_floating-bnr img {
    width: 100vw;
  }
  .bl_post_writer {
    gap: 24px;
    grid-template-areas:
      "ttl"
      "imgWrapper"
      "name"
      "conts";
    margin-top: 64px;
    grid-template-columns: auto;
    grid-template-rows: auto;
  }
  .bl_post_tag_list {
    gap: 24px;
    margin-top: 64px;
  }
}