@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* --------------------------------
 * base/layout
 * -------------------------------- */

:root {
  /* アンカー被り対策：追従ナビ分だけ下で止める */
  --anchor-offset-pc: 64px;
  --anchor-offset-sp: 48px;
}
/* ハッシュで到達した “その要素(:target)” にだけ効かせる */
.post_content :target {
  scroll-margin-top: var(--anchor-offset-pc);
}

em,
b {
  font-weight: 500;
}
strong {
  font-weight: 600;
}

.l-content {
  margin-bottom: 0;
}

/* --------------------------------
 * block
 * -------------------------------- */
/* fixed cta */
.widget_custom_html:has(.is-style-fixed-cta) {
  position: fixed;
  top: 30%;
  right: -90px;
  z-index: 80;
  opacity: 0;
  transition: all 0.4s ease-in-out;
  &.is_scrolled {
    right: 0;
    opacity: 1;
  }
  .is-style-fixed-cta {
    .wp-block-button__link {
      aspect-ratio: 1/1;
      width: 90px;
      padding: 8px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      transition: all 0.3s ease-in-out;
      &:hover,
      &:focus-visible {
        opacity: 0.9;
      }
    }
    span.swl-inline-icon {
      font-size: 24px;
      position: relative;
      &::after {
        position: absolute;
        translate: -50% -50%;
        top: 50%;
        left: 50%;
      }
    }
    span.swl-format-1 {
      font-size: 10px;
    }
  }
}

/* header */
.l-header__inner.l-container {
  display: grid;
  row-gap: 0.5em;
  grid-template-columns: auto minmax(auto, 500px);
  grid-template-columns: auto auto;
  justify-content: space-between;
  grid-template-areas:
    'logo ctabtn'
    'gnav gnav';
  width: min(100%, 1440px);
  padding-inline: 2rem;
}
.l-header__logo {
  grid-area: logo;
  grid-column: 1;
  grid-row: 1;
}
.w-header.pc_ {
  grid-area: ctabtn;
  grid-column: 2;
  grid-row: 1;
  justify-content: end;
}
.bl_headerColumn {
  width: 100%;
  margin-left: auto;
  margin-left: initial;
}
.l-header__gnav.c-gnavWrap {
  position: relative;
  grid-area: gnav;
  grid-column: 1/-1;
  grid-row: 2;
  &::before {
    content: '';
    display: block;
    width: 100vw;
    height: 1px;
    background-color: hsl(0, 0%, 90%);
    position: absolute;
    top: 0;
    left: 50%;
    translate: -50% 0;
  }
  .c-gnav > li > a {
    padding-inline: 2em;
    font-size: 1.2rem;
    font-weight: 500;
  }
}
/* footer */
.w-beforeFooter {
  margin-block: 0 1rem;
  :is(h2, h3, h4, h5, h6).wp-block-heading {
    font-weight: 500;
  }
  .swell-block-fullWide.has-bg-img:before {
    z-index: 0;
  }
}
.bl_ctaSection {
  h2.is-style-section_ttl::after {
    background-color: #fff;
  }
  .bl_ctaBtn .swell-block-button__link {
    padding-block: 1.2em;
  }
}
.w-beforeFooter {
  container: bl_footer_column / inline-size;
}

.swell-block-columns.bl_footer_column {
  & > .swell-block-columns__inner {
    column-gap: 3%;
    row-gap: 3rem;
    justify-content: space-between;
  }
  .swell-block-linkList__link {
    padding-inline-start: 1em;
    position: relative;
    &::after {
      content: '-';
      position: absolute;
      translate: 0% -50%;
      top: 50%;
      left: 0;
    }
  }
}
.swell-block-columns.bl_footer_service_column {
  .swell-block-columns__inner {
    justify-content: start;
    column-gap: 2%;
    row-gap: 1.5rem;
  }
}
@container bl_footer_column (width >= 1531px) {
  .swell-block-columns.bl_footer_column {
    & > .swell-block-columns__inner {
      justify-content: space-between;
    }
  }
}
@container bl_footer_column (1064px <= width <= 1530px) {
  .swell-block-columns.bl_footer_column {
    padding-inline: 6rem;
    & > .swell-block-columns__inner {
      justify-content: start;
      & > .swell-block-column:first-of-type {
        --clmn-w--pc: 100% !important;
      }
    }
  }
  .swell-block-columns.bl_footer_service_column {
    .swell-block-columns__inner {
      flex-wrap: nowrap;
    }
  }
}

/* リンク設定グループ｜リッチカラム内 */
.swell-block-columns {
  .wp-block-group.is-linked {
    position: relative;
    padding-block: 1em !important;
    padding-inline: 2em !important;
    p {
      transition: 0.3s all ease-in-out;
    }
    &::after {
      content: '';
      display: block;
      width: 0.8rem;
      aspect-ratio: 1/1;
      border-right: 2px solid currentColor;
      border-bottom: 2px solid currentColor;
      rotate: -45deg;
      translate: 0 -50%;
      position: absolute;
      transition: 0.3s all ease-in-out;
      top: 50%;
      right: 1.5rem;
    }
    &:hover,
    &:focus-visible {
      p {
        opacity: 0.8;
      }
      &::after {
        right: 1.3rem;
      }
    }
  }
}
/* 背景色設定ブロック｜リッチカラムブロック内 */
.swell-block-columns {
  .wp-block-group.has-background {
    height: 100%;
  }
}
/* 説明リストブロック */
.swell-block-dl.is-style-float {
  .swell-block-dl__dt,
  .swell-block-dl__dd {
    padding-block: 1em;
    border-bottom: 1px solid;
  }
  .swell-block-dl__dt {
    border-color: #0053a6;
    padding-inline: 1em;
    &::after {
      content: none;
    }
  }
  .swell-block-dl__dd {
    border-color: #ddd;
    padding-inline: 1em;
  }
}
/* 見出しブロック */
.wp-block-heading.is-style-has-left-borer {
  border-left: 2px solid #0053a6;
  padding-left: 0.5em;
}
/* ボタンブロック */
.swell-block-button {
  .swell-block-button__link {
    border-radius: 0;
  }
}
/* リンクリストブロック */
.swell-block-linkList__link {
  cursor: pointer;
}
/* --------------------------------
 * unique
 * -------------------------------- */
