@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

:root {
    --bg-width-pc: max(100%, 1920px);
    --content-width: 1104px;
}

/* ============================================
   基本設定
============================================ */
html,
body {
    max-width: 100vw;
    overflow-x: hidden;
}

.main {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #2C2A29;
    position: relative;
    line-height: 1.5;
}

.main * {
    box-sizing: border-box;
}

.inner {
    width: 100%;
    max-width: calc(var(--content-width) + 40px);
    margin: auto;
    padding-left: 20px;
    padding-right: 20px;
}

a {
    transition: 0.3s;
    text-decoration: none;
    color: inherit;
}

a:hover,
a:active,
a:focus {
    opacity: 0.8;
}

sup {
    font-size: 10px;
}

img {
    max-width: 100%;
}

picture,
figure {
    display: block;
}

/* ============================================
   表示切り替え
============================================ */
.pc-only {
    display: block !important;
}

.sp-only {
    display: none !important;
}

@media (max-width: 768px) {
    .pc-only {
        display: none !important;
    }

    .sp-only {
        display: block !important;
    }
}


/* ============================================
   共通
============================================ */

.section {
    padding-bottom: 96px;
}

.section-inner {
    padding-bottom: 64px;
}

.note__txt {
    display: block;
    font-size: 12px;
    padding-left: 1.0em;
    text-indent: -1.0em;
}

@media (max-width: 768px) {
    .section {
        padding-bottom: 64px;
    }

}

/* =========
- grid
========== */

.grid {
    display: grid;
}

@media screen and (min-width: 769px) {
    .pc_grid {
        display: grid;
    }
}

@media screen and (max-width: 768px) {
    .sp_grid {
        display: grid;
    }
}

.grid-cols-none {
    grid-template-columns: none;
}

.grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-col-span-1 {
    grid-column: span 1 / span 1;
}

.grid-row-span-1 {
    grid-row: span 1 / span 1;
}

.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-col-span-2 {
    grid-column: span 2 / span 2;
}

.grid-row-span-2 {
    grid-row: span 2 / span 2;
}

.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-col-span-3 {
    grid-column: span 3 / span 3;
}

.grid-row-span-3 {
    grid-row: span 3 / span 3;
}

.grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid-col-span-4 {
    grid-column: span 4 / span 4;
}

.grid-row-span-4 {
    grid-row: span 4 / span 4;
}

.grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.grid-col-span-5 {
    grid-column: span 5 / span 5;
}

.grid-row-span-5 {
    grid-row: span 5 / span 5;
}

.grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.grid-col-span-6 {
    grid-column: span 6 / span 6;
}

.grid-row-span-6 {
    grid-row: span 6 / span 6;
}

.grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.grid-col-span-7 {
    grid-column: span 7 / span 7;
}

.grid-row-span-7 {
    grid-row: span 7 / span 7;
}

.grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
}

.grid-col-span-8 {
    grid-column: span 8 / span 8;
}

.grid-row-span-8 {
    grid-row: span 8 / span 8;
}

.grid-cols-9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
}

.grid-col-span-9 {
    grid-column: span 9 / span 9;
}

.grid-row-span-9 {
    grid-row: span 9 / span 9;
}

.grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
}

.grid-col-span-10 {
    grid-column: span 10 / span 10;
}

.grid-row-span-10 {
    grid-row: span 10 / span 10;
}

.grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
}

.grid-col-span-11 {
    grid-column: span 11 / span 11;
}

.grid-row-span-11 {
    grid-row: span 11 / span 11;
}

.grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.grid-col-span-12 {
    grid-column: span 12 / span 12;
}

.grid-row-span-12 {
    grid-row: span 12 / span 12;
}

