@charset "UTF-8";

/* 共通部分---------------------------------- */
body {
    font-family: 'Yu Gothic UI', 'ヒラギノ角ゴシック', 'Hiragino Sans', sans-serif;
    font-size: 16px;
    font-weight: normal;
    letter-spacing: 0em;
    color: #6F6B6B;
    line-height: 2.5em;
}

.wrapper {
    width: 90%;
    max-width: 1080px;
    margin: 0 auto;
}

img {
    max-width: 100%;
}

/* 勝手に汎用 */
.inner {
    padding: 0 5%;
}

/* 共通部分_セクションタイトルCSS---------------------------------- */
.section_title {
    display: inline-block;
    font-size: 40px;
    font-weight: bold;
    margin-bottom: 50px;
}

.section_title span {
    font-size: 20px;
    color: #00A6DF;
    text-align: right;
    display: block;
}

@media (max-width: 798px) {
    body {
        font-size: 12px;
        line-height: 1.5em;
    }

    .section_title {
        font-size: 20px;
        margin-bottom: 20px;
        text-align: center;
        display: block;
    }

    .section_title span {
        font-size: 11px;
        text-align: center;
    }

}


/* 共通部分_サブタイトル */
.subtitle {
    color: #FFFFFF;
    font-size: 24px;
    font-weight: bold;
    display: inline-block;
    padding: 0.3em 4em;
    background-color: #8CDAE4;
}

@media (max-width: 798px) {
    .subtitle {
        font-size: 15px;
        padding: 0.3em 2em;
    }
}

/* 共通_お問い合わせボタン */
.contact_button {
    font-size: 20px;
    font-weight: bold;
    background-color: #DDEDD5;
    padding: 0.1em 10%;
    display: inline-block;
}

.contact {
    display: flex;
    justify-content: center;
}

@media (max-width: 798px) {
    .contact_button {
        font-size: 15px;
    }
}

/* お問い合わせボタンホバー時動き */
.contact a {
    transition: all .3s ease 0s;
}

.contact a:hover {
    transform: scale(1.03);
    color: #C1BFBF;

}



/*  共通部分_下層のMV---------------------------------- */
.lower_mv_img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* 共通部分_下層パンくずリスト */
.breadcrumb {
    display: flex;
    gap: 0 22px;
    list-style: none;
    padding: 0;
    font-size: .9em;
}

.breadcrumb li {
    display: flex;
    align-items: center;
}

.breadcrumb li:first-child::before {
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 4px;
    background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M11.7%207.5%204%2013.8v6.8c0%20.4.3.7.7.7h4.7c.4%200%20.7-.3.7-.7v-4c0-.4.3-.7.7-.7h2.7c.4%200%20.7.3.7.7v4c0%20.4.3.7.7.7h4.7c.4%200%20.7-.3.7-.7v-6.8l-7.7-6.3h-.9zm12.1%204.4L20.3%209V3.2c0-.3-.2-.5-.5-.5h-2.3c-.3%200-.5.2-.5.5v2.9L13.3%203c-.7-.6-1.8-.6-2.5%200L.2%2011.8c-.2.2-.3.5-.1.7l1.1%201.3c.2.2.5.2.7.1l9.8-8.1h.6l9.8%208.1c.2.2.5.1.7-.1l1.1-1.3c.2-.2.1-.5-.1-.6z%22%20style%3D%22fill%3A%236f6b6b%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat;
    content: '';
}

.breadcrumb li:not(:last-child)::after {
    display: inline-block;
    transform: rotate(45deg);
    width: .3em;
    height: .3em;
    margin-left: 10px;
    border-top: 1px solid #6F6B6B;
    border-right: 1px solid #6F6B6B;
    content: '';
}

.breadcrumb a {
    color: #6F6B6B;
    text-decoration: none;
}

/* パンくずホバー時動き */
.breadcrumb li a {
    display: inline-block;
    transition: all .3s ease 0s;
}

.breadcrumb li a:hover {
    transform: scale(1.1);
    color: #C1BFBF;
}


/* 共通_区切り線---------------------------------- */
.hr {
    display: block;
    height: 1px;
    background-color: #C1BFBF;
    border: 0;
}

.hr_hamburger-menu_header {
    display: block;
    height: 1px;
    background-color: #C1BFBF;
    border: 0;
    margin-left: 20%;
    margin-right: 20%;
}

.footer_hr {
    display: block;
    height: 1px;
    background-color: #C1BFBF;
    border: 0;
    margin-left: 20%;
    margin-right: 20%;
}

/* フッター区切り線PCでは表示なし */
@media (min-width: 768px) {
    .footer_hr {
        display: none;
    }
}

/* ヘッダー---------------------------------- */
.header {
    margin: 20px 0 30px 0;
}

.header .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.header_list img {
    width: 30px;
}

.header_list ul {
    display: flex;
    justify-content: flex-end;
    align-items: center;

}

.header_list ul li {
    text-align: center;
    font-weight: bold;
}


.navi_border {
    position: relative;
}

.navi_border {
    position: relative;
}

.navi_border::before {
    content: "";
    display: inline-block;
    width: 2px;
    height: 30px;
    background-color: #6F6B6B;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.headermenu_icon span {
    display: block;

}

