@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
*/


/* =========================================================
//  キャッチコピー
// ========================================================= */
.swell-block-columns.top_head_main {
    padding-bottom: 20rem;
}
/* =========================================================
//  コピペで簡単！無限ループアニメーション
// ========================================================= */
/* 無限ループアニメーション */
@keyframes infinite-loop {
  to {
    transform: translateX(-100%);
  }
}
/* 無限ループアニメーションのメインスタイル */
.infiniteLoop {
  /* 設定項目 START */
  --item-max-width: 400px; /* 各アイテムの最大幅 */
  --item-mobile-width: 50vw; /* スマホでのアイテムの幅 */
  --duration: 20s; /* アニメーションスピード */
  --gap: 5px;
  /* 設定項目 END */
  --play-state: running;
  --direction: normal;
  --flex-direction: row;
}
.infiniteLoop.-reverse {
    --direction: reverse;
    --flex-direction: row-reverse
}
.infiniteLoop:hover{
    --play-state: paused
}
.infiniteLoop>*{
    display:flex
}
.infiniteLoop>*>*>*{
    overflow:hidden;
    transform:translateX(0);
    flex-wrap:nowrap !important;
    flex-direction:var(--flex-direction, row);
    margin:0 !important;
    padding-left:var(--gap) !important;
    gap:var(--gap);
    width:calc(var(--infinite-loop_width, 100vw)*1);
    animation:infinite-loop var(--duration) linear infinite both var(--play-state) var(--direction);
    will-change:transform;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden
}
@media not all and (min-width: 600px){
    .infiniteLoop>*>*>*{
        width:calc(var(--infinite-loop_width, 130vw)*1);
    }
}
.infiniteLoop>*>*>*>*{
    padding:0 !important
}
.infiniteLoop>*>*>*>*>*{
    max-width:var(--item-max-width, 0px);
    margin-inline:auto
}
/* TOPのスライダーだけに指定.TOP */
.infiniteLoop.-top {
    position: absolute;
    top:-300px;
    /* transform: rotate(-10deg); */
}
.infiniteLoop.-top>*>*>*>*>*>*{
    width:70% !important;
    height: 70% !important;
}
.infiniteLoop.-saiseikai>*>*>*>*>*>*{
    width:1280px !important;
    height: 120px !important;
}
.swell-block-columns.top_head_main {
    padding-bottom: 20rem;
}
@media not all and (min-width: 600px){
    .infiniteLoop.-top{
        top:-200px;
    }
    .infiniteLoop.-top>*>*>*>*>*>*{
        width:100% !important;
        height: 100% !important;
    }
    .swell-block-columns.top_head_main {
    padding-bottom: 10rem;
    }
}
/* SAISEIKAIロゴだけ横幅調整 */
.saiseikai .swell-block-column{
    width:100%;
}
/* SAISEIKAIロゴだけ斜めに */
/* .rotateLogo{
    transform: rotate(-4deg);
    position: absolute;
} */

/* =========================================================
//  写真の角を丸く
// ========================================================= */
/* 右側 */
.radius-img-r img {
    border-radius: 0 20px 20px 0;
    overflow: hidden;
}
/* 左側 */
.radius-img-l img {
    border-radius: 20px 0 0 20px;
    overflow: hidden;
}
/* 全て */
.radius-img img {
    border-radius: 20px;
    overflow: hidden;
}
/* 右側 10px */
.radius-img-r-10 img {
    border-radius: 0 10px 10px 0;
    overflow: hidden;
}
/* 左側 10px */
.radius-img-l-10 img {
    border-radius: 10px 0 0 10px;
    overflow: hidden;
}
/* 全て 10px */
.radius-img-10 img {
    border-radius: 10px;
    overflow: hidden;
}
/* =========================================================
//  要素（写真以外）の角を丸く
// ========================================================= */
.radius-cover {
    border-radius: 30px;
    overflow: hidden;
}