@media screen and (max-width: 768px) {
    .sp_grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .sp_grid-col-span-1 {
        grid-column: span 1 / span 1;
    }

    .sp_grid-row-span-1 {
        grid-row: span 1 / span 1;
    }

    .sp_grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sp_grid-col-span-2 {
        grid-column: span 2 / span 2;
    }

    .sp_grid-row-span-2 {
        grid-row: span 2 / span 2;
    }

    .sp_grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .sp_grid-col-span-3 {
        grid-column: span 3 / span 3;
    }

    .sp_grid-row-span-3 {
        grid-row: span 3 / span 3;
    }

    .sp_grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .sp_grid-col-span-4 {
        grid-column: span 4 / span 4;
    }

    .sp_grid-row-span-4 {
        grid-row: span 4 / span 4;
    }

    .sp_grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .sp_grid-col-span-5 {
        grid-column: span 5 / span 5;
    }

    .sp_grid-row-span-5 {
        grid-row: span 5 / span 5;
    }

    .sp_grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .sp_grid-col-span-6 {
        grid-column: span 6 / span 6;
    }

    .sp_grid-row-span-6 {
        grid-row: span 6 / span 6;
    }

    .sp_grid-cols-7 {
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }

    .sp_grid-col-span-7 {
        grid-column: span 7 / span 7;
    }

    .sp_grid-row-span-7 {
        grid-row: span 7 / span 7;
    }

    .sp_grid-cols-8 {
        grid-template-columns: repeat(8, minmax(0, 1fr));
    }

    .sp_grid-col-span-8 {
        grid-column: span 8 / span 8;
    }

    .sp_grid-row-span-8 {
        grid-row: span 8 / span 8;
    }

    .sp_grid-cols-9 {
        grid-template-columns: repeat(9, minmax(0, 1fr));
    }

    .sp_grid-col-span-9 {
        grid-column: span 9 / span 9;
    }

    .sp_grid-row-span-9 {
        grid-row: span 9 / span 9;
    }

    .sp_grid-cols-10 {
        grid-template-columns: repeat(10, minmax(0, 1fr));
    }

    .sp_grid-col-span-10 {
        grid-column: span 10 / span 10;
    }

    .sp_grid-row-span-10 {
        grid-row: span 10 / span 10;
    }

    .sp_grid-cols-11 {
        grid-template-columns: repeat(11, minmax(0, 1fr));
    }

    .sp_grid-col-span-11 {
        grid-column: span 11 / span 11;
    }

    .sp_grid-row-span-11 {
        grid-row: span 11 / span 11;
    }

    .sp_grid-cols-12 {
        grid-template-columns: repeat(12, minmax(0, 1fr));
    }

    .sp_grid-col-span-12 {
        grid-column: span 12 / span 12;
    }

    .sp_grid-row-span-12 {
        grid-row: span 12 / span 12;
    }
}

/* *** flex *** */
.flex,
.flex_pc {
    display: flex;
}

.align-items_center {
    align-items: center;
}

.align-items_start {
    align-items: flex-start;
}

.align-items_end {
    align-items: flex-end;
}

.justify-content_between {
    justify-content: space-between;
}

.justify-content_center {
    justify-content: center;
}

.justify-content_start {
    justify-content: flex-start;
}

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

.flex-wrap_wrap {
    flex-wrap: wrap;
}

.gap_8 {
    gap: 8px;
}

.gap_16 {
    gap: 16px;
}

.gap_20 {
    gap: 20px;
}

.gap_24 {
    gap: 24px;
}

.gap_30 {
    gap: 30px;
}

.grow_0 {
    flex-grow: 0;
}

.grow_1 {
    flex-grow: 1;
}

.grow_2 {
    flex-grow: 2;
}

@media screen and (max-width: 860px) {
    .tb_gap_16 {
        gap: 16px;
    }

}

@media screen and (max-width: 768px) {
    .sp_flex {
        display: flex;
    }

    .sp_item_center {
        align-items: center;
    }

    .sp_item_baseline {
        align-items: baseline;
    }

    .sp_justify-content_between {
        justify-content: space-between;
    }

    .sp_justify-content_center {
        justify-content: center;
    }

    .sp_justify-content_end {
        justify-content: flex-end;
    }

    .sp_justify-content_start {
        justify-content: flex-start;
    }

    .sp_flex-wrap_wrap {
        flex-wrap: wrap;
    }

    .sp_flex-direction_column-reverse {
        flex-direction: column-reverse;
    }

    .flex_pc {
        display: block;
    }

    .sp_gap_8 {
        gap: 8px;
    }

    .sp_gap_10 {
        gap: 10px;
    }

    .sp_gap_15 {
        gap: 15px;
    }

    .sp_gap_16 {
        gap: 16px;
    }

    .sp_gap_20 {
        gap: 20px;
    }

    .sp_gap_24 {
        gap: 24px;
    }

    .sp_gap_30 {
        gap: 30px;
    }

    .sp_grow_0 {
        flex-grow: 0;
    }

    .sp_grow_1 {
        flex-grow: 1;
    }

    .sp_grow_2 {
        flex-grow: 2;
    }
}

