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

/* メニューの基本スタイル */
.l-fixHeader__inner {
    justify-content: space-between;
}

.flex-between {
    justify-content: flex-end;
}

@media (min-width: 960px) {
    .l-header {
        box-shadow: 0 4px 4px rgba(0, 0, 0, 0.12) !important;
        /* 下方向にのみシャドウ */
        margin-top: -10px !important;
    }
}

@media (min-width: 960px) {
    .l-fixHeader .c-headLogo {
        height: var(--logo_size_pc);
    }
}

.c-gnav>.menu-item>a .ttl {
    font-weight: bold !important;
    font-size: 18px !important;
    color: #000 !important;
}

@media (min-width: 960px) {
    .-series .l-header__logo {
        padding: 0 0 10px !important;
        position: absolute;
        top: -20px;
    }

    .l-header__gnav .c-gnav>.menu-item>a {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .l-fixHeader__gnav .c-gnav>.menu-item>a {
        padding-top: 10px !important;
        padding-bottom: 20px !important;
    }
}

@media (max-width: 959px) {
    .header-top-menu {
        display: none;
    }
}

.header-top {
    background: transparent;
}

.header-top-menu-items {
    display: flex;
    list-style: none;
    justify-content: flex-end;
    padding: 10px 12px;
    margin: 0;
}

.header-top-menu-items li {
    margin-right: 10px;
}

.header-top-menu-items li a {
    position: relative;
    text-decoration: none;
    color: #000;
    padding: 5px 30px 5px 15px;
    border-radius: 10px;
    font-size: 14px;
    display: inline-block;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.header-top-menu-items li a::after {
    content: "\f061";
    /* Font Awesomeのコード */
    font-family: 'Font Awesome 5 Free';
    /* Font Awesomeのフォントファミリー */
    font-weight: 900;
    /* 必要に応じてフォントのウェイトを調整 */
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.8em;
    /* アイコンのサイズを調整 */
}

.header-top-menu-items li:nth-child(4) a::after {
    content: "\f30b";
    font-family: 'Font Awesome 5 Free';
    font-size: 20px;
}

.header-top-menu-items li:nth-child(5) a::after {
    content: "\f30b";
    font-family: 'Font Awesome 5 Free';
    font-size: 20px;
}

/* 通常リンク */
.header-top-menu-items li a {
    background-color: transparent;
    color: #000;
}

/* ボーダーボタン */
.header-top-menu-items li:nth-child(4) a {
    background-color: #fff;
    border: 2px solid #00aaff;
    color: #00aaff;
    padding: 5px 40px 5px 15px;
    font-weight: bold;
}

.header-top-menu-items li:nth-child(4) a:hover {
    background-color: #00aaff;
    color: #fff;
}

/* フルカラーボタン */
.header-top-menu-items li:nth-child(5) a {
    border: 2px solid #00aaff;
    background-color: #00aaff;
    color: #fff;
    padding: 5px 40px 5px 15px;
    font-weight: bold;
}

.header-top-menu-items li:nth-child(5) a:hover {
    border: 2px solid #00aaff;
    background-color: #fff !important;
    color: #00aaff;
}

/* ホバースタイル */
.header-top-menu-items li a:hover {
    background-color: #f0f0f0;
}

.top-service {
    position: relative;

}

.top-service__image {
    position: absolute;
    right: 0;
    bottom: -6.2em !important;
    width: min(660px, 70%) !important;
    z-index: -1;
}

@media (max-width: 959px) {
    .top-service__image {
        position: absolute;
        right: 0;
        bottom: -4.2em !important;
        width: min(180px, 70%) !important;
    }
}

/* .top-step {
    padding-bottom: 0 !important;
} */


.top-step__wrap .swell-block-columns__inner>div {
    position: relative;
}

@media screen and (min-width: 960px) {

    /* 隣接するアイテム間の三角形 */
    .top-step__wrap .swell-block-columns__inner>.swell-block-column:not(:nth-child(4))::after {
        content: "";
        position: absolute;
        top: calc(50% - 3rem);
        right: -4rem;
        transform: translateY(-50%);
        width: 0;
        height: 0;
        border-left: 2rem solid #ececec;
        /* 三角形の色を設定 */
        border-top: 1.25rem solid transparent;
        border-bottom: 1.25rem solid transparent;
    }

    .top-step__wrap .swell-block-columns__inner>.swell-block-column:last-child::after {
        display: none;
    }

}

@media screen and (max-width: 959px) {

    /* 縦並びのアイテム間の三角形 */
    .top-step__wrap .swell-block-columns__inner>.swell-block-column:not(:nth-child(4))::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -4rem;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-top: 2rem solid #ececec;
        /* 三角形の色を設定 */
        border-left: 1.25rem solid transparent;
        border-right: 1.25rem solid transparent;
    }

    .top-step__wrap .swell-block-columns__inner>.swell-block-column:last-child::after {
        display: none;
    }
}

/* @media screen and (max-width: 959px) {
    .min-width-text {
        padding-left: 3rem;
        padding-right: 3rem;
    }
} */

@media screen and (max-width: 959px) {
    .difference .wp-block-image {
        width: 100vw;
        position: relative;
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
        overflow-x: scroll;
    }

    .difference img {
        height: auto;
        width: 100%;
        min-width: 660px;
    }
}


.sp-cta {
    display: flex;
    list-style: none;
    justify-content: flex-end;
    margin: 0;
}

@media screen and (min-width: 960px) {
    .sp-cta {
        display: none;
    }
}

.sp-cta li:not(:last-child) {
    margin-right: 10px;
}

.sp-cta li a {
    padding: 5px 25px 5px 10px;
    position: relative;
    text-decoration: none;
    color: #000;
    border-radius: 10px;
    font-size: 12px;
    display: inline-block;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.sp-cta li a::after {
    content: "\f061";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.8em;
}

.sp-cta li:nth-child(1) a::after {
    content: "\f30b";
    font-family: 'Font Awesome 5 Free';
    font-size: 10px;
}

.sp-cta li:nth-child(2) a::after {
    content: "\f30b";
    font-family: 'Font Awesome 5 Free';
    font-size: 10px;
}


/* 通常リンク */
.sp-cta li a {
    background-color: transparent;
    color: #000;
}

/* ボーダーボタン */
.sp-cta li:nth-child(1) a {
    background-color: #fff;
    border: 2px solid #00aaff;
    color: #00aaff;
    font-weight: bold;
}

.sp-cta li:nth-child(1) a:hover {
    background-color: #00aaff;
    color: #fff;
}

/* フルカラーボタン */
.sp-cta li:nth-child(2) a {
    border: 2px solid #00aaff;
    background-color: #00aaff;
    color: #fff;
    font-weight: bold;
}

.sp-cta li:nth-child(2) a:hover {
    border: 2px solid #00aaff;
    background-color: #fff !important;
    color: #00aaff;
}

/* ホバースタイル */
.sp-cta li a:hover {
    background-color: #f0f0f0;
}

.error404 .search {
    display: none;
}