/* 写真以外 右側 */
.radius-r {
    border-radius: 0 20px 20px 0;
    overflow: hidden;
}

/* 写真以外 左側 */
.radius-l {
    border-radius: 20px 0 0 20px;
    overflow: hidden;
}

/* 写真以外 全て */
.radius-all {
    border-radius: 20px;
    overflow: hidden;
}

/* 写真以外 右側 10px */
.radius-r-10 {
    border-radius: 0 10px 10px 0;
    overflow: hidden;
}

/* 写真以外 左側 10px */
.radius-l-10 {
    border-radius: 10px 0 0 10px;
    overflow: hidden;
}

/* 写真以外 全て 10px */
.radius-all-10 {
    border-radius: 10px;
    overflow: hidden;
}

/* =========================================================
//  コピペで簡単！スマホでスクロールスナップ
// ========================================================= */
@media not all and (min-width: 600px) {
  .-snap {
    --item-mobile-width: 80vw; /* スマホでのアイテムの幅 */
    --gap: 1rem; /* 各アイテム同士の間隔 */
  }
  .-snap > * {
    flex-wrap: nowrap !important;
    padding: 0 calc((100vw - var(--item-mobile-width, 80vw)) / 2) !important;
    margin-inline: calc(var(--swl-pad_container, 0px) * -1) !important;
    gap: var(--gap);
    overflow-x: scroll;
    -webkit-scroll-snap-type: x mandatory;
            scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .-snap > *::-webkit-scrollbar {
    display: none;
  }
  .-snap > * > * {
    padding: 0 !important;
    margin-inline: auto !important;
    flex-shrink: 0;
    width: var(--item-mobile-width, 80vw) !important;
    scroll-snap-align: center;
  }
  /* 「ノーマル」スタイルの調整 */
  .swell-block-tab.is-style-default .c-tabBody:has(.-snap) {
    padding-left: var(--swl-pad_container, 0px);
    padding-right: var(--swl-pad_container, 0px);
  }
}

/* =========================================================
//  バッジ
// ========================================================= */
@media (max-width: 600px) {
    .post_content .is-style-section_ttl.has-text-align-right {
        text-align: left !important;
    }
    h2.wp-block-heading.badge-r {
    margin-right: none !important;
    margin-left:-1rem;
    padding-top: 1rem;
    }
}
/* 左側 */
.wp-block-group.badge-l > div {
    margin-left: -1rem;
    padding-top: 1rem;
}
/* 右側 */
.wp-block-group.badge-r > div {
    margin-right: -1rem;
    padding-top: 1rem;
}
.badge-l > div> h2,
.badge-r > div> h2 {
    padding: 10px !important;
    border-radius: 10px !important;
}
/* STEP用 */
.wp-block-group.badge-step > div > p {
    padding: 10px;
    border-radius: 10px;
}

/* =========================================================
//  事業所の特徴 一日の流れ
// ========================================================= */
/* STEP非表示 */
.swell-block-step__number > span.__label,
.is-style-small .swell-block-step__number:after {
    display: none;
}
.is-style-small .swell-block-step__number .__shape {
    top: 1.6rem;
    position: absolute;
    background-color: var(--color_deep02);
    border: none;
}
.is-style-small .swell-block-step__item:before {
    height: 200% !important;
    border-left: 2px solid hsl(0deg 0% 78%);
}
@media (min-width: 600px) {
    .is-style-small .swell-block-step__item:before {
        left: 50% !important;
        top: 0px !important;
    }
    .is-style-small .swell-block-step__item {
        padding: 0 !important;
    }
    .is-style-small .swell-block-step__number {
        justify-content: center !important;
        margin-left: 10px !important;
    }
    .is-style-small .swell-block-step__number .__shape {
        top: 130px;
        position: absolute;
    }
    .is-style-small .swell-block-step__body {
    margin-top: 2.5em;
    }
}