/* ==========
- アコーディオン
========== */
.accordion {
    width: 100%;
}

.accordion dt {
    cursor: pointer;
    position: relative;
    user-select: none;
}

.accordion dt::after {
    content: '';
    position: absolute;
    margin: auto;
    top: 0;
    bottom: -3px;
    right: 18px;
    width: 6px;
    height: 6px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(-75%) rotate(45deg);
    transition: transform 0.3s ease-out;
}

.accordion dt.active::after {
    transform: translateY(-25%) rotate(-135deg);
}

/* 開閉するコンテンツ部分 (dd) */
.accordion dd {
    margin: 0;
    max-height: 0;
    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
}

/* dd内のコンテンツの上下の余白 */
/* .accordion dd > * {
    padding: 20px 0;
} */



/* ==========
- slick
========== */

.slick-dots {
    position: relative;
    bottom: auto;
    display: block;
    width: 100%;
    padding: 0;
    list-style: none;
    text-align: center;
}


.slick-dots li {
    width: 10px;
    height: 10px;
    margin: 0 2px;
}

.slick-dots li button {
    width: 10px;
    height: 10px;
}

.slick-dots li button:before {
    font-size: 12px;
    color: #fff;
    opacity: 1;
    /*  */
    content: "";
    background: #fff;
    border-radius: 50%;
    width: 10px;
    height: 10px;
}

.slick-dots li.slick-active button:before {
    color: #163BBF;
    background: #163BBF;
}

.slick-prev,
.slick-next {
    z-index: 10;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.15);
    background: rgba(233, 236, 242, 0.7);
}

.slick-prev:before,
.slick-next:before {
    content: "";
    background: none;
    color: #697180;
    font-size: 12px;
    height: 25px;
    padding: 0;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    background: rgba(233, 236, 242, 0.2);
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
    background: none;
    color: #697180;
}

.slick-prev:before {
    content: url(../images/arrow_prev.svg);
}

.slick-next:before {
    content: url(../images/arrow_next.svg);
}

/* ==========
- タイトル
========== */
.article-mainhead {
    position: relative;
    text-align: center;
    margin-bottom: calc(56px - 40px);
    top: -40px;
}

.article-mainhead::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 485px;
    height: 402px;
    border-radius: 485px;
    background: #E0EDFF;
}

.article-mainhead__subtitle {
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 2.4px;
    color: #163BBF;
}

.article-mainhead__subtitle::before {
    content: url(../images/title_balloon.svg);
    display: block;
    height: 40px;
    margin-bottom: -5px;
}

.article-mainhead__subtitle span {
    font-size: 32px;
}

.article-mainhead__title {
    font-size: 24px;
    font-weight: 700;
    line-height: 160%;
    position: relative;
}

.article-mainhead__title span {
    display: block;
    min-height: 56px;
    background: url(../images/title_ribbon.svg) center no-repeat;
    background-size: contain;
    padding: 8px 0 10px;
    color: #fff;
    position: relative;
    z-index: 1;
}

