.grecaptcha-badge {
  z-index: 100;
  bottom: 200px !important;
}

:root {
  /* 色指定 */
  --c-color01: #1c305c;
  /* フォント指定 */
  --ttl-font: "Yuji Syuku", serif;
  --txt-font: "Zen Kaku Gothic New", sans-serif;
  /* 余白 */
  --content-inner-5: min(5vw, 50px);
  --content-inner-3: min(3vw, 30px);
}

/* 全体の文字設定 */
.post_content :is(h2, h3, h4, h5, p, a, td, li) {
  font-family: var(--txt-font);
  color: #222;
  letter-spacing: 0.1em;
}

/* width shape 100% */
.wide {
  margin-right: calc(50% - 50vw);
  margin-left: calc(50% - 50vw);
  background: #ddd;
}
.wide > .wp-block-group__inner-container {
  max-width: 1200px;
  width: 100%;
  margin: auto;
  padding: 100px 0;
}

/* コンテンツ幅 */
body.page #page_contents .post_content {
  max-width: 1200px;
  width: 100%;
}

/* 背景画像 */
/*body {
    overflow: hidden;
}*/
body::before,
.open_drawer_menu #drawer_menu::before {
  position: fixed;
  content: "";
  width: 100%;
  height: 100%;
  background: url(../2026/06/p0044_l.jpg);
  opacity: 0.5;
  top: 0;
}

/* パンくず */
#bread_crumb {
  border: none;
}

/* header */
/* glo-nav */
#global_menu {
  text-align: right;
}
#header_logo img {
  height: 70px;
}
#header_logo a span {
  font-family: var(--ttl-font);
}
#global_menu > ul > li > a {
  font-family: var(--ttl-font);
  font-size: 18px;
  color: #fff;
  letter-spacing: 0.05em;
}
#header .menu_area .bottom {
  border: none;
}
#global_menu > ul > li > a:after {
  background: #fff;
}
#header {
  background: none;
}
/* fix */
body.header_fix #header,
body.header_fix #header_logo {
  background: var(--c-color01);
}
/* ヘッダーボタン */
#header_button a {
  position: relative;
  font-family: var(--ttl-font);
  background: var(--c-color01) !important;
  color: #fff !important;
  z-index: 0;
  height: 60px;
  line-height: 60px;
}
#header_button a::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.1;
  transition: all ease 0.5s;
  top: 0;
  left: 0;
  transform: translateY(-100%);
  z-index: -1;
}
#header_button a:hover::before {
  transform: translateY(0);
}
#header_button {
  gap: 10px;
}

/* page-header */
/* #page_header .headline {
  font-family: var(--ttl-font);
  width: 50%;
  height: auto;
  background: none;
  color: #333;
  font-size: 50px;
  writing-mode: vertical-rl;
  top: 0;
  bottom: 0;
  margin-block: auto;
  left: auto;
  right: 0;
  transform: unset;
  padding-bottom: 100px;
}
#page_header .headline::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 450px;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/head-item02.png) no-repeat center bottom;
  background-size: cover;
  bottom: 0;
  right: 0;
}
#page_header .overlay {
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/head-bg02-100.jpg) center center !important;
  width: 50%;
  left: auto;
  right: 0;
  background-size: cover !important;
}
#page_header {
  width: 95%;
  margin-inline: auto;
  height: 450px;
  aspect-ratio: unset;
  margin-top: 50px;
}
#page_header .image {
  width: 50%;
} */

/* サイドボタン */
#side_icon_button .label {
  padding: 0 5px;
  font-family: var(--txt-font);
  letter-spacing: 0.05em;
  font-weight: 600;
}
#side_icon_button a span {
  color: var(--c-color01);
}

/* h2title */
.post_content .h2title {
  position: relative;
  font-family: var(--ttl-font);
  writing-mode: vertical-rl;
  font-size: 50px;
}
/* h2.wp-block-heading.h2title::first-letter {
  color: var(--c-color01);
  font-size: 70px;
} */
.post_content .h2title::before {
  position: absolute;
  content: "";
  width: 2.5em;
  height: 2.5em;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/h2ttl-item.png) no-repeat;
  background-size: contain;
  z-index: -1;
  top: -0.5em;
  left: 0;
  right: 0;
  margin: auto;
  opacity: 0.2;
}

/* h3title */
.post_content .h3title {
  position: relative;
  font-family: var(--ttl-font);
  z-index: 0;
}
.h3title::before {
  position: absolute;
  content: "";
  width: 250px;
  height: 250px;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/sub-ttl-item.png);
  background-size: contain;
  left: -0.5em;
  bottom: 0;
  opacity: 0.2;
  z-index: -1;
}

/* original-btn */
.original-btn a,
.cb_design_content .link_button a {
  background: var(--c-color01);
  color: #fff;
  position: relative;
  padding: 1em 3em;
  z-index: 0;
  overflow: hidden;
}
.original-btn a:hover,
.cb_design_content .link_button a:hover {
  text-decoration: none;
}
.original-btn a::before,
.cb_design_content .link_button a::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.2;
  z-index: -1;
  top: 0;
  left: 0;
  transform: translateX(-100%);
  transition: 0.5s;
}
.original-btn a:hover::before,
.cb_design_content .link_button a:hover::before {
  transform: translateX(0);
}
.col-content.reverse .txt {
  margin-left: auto;
}

/* side-ttl */
.side-ttl > .wp-block-group__inner-container {
  display: flex;
  flex-direction: row;
  gap: 100px;
  align-items: flex-start;
}
.side-ttl-content {
  width: 100%;
}