/* ヘッダーSP切り替えバージョン---------------------------------- */
@media(max-width: 1080px) {
    .header .inner {
        display: flex;
        align-items: center;
        flex-direction: column;
    }

    .header_logo {
        width: 30%;
    }

    .header_list {
        margin-top: 3%;
    }
}

@media(max-width: 798px) {
    .header .inner {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
}

/* ヘッダーホバー時動き */
.header_list li a {
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: transform .6s ease;
    padding: 0 25px;
}

.header_list li a:hover {
    transform: scale(1.2, 1.2);
    filter: brightness(0) saturate(100%) invert(98%) sepia(0%) saturate(3891%) hue-rotate(169deg) brightness(98%) contrast(50%);
}


/* PC版では非表示 */
.hamburger-menu {
    display: none;
}



/* ハンバーガーメニュー
------------------------------------------ */
@media (max-width: 798px) {

    .header {
        position: relative;
    }

    .header_inner {
        position: initial;
        display: flex;
        justify-content: end;
        padding-top: 20px;
        padding-bottom: 60px;
    }

    .header_logo {
        width: 60%;
        max-width: 190px;
    }

    .header-logo_image {
        width: 100%;
    }

    .hamburger-menu {
        display: block;
    }

    /* PC版メニューは非表示 */
    .header_list {
        display: none;
    }

    /* ハンバーガーボタン */
    .hamburger-button {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        row-gap: 8px;
    }

    .hamburger-button-bar {
        width: 30px;
        height: 2px;
        background-color: #C1BFBF;
    }

    /* ハンバーガーメニュー */
    .hamburger-menu {
        position: fixed;
        top: 0;
        left: 100%;
        width: 100%;
        height: 100vh;
        padding: 10px 24px 24px 24px;
        background-color: #F8FDFC;
        transition: all 0.6s;
        visibility: hidden;
        z-index: 11;
    }

    /* 開いている状態 */
    .hamburger-menu-active {
        left: 0;
        visibility: visible;
    }

    .hamburger-menu_header {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .hamburger-menu_logo {
        width: 200px;
    }

    .hamburger-menu_logo img {
        width: 100%;

    }

    .hamburger-menu_header .hamburger-button {
        position: relative;
        padding-top: 50px;
    }

    .hamburger-menu_header .hamburger-button-text {
        color: #C1BFBF;
        font-size: 13px;
    }

    .hamburger-menu_header .hamburger-button-bar {
        background-color: #C1BFBF;
    }

    .hamburger-menu_header .hamburger-button-bar:nth-of-type(1) {
        transform: rotate(-45deg);
        position: absolute;
        top: 50%;
    }

    .hamburger-menu_header .hamburger-button-bar:nth-of-type(2) {
        transform: rotate(45deg);
        position: absolute;
        top: 50%;
    }

    .hamburger-nav-first_list {
        display: flex;
        flex-direction: column;
        text-align: center;
        row-gap: 10px;
        color: #6F6B6B;
        font-size: 15px;
        margin-top: 5px;
        margin-bottom: 30px;
    }

    /* ハンバーガーアイコンボタン */
    .hamburger-nav-second_icon {
        display: flex;
        align-items: center;
        width: 50px;
        height: 50px;
        margin: 10px;
        border-radius: 50%;
        background: #DDEDD5;
        text-align: center;
        padding: 15px;
    }

    .hamburger-nav-second {
        display: flex;
        justify-content: center;
        margin-top: 30px;
    }

    /* ホバー時の動き */
    .hamburger-nav-first_list li a {
        display: inline-block;
        transition: all .3s ease 0s;
    }

    .hamburger-nav-first_list li a:hover {
        transform: scale(1.1);
        color: #C1BFBF;
    }

    .hamburger-nav-second a {
        transition: all .3s ease 0s;
    }

    .hamburger-nav-second a:hover {
        transform: scale(1.3);
    }
}

/* topへ戻るボタン */
.totop {
    position: fixed;
    right: 20px;
    bottom: 20px;
}

@media (max-width: 798px) {
    .totop img {
        width: 40px;
    }
}

/* フッター---------------------------------- */

.footer_img {
    margin-left: -20px;
}

.footer_list li a {
    display: inline-block;
    transition: all .3s ease 0s;
}

.footer {
    margin-top: 90px;
}

.footer {
    background-color: #F8FDFC;
    padding: 2% 5% 1% 5%;
}

.footer_container li {
    display: flex;
    justify-content: space-between;
}

.footer_container {
    display: flex;
    justify-content: space-between;
}


.footer_box_second {
    display: flex;
    justify-content: space-around;
    width: 70%;
}

.footer_list {
    font-size: 13px;
    line-height: 2em;
}

.footer_copyright {
    display: block;
    text-align: center;
    font-size: 8px;
}

/* フッターホバー時動き */
.footer_list li a:hover {
    transform: scale(1.1);
    color: #C1BFBF;
}

/* フッター SP----------------------------------*/
@media (max-width: 798px) {

    .footer {
        margin-top: 40px;
    }

    .footer_img {
        text-align: center;
    }

    .footer_img img {
        width: 50%;
    }

    .footer_box_first {
        margin: 0 auto;
    }

    .footer_box_second {
        margin-top: 0px;
        width: 100%;
    }

    .footer_list {
        font-size: 10px;
        margin: 10px auto;
    }

    .footer_container {
        display: flex;
        flex-direction: column;
    }

    .footer_name {
        font-size: 13px;
    }

}