/* top */
.p-mainVisual__textLayer .p-blogParts.post_content {
  translate: 0 -1rem;
}
.l-mainContent__inner > :first-child.w-frontTop {
  margin-top: -5rem !important;
}
.wp-block-image.un_mainVisual_logo img {
  width: clamp(180px, 20vw, 250px) !important;
}
.wp-block-heading.un_mainVisualCopy {
  margin-top: 1em;
  margin-inline: auto;
  padding-inline: 4em;
  padding-block: 2em;
  position: relative;
  width: fit-content;
  line-height: 1.3;
  &:before,
  &:after {
    content: '';
    display: block;
    width: 4rem;
    aspect-ratio: 1/1;
    position: absolute;
  }
  &::before {
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    top: 0;
    left: 0;
  }
  &::after {
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    bottom: 0;
    right: 0;
  }
  span.main,
  span.sub {
    display: block;
    color: #fff;
    word-break: keep-all;
    overflow-wrap: normal;
  }
  span.main {
    font-size: clamp(1.125rem, 0.727rem + 1.7vw, 2rem);
    font-size: clamp(1.125rem, 0.805rem + 1.37vw, 2rem);
  }
  span.sub {
    font-size: clamp(1rem, 0.773rem + 0.97vw, 1.5rem);
    font-size: clamp(1rem, 0.817rem + 0.78vw, 1.5rem);
    margin-top: 0.5em;
  }
}
.w-frontTop {
  .swell-block-columns.un_fvLink {
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding-inline: 2em;
  }
}
.swell-block-columns.un_fvLink {
  .wp-block-group.is-linked {
    display: grid;
    place-content: center;
    & > .wp-block-group__inner-container {
      width: 250px;
    }
  }
  .wp-block-columns {
    column-gap: 0.5em !important;
    & p {
      font-weight: 600;
    }
  }
}
.un_threeFeaturesSec {
  .bl_groupBox {
    padding-inline: 4rem;
  }
}
/* service */
.un_serviceLinkBox {
  .swell-block-linkList .swell-block-linkList__icon {
    rotate: 90deg;
  }
}
.un_serviceGroup > .wp-block-group__inner-container {
  display: grid;
  grid-template-rows: 1fr auto;
  grid-template-columns: 1fr;
  align-content: space-between;
  height: 100%;
  & > * {
    width: 100%;
  }
}
.un_flow {
  .swell-block-step__item {
    background-color: #fff;
    + .swell-block-step__item {
      margin-top: 1em;
    }
  }
}
/* --------------------------------
 * helper
 * -------------------------------- */

.hp_wbr {
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.hp_text-nowrap {
  white-space: nowrap;
}
.hp_spOnly {
  display: none;
}
.hp_pdding-left-1 {
  padding-inline-start: 1em;
}

/* --------------------------------
 * mediaquery
 * -------------------------------- */
@media (width < 960px) {
  .post_content :target {
    scroll-margin-top: var(--anchor-offset-sp);
  }
  .l-header__inner.l-container {
    display: flex;
    justify-content: space-between;
  }
  .l-mainContent__inner > :first-child.w-frontTop {
    margin-top: 2rem !important;
  }
  /* fixed cta */
  .widget_custom_html:has(.is-style-fixed-cta) {
    display: none;
  }
  .w-frontTop {
    .swell-block-columns.un_fvLink {
      margin-right: initial;
      margin-left: initial;
      padding-inline: initial;
    }
  }
  .swell-block-columns.bl_footer_column {
    padding-inline: initial;
  }
  .wp-block-heading.un_mainVisualCopy {
    padding-inline: 2em;
    padding-block: 2em;
    &:before,
    &:after {
      width: 3rem;
    }
  }
  .un_threeFeaturesSec {
    .bl_groupBox {
      padding-inline: 3rem;
    }
  }
}

@media (width < 600px) {
  .swell-block-dl.is-style-float {
    .swell-block-dl__dt {
      padding-inline: 0 1em;
    }
    .swell-block-dl__dd {
      padding-inline: 1em 0;
    }
  }
  .wp-block-heading.un_mainVisualCopy {
    width: 100%;
    padding-inline: 1.3em;
    padding-block: 2em;
    &:before,
    &:after {
      width: 3rem;
    }
  }
  .swell-block-columns {
    .wp-block-group.is-linked {
      padding-block: 1em !important;
      padding-inline: 1em 2em !important;
    }
    &.un_fvLink {
      .wp-block-group.is-linked {
        place-content: initial;
        & > .wp-block-group__inner-container {
          width: 100%;
        }
      }
    }
  }
  .un_threeFeaturesSec {
    .bl_groupBox {
      padding-inline: 2rem;
    }
  }
  .hp_spOnly {
    display: block;
  }
}
