/* パンくずリスト */
.breadcrumb {
  color: #a9a9a9;
  font-size: 0.8125em;
  letter-spacing: 0.08125em;
  margin-block-start: 4em;
  ol,
  li {
    display: flex;
    gap: 0.5rem;
    margin: 0;
    padding-inline: 0;
    align-items: center;
    font-family: "Zen Old Mincho", serif;
  }
  span,
  a {
    display: block;
  }
}
section.error-404 {
  width: var(--contents-block-width);
  margin-inline: auto;
  text-align: center;
  font-size: 1.5em;
  p {
    text-align: center;
  }
  min-height: 50dvh;
  display: grid;
  place-content: center;
}
.drowing-img {
  max-width: 824px;
  height: auto;
  margin-inline: auto;
  margin-block-start: 3em;
  figcaption {
    text-align: center;
    margin-block: 0;
    line-height: 1;
    font-size: 0.75rem;
  }
  figcaption::before {
    content: "( ";
  }
  figcaption::after {
    content: " )";
  }
}
:where(article, .error-on404, div[id^="cate-"]) {
  header.entry-header {
    width: 100%;
    overflow-x: hidden;
    left: 50%;
    transform: translateX(-50%);
    padding-inline-start: var(--block-padding-size);
    position: relative;
    /* margin-block-end: clamp(4rem, 1.967rem + 7.67vw, 12.375rem); */
    /* margin-block-end: 5em; */
    margin-block-end: clamp(4.5em, 3.071rem + 3.81vw, 6.5rem);
    display: grid;
    row-gap: 3.5rem;
  }
  .entry-header {
    background: var(--color-white-color);
    > div {
      height: clamp(18em, 5.727em + 32.73vw, 45em);
      margin-block-start: clamp(4em, 1.143em + 7vw, 7em);
      background-image: url(../../../uploads/2025/10/about-image-header-scaled.webp);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: left 1px top 50%;
      display: grid;
      justify-items: start;
      align-items: end;
      @media (1280px <=width) {
        height: 70dvh;
      }
      @media (1440px >=width) {
        /* height: unset; */
        height: clamp(14.375rem, -0.568rem + 39.85vw, 47.25rem);
      }
    }
    > .inner_page-feature {
      background-image: url(../../../uploads/2025/10/about-image-header-scaled.webp);
    }
    > .inner_page-faq {
      background-image: url(../../../uploads/2025/10/faq-image-header-scaled.webp);
    }
    > .inner_page-company {
      background-image: url(../../../uploads/2025/10/company-image-header-scaled.webp);
    }
    > .inner_page-renovation {
      background-image: url(../../../uploads/2025/11/carportfence-image-header-scaled-1.webp);
    }
    > .inner_page-new__construction {
      background-image: url(../../../uploads/2025/11/concretasphalt-image-header.webp);
    }
    > .inner_page-garden_dogrun {
      background-image: url(../../../uploads/2025/11/gardendogrun-image-header-scaled1.webp);
    }
    > .inner_page-single__construction {
      background-image: url(../../../uploads/2025/10/reform-image-header-scaled.webp);
    }
    > .inner_page-shopping-guide {
      background-image: url(../../../uploads/2025/10/shoppingguide-image-header-scaled.webp);
    }
    > .inner_page-feature {
      background-image: url(../../../uploads/2025/10/about-image-header-scaled.webp);
    }
    /* 
		> .inner_category-news {
			background-image: url(../../../uploads/2025/10/contact-image-header-scaled.webp);
		} */
    > .inner_category-item {
      background-image: url(../../../uploads/2025/10/goods-image-header.webp);
    }
    > .inner_category-works {
      background-image: url(../../../uploads/2025/12/works-image-header-scaled_re.webp);
    }
    h1.entry-title {
      background: #ffffff;
      margin-block: 0;
      padding-block-start: 1.25em;
      line-height: 1.4;
      position: relative;
      /* align-items: end;
align-content: end; */
      left: 0;
      bottom: 0;
      font-size: clamp(1.5em, 0.964em + 1.43vw, 2.25em);
      font-weight: normal;
      letter-spacing: 0.225rem;
      color: var(--color-headline-color);
      @media (width >=1024px) {
        width: clamp(18rem, 4.429rem + 36.19vw, 37rem);
      }
      @media (width < 1024px) {
        width: 95%;
        padding-inline-end: 1em;
      }
    }
    /*  header title　属性出力処理 */
    h1.entry-title::before {
      content: attr(data-slugname);
      display: block;
      font-size: 0.834em;
      margin-block-end: 0.125em;
      align-self: end;
      line-height: 2;
      font-family: "Ysabeau Infant", sans-serif;
      font-weight: bold;
    }
    h1.entry-title::first-letter {
      color: var(--color-accent-color);
      font-weight: 800;
      text-transform: capitalize;
    }
  }
  h2 {
    font-size: clamp(1.2em, 0.107em + 2.38vw, 2.25em);
    font-weight: 400;
    font-family: "Zen Old Mincho", serif;
    line-height: 2;
    letter-spacing: 0.225rem;
    /* color: var(--color-headline-color); */
  }
  h3 {
    font-size: clamp(1.5em, 1.143em + 0.95vw, 2em);
  }
  h3,
  h4,
  h5 {
    font-weight: normal;
  }
  :where(
      .is-dark-section h2,
      :not(.is-dark-section) h2,
      :not(.is-dark-section) h3,
      :not(.is-dark-section) h4,
      :not(.is-dark-section) h5
    ) {
    color: var(--color-headlinein-color);
  }
  h2:nth-of-type(1),
  h2:nth-of-type(1) ~ p {
    text-align: center;
  }
  h2:nth-of-type(1) {
    margin-block-end: 1.35em;
  }
  h2:nth-of-type(1) ~ p {
    line-height: 2;
    letter-spacing: 0.1em;
  }
}
/* 固定ページ */
.lead-block-content {
  /* margin-block: clamp(0.5em, -10.357rem + 16.96vw, 10em) clamp(3.5em, 1em + 6.67vw, 7em); */
  /* margin-block: 1em clamp(3.5em, 1em + 6.67vw, 7em); */
  margin-block: 1em clamp(3.5em, 1em + 6.67vw, 9em);
}
/* Feature:選ばれる理由 */
main.page-feature {
  counter-reset: feature;
}
/* Feature:選ばれる理由 */
/* 背景が暗い設定 */
.about-feature01,
.about-feature03,
.about-flow,
.carpetfence-carport {
  background-color: var(--color-main-color);
  h3,
  p {
    color: var(--color-dark-color);
  }
}
/* 通常 */
.about-feature01,
.about-feature02,
.about-feature03,
.about-feature04 {
  counter-increment: feature 1;
  h3 ~ p {
    text-align: justify;
    line-height: 2.4;
    letter-spacing: 0.1rem;
  }
  > div figure img {
    width: 100%;
    height: 100%;
    min-height: 250px;
    max-height: 60rem;
    object-fit: cover;
  }
  h3.headline-block-text {
    display: grid;
    grid-template-columns: 5rem auto;
    justify-content: start;
    span {
      display: block;
      grid-column: 1 / 3;
      grid-row: 2 / 3;
      margin-block: clamp(0rem, -4.554rem + 7.12vw, 1.85rem)
        clamp(0rem, -9.846rem + 15.38vw, 4rem);
    }
    &::before,
    &::after {
      font-family: "Ysabeau Infant", sans-serif;
      font-size: 1.125rem;
      font-style: normal;
      font-weight: 800;
      line-height: 200%;
      letter-spacing: 0.135rem;
    }
    &::before {
      content: attr(data-slugname);
      grid-column: 1 / 2;
      grid-row: 1 / 2;
    }
    &::after {
      content: counter(feature, decimal-leading-zero);
      grid-column: 2 / 3;
      grid-row: 1 / 2;
      color: var(--color-accent-color);
    }
  }
}
.about-flow,
.inner-pagefaq {
  /* padding-block: 2em 4.374999em; */
  padding-block: clamp(1.75em, 0.857em + 2.38vw, 3rem) 4.374999em;
  h2 {
    line-height: 1;
    font-size: clamp(1.7em, 1.307em + 1.05vw, 2.25em);
    font-weight: 400;
    margin-block-end: 1.75em;
  }
  h2::before {
    content: attr(data-slugname);
    display: block;
    font-size: 1.25rem;
    font-family: "Ysabeau Infant", sans-serif;
    /* color: var(--color-accent-color); */
    font-weight: 800;
    margin-block-end: 1.25em;
  }
  dl {
    margin-inline: auto;
    /* counter-increment: step; */
    dt,
    dd {
      margin-inline: 0;
      padding: 1em 2em;
    }
    dt {
      /* background: var(--color-faq-bg-color); */
      /* color: var(--color-headline-color); */
      padding: 0.6em 2em;
      letter-spacing: 0.1125rem;
      font-weight: 700;
    }
    dt::before {
      /* content: "Step" counter(step, decimal-leading-zero); */
      display: inline-block;
      margin-inline-end: 1em;
      font-family: "Ysabeau Infant", sans-serif;
      font-size: 1.25rem;
      letter-spacing: 0.15rem;
    }
    span {
      font-size: 0.9em;
      padding-inline-start: 1em;
    }
    dd {
      padding-block: 1.5em 3em;
      letter-spacing: 0.1em;
      text-align: justify;
      a.linkbtn {
        white-space: nowrap;
      }
    }
    p {
      margin-block: 0 0.5em;
    }
    div {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 1rem;
      margin-block-start: 1.75em;
      p {
        text-align: center;
      }
    }
    /* .linkbtn-phone {
			color: var(--color-accent-color);
		} */
  }
  @media (834px <=width) {
    dl {
      width: clamp(21.87rem, -5.357em + 72.62vw, 60em);
    }
  }
  @media (834px > width) {
    dl {
      width: 85%;
    }
  }
}
.about-flow {
  counter-reset: step;
  color: var(--color-dark-color);
  h2 {
    color: var(--color-dark-color);
  }
  h2::before {
    color: var(--color-accent-color);
  }
  dl {
    dt {
      background: var(--color-faq-bg-color);
      color: var(--color-headline-color);
      counter-increment: step;
      font-weight: 800;
    }
    dt::before {
      content: "Step" counter(step, decimal-leading-zero);
      font-weight: 700;
    }
    .linkbtn-phone {
      color: var(--color-accent-color);
      margin-block-end: 0;
    }
  }
}
/* carport,fence */
.inner-pagefaq {
  counter-reset: qa;
  color: var(--color-text);
  h2 {
    color: var(--color-accent-color);
    font-size: 1.25rem;
    font-weight: 800;
    font-family: "Ysabeau Infant", sans-serif;
  }
  h2 + p {
    margin-block: 1em 2.85em;
  }
  dl {
    font-family: "Zen Old Mincho", serif;
    dt {
      background: var(--color-main-color);
      color: var(--color-dark-color);
      counter-increment: qa;
    }
    dt::before {
      content: "Q" counter(qa) ".";
      font-weight: normal;
      /* font-family: "Zen Old Mincho", serif; */
    }
    dd {
      display: inline-flex;
    }
    dd::before {
      content: "A" counter(qa) ".";
      margin-inline-end: 1em;
      color: var(--color-accent-color);
      font-size: 1.25rem;
      font-weight: normal;
      letter-spacing: 0.15rem;
    }
  }
}
.width-wide-size img {
  display: block;
  object-fit: cover;
  height: 100%;
  margin-inline: auto;
  width: var(--contents-blocknarrow-width);
}
h4.top-sentence {
  font-size: clamp(1.25em, 1.071rem + 0.48vw, 1.5em);
  letter-spacing: 0.15em;
  margin-block: 2.5em;
  /* color: var(--color-headline-color); */
  font-weight: normal;
}
/* :not(.is-dark-section) h3 {
	color: var(--color-headline-color);
} */
:not(.is-dark-section) h3::before {
  content: attr(data-slugname);
  display: block;
  font-size: 1.25rem;
  font-family: "Ysabeau Infant", sans-serif;
  font-weight: 800;
  letter-spacing: 0.135rem;
  color: var(--color-headline-color);
  margin-block-end: 1.5em;
  /* margin-block-end: 0.5em; */
}
:not(.is-dark-section) h4.top-sentence {
  /* color: var(--color-main-color); */
}
.is-dark-section h2 {
  color: var(--color-dark-color);
}
.is-dark-section h3 {
  color: var(--color-dark-color);
  span {
    color: inherit;
  }
  &::before {
    color: inherit;
  }
}
.is-dark-section h4.top-sentence {
  color: var(--color-dark-color);
}
.carpetfence-carport {
  h3 {
    font-size: clamp(1.875rem, 1.339rem + 1.43vw, 2.625rem);
    margin-block: 0 clamp(1em, 0.286em + 1.9vw, 2em);
    letter-spacing: 0.2625em;
  }
  h3::before {
    content: attr(data-slugname);
    display: block;
    font-size: 1.25rem;
    font-family: "Ysabeau Infant", sans-serif;
    font-weight: 800;
    letter-spacing: 0.135rem;
    margin-block-end: 0.5em;
  }
}
.text-squre-block {
  > div {
    display: grid;
    grid-template-columns: repeat(2, 208px);
    grid-template-rows: repeat(2, 208px);
    align-items: center;
    justify-items: center;
    gap: 1em;
  }
  p {
    align-content: center;
    aspect-ratio: 1 / 1;
    border: 4px solid var(--color-accent-color);
    color: var(--color-white-color);
    background-color: var(--color-main-color);
    width: 100%;
    height: 100%;
    text-align: center;
    font-size: 1.25em;
  }
}
.is-dark-section .text-squre-block {
  > div > p {
    background-color: var(--color-white-color);
    color: var(--color-main-color);
  }
}
/* エクステリア */
.carpetfence-fence-exterior {
  background: var(--color-faq-bg-color, #f7f6f5);
  padding-block: 5.25em;
  text-align: center;
  h3 {
    color: var(--color-headline-color);
    font-size: 1.5em;
    font-style: normal;
    font-weight: 400;
    letter-spacing: 0.15em;
    margin-block-end: 1.5em;
  }
  h3 + p {
    max-width: 617px;
    margin-inline: auto;
    line-height: 240%;
    /* 2.4rem */
    letter-spacing: 0.1rem;
  }
  > div {
    width: var(--contents-block-width);
    margin-inline: auto;
  }
  .images > div {
    display: flex;
    flex-wrap: wrap;
    max-width: 1024px;
    margin-inline: auto;
    justify-content: center;
    gap: 1.75em;
    margin-block-start: 2em;
    p {
      text-align: center;
      line-height: 1;
      margin-block-end: 0.5em;
    }
  }
}
/* page-faq よくある質問 */
.page-faq {
  .entry-content {
    > p:first-child {
      text-align: center;
    }
  }
}
/* コンクリートアスファルト page */
:where(
    .entry-content.renovation,
    .entry-content.new__construction,
    .entry-content.garden_dogrun,
    .entry-content.single__construction
  ) {
  .lead-block-content {
    margin-block-end: 4em;
  }
  .width-narrow p {
    max-width: 754px;
    margin-inline: auto;
    letter-spacing: 0.1em;
  }
  figure.width-wide-size {
    margin-block-end: calc(var(--block-scale) + 2.25em);
    margin-block-end: 5.5em;
  }
}
/* リノベーションページ */
.carpetfence-carport {
  .carport-fence {
    h3 {
      margin-block-end: 0;
    }
    h3 + p {
      margin-block: 0;
      line-height: 2;
      letter-spacing: 0.1rem;
      font-size: 13px;
    }
  }
}
/* コンクリートアスファルト page */
.entry-content.new__construction {
  .images.list {
    max-width: 624px;
    margin-inline: auto;
    background: #434343;
    border-radius: 35px;
    color: var(--color-dark-color);
    > div {
      width: 100%;
      display: flex;
      gap: 0.75em;
      justify-content: center;
      border-radius: 35px;
      padding-block: 74px;
      margin-block-start: 0;
      p {
        @media (600px <=width) {
          -ms-writing-mode: tb-rl;
          writing-mode: vertical-lr;
          -webkit-writing-mode: vertical-lr;
          min-height: 220px;
        }
        display: flex;
        width: fit-content;
        flex-direction: column;
        gap: 1.5em;
        align-items: stretch;
      }
      p span {
        display: block;
        border: 1px solid var(--color-dark-color);
        padding: 1em 1.5em;
      }
      .letter2word span:first-letter {
        letter-spacing: 1rem;
      }
      p:not(:nth-last-of-type(1))::after {
        writing-mode: horizontal-tb;
        -webkit-writing-mode: horizontal-tb;
        -ms-writing-mode: horizontal-tb;
        content: ">>";
        display: block;
        align-content: center;
      }
    }
  }
  .carpetfence-fence-exterior {
    background-color: unset;
  }
  .explane-block {
    text-align: center;
    margin-block-start: 3em;
  }
}
/* page-company 会社案内 */
:where(
    .entry-content.company,
    .entry-content.shopping-guide,
    .entry-content.privacy-policy,
    .entry-content.contact
  ) {
  width: var(--contents-blocknarrow-width);
  margin-inline: auto;
  margin-block-end: 12em;
  h2,
  h3 {
    /* font-size: 2.25rem; */
    font-size: clamp(1.5em, 0.964em + 1.43vw, 2.25em);
    letter-spacing: 0.225rem;
    line-height: 1;
    margin-block-end: 2.55em;
    text-align: center;
    &::before {
      content: attr(data-slugname);
      display: block;
      font-size: 1.25rem;
      font-family: "Ysabeau Infant", sans-serif;
      font-weight: 800;
      letter-spacing: 0.15rem;
      margin-block-end: 1.5rem;
    }
    &::first-letter {
      color: var(--color-accent-color);
      font-weight: 800;
    }
  }
  h3 {
    letter-spacing: 0.225em;
    margin-block-end: 1.85em;
  }
}
:where(
    .entry-content.company,
    .entry-content.shopping-guide,
    .entry-content.privacy-policy
  ) {
  .lead-block-content ~ section {
    margin-block-end: clamp(3.5em, 1em + 6.67vw, 7em);
  }
  .lead-block-content p {
    line-height: 2.4;
    letter-spacing: 0.1rem;
    margin-block-end: 2.5em;
    text-align: justify;
  }
  .signature {
    width: fit-content;
    margin-inline: auto 0;
  }
  .lead-block-content section,
  .entry-content > section {
    width: var(--contents-blocknarrow-width);
    margin-inline: auto;
  }
  .company-sdgs {
    .lead-block-content {
      margin-block: 2em 5em;
      figure {
        max-width: 600px;
        margin-inline: auto;
        margin-block: 4em 5em;
      }
    }
    h4 {
      color: var(--color-headline-color);
      font-size: 1.5rem;
      margin-block: 0;
    }
    p {
      line-height: 2.4;
      text-align: justify;
      letter-spacing: 0.1rem;
    }
    .inner-detail {
      border-top: 1px solid var(--color-dark-color);
      padding-block: 3em;
      > div {
        display: grid;
      }
      .inner-detail img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
      &:last-child {
        border-bottom: 1px solid var(--color-dark-color);
      }
    }
  }
}
.entry-content.shopping-guide,
.entry-content.privacy-policy {
  h2,
  h3,
  h4 {
    font-weight: normal;
    color: var(--color-headline-color);
  }
  h2 {
    /* font-size: 2.25em; */
    font-size: clamp(1.5em, 0.964em + 1.43vw, 2.25em);
    line-height: 2;
    letter-spacing: 0.225em;
  }
  .guide-details h2 {
    margin-block: 4em 1.35em;
  }
  h3 {
    font-size: 1.5em;
    letter-spacing: 0.15em;
    text-align: start;
    border-bottom: 1px solid var(--color-dark-color);
    padding-block-end: 0.8em;
    margin-block-end: 1em;
  }
  h4 {
    color: var(--color-text);
    font-size: 1em;
    line-height: 2.4;
    letter-spacing: 0.1em;
  }
  p {
    line-height: 2.6;
    letter-spacing: 0.1em;
    margin-block: 0;
  }
  .shopping_guide-header {
    margin-block-end: 7em;
  }
  .guideblock {
    margin-block-end: 4.5em;
    img {
      max-width: 280px;
      display: block;
      margin-block: 0.5em 1.25em;
    }
  }
  ul {
    margin-inline-start: 0;
    padding-inline-start: 0;
    list-style: none;
  }
  ul,
  ol {
    margin-block-start: 0.75em;
  }
  ol {
    padding-inline-start: 1.25em;
  }
  li {
    line-height: 2.6;
    letter-spacing: 0.1em;
    margin-block: 0;
  }
  ul li::before {
    content: "※ ";
  }
  li a {
    display: inline-block;
    text-decoration: underline;
    text-decoration-color: var(--color-dark-color);
    text-underline-offset: 0.2em;
    text-decoration-thickness: 1px;
    padding-inline: 0.55em;
  }
}
.entry-content.privacy-policy {
  h3 ~ p {
    text-align: justify;
  }
  h3 {
    margin-block-start: 2em;
  }
  h2 {
    text-align: start;
    margin-block: 2em 1em;
  }
  .lead-block-content {
    h2 {
      margin-block-start: 0;
      line-height: 1;
    }
    p {
      text-align: center;
    }
  }
  .details-block {
    margin-block-start: var(--block-scale);
    h2:nth-of-type(1),
    h2:nth-of-type(1) ~ p {
      text-align: justify;
    }
    h2 {
      margin-block: 1em;
    }
  }
}
/* お問い合わせ */
.entry-content.contact {
  width: var(--contents-blocknarrow-width);
  margin-inline: auto;
}
.opencontact {
  width: clamp(37.5em, 7.346em + 47.12vw, 49.75em);
  margin-inline: auto;
  margin-block-start: 2.25em;
  background-color: var(--color-faq-bg-color);
  display: grid;
  gap: 1em;
  padding-block: 1em 1.75em;
  font-family: "Zen Old Mincho", serif;
  p {
    text-align: center;
    margin-block: 0;
  }
  p:nth-child(1) {
    font-size: 2rem;
    font-weight: 700;
    font-family: "Zen Old Mincho", serif;
    letter-spacing: 0.1rem;
    border-bottom: 1px solid var(--color-dark-color);
    width: fit-content;
    margin-inline: auto;
    padding-inline: 0.8em;
    padding-block-end: 0.25em;
  }
  p:nth-child(2) {
    padding-block-start: 0.5em;
    font-size: 1.25rem;
  }
}
.contact-form-mail {
  label {
    white-space: nowrap;
  }
  form {
    margin-inline: auto;
    color: var(--color-text);
    input[type="text"],
    input[type="email"],
    input[type="password"],
    textarea,
    select,
    button,
    input[type="submit"] {
      -webkit-appearance: none;
      appearance: none;
      box-shadow: none;
    }
    /* 共通フォントと行の高さ */
    input,
    textarea,
    select,
    button {
      font-family: inherit;
      /* 親要素のフォントを継承 */
      font-size: 1rem;
      /* 適切なフォントサイズ */
      line-height: 1.5;
      color: inherit;
    }
    /* focus時のアウトラインを明確にする */
    input:focus,
    textarea:focus,
    select:focus,
    button:focus {
      outline-offset: 0;
      outline: none;
    }
    label:has(input[type="checkbox"]) {
      display: flex;
      align-items: center;
      column-gap: 0.25em;
    }
    span:has(input[type="checkbox"]) .wpcf7-list-item.first,
    small.zipcode_note {
      margin-inline-start: 0;
    }
    input[type="checkbox"],
    input[type="radio"] {
      outline: none;
      /* サイズ調整 */
      width: 1.2em;
      height: 1.2em;
    }
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    textarea {
      width: 100%;
      padding: 0.5em 0.75em;
      border: 1px solid #e1e1e1;
      font-size: inherit;
      border-radius: 5px;
    }
  }
  .input_area {
    p {
      display: grid;
      grid-template-columns: minmax(8em, 8vw) 1fr;
      justify-content: start;
      justify-items: start;
      column-gap: 1em;
      /* margin-block: 0 1.5em; */
      margin-block: 0 2.5em;
      label,
      > span {
        display: block;
        letter-spacing: 0.1rem;
        width: 100%;
      }
      > br {
        display: none;
      }
    }
    p {
      span.wpcf7-form-control-wrap {
        display: grid;
        align-items: center;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
        justify-content: start;
        column-gap: 0.5em;
      }
      span.wpcf7-not-valid-tip {
        grid-row: 2 / 3;
        grid-column: 2 / 3;
        margin: 0;
      }
      span.wpcf7-form-control-wrap::before {
        content: "　　";
        display: block;
        width: fit-content;
        font-size: 0.7em;
        /* background-color:var(--color-main-color);
			color:var(--color-dark-color); */
        text-align: center;
        margin-inline-end: 1em;
        padding: 0.25em 0.75em;
        font-family: sans-serif;
        letter-spacing: 0.2rem;
        white-space: nowrap;
        line-height: 2.5;
        grid-column: 1 / 2;
        grid-row: 1 / 3;
      }
    }
    p:has(textarea) {
      span.wpcf7-form-control-wrap {
        align-items: start;
      }
    }
    p:has(.wpcf7-validates-as-required) {
      span.wpcf7-form-control-wrap::before {
        content: "必須";
        display: inline-block;
        width: fit-content;
        font-size: 0.7em;
        background-color: var(--color-main-color);
        color: var(--color-dark-color);
        text-align: center;
        margin-inline-end: 1em;
        /* padding: 0.25em 0.75em; */
        font-family: sans-serif;
        letter-spacing: 0.2rem;
      }
    }
    p:has(small.zipcode_note) {
      label {
        grid-column: 1/2;
        grid-row: 1/3;
      }
      > span {
        grid-column: 2/3;
        grid-row: 1/2;
      }
      > small {
        display: block;
        grid-column: 2/3;
        grid-row: 2/3;
        padding-inline-start: 4em;
      }
    }
    p:has(label) {
      line-height: 2;
    }
    p:not(:has(textarea)) {
      align-items: center;
    }
  }
  /* 確認画面と完了画面を非表示 */
  .confirm_area,
  .thanks_area {
    display: none;
  }
  /* デフォルトのサンクスメッセージを非表示 */
  .wpcf7-response-output {
    display: none;
  }
  /* 確認画面のスタイル */
  .confirm_area {
    padding: 20px 0;
  }
  .confirm_area h2 {
    margin-bottom: 20px;
    padding-bottom: 10px;
    font-size: 1.5em;
    font-weight: bold;
    border-bottom: 1px solid var(--color-headlinein-color);
  }
  .confirm_item p {
    display: flex;
    border-bottom: 1px solid var(--color-faq-bg-color);
    align-items: flex-start;
  }
  .input_area {
    .confirm_item p {
      padding: 15px 10px;
    }
  }
  .confirm_area {
    .confirm_item p {
      margin-block: 0;
      padding: 0.25em;
    }
    .confirm_label {
      min-width: 11vw;
      margin-inline-end: 2em;
      width: fit-content;
    }
  }
  .confirm_value {
    flex: 1;
    white-space: pre-wrap;
    word-break: break-word;
  }
  .confirm_value:empty::after {
    content: "（未入力）";
  }
  input[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
  }
  /* ボタンのスタイル */
  .button_group {
    display: flex;
    gap: 12em;
    margin-top: 2em;
    justify-content: center;
    p {
      display: grid;
      gap: 0.5em;
      > br {
        display: none;
      }
    }
  }
  .confirm_button,
  input[type="submit"] {
    border: none;
    padding: 1em 4em;
    font-size: 1.025em;
    cursor: pointer;
    background: var(--color-main-color);
    color: var(--color-accent-color);
    border-radius: 3em;
    transition: all 0.3s;
    font-weight: bold;
  }
  .confirm_button:hover,
  input[type="submit"]:hover {
    background: var(--color-main-color);
    color: var(--color-dark-color);
  }
  .confirm_button,
  .back_button {
    transition: all 0.3s;
  }
  .confirm_button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }
  /* 確認 */
  .confirm_area {
    .confirm_button:hover:not(:disabled) {
      background: var(--color-main-color);
      color: var(--color-dark-color);
    }
    .back_button {
      border: none;
      padding: 1em 4em;
      font-size: 1.025em;
      cursor: pointer;
      background: var(--color-text);
      color: var(--color-dark-color);
      border-radius: 3em;
      transition: all 0.3s;
      font-weight: bold;
    }
    .back_button:hover {
      background: var(--color-text);
      color: var(--color-accent-color);
    }
    .acceptance-wrapper:has(input[type="checkbox"]:checked) + .button_group {
      .back_button {
        opacity: 0.7;
      }
    }
  }
  /* 完了画面のスタイル */
  .thanks_area {
    padding: 60px 20px;
    text-align: center;
    backgrouborder: 1px solid #f9f9f9;
    border-radius: 8px;
  }
  .thanks_area h2 {
    margin-bottom: 20px;
    font-size: 2em;
  }
  .thanks_area p {
    line-height: 1.8;
  }
  /* プライバシーポリシー同意部分 */
  .wpcf7-acceptance {
    margin: 20px 0;
  }
  .acceptance-wrapper {
    margin: 20px 0;
    padding: 15px;
    background: #f5f5f5;
    border-radius: 4px;
  }
}
.contact-policy {
  margin-block-start: 6.25em;
  .inner_contact-policy {
    height: 210px;
    overflow-y: scroll;
    border: 1px solid var(--color-dark-color);
    padding-block: 1em 1.5em;
    padding-inline: 2em 2.5em;
  }
  ol {
    margin-inline-start: 1em;
  }
  ul {
    list-style: none;
  }
  h4 {
    border-top: 1px solid var(--color-dark-color);
    border-bottom: 1px solid var(--color-dark-color);
    padding-block: 0.75em;
  }
}
@media (1024px <=width) {
  .about-feature01,
  .about-feature02,
  .about-feature03,
  .about-feature04 {
    h3 ~ p {
      width: clamp(26em, 11.231rem + 23.08vw, 32em);
    }
  }
}
@media (1024px < width) {
  article {
    header.entry-header,
    .inner-block-columns {
      padding-inline-start: var(--block-padding-size);
    }
    .inner-block-columns_re {
      padding-inline-end: var(--block-padding-size);
    }
  }
  .inner-block-columns,
  .inner-block-columns_re {
    > div {
      padding-block-start: clamp(3.875rem, -0.946rem + 12.86vw, 10.625rem);
      display: flex;
      gap: clamp(2rem, -11.571rem + 21.21vw, 13.875rem);
      justify-content: flex-end;
      max-width: 1920px;
      margin-inline: auto;
    }
    &.has-after-block {
      > div {
        padding-block-end: 0;
      }
    }
    figure {
      margin-block: 0;
    }
    img {
      display: block;
      height: 100%;
      object-fit: cover;
    }
    > div > div {
      align-self: center;
    }
    &.ajust-block > div {
      padding-block: 0;
    }
  }
  .entry-content.feature {
    .inner-block-columns,
    .inner-block-columns_re {
      padding-block-end: clamp(3.875rem, -0.946rem + 12.86vw, 10.625rem);
    }
  }
  .inner-block-columns_re {
    > div {
      flex-direction: row-reverse;
    }
  }
  :where(.carpetfence-fence, .carpetfence-carport) {
    padding-block-end: clamp(3.875rem, -0.946rem + 12.86vw, 10.625rem);
    h4 ~ p {
      text-align: justify;
      font-size: 1rem;
      line-height: 2.4;
      letter-spacing: 0.1rem;
      width: 30em;
    }
    .img-list-block > div {
      display: flex;
      /* width: var(--contents-block-width); */
      width: calc(var(--contents-blocknarrow-width) + 10em);
      margin-inline: auto;
      gap: 1em;
    }
    > div {
      display: grid;
      /* gap: clamp(3.875rem, -0.946rem + 12.86vw, 10.625rem); */
      gap: clamp(3.875em, -1.554em + 8.48vw, 8.625rem);
      .inner-block-columns,
      .inner-block-columns_re {
        padding-inline-start: unset;
        > div {
          justify-content: space-between;
          width: var(--contents-block-width);
        }
      }
      .inner-block-columns {
        > div {
          padding-block-end: 0;
        }
      }
      .inner-block-columns_re {
        padding-inline-end: unset;
        > div {
          padding-block: 0;
          justify-content: center;
          width: var(--contents-block-width);
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          grid-template-rows: auto;
        }
        > div > div:nth-child(1) {
          grid-column: 2/3;
          grid-row: 1/2;
          padding-inline-start: clamp(2rem, 1.995rem + 0.01vw, 9rem);
        }
        .text-squre-block {
          justify-items: center;
          grid-column: 1/2;
          grid-row: 1/2;
        }
        h4.top-sentence {
          margin-block-start: 0;
        }
      }
    }
    .about-flow.is-dark-section {
      /* padding-block: 0 3em; */
    }
  }
  .entry-content.renovation {
    .img-list-block + div {
      > div {
        display: grid;
        gap: 3em;
      }
      .inner-block-columns_re > div {
        padding-block: 0;
      }
    }
  }
  .company-sdgs {
    .inner-detail > div {
      grid-template-columns: 348px 1fr;
      grid-template-rows: auto;
      gap: 3.5rem;
      > div {
        grid-column: 2/3;
        grid-row: 1/2;
      }
      figure {
        grid-column: 1/2;
        grid-row: 1/2;
      }
    }
  }
  .entry-content.single__construction {
    h3[data-slugname] {
      margin-block-end: 0;
    }
    h3[data-slugname] + p {
      color: #878787;
    }
  }
  .entry-content.garden_dogrun,
  .entry-content.single__construction {
    .carpetfence-fence:has(h3[data-slugname="Dogrun"]),
    .carpetfence-fence:has(div[id="carport-fence"]) {
      padding-block-end: calc(
        clamp(3.875rem, -0.946rem + 12.86vw, 10.625rem) / 2
      );
    }
  }
  .entry-content.renovation {
    .about-flow.is-dark-section {
      padding-block-start: 0;
    }
    .is-dark-section:has(.about-flow.is-dark-section) {
      padding-block-end: 0;
    }
  }
}
.inner-block-columns.ajust-block.oncemore {
  > div {
    display: grid;
    @media (1024px < width) {
      grid-template-columns: 0.7fr 0.9fr;
    }
    /* padding-block: 0 clamp(3.875rem, -0.946rem + 12.86vw, 10.625rem); */
    > div {
      justify-self: end;
    }
    > figure {
      width: 100%;
      img {
        width: 100%;
        min-width: 280px;
        height: 100%;
        object-fit: contain;
      }
    }
    @media (1024px >=width) {
      > figure {
        width: 100%;
        img {
          max-width: 500px;
        }
      }
    }
  }
}
@media (width <=1024px) {
  .about-flow,
  .inner-pagefaq {
    dl {
      div {
        flex-direction: column;
      }
    }
  }
}
.inner-detail {
  display: none;
}
main[class*="category-"] {
  .post-li {
    width: var(--contents-blocknarrow-width);
    margin-inline: auto;
  }
}
.pagination_wrapper .nav-links {
  width: var(--contents-blocknarrow-width);
  margin-inline: auto;
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5em;
  /* margin-block: var(--block-scale); */
  a {
    display: block;
    padding: 0.25em;
    font-size: 15px;
  }
}
span.page-numbers:not(.dots),
a.page-numbers:not(.prev):not(.next) {
  background-color: var(--color-white-color);
  color: var(--color-main-color);
  width: calc(1.5em + 1vw);
  height: calc(1.5em + 1vw);
  display: grid;
  justify-items: center;
  align-items: center;
  align-content: center;
  border-radius: 50%;
  border: 1px solid var(--color-main-color);
}
span.page-numbers.current {
  background-color: var(--color-main-color);
  color: var(--color-accent-color);
}
a.page-numbers.prev {
  margin-inline-end: 1em;
}
a.page-numbers.next {
  margin-inline-start: 1em;
}
a.page-numbers {
  transition: all 0.7s ease;
}
a.page-numbers.prev:hover,
a.page-numbers.next:hover {
  opacity: 0.5;
}
a.page-numbers:not(.prev):not(.next):hover {
  background-color: var(--color-main-color);
  color: var(--color-dark-color);
}
:where(main.category-news, main.category-works, main.category-item) {
  margin-block-end: var(--block-scale);
  .post-li {
    display: grid;
    gap: 2em;
    width: var(--contents-blocknarrow-width);
    margin-block-end: var(--block-scale);
    article a {
      display: flex;
      gap: 2em;
      .post-thumbnail {
        height: 100%;
        width: 100%;
        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          display: block;
        }
      }
      h2,
      .post-excerpt {
        text-align: start;
        letter-spacing: 1px;
      }
      h2 {
        line-height: 1.4;
        margin-block: 0;
        font-size: clamp(1.25em, 1.071em + 0.48vw, 1.5em);
      }
      time {
        letter-spacing: 0.1em;
        line-height: 2.4;
        font-size: 0.875em;
      }
      .post-excerpt {
        text-align: justify;
        margin-block-end: 0.25em;
        line-height: 1.7;
      }
    }
  }
}
main.category-news {
  .post-li article a {
    display: flex;
    gap: 2em;
    align-items: center;
    .post-thumbnail {
      max-width: 300px;
      aspect-ratio: 4 / 3;
      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }
  }
}
main.category-works,
main.category-item {
  padding-block-end: 2em;
  .post-li,
  .cat-il {
    display: grid;
    justify-items: center;
    /* justify-content: space-between; */
    justify-content: center;
  }
  article a {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .post-thumbnail {
    aspect-ratio: 4 / 3;
  }
  .itemimg {
    max-height: 18.75em;
    aspect-ratio: 3 / 4;
  }
  .itemname {
    line-height: 1.5;
    /* margin-block: 0.5em 1em; */
  }
  .itemprice,
  .itemsoldout {
    margin-inline: auto 0;
    width: fit-content;
  }
}
main.category-works {
  .post-li {
    grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
    gap: 3em;
  }
  article a {
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    align-items: flex-start;
    gap: unset;
    img {
      max-width: 460px;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}
/* 商品一覧 */
main.category-item {
  .cat-il {
    width: var(--contents-blocknarrow-width);

    margin-inline: auto;
    grid-template-columns: repeat(auto-fit, 18.75em);
    gap: 3em 2em;
    margin-block-end: var(--block-scale);
    @media (600px>=width) {
      width: 100%;
      padding-block-end: 4em;
    }
    a > img {
      display: block;
      max-width: 18.75em;
      /* aspect-ratio: 1 / 1.23;	 */
      height: auto;
      object-fit: contain;
      @media (1400px<=width) {
        width: 18.75em;
      }
    }
  }
}
body.single-post {
  article header.entry-header > div {
    /* background: unset; */
    /* background-color: red; */
    height: 10em;
    background-position: right 0 top 50%;
    h1.entry-title {
      width: unset;
      padding-inline-end: 2em;
    }
  }
}
body.wp-theme-welcart_basic {
  header.entry-header {
    row-gap: unset;
  }
  header.entry-header.page-usces-cart-header > div {
    height: unset;
    background-image: unset;
    h1 {
      padding-block-start: unset;
    }
  }
}
/* 商品個別ページ */
.storycontent {
  width: var(--contents-block-width);
  margin-inline: auto;
  margin-block-end: var(--block-padding-size);
  .detail-box h2.item-name {
    margin-block: 0;
    text-align: start;
  }
  /* 商品アイテム */
  #itempage {
    display: grid;
    margin-inline: auto;
    .detail-box .itemcode {
      border-bottom: none;
    }
    #img-box,
    .detail-box {
      float: none;
      width: unset;
    }
    .itemsubimg {
      margin: unset;
      display: flex;
      @media (600px >= width) {
        flex-wrap: wrap;
      }
      /*  */
      padding-inline: 0.5em;
      width: 100%;
      column-gap: 0.5em;
      overflow-x: scroll;
      position: relative;
      /* macOSでスクロール可能であることを示す左右のグラデーション */
      &::before {
        content: "";
        position: sticky;
        left: 0;
        width: 30px;
        height: 100%;
        background: linear-gradient(
          to right,
          rgba(255, 255, 255, 0.95),
          transparent
        );
        pointer-events: none;
        z-index: 1;
        flex-shrink: 0;
      }
      &::after {
        content: "";
        position: sticky;
        right: 0;
        width: 30px;
        height: 100%;
        background: linear-gradient(
          to left,
          rgba(255, 255, 255, 0.95),
          transparent
        );
        pointer-events: none;
        z-index: 1;
        flex-shrink: 0;
      }
      /* カスタムスクロールバー - Firefox用 */
      scrollbar-width: auto;
      scrollbar-color: rgba(0, 0, 0, 0.6) rgba(0, 0, 0, 0.15);
      /* カスタムスクロールバー - Webkit系ブラウザ用 */
      &::-webkit-scrollbar {
        height: 12px;
      }
      &::-webkit-scrollbar-track {
        background: rgba(0, 0, 0, 0.15);
        border-radius: 6px;
        border: 1px solid rgba(0, 0, 0, 0.1);
      }
      &::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.6);
        border-radius: 6px;
        border: 2px solid rgba(255, 255, 255, 0.3);
        &:hover {
          background: rgba(0, 0, 0, 0.8);
        }
        &:active {
          background: rgba(0, 0, 0, 0.9);
        }
      }
      img {
        width: 100px;
      }
    }
    .item-info {
      padding-block-start: unset;
    }
    .item-info .skubutton {
      background-color: var(--color-main-color);
      padding: 1em 3em;
      margin-inline-start: 1em;
      letter-spacing: 0.1em;
      font-family: "Zen Old Mincho", serif;
    }
  }
  .item-description p {
    text-align: start;
  }
  .field {
    font-family: "Zen Old Mincho", serif;
    .field_price {
      font-size: 36px;
    }
    span.field_cprice,
    em.tax,
    .zaikostatus {
      color: var(--color-text);
      font-weight: normal;
      font-size: 16px;
    }
  }
}
/* カート系 */
span.quantity.item-quantity input[type="number"] {
  width: unset;
  padding-inline: 0.3em;
  font-size: 16px;
}
.item-info div.skuname {
  background-color: unset;
}
.item-description {
  margin-block-start: 3em;
  padding-block-start: 3em;
  border-top: 1px solid var(--color-main-color);
}
/* カート */
main.page-usces-member,
main.page-usces-cart:has(data-slugname="shopping cart") {
  div.cart_navi {
    margin-block-end: 2em;
    li {
      font-weight: lighter;
    }
  }
}
.page-entry-width,
h1 + div {
  div.cart_navi li,
  div.cart_navi li::before,
  div.cart_navi li::after {
    color: var(--color-main-color);
    background-color: var(--color-dark-color);
  }
  div.cart_navi li.current,
  div.cart_navi li.current::before,
  div.cart_navi li.current::after {
    color: var(--color-dark-color);
    background-color: var(--color-main-color);
  }
}
main.page-usces-cart,
main.page-usces-member {
  h5 {
    font-size: 16px;
    color: var(--color-headlinein-color);
  }
  form,
  form[name="loginform"],
  #memberpages,
  #info-confirm {
    font-size: 1em;
    #cart_table .quantity input {
      padding: 0.35em 0.5em;
    }
    #nav + .send {
      padding-block-start: 0;
    }
    table,
    .customer_form,
    #cart_table {
      font-size: inherit;
      border-collapse: collapse;
      border: 1px solid var(--color-faq-bg-color);
      th {
        font-family: sans-serif;
        font-size: 1em;
        font-weight: normal;
      }
      td {
        font-family: "Zen Old Mincho", serif;
        font-size: 16px;
        padding: 0.75em 0.5em;
        &.thumbnail {
          width: 6em;
        }
      }
    }
    /* 会員情報入力フォーム */
    input:not([type="radio"]):not([type="checkbox"]),
    select,
    textarea {
      font-size: 1em;
      padding: 0.5em 0.35em;
      margin-inline: 0.5em;
      border: 1px solid #e1e1e1;
      border-radius: 0.5em;
      appearance: none;
      -webkit-appearance: none;
      box-shadow: none;
    }
    textarea {
      width: 99%;
      height: 6em;
    }
    select,
    ::picker(select) {
      appearance: base-select;
    }
    select::picker-icon {
      color: #999999;
      transition: 0.4s rotate;
    }
    input:not([type="radio"]):not([type="checkbox"]):focus,
    select:focus,
    textarea:focus {
      outline: 1px solid var(--color-text);
      border-color: transparent;
    }
    input.delButton {
      padding: 0.15em 0.35em;
      font-size: 0.85em;
      cursor: pointer;
    }
    .customer_form th em {
      color: #d96988;
      font-size: 0.8em;
    }
    .customer_form input#zipcode {
      margin-right: 0.35em;
      width: 7em;
    }
    .customer_form th {
      background-color: var(--color-faq-bg-color);
      white-space: nowrap;
    }
    /* カートボタン */
    .send input,
    input[type="submit"],
    #wc_login .loginbox input,
    #wc_member .loginbox input {
      appearance: none;
      cursor: pointer;
      border: 1px solid var(--color-text);
      padding: 0.25em 0.5em;
      &.continue_shopping_button,
      &.back_to_customer_button,
      &.back_cart_button,
      &.top.back,
      &.back_to_delivery_button {
        font-size: 16px;
        background-color: var(--color-faq-bg-color);
        color: var(--color-text);
        border-color: var(--color-text);
        transition: 1s ease;
        padding-inline: 1em;
        &:hover {
          background-color: var(--color-accent-color);
          color: var(--color-main-color);
          border-color: var(--color-accent-color);
        }
      }
      &.top.back {
        padding-inline: 1.5em;
      }
      &.to_customerinfo_button,
      &.to_memberlogin_button,
      &.to_confirm_button,
      &.checkout_button,
      &.to_deliveryinfo_button,
      &.to_reganddeliveryinfo_button,
      &#member_login,
      &[name="regmember"] {
        font-size: 16px;
        background-color: var(--color-main-color);
        color: var(--color-accent-color);
        border-color: var(--color-accent-color);
        transition: 1s ease;
        padding: 0.45em 0.5em;
        &:hover {
          background-color: var(--color-accent-color);
          color: var(--color-main-color);
          border-color: var(--color-accent-color);
        }
      }
      &[name="regmember"] {
        padding-inline: 2em;
      }
    }
    /* 認証メール */
    #memberedit {
      h2 {
        font-weight: normal;
        font-size: 1.5em;
        margin-block-end: 3em;
      }
      p {
        line-height: 1.4;
      }
    }
  }
  #newmember {
    .error_message {
      padding-block-end: 1em;
    }
    .header_explanation {
      ul {
        margin-inline-start: 1em;
      }
      li {
        line-height: 1.4;
        margin-block-end: 0.5em;
      }
    }
  }
  #wc_login,
  #wc_member {
    .member_page_title {
      margin-block: 2em 0;
      line-height: 1.5;
      font-weight: normal;
    }
    .loginbox .new-entry {
      margin-block-start: 5em;
      h2 {
        font-size: 1.05em;
        font-weight: normal;
      }
      #nav a {
        font-size: 16px;
        background-color: var(--color-main-color);
        color: var(--color-accent-color);
        border-color: var(--color-accent-color);
        transition: 1s ease;
        padding: 0.45em 1em;
        &:hover {
          background-color: var(--color-accent-color);
          color: var(--color-main-color);
          border-color: var(--color-accent-color);
        }
      }
    }
    .forgetmenot {
      align-content: center;
      line-height: 1;
      position: relative;
      label {
        display: flex;
        align-items: center;
        column-gap: 0.5em;
      }
      input {
        width: 1.3em;
        height: 1.3em;
      }
    }
  }
  #wc_cart #cart .upbutton input {
    background-color: var(--color-white-color);
    color: #a86779;
    border-color: #a86779;
    font-size: 0.9em;
    font-family: "Zen Old Mincho", serif;
    transition: all 0.7s ease;
  }
  #wc_cart #cart .upbutton input:hover {
    background-color: var(--color-text);
    color: var(--color-accent-color);
  }
  #confirm_table {
    h3 {
      font-size: 1.1em;
      color: var(--color-headline-color);
      text-align: center;
    }
    td h3::before {
      display: inline;
      content: "[ ";
      font-size: 1em;
      font-weight: unset;
      letter-spacing: unset;
      margin-block-end: unset;
    }
    td h3::after {
      display: inline;
      content: " ]";
      font-size: 1em;
      font-weight: unset;
      letter-spacing: unset;
      margin-block-end: unset;
    }
  }
}
a[title="パスワードをお忘れですか？"]:hover {
  opacity: 0.65;
}
/* .member-page .send input[name="regmember"] {
	color: var(--color-text);
} */
#wc_customer.post,
#wc_delivery.post,
#wc_confirm.post,
#wc_login.post,
#wc_newmemberform.post,
#wc_ordercompletion.post {
  padding-block: 7.5em 9em;
}
#wc_ordercompletion.post {
  h1 {
    padding-block-start: 2em;
  }
  h1,
  p {
    text-align: center;
  }
}
/* 投稿用 */
article.category-works {
  img {
    display: inline-block;
    width: unset;
    height: unset;
  }
}
@media (1024px <=width) {
  /* 商品個別ページ */
  .storycontent {
    #itempage {
      max-width: 1100px;
      grid-template-columns: minmax(250px, 0.4fr) 1fr;
      gap: 2em 3em;
      /* width: 64em; */
    }
    .detail-box > div:not(.item-description) {
      margin-inline: auto 0;
      width: fit-content;
      .field {
        margin-inline: auto 0;
      }
    }
  }
}
article#wc_customer {
  #customer-info {
    .error_message:not(:empty) {
      padding: 1em;
      border: 1px solid var(--color-accent-color);
    }
  }
}
/* 
.entry-content.renovation,
.entry-content.new__construction,
.entry-content.garden_dogrun,
.entry-content.single__construction	{
	.lead-block-content{
		margin-block-end: 4em;
	}

} */
.category-works {
  .post-li article a {
    h2 {
      font-size: 1rem;
    }
    .post-title {
      margin-block-start: 0.5em;
      display: flex;
      flex-direction: column-reverse;
      justify-content: center;
      align-items: flex-start;
      /* gap:0.5em; */
    }
  }
}
@media (width < 1024px) {
  body.single-post {
    article header.entry-header > div {
      h1.entry-title {
        width: 95%;
        padding-inline-end: 1em;
      }
    }
  }
  .lead-block-content {
    padding-inline: 1.5em;
	width: 100%;
  }
  :where(
      .about-feature01,
      .about-feature01,
      .about-feature02,
      .about-feature03,
      .about-feature04
    ) {
    display: grid;
    gap: 1.5em;
    padding-block-end: 5.5em;
    .inner-block-columns,
    .inner-block-columns_re {
      padding-inline: 1.5em;
      max-width: 800px;
      margin-inline: auto;
      display: grid;
      gap: 1.5em;
      margin-block-start: 2.25em;
    }
    div + figure {
      margin-block-start: 2.25em;
    }
  }
  .about-feature01 figure:nth-of-type(1) {
    img {
      aspect-ratio: 1 / 0.5;
    }
  }
}
@media (width < 768px) {
  :where(article, .error-on404, div[id^="cate-"]) {
    h2:nth-of-type(1) ~ p {
      text-align: justify;
    }
    .inner-pagefaq h2 + p {
      text-align: center;
    }
  }
  .about-flow,
  .inner-pagefaq {
    dl {
      dt::before {
        display: block;
      }
      dd {
        display: grid;
      }
    }
    dt {
      span {
        display: block;
      }
    }
  }
  .about-flow {
    dl dd {
      padding-inline: 0;
    }
  }
}
@media (600px > width) {
  .entry-content.new__construction {
    .images.list {
      > div {
        flex-direction: column;
        align-content: center;
        align-items: center;
        gap: 0;
        p {
          gap: 0.75em;
          width: 19em;
        }
        p:not(:nth-last-of-type(1))::after {
          transform: rotate(90deg);
        }
      }
    }
  }
  .inner-pagefaq {
    padding-inline: 1.5em;
    padding-block-end: 0.5em;
    dl {
      width: 100%;
    }
  }
  .entry-content.single__construction {
    .carpetfence-carport,
    .carpetfence-fence {
      > div {
        .text-squre-block {
          > div {
            /* background-color: red; */
            display: block;
            grid-template-columns: unset;
            grid-template-rows: unset;
          }
        }
      }
    }
  }
}
@media (width <=1024px) {
  .entry-content.renovation,
  .entry-content.new__construction,
  .entry-content.garden_dogrun,
  .entry-content.single__construction {
	width: 100%;
    .carpetfence-carport {
      padding-block: 3.75em;
      > div {
        display: grid;
        gap: 3.5em;
      }
      figure {
        margin-block-start: 2.5em;
      }
    }
    .inner-block-columns,
    .inner-block-columns_re {
      padding-inline: 1.5em;
    }
  }
  .entry-content.renovation {
    .carpetfence-carport {
      padding-block: 3.75em 1em;
    }
  }
  .about-flow {
    padding-block-end: 0;
  }
  .entry-content.new__construction,
  .entry-content.single__construction {
    .carpetfence-carport {
      padding-block-end: 7em;
      /* background-color: pink; */
    }
  }
  .entry-content.single__construction {
    .carpetfence-carport,
    .carpetfence-fence {
      figure {
        max-width: 600px;
        margin-inline: auto;
        margin-block: 2.5em;
      }
    }
    .carpetfence-carport,
    .carpetfence-fence {
      > div {
        .ajust-block {
          > div {
            display: grid;
            gap: 1.5em;
          }
        }
        .text-squre-block,
        figure {
          margin-inline: auto;
          width: fit-content;
          > div {
            justify-content: center;
          }
        }
      }
    }
    .carpetfence-fence {
      padding-block: 3.75em;
      padding-inline: 1.5em;
    }
  }
  .inner-block-columns,
  .inner-block-columns_re {
    .ajust-block > div {
      display: block;
    }
  }
}
@media (600px > width) {
  .entry-content.single__construction {
    .carpetfence-carport,
    .carpetfence-fence {
      width: 100% !important;
      overflow-x: hidden;
      > div {
        /* width:100vw; */
        .text-squre-block {
          > div {
            display: grid;
            grid-template-columns: 1fr;
            grid-template-rows: unset;
          }
		  p{
			aspect-ratio: unset;
			width: 140px;
			height: 140px;
			font-size: 14px;
		  }
        }
      }
    }
  }
}