.article-mainhead__title::before {
    content: "";
    display: block;
    width: 100%;
    height: 28px;
    background: #A7C7F3;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

@media (max-width: 768px) {
    .article-mainhead {
        margin-bottom: calc(56px - 30px);
        top: -30px;
    }

    .article-mainhead__subtitle {
        margin-bottom: 4px;
    }

    .article-mainhead__title span {
        min-height: 48px;
        line-height: 1;
        padding: 10px 0 10px;
    }

    .article-mainhead__subtitle span,
    .article-mainhead__subtitle {
        font-size: 20px;
    }

    .article-mainhead__title {
        font-size: 18px;
    }

    .article-mainhead__title::before {
        height: 25px;
    }

}

/* 上下にデコレーション */
.section-mainhead {
    margin-bottom: 40px;
    text-align: center;
}

.section-mainhead__title {
    font-size: 32px;
    line-height: 130%;
    margin-bottom: 16px;
}

.section-mainhead__title::before {
    content: url(../images/title_line-beigeblue.svg);
    display: block;
    line-height: 0;
}

.section-mainhead__title::after {
    content: url(../images/title_line-bluebeige.svg);
    display: block;
    line-height: 0;
}

.section-mainhead__text {
    font-size: 18px;
    font-weight: 700;
}

@media (max-width: 768px) {
    .section-mainhead {
        margin-bottom: 32px;
    }

    .section-mainhead__title {
        font-size: 28px;
    }

    .section-mainhead__text {
        font-size: 14px;
    }
}

/* 下にデコレーション */
.section-head {
    text-align: center;
    padding-bottom: 24px;
    margin-bottom: 40px;
}

.section-head--line-blue {
    background: url(../images/title_underline-blue.svg) no-repeat bottom center;
}

.section-head--line-gold {
    background: url(../images/title_underline.svg) no-repeat bottom center;
}

.section-head__title {
    font-size: 32px;
    line-height: 130%;
    margin-bottom: 8px;
}

.section-head__kicker {
    font-size: 26px;
}

.section-head__text {
    font-size: 18px;
    line-height: 130%;

}

@media (max-width: 768px) {


    .section-head__title {
        font-size: 28px;
    }

    .section-head__kicker {
        font-size: 20px;
    }

    .section-head__text {
        font-size: 14px;
        line-height: 180%;
    }

}

/* ============================================
- MV
============================================ */
.ui-static-breadcrumb {
    background: #fff;
}

.mv__wrapper {
    position: relative;
    width: 100%;
    margin-inline: auto;
    z-index: -1;
    min-height: 700px;
    max-height: 775px;
}

.mv-titlebox {
    position: absolute;
    text-align: center;
    max-width: var(--content-width);
    width: 100%;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 24px 0 48px;
    color: #FFF;
    text-align: center;
}

.mv-title {
    margin-bottom: 30px;
}

.mv-subtitle {
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.50);
    font-size: 50px;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 10px;
    margin-bottom: 100px;
}

.mv-subtext {
    text-shadow: 0 0 20px rgba(0, 0, 0, 0.80);
    font-size: 20px;
    font-weight: 500;
    line-height: 260%;
    letter-spacing: 6px;
}

.mv_slider {
    min-height: 700px;
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-bottom: 0;

    position: fixed;
    top: 0;
}

.slick-slide {
    position: relative;
}

.slick-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.add-animation img {
    animation: zoomIn 10s linear 0s normal both;
}

@keyframes zoomIn {
    0% {
        transform: scale(1.15);
    }

    100% {
        transform: scale(1);
    }
}


@media (min-width: 769px) and (max-width: 860px) {

    .mv-subtitle {
        font-size: clamp(40px, calc(-43.47826086956522px + 10.869565217391305vw), 50px);
    }
}

@media (max-width: 768px) {


    .mv-titlebox {
        position: absolute;
        margin: auto;
        top: 0;
        bottom: auto;
        left: 0;
        right: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 24px 0;
        min-height: 680px;
        max-height: 775px;
    }

    .mv-title {
        margin-bottom: 18px;
    }

    .mv-title__image {
        height: 50px;
    }

    .mv-subtitle {
        font-size: 28px;
        line-height: 190%;
        letter-spacing: 5.6px;
        margin-bottom: 90px;
    }

    .mv-subtext {
        font-size: 16px;
        font-weight: 700;
        line-height: 180%;
        letter-spacing: 3.52px;
    }

    .mv-subtitle+.mv-subtitle {
        margin-top: 1em;
    }

    .mv-titlebox>div {
        width: 100%;
    }

    .mv-title img {
        width: 100%;
    }

}

.main__content {
    position: relative;
    background: #E0EDFF;
}

.main__content:before {
    content: "";
    width: 485px;
    height: 402px;
    border-radius: 50%;
    background: #E0EDFF;
    display: block;
    z-index: -1;
    position: absolute;
    top: -80px;
    left: 0;
    right: 0;
    margin: auto;
}

@media (max-width: 768px) {
    .main__content:before {
        width: 215px;
        height: 172px;
        top: -55px;
    }
}

/* ============================================
- 海外/国内
============================================ */

/* ==========
- リスト
========== */
.kaigai-list,
.kokunai-list {
    margin-bottom: 64px;
}

.kaigai-list__item,
.kokunai-list__item {
    margin: 0 auto;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.kaigai-list__picture,
.kokunai-list__picture {
    width: 100%;
    overflow: hidden;
}

.kaigai-list__image,
.kokunai-list__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* .kaigai-list__item:hover .kaigai-list__image,
.kokunai-list__item:hover .kokunai-list__image {    
    animation: zoomUp 2s linear 0s normal both;
} */

.kaigai-list__content,
.kokunai-list__content {
    padding: 24px;
}

.kaigai-list__title,
.kokunai-list__title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 16px;
}