/* col-content */
.col-content {
  width: 100vw;
  margin-inline: calc(50% - 50vw);
}
.col-content .txt {
  max-width: 650px;
  width: 100%;
}
.col-content .txt .ttl {
  position: relative;
  writing-mode: vertical-rl;
  font-family: var(--ttl-font);
  text-align: left;
}
.col-content .txt .ttl::before {
  position: absolute;
  content: "";
  width: 250px;
  height: 250px;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/ttl-item.png) no-repeat;
  background-size: contain;
  inset: 0;
  margin: auto;
  z-index: -1;
  opacity: 0.2;
}
.col-content .txt > .wp-block-group__inner-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* banner */
.post_content a.banner-wrap:hover {
  text-decoration: none;
}
.banner-wrap .wp-block-cover {
  padding: 0;
  min-height: 350px;
}
.banner-wrap .wp-block-cover .wp-block-cover__background {
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/head-bg02-100.jpg) center center;
  background-size: contain;
  opacity: 1;
  width: 50%;
  z-index: 0;
}
.banner-wrap .wp-block-cover .wp-block-cover__background::before {
  position: absolute;
  content: "";
  width: 300px;
  height: 300px;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/12/kome-item_1-1.png) no-repeat;
  background-size: cover;
  top: 0;
  bottom: 0;
  margin: auto;
  left: 0;
  right: 0;
  transition: 0.5s;
  z-index: -1;
}
.banner-wrap .wp-block-cover .wp-block-cover__background::after {
  position: absolute;
  content: "";
  width: 180px;
  height: 180px;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/12/ine-item.png) no-repeat;
  top: 50%;
  left: 50%;
  margin: auto;
  background-size: contain;
  z-index: -2;
  transition: all ease 0.5s;
  transform: translate(-50%, -50%) rotate(0deg);
  opacity: 0.3;
}
.banner-wrap:hover .wp-block-cover .wp-block-cover__background::after {
  left: auto;
  bottom: auto;
  top: 50px;
  right: 50px;
  transform: translate(5%, -5%) rotate(30deg);
}
.post_content .banner-wrap p {
  width: 50%;
  font-family: var(--ttl-font);
  font-size: 45px !important;
}
.banner-wrap .wp-block-cover .wp-block-cover__image-background {
  width: 50%;
  margin-left: auto;
  height: 100%;
}

/* point-wrap */
.point-wrap .item .ttl {
  position: relative;
  font-family: var(--ttl-font);
  margin-bottom: 0.5em;
}
.point-wrap .item .ttl::before {
  position: absolute;
  content: "";
  width: 200px;
  height: 200px;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/sub-ttl-item.png) no-repeat;
  background-size: contain;
  left: -0.5em;
  bottom: 0;
  z-index: -1;
  opacity: 0.2;
}
.point-wrap .item {
  background: #fff;
  padding: var(--content-inner-3);
  z-index: 0;
  position: relative;
}
.point-wrap .item::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/head-bg02-100.jpg) center center;
  background-size: cover;
  top: 0;
  left: 0;
  z-index: -1;
}

/* table */
#container .post_content td {
  border: none !important;
  background: rgb(255, 255, 255, 0.8);
  border-bottom: 1px solid #ddd !important;
  vertical-align: middle;
  padding: 1em !important;
}
#container .post_content td:first-child {
  width: 8em;
}

/* お知らせ */
#page_header .headline span {
  text-align: left;
}
body.single-post #container {
  background: none;
}
#single_post_header .category {
  font-family: var(--txt-font);
  background: #333;
}
#archive_blog {
  background: none;
}
.category_sort_button a {
  border: none;
  font-family: var(--txt-font);
}
.category_sort_button {
  gap: 10px;
}

/* footer */
#footer_logo img {
  max-width: 500px;
  width: 100%;
  height: auto;
}
#footer {
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/10/p0500_l.jpg);
  background-color: rgb(75 16 4 / 20%);
  background-blend-mode: multiply;
}
#footer_logo a .logo_text {
  font-family: var(--ttl-font);
  letter-spacing: 0.1em;
}
#footer_menu nav ul {
  display: flex;
  gap: 3em;
  justify-content: center;
}
#footer {
  position: relative;
  z-index: 0;
  overflow: hidden;
}
/* #footer::before {
  position: absolute;
  content: "";
  width: 300px;
  height: 300px;
  background: url(https://www.yorozuhoshina.co.jp/wp-content/uploads/2025/11/h2ttl-item.png) no-repeat;
  background-size: contain;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: -1;
  transform: translateY(-50%);
} */

@media screen and (max-width: 1300px) {
  #page_header {
    margin-top: 25px;
  }
  .side-ttl > .wp-block-group__inner-container {
    flex-direction: column;
  }
  .post_content .h2title {
    writing-mode: horizontal-tb;
    text-align: left;
  }
  .post_content .h2title::before {
    top: 0;
    bottom: 0;
    left: -0.5em;
    right: auto;
  }
}

@media screen and (max-width: 781px) {
  .banner-wrap .wp-block-cover .wp-block-cover__background::after {
    content: none;
  }
}

@media screen and (max-width: 750px) {
  #page_header .headline {
    width: 100%;
    writing-mode: horizontal-tb;
    height: 50%;
    margin-top: 0;
  }
  #page_header .overlay {
    width: 100%;
    height: 50%;
  }
  #page_header .image {
    width: 100%;
    height: 50%;
    top: auto;
    bottom: 0;
  }
  #page_header .headline::before {
    transform: translateY(16px);
  }
}

@media screen and (max-width: 500px) {
  #page_header .headline {
    font-size: 30px;
  }
  #page_header {
    height: 250px;
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}