@media (width < 800px) {
  .entry-content.contact {
    width: 100%;
  }
  .contact-form-mail {
    padding-inline: 1.5rem;
    .input_area {
      p {
        display: block;
      }
    }
  }
  div.cate-news,
  main[class*="category-"] {
    .post-li {
		width: 100%;
		padding-inline: 1.5em;
	}
	.post-li article a {
        gap: 2em 0.75em;
		.post-thumbnail {
            max-width: 30vw;
        }
		time {
			line-height: 1;
		}
		.post-title{
			h2{font-size: 15px;}
		}
	}

  }

}

@media (width < 600px) {
  .opencontact {
    width: 100%;
    p:nth-child(1) {
      font-size: 1.5em;
      line-height: 2.5;
    }
  }
  body.page {
    .wp-block-table {
    }
    figure.table2column {
      tr,
      td {
        display: block;
        width: 100%;
      }
      padding-inline: 1.5rem;
      tr td:nth-child(1),
      tr td:nth-child(2) {
        border: none;
        width: 100%;
        padding-inline-start: unset;
        padding: 0.5em 1em;
      }
      tr td:nth-child(1) {
        padding-block-end: 0;
      }
      tr td:nth-child(2) {
        border: none;
        padding-block-start: 0;
        border-bottom: 1px solid #e1e1e1;
      }
    }
  }
  .entry-content.shopping-guide {
    .guide-details {
      padding-inline: 1.5rem;
    }
    figure.table3columnth {
      th,
      td {
        padding-inline: 0.5em;
        text-align: start;
      }
    }
  }
}