.kaigai-list__text,
.kokunai-list__text {}

@media (max-width: 768px) {

    .kaigai-list,
    .kokunai-list {
        margin-bottom: 24px;
    }

    .kaigai-list__content,
    .kokunai-list__content {
        padding: 16px;
    }

    .kaigai-list__picture,
    .kokunai-list__picture {
        height: 220px;
    }

    .kaigai-list__title,
    .kokunai-list__title {
        font-size: 16px;
    }

}

/* ==========
- その他の海外旅行から選ぶ
========== */
.other-list {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
}

.other-list__title {
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    background: #3064D5;
    padding: 16px;
}

.other-list__title.active {}

.other-list__content {}

.other-list__links {
    padding: 24px;
}

.other-list__item {}

.other-list__link {
    width: 100%;
    display: block;
    padding: 16px 32px 16px 16px;
    position: relative;
    color: #2C3D59;
}

.other-list__link::after {
    content: "";
    display: inline-block;
    padding: 2px;
    width: 2px;
    height: 5px;
    border-right: 2px solid #697180;
    border-bottom: 2px solid #697180;
    transform: rotate(-45deg);
    position: absolute;
    right: 20px;
    top: 0;
    bottom: 0;
    margin: auto;
}

@media (max-width: 768px) {

    .other-list__links {
        padding: 24px 0;
    }

    .other-list__link {
        padding: 16px 32px 16px 24px;
    }

    .other-list__link::after {
        right: 24px;
    }
}

/* ==========
- 旅に出よう
========== */
.bnr-list {}

.bnr-list__item {}

.bnr-list__link {
    border-radius: 8px;
    overflow: hidden;
    display: block;
}

.bnr-list__picture {}

.bnr-list__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

@media (max-width: 768px) {}

/* ==========
- サポート
========== */
.support-box {
    max-width: calc(var(--content-width));
    padding: 70px 30px 30px;
    background: url(../images/support_bg.png) no-repeat top left;
    background-size: cover;
    border-radius: 8px;
    overflow: hidden;
}

.support-box__title {
    text-align: center;
    font-size: 20px;
    line-height: 130%;
    font-weight: 700;
    color: #FFF;
    background: url(../images/support_title-balloon.svg) center no-repeat;
    min-height: 131px;
    margin-bottom: -60px;
    position: relative;
    z-index: 1;

}

.support-box__title::before {
    content: url(../images/support_title.svg);
    display: block;
    line-height: 0;
    margin-bottom: -10px;

}

.support-box__title::before {
    content: "";
    background: url(../images/support_title.svg) no-repeat center;
    background-size: contain;
    display: block;
    line-height: 0;
    position: relative;
    height: 58px;
}

.support-box__title span {
    color: #FFFC3A;
}

.support-list {}

.support-list__item {
    width: 100%;
    position: relative;
}

.support-list__pointicon {
    position: absolute;
    top: -12px;
    left: -12px;
    z-index: 5;
}

.support-list__body {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    padding: 24px;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    text-align: center;
    z-index: 0;
}

.support-list__link:hover .support-list__pointicon,
.support-list__link:active .support-list__pointicon,
.support-list__link:focus .support-list__pointicon {
    z-index: 5 !important;
}

.support-list__link:hover .support-list__body,
.support-list__link:active .support-list__body,
.support-list__link:focus .support-list__body {
    z-index: 0 !important;
}

.support-list__picture {
    width: calc(100% / 2 - 24px);
    border-radius: 8px;
    overflow: hidden;
}

.support-list__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.support-list__content {
    width: calc(100% / 2);
}

.support-list__title {
    color: #10069F;
    font-size: 20px;
    font-weight: 700;
    text-align: left;
    margin-bottom: 16px;
    line-height: 130%;
}

.support-list__text {
    text-align: left;
}

.support-list__item-icon .support-list__body {
    padding: 16px 24px;
}

.support-list__item-icon .support-list__title {
    color: #2C2A29;
    font-size: 16px;
    text-align: center;
}

.support-list__icon {
    margin-bottom: 8px;
    display: inline-block;
}

@media (max-width: 768px) {

    .support-box__title {
        font-size: 16px;
        background: url(../images/support_title-balloon_sp.svg) center no-repeat;
        background-size: contain;
        min-height: 102px;
        margin-bottom: -60px;
        position: relative;
        z-index: 1;
    }

    .support-box__title::before {
        height: 48px;
    }

    .support-box {
        width: calc(100% - 40px);
        padding: 70px 20px 24px;
    }

    .support-list__link:hover,
    .support-list__link:hover .support-list__pointicon,
    .support-list__link:active .support-list__pointicon,
    .support-list__link:focus .support-list__pointicon {
        opacity: 1;
    }

    .support-list__body {
        padding: 16px;
    }

    .support-list__picture {
        width: 100%;
        height: 175px;
        margin-bottom: 16px;
    }

    .support-list__content {
        width: 100%;
    }

    .support-list__title {
        font-size: 18px;
    }
}

/* ==========
- 準備
========== */
.prep-list__item {
    margin: 0 auto;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    padding: 24px;
    text-align: center;
}

.prep-list__icon {
    display: inline-block !important;
    margin-bottom: 16px;
    width: 36px;
    height: 36px;
}

.prep-list__title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 16px;
}

.prep-list__text {
    text-align: left;
}

.prep-list.slick-slider {
    margin-bottom: 0;
}

.prep-list .slick-slide {
    transition: transform 0.4s ease, opacity 0.4s ease;
    transform: scale(0.9);
}

.prep-list .slick-center {
    transform: scale(1);
    opacity: 1;
}

@media screen and (min-width: 769px) {
    .prep-list {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 16px;
    }

    .prep-list__item {
        grid-column: span 1 / span 1;
    }
}

@media screen and (min-width: 861px) {
    .prep-list {
        gap: 24px;
    }
}


@media (max-width: 768px) {
    .kaigai-prep .inner {
        padding-left: 0;
        padding-right: 0;
    }
}


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

    .prep-list.slick-initialized .slick-track {
        display: flex !important;
        align-items: stretch;
    }

    .prep-list.slick-initialized .slick-slide {
        height: auto;
    }

    .prep-list.slick-initialized .slick-slide>div {
        height: 100%;
    }

    .prep-list__item {
        height: 100%;
        box-sizing: border-box;
    }

    .prep-list__link {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .prep-list__text {
        flex-grow: 1;
        text-align: left;
    }
}

/* ============================================
- 専門店
============================================ */

.variety-carousel-wrapper {
    position: relative;
    width: 100%;
    padding: 20px 0 50px;
    box-sizing: border-box;
}

.variety-carousel-clipper {
    overflow: hidden;
    width: 100%;
    position: relative;
}

.variety-carousel {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
}

.variety-list {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.variety-list__item {
    flex-shrink: 0;
    box-sizing: border-box;
    position: relative;
    transform-origin: center center;
    transition: transform 0.5s ease-in-out,
        margin-left 0.5s ease-in-out,
        margin-right 0.5s ease-in-out;
    background-color: transparent;
    border: none;
    overflow: visible;
}

.variety-list__item .variety-list__link {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}

.variety-list__picture {
    width: 100%;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    background-color: #e0e0e0;
    display: block;
}

.variety-list__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.variety-list__content {
    padding: 16px;
}

.variety-list__title {
    font-size: 16px;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 8px;
}

.variety-list__text {
    font-size: 14px;
    margin: 0;
    color: #555;
}

.is-center .variety-list__content {
    padding: 24px;
}

.is-center .variety-list__title {
    font-size: 18px;
    margin-bottom: 16px;
}

.is-center .variety-list__text {
    font-size: 14px;
}

@media (min-width: 769px)  {
    .variety-list__title {
        font-size: clamp( 14px, calc( 11.901639344262295px + 0.273224043715847vw ), 16px );
        letter-spacing: 0;
    }

    .variety-list__text {
        font-size: clamp( 12px, calc( 10.950819672131148px + 0.1366120218579235vw ), 13px );        
        letter-spacing: 0;
    }
}

/* ===================================
   ナビゲーション (矢印・ドット)
=================================== */

.carousel-arrow {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 10;
    border: none;
    background: rgba(233, 236, 242, 0.70);
    border-radius: 50%;
    width: 44px;
    height: 44px;
    cursor: pointer;
    font-size: 20px;
    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.15);
    left: 0;
    right: 0;
}

.carousel-arrow.prev {
    right: calc(var(--content-width) / 1.2);
}

.carousel-arrow.next {
    left: calc(var(--content-width) / 1.2);
}

.carousel-arrow.prev::before {
    content: url(../images/arrow_prev.svg);
}

.carousel-arrow.next::before {
    content: url(../images/arrow_next.svg);
}

.carousel-dots {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 4px;
    z-index: 5;
}

.carousel-dots button {
    background-color: #fff;
    border: none;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    padding: 0;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.carousel-dots button.active {
    background: #163BBF;
}

@media (max-width: 1104px) {
    .carousel-arrow {
        display: none;
    }
}

/* ============================================
- HISの選べる窓口
============================================ */
.hisService {
    background: url(../images/his-service_bg.png) no-repeat center;
    background-size: cover;
    padding: 96px 0;
}

.hisService-head {
    color: #fff;
}

.hisService-list {}

.hisService-list__item {
    border-radius: 8px;
    overflow: hidden;
    background: #FFF;
    margin-bottom: 40px;
}

.hisService-list__picture {
    overflow: hidden;
}

.hisService-list__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.hisService-list__content {
    padding: 37px 16px 24px 16px;
    position: relative;
}

.hisService-list__label,
.hisService-note__label {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    background: #10069F;
    color: #FFF;
    padding: 2px 8px;
}

.hisService-list__label {
    position: absolute;
    top: 0;
    left: 0;
}

.hisService-list__title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.hisService-list__text {}

.hisService-note {}

.hisService-note__text {
    line-height: 150%;
}

.hisService-note__link {
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    padding: 24px 40px 24px 24px;
    background: rgba(255, 255, 255, 0.90);
    position: relative;
}

.hisService-note__link::after {
    content: "";
    display: inline-block;
    padding: 2px;
    width: 2px;
    height: 5px;
    border-right: 2px solid #697180;
    border-bottom: 2px solid #697180;
    transform: rotate(-45deg);
    position: absolute;
    right: 24px;
    top: 0;
    bottom: 0;
    margin: auto;
}


@media (max-width: 768px) {
    .hisService-list__content {
        padding: 16px;
    }

    .hisService-list__content:has(.hisService-list__label) {
        padding-top: 32px;
    }

    .hisService-list__title {
        font-size: 18px;
    }

    .hisService-note__label {
        margin-bottom: 16px;
    }
}

/* ============================================
- お役立ち情報
============================================ */
.hisInfo {
    padding: 64px 0;
}

.hisInfo-list__item {}

.hisInfo-list__link {
    display: block;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #939DAD;
    background: #FFF;
    padding: 16px 32px 16px 16px;
    text-decoration: none;
    color: #2C2A29;
    position: relative;
    height: 100%;
}

.hisInfo-list__link::after {
    content: "";
    display: inline-block;
    padding: 2px;
    width: 2px;
    height: 5px;
    border-right: 2px solid #697180;
    border-bottom: 2px solid #697180;
    transform: rotate(-45deg);
    position: absolute;
    right: 16px;
    top: 0;
    bottom: 0;
    margin: auto;
}

.hisInfo-list__link:hover {
    color: #2C2A29;
    text-decoration: none;
}

.hisInfo-list__title {
    margin-bottom: 8px;
    font-weight: 700;
}

.hisInfo-list__text {
    line-height: 150%;
}

@media (max-width: 768px) {}

/* ============================================
- 画像ループ
============================================ */
.photo-slider {
    padding-top: 20px;
}

.photo-list__item {
    padding: 0 8px;
    box-sizing: border-box;
}

.photo-list__item:nth-child(odd) {
    padding-top: 30px;
}

.photo-list__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.photo-list .slick-track {
    transition-timing-function: linear !important;
}


@media (max-width: 768px) {
    .photo-slider {
        padding-top: 0;
    }

    .photo-list.slick-slider {
        margin-bottom: 0;
    }
}

/* ============================================
- アニメーション
============================================ */
.anime--zoomUp:hover picture img {
    animation: zoomUp 0.8s linear 0s normal both;
}

@keyframes zoomUp {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.1);
    }
}


.support-box__title {
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transform-origin: center bottom;
}

/* JavaScriptアニメーション用クラス */
.support-box__title.is-hovered {
    transform: rotate(-3deg);
}