@charset "UTF-8";

/*　Common CSS---------------------------------------------　*/
body, html { padding: 0; margin: 0; overflow-x: hidden; font-family: 'Noto Sans JP', 'Noto Sans', YakuHanJPs, sans-serif; }
.m_t_3 { margin-top: 2rem; }
.m_b_3 { margin-bottom: 2rem; }
.m_b_2 { margin-bottom: 1.5rem; }
.m_b_1 { margin-bottom: 1rem !important; }
.text_center { text-align: center; }
.text_gray { color: gray; }
p { font-weight: 600; line-height: 1.7rem; margin: 0rem; font-size: 0.9rem; padding: 0 1rem; }
p.text_light { font-weight: normal; line-height: 1.6rem; font-size: 1rem; }
.pc_only { display: none !important; }
.sp_only { display: block !important; }
@media print, screen and (min-width: 640px) {
    .m_t_3 { margin-top: 3rem; }
    .m_b_3 { margin-bottom: 3rem; }
    .m_b_2 { margin-bottom: 2rem; }
    p { line-height: 2.5rem; margin: 0rem; font-size: 1rem; padding: 0; }
    p.text_light { font-size: 0.85rem; }
    .pc_only { display: block !important; }
    .sp_only { display: none !important; }

    .img_w_80 > img {
        width: 80% !important;
    }
    .img_w_70 > img {
        width: 70% !important;
    }
}

.blue_bg { background-color: #e3f0ff; }
.white_bg { background-color: #ffffff; }
.snow_bg { background-image: url('../images/common/bg_blue.png'); background-repeat: repeat; background-size: 85%; }
.snow_white_bg { background-image: url('../images/common/bg_white.png'); background-repeat: repeat; background-size: 85%; }

.top_bg { height: 3rem; background-image: url('../images/common/bg_whitetop.png'); background-repeat: no-repeat; background-size: cover;}
.bottom_bg { height: 3rem; background-image: url('../images/common/bg_bluetop.png'); background-repeat: no-repeat; background-size: cover;}
@media print, screen and (min-width: 640px) {
    .top_bg { height: 11rem; }
    .bottom_bg { height: 11rem; }
}

.content_box { width: auto; margin: auto 1.5rem; }
.content_box_pad { padding: 1.5rem; border-radius: 30px; width: auto; margin: auto 1.5rem; }
@media print, screen and (min-width: 640px) {
    .content_box { max-width: 1200px; margin: auto;}
    .content_box_pad { border-radius: 60px; max-width: 1144px; margin: auto;}
}
/*　Common CSS---------------------------------------------　*/

/* Header Content CSS--------------------------------------- */
.header { background-color: #818181; }
.header > .top { height: 4rem; background-image: url('../images/common/header_illust.png'); background-repeat: repeat-x; background-size: cover; }
.header > .bottom { display: flex;}
.header > .bottom img { width: 100% }
@media print, screen and (min-width: 640px) {
    .header > .top { height: 6rem; background-size: contain; }
    .header > .bottom {  }
}
@media print, screen and (min-width: 768px) {
    .header > .top {
        height: 6rem;
        background-size: cover;
    }
}
@media print, screen and (min-width: 1300px) {
    .header > .top {
        background-size: contain;
    }
}
/* Header Content CSS--------------------------------------- */

/* Footer Content CSS--------------------------------------- */
.footer {  }
.footer > .top { height: 8rem; background-image: url('../images/common/footer_illust.png'); background-repeat: no-repeat; background-position-y: center; background-size: 100%; }
.footer > .copy_right { font-size: 0.6rem; text-align: center; background-color: #9a9ab2; padding: 0.5rem; color: #FFFFFF; }
@media print, screen and (min-width: 640px) {
    .footer > .top { height: 25rem; }
    .footer > .copy_right { font-size: 1rem; padding: 0.5rem; }
}
@media print, screen and (min-width: 768px) {
    .footer > .top { height: 14rem; }
}
@media print, screen and (min-width: 1300px) {
    .footer > .top { height: 25rem; }
}
/* Footer Content CSS--------------------------------------- */

/* Top Content CSS--------------------------------------- */
.top_content { padding: 2rem 0; }
.top_content .group_of_three > .left img { margin-top: 2rem; }

.top_content .group_of_three > .left { grid-area: left; display: flex; justify-content: space-around; align-items: flex-end; }
.top_content .group_of_three > .middle { grid-area: middle; display: block; text-align: center; }
.top_content .group_of_three > .right { grid-area: right; display: flex; justify-content: center; align-items: flex-end; position: relative }
.top_content .group_of_three > .right > img { width: 50%; position: absolute; top: 1rem; left: 2rem; }

@media print, screen and (min-width: 640px) {
    .top_content { padding: 0; height: 19rem; }
    .top_content .group_of_three > .left img { margin-top: 0; }
    .top_content .group_of_three > .right { position: relative; }
    .top_content .group_of_three > .right img { position: absolute; top: 1rem; left: 2rem; width: 50%; }
}
/* Top Content CSS--------------------------------------- */

/*** Content box ***/

/*** Content box----------------------------------- ***/

/*** Group of three layout--------------------- ***/
.group_of_three { display: grid; gap: 12px; padding: 0 1rem; }
.group_of_three img { width: 70%; display:block; }
.group_of_three iframe { width: 100%; display:block; border-radius: 7px; height: 10rem; }
/* Name the areas for easy rearrangement on mobile */

.group_of_three > .left { grid-area: left; display: flex; justify-content: end; align-items: center; }
.group_of_three > .middle { grid-area: middle; display: flex; justify-content:center; align-items: center; }
.group_of_three > .right { grid-area: right; display: flex; justify-content: start; align-items: center; }
.group_of_three > .left > img { width: 50%; }
.group_of_three > .right.img_w_70 > img { width: 70%; }

.group_of_three.v_bottom_align > .left { align-items: end; justify-content: center; }
.group_of_three.v_bottom_align > .middle { align-items: end; justify-content: center; }
.group_of_three.v_bottom_align > .right { align-items: end; justify-content: center; }

/* SP layout: first row middle (full width), second row left and right */
.group_of_three {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas:
                "middle middle"
                "left right";
    gap: 0;
}
/* PC layout: left middle right in a row */
@media print, screen and (min-width: 640px) {
    .group_of_three {
        grid-template-areas: "left middle middle right";
        grid-template-columns: repeat(4, 1fr); /* PC: left middle right on one row */
        padding: 0;
    }
    .group_of_three img { width: 50%; display:block; }
    .group_of_three > .left > img,
    .group_of_three > .right > img { width: 50%; display:block; }
    .group_of_three > .middle > img { width: 80%; display:block; }

    .group_of_three iframe { border-radius: 15px; height: 20rem; }

    .group_of_three.middle_l {
        grid-template-areas: "left middle middle middle middle right";
        grid-template-columns: repeat(6, 1fr); /* PC: left middle right on one row */
    }

    .group_of_three.middle_l > .left { justify-content: center; align-items: flex-start; }
    .group_of_three.middle_l > .left > img { width: 90%; margin-top: 3rem; }
    .group_of_three.middle_l > .middle { grid-area: middle; display: block; text-align: center; padding: 0; margin-top: 4rem;}
    .group_of_three.middle_l > .right { justify-content: end; align-items: center; }
    .group_of_three.middle_l > .right > img { width: 90%; }

}
/*** Group of three layout----------------------------------- ***/

/*** 写真 スライダー ***/
.loop_wrap { display: flex; width: 100dvw; margin-inline: calc(50% - 50dvw); height: 150px; overflow: hidden; }
.loop_wrap img { width: auto; height: 100%; }
@media print, screen and (min-width: 640px) {
    .loop_wrap { height: 300px; }
}

@keyframes loop {
    0% {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
}

@keyframes loop2 {
    0% {
        transform: translateX(0);
    }
    to {
        transform: translateX(-200%);
    }
}

.loop_wrap img:nth-child(odd) {
    animation: loop 50s -25s linear infinite;
}

.loop_wrap img:nth-child(even) {
    animation: loop2 50s linear infinite;
}
/*** Swiper スライダー----------------------------------- ***/

/*** 2カラムレイアウト ***/
.content_1_col { display: block; padding: 0; margin-bottom: 3rem; }
.content_2_col { display: block; padding: 0; }
.content_2_col > .s_col { padding: 0 1rem; }
.content_2_col > .s_col > img { width: 100%; display:block; }
.content_2_col div.subtitle > img { display:block; width: 45%; padding: 1.5rem 0 1rem; margin: auto; }
.content_2_col div.subtitle > img.small { width: 56%; }

@media print, screen and (min-width: 640px) {
    .content_1_col {  padding: 0 5rem; }
    .content_2_col { display: flex; flex-direction: row; gap: 2rem; padding: 0 5rem; }
    .content_2_col div.subtitle > img { display:block; width: 35%; padding: 1rem 0 1.5rem; margin: 0; }
    .content_2_col div.subtitle > img.small { width: 42%; }
    .content_2_col.revert_children { flex-direction: row-reverse; }
    .content_2_col > .l_col { width: 65%; }
    .content_2_col > .s_col { width: 35%; padding: 0; }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .content_2_col { padding: 0 2rem; }
}
/*** 2カラムレイアウト----------------------------------- ***/

/*** 温泉----------------------------------- ***/
.content_box_pad .content_2_col { margin-bottom: 3rem; }
.hot_spring {
    box-shadow: inset 0px 0px 15px rgb(255, 180, 32);
    border: 4px solid #ffb420;
    background-color: #fff4e6;
}
.hot_spring > .hot_spring_top_text { position: relative; }
.hot_spring > .hot_spring_top_text > img.cloud_l_t { position: absolute; top: -7rem; left: -1rem; width: 20%; -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -o-transform: scale(-1, 1); transform: scale(-1, 1); }
.hot_spring > .hot_spring_top_text > img.cloud_l_b { position: absolute; top: -2rem; left: -3rem; width: 14%; -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -o-transform: scale(-1, 1); transform: scale(-1, 1); }
.hot_spring > .hot_spring_top_text > img.cloud_r_t { position: absolute; top: -7rem; right: -1.5rem; width: 20%; }
.hot_spring > .hot_spring_top_text > img.cloud_r_b { position: absolute; top: -2rem; right: -2.5rem; width: 14%; }
.hot_spring .pos_relative { position: relative; }
.hot_spring .pos_relative .abs_img > img { position: absolute; top: 37rem; left: -4rem; width: 27% !important; }
.hot_spring > .loop_wrap { border-top: 3px solid #ff733e; border-bottom: 3px solid #ff733e; }
.hot_spring iframe { border: 3px solid #ffb420; }
.hot_spring .map { position: relative; }
.hot_spring .map img.map { width: 100%; display:block; margin: auto; }
.hot_spring .map img.left { width: 30%; position: absolute; top: 0rem; left: -2rem; }
.hot_spring .map img.right { width: 20%; position: absolute; top: 9rem; right: -2.7rem; -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -o-transform: scale(-1, 1); transform: scale(-1, 1); }
.hot_spring .group_of_three.v_bottom_align > .left > img { width: 90%; margin-top: 1rem; }
.hot_spring .group_of_three.v_bottom_align > .right > .flex_column { display: flex; flex-direction: column; align-items: center; }
.hot_spring .group_of_three.v_bottom_align > .right > .flex_column img { width: 90%; }
.hot_spring .group_of_three.v_bottom_align > .right > .flex_column img.img_s { width: 20%; margin-bottom: 2rem; margin-right: -5rem; }

@media print, screen and (min-width: 640px) {
    .hot_spring > .hot_spring_top_text > img.cloud_l_t { top: -5rem; left: 2rem; width: 13%; }
    .hot_spring > .hot_spring_top_text > img.cloud_l_b { top: 8rem; left: -3rem; width: 10%; }
    .hot_spring > .hot_spring_top_text > img.cloud_r_t { top: -5rem; right: 0rem; width: 13%; }
    .hot_spring > .hot_spring_top_text > img.cloud_r_b { top: 8rem; right: -3rem; width: 10%; }
    .hot_spring .pos_relative .abs_img > img { position: absolute; top: 14rem; left: -9rem; width: 22% !important; }

    .hot_spring .map img.map { width: 75%;  }
    .hot_spring .map img.left { width: 15%; top: 3rem; left: 3rem; }
    .hot_spring .map img.right { width: 15%; top: 12rem; right: -2.7rem; }
    .hot_spring .group_of_three.v_bottom_align > .left > img { width: 70%; margin-top: 0;}
    .hot_spring .group_of_three.v_bottom_align > .right > .flex_column img { width: 90%; }
    .hot_spring .group_of_three.v_bottom_align > .right > .flex_column img.img_s { width: 20%; margin-bottom: 6rem; margin-right: 10rem; }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    /* CSS rules for iPads in portrait or smaller landscape modes */
    .hot_spring .group_of_three.v_bottom_align > .right > .flex_column img.img_s { width: 26%; margin-bottom: 1rem; margin-right: 6rem; }
    .hot_spring .pos_relative .abs_img > img { position: absolute; top: 10rem; left: -4rem; width: 25% !important; }
}
/*** 温泉----------------------------------- ***/

/*** スノーアクティビティ------------------------------- ***/
.snow_activities {
    box-shadow: inset 0px 0px 15px rgb(113, 203, 248);
    border: 4px solid #71cbf8;
    background-color: #e5f3fc;
}
.snow_activities .group_of_three.title > .middle > img { width: 100%; }
.snow_activities .group_of_three.title > .left img { width: 50%; margin-right: 1rem; }
.snow_activities .group_of_three.title > .right img { width: 60%; }

.snow_activities .pos_relative { position: relative; }
.snow_activities .pos_relative .abs_img > img { position: absolute; bottom: -3rem; right: -2.5rem; width: 18% !important; }

.snow_activities .group_of_three > .left { justify-content: right; }
.snow_activities .group_of_three > .left > .flex_column { display: flex; flex-direction: column; align-items: center; }
.snow_activities .group_of_three > .left > .flex_column img { width: 78%; }
.snow_activities .group_of_three > .left > .flex_column img.img_s { width: 25%; margin: 1rem 5rem 1rem 0; }
.snow_activities .group_of_three > .right { margin-top: 1rem; }
.snow_activities .group_of_three > .right img { width: 100%; }

.snow_activities_top_text { position: relative; }
.snow_activities_top_text > img.snow_l { position: absolute; top: -7rem; left: -2.8rem; width: 25%; -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -o-transform: scale(-1, 1); transform: scale(-1, 1); }
.snow_activities_top_text > img.snow_r { position: absolute; top: -7rem; right: -2.8rem; width: 25%; }

.snow_activities > .loop_wrap { border-top: 3px solid #71cbf8; border-bottom: 3px solid #71cbf8; }
.snow_activities iframe { border: 3px solid #71cbf8; }

.snow_activities .content_2_col .subtitle > img { width: 68%; }
.snow_activities .content_2_col .subtitle.title_2 > img { width: 70%; } /*Mt.乗鞍スノーリゾート*/
.snow_activities .content_1_col { background-color: rgb(255 255 255 / 50%); border: 2px solid #0089e3; border-radius: 1rem; padding: 1rem 0rem; margin: 0 1rem 3rem 1rem; }
.snow_activities .content_1_col p { color: #0289e1; font-size: 0.8rem; line-height: 1.5rem; }
.snow_activities .content_1_col .subtitle.title_3 { text-align: center; }
.snow_activities .content_1_col .subtitle.title_3 > img { width: 55%; } /*お得なサービス*/
.snow_activities .content_2_col .subtitle.title_4 > img { width: 63%; } /*冷たい冬こそ暖かな人たちと*/

@media print, screen and (min-width: 640px) {
    .snow_activities .group_of_three.title {
        grid-template-areas: "left middle middle middle middle right";
        grid-template-columns: repeat(6, 1fr);
    }
    .snow_activities .group_of_three.title > .middle > img { width: 100%; }
    .snow_activities .group_of_three.title > .left,
    .snow_activities .group_of_three.title > .right { justify-content: center; }
    .snow_activities .group_of_three.title > .right img { width: 70%; }

    .snow_activities .pos_relative .abs_img > img { position: absolute; bottom: 1rem; right: -3rem; width: 15% !important; }

    .snow_activities .group_of_three > .left > .flex_column img { width: 70%; }
    .snow_activities .group_of_three > .left > .flex_column img.img_s { margin: 0 0 2rem 9rem; }
    .snow_activities .group_of_three > .right { margin-top: 0; }
    .snow_activities .group_of_three > .right img { width: 80%; }

    .snow_activities_top_text > img.snow_l { top: -2rem; left: -3rem; width: 14%; }
    .snow_activities_top_text > img.snow_r { top: -2rem; right: -3rem; width: 14%; }

    .snow_activities .content_2_col .subtitle > img { width: 50%; }
    .snow_activities .content_2_col .subtitle.title_2 > img { width: 92%; } /*Mt.乗鞍スノーリゾート*/
    .snow_activities .content_1_col { border: 3px solid #0089e3; border-radius: 1rem; padding: 1.5rem 2rem; margin: 0 5rem 3rem 5rem; }
    .snow_activities .content_1_col p { color: #0289e1; font-size: 0.875rem; line-height: 2.2rem; }
    .snow_activities .content_1_col .subtitle.title_3 > img { width: 24%; margin-bottom: 0.5rem; } /*お得なサービス*/
    .snow_activities .content_2_col .subtitle.title_4 > img { width: 84%; } /*冷たい冬こそ暖かな人たちと*/
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    /* CSS rules for iPads in portrait or smaller landscape modes */
    .snow_activities_top_text > img.snow_l { top: -5rem; left: 7rem; width: 11%; }
    .snow_activities_top_text > img.snow_r { top: -5rem; right: 7rem; width: 11%; }
    .snow_activities .group_of_three > .left > .flex_column img.img_s { margin: 0 0 2rem 5rem; }
    .snow_activities .pos_relative .abs_img > img { right: 0rem; width: 20% !important; }
}
/*** スノーアクティビティ------------------------------- ***/
/*** 市街地 観パ良し------------------------------- ***/
.town_location {
    box-shadow: inset 0px 0px 15px rgb(128, 211, 137);
    border: 4px solid #7ed389;
    background-color: #eaf7ee;
}
.town_location > .loop_wrap { border-top: 3px solid #7ed389; border-bottom: 3px solid #7ed389; }
.town_location iframe { border: 3px solid #7ed389; }

.town_location .group_of_three.title > .middle > img { width: 100%; }
.town_location .group_of_three.title > .left > img { width: 55%; margin: 1rem 1rem 0 0; }
.town_location .group_of_three.title > .right > img { width: 65%; margin: 1rem 0 0 1rem; }

.town_location_top_text > img.icon_l_t { top: -6rem; left: -2.5rem; width: 19%; }
.town_location_top_text > img.icon_l_b { top: -3rem; left: 0; width: 12%; }
.town_location_top_text > img.icon_r_t { top: -6.5rem; right: -2.5rem; width: 17%; }
.town_location_top_text > img.icon_r_b { top: -3rem; right: 0; width: 9%; }

.town_location_top_text { position: relative; }
.town_location_top_text > img { position: absolute; }

.town_location .group_of_three.v_bottom_align > .left > img { width: 100%; margin-top: 1rem; }
.town_location .group_of_three.v_bottom_align > .right { justify-content: flex-start; }
.town_location .group_of_three.v_bottom_align > .right > .flex_column { display: flex; flex-direction: column; align-items: center; }
.town_location .group_of_three.v_bottom_align > .right > .flex_column img { width: 47%; }
.town_location .group_of_three.v_bottom_align > .right > .flex_column img.img_s { width: 25%; margin-bottom: 0rem; margin-right: -7rem; }

.town_location .content_2_col .subtitle > img { width: 90%; }


@media print, screen and (min-width: 640px) {
    .town_location .group_of_three.title {
        grid-template-areas: "left middle middle middle middle right";
        grid-template-columns: repeat(6, 1fr);
    }
    .town_location .group_of_three.title > .middle > img { width: 100%; }
    .town_location .group_of_three.title > .left > img { width: 90%; margin:0 }
    .town_location .group_of_three.title > .right > img { width: 90%; margin:0 }

    .town_location_top_text > img.icon_l_t { top: 2rem; left: -5rem; width: 15%; }
    .town_location_top_text > img.icon_l_b { top: 10rem; left: 4rem; width: 9%; }
    .town_location_top_text > img.icon_r_t { top: 0; right: -5.2rem; width: 14%; }
    .town_location_top_text > img.icon_r_b { top: 10rem; right: 5rem; width: 7%; }

    .town_location .group_of_three.v_bottom_align > .left > img { width: 70%; margin: 0;}
    .town_location .group_of_three.v_bottom_align > .right > .flex_column { align-items: flex-start; }
    .town_location .group_of_three.v_bottom_align > .right > .flex_column img { width: 53%; margin-left: 2rem; }
    .town_location .group_of_three.v_bottom_align > .right > .flex_column img.img_s { width: 23%; margin: 0 0 0 1rem; }

    .town_location .content_2_col .subtitle > img { width: 110%; }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    /* CSS rules for iPads in portrait or smaller landscape modes */
    .town_location_top_text > img.icon_l_t { top: -4rem; left: 4rem; width: 10%; }
    .town_location_top_text > img.icon_l_b { top: -2rem; left: 8rem; width: 6%; }
    .town_location_top_text > img.icon_r_t { top: -5rem; right: 5rem; width: 10%; }
    .town_location_top_text > img.icon_r_b { top: -2rem; right: 10rem; width: 4%; }
}

.youtubelink { text-align: center; }
.youtubelink .img-link { position: relative; display: inline-block; line-height: 0; width: 100%; /* remove inline gap */ }
.youtubelink .img-link img { display: block; margin: auto; width: 95%; }
.youtubelink .img-hover { position: absolute; inset: 0; opacity: 0; transition: opacity .2s ease; }
.youtubelink .img-link:hover .img-hover,
.youtubelink .img-link:focus-visible .img-hover { opacity: 1; }
@media print, screen and (min-width: 640px) {
    .youtubelink .img-link { width: 30%; }
}
/*** 市街地 観パ良し------------------------------- ***/

/*** 期間限定ショート動画リンクバナー ------------------------------- ***/
..banner_rakuten { padding: 1rem 0;  margin: 0 2rem 3rem 2rem; }
.banner_rakuten .shortmovie_banner .shortmovie_flex { display: block;-webkit-justify-content: space-between;justify-content: space-between;border: 2px solid #ff118c;border-radius: 10px;margin: 0;padding: 2rem 2rem;list-style:none;}
.banner_rakuten .shortmovie_banner .shortmovie_flex li { width: 100%;display: flex;justify-content: center;}
.banner_rakuten .shortmovie_banner img { width: 100%; display:block; margin: 1rem auto; 0}
.banner_rakuten .shortmovie_banner a { display: contents; }
.rakuten_title { margin: 4rem 0 2rem; position: relative; }
.rakuten_title img { width: 65%; display:block; margin: auto; }
@media print, screen and (min-width: 640px) {
    .banner_rakuten { padding: 0 0 6rem 0; margin: 0 2rem; }
    .banner_rakuten .shortmovie_banner .shortmovie_flex { width: 1150px; margin: 0 auto;}
    .banner_rakuten .shortmovie_banner .shortmovie_flex { display: -webkit-flex;display: flex;-webkit-justify-content: space-between;justify-content: space-between;border: 2px solid #ff118c;border-radius: 10px;padding: 2rem 2rem;list-style:none;}
.banner_rakuten .shortmovie_banner .shortmovie_flex li { width: 31%;display: flex;justify-content: center;}
    .banner_rakuten .shortmovie_banner img { width:100%; display:block; margin: auto; }
    .rakuten_title img { width: 40%; }
}
/*** 期間限定ショート動画リンクバナー ------------------------------- ***/

/*** 楽天トラベル公式宿泊予約サイト ------------------------------- ***/
.banner_rakuten { padding: 1rem 0;  margin: 0 2rem 3rem 2rem; }
.banner_rakuten .banner img { width: 100%; display:block; margin: auto; }
.banner_rakuten .banner a { display: contents; }
.rakuten_title { margin: 4rem 0 2rem; position: relative; }
.rakuten_title img { width: 65%; display:block; margin: auto; }
@media print, screen and (min-width: 640px) {
    .banner_rakuten { padding: 0 0 6rem 0; margin: 0 2rem; }
    .banner_rakuten .banner img { width: 50%; display:block; margin: auto; }
    .rakuten_title img { width: 40%; }
}
/*** 楽天トラベル公式宿泊予約サイト ------------------------------- ***/

/*** 松本は関東・関西から意外と近い ------------------------------- ***/
.access_info .bus_title img { width: 80%; display:block; margin: auto; padding-bottom: 2rem; }

.access_info .group_of_three .left img { width: 65%; margin-right: 1rem; }
.access_info .group_of_three .right img { width: 55%; margin-left: 1rem; }
.access_info .group_of_three .middle { margin-bottom: 1rem; }
.access_info .group_of_three .middle img { width: 100%; }
@media print, screen and (min-width: 640px) {
    .access_info .group_of_three .left img { width: 50%; margin-right: 0; }
    .access_info .group_of_three .right img { width: 40%; margin-left: 0; }
    .access_info .group_of_three .middle { margin-bottom: 0; }
    .access_info .group_of_three .middle img { width: 85%; }
}

.access_info .content_2_col { padding: 0; }
.access_info .content_2_col.bus_info { gap: 2rem; margin: 0 0 2rem 0; }
.access_info .content_2_col.bus_info > div { border: 2px solid #ff118c; border-radius: 10px; padding: 1.5rem 2rem; width: auto; }
.access_info .content_2_col.bus_info > div:first-child { margin-bottom: 1.5rem; }
.access_info .content_2_col.bus_info > div > h3 { color: #ff118c; text-align: center; line-height: 0; margin-bottom: 2rem;}
.access_info .content_2_col.bus_info > div > img { display: block; margin: auto; width: 100%; }
.access_info .content_2_col.bus_info > div > p { padding: 0; margin: 0; font-size: 1.5rem; line-height: 2.5rem; }
.access_info .content_2_col.bus_info > div > p.text_light { font-size: 1.1rem; line-height: 1.9rem; }
.access_info .content_2_col.bus_info > div.l_col { padding: 0; }
.access_info .content_2_col.bus_info > div.l_col > img { width: 100%; border-radius: 10px; }
.access_info .content_2_col.bus_info > div.s_col { border: 0; padding: 0; }
.access_info .content_2_col.bus_info > div.s_col > h3 { font-size: 1.5rem; text-align: left; line-height: 0; border-bottom: 1px solid grey; padding: 1rem 0 2rem; margin-bottom: 1rem; }

.access_info .content_2_col.bus_info.info_2 > div > h3 { font-size: 1.7rem; line-height: 2.5rem; margin: 0 0 1rem; }
.access_info .content_2_col.bus_info.info_2 p { font-size: 0.9rem; line-height: 1.7rem; margin-top: 1rem; }

@media print, screen and (min-width: 640px) {
    .access_info .content_2_col.bus_info { margin: 0 0 2rem 0; }
    .access_info .content_2_col.bus_info > div.l_col { margin-top: 1.5rem; width: 65%; height: 100%; }
    .access_info .content_2_col.bus_info.info_2 > div { width: 50%; }
    .access_info .content_2_col.bus_info > div:first-child { margin-bottom: 0; }
    .access_info .content_2_col.bus_info > div > img { display: block; margin: auto; width: 60%; }
    .access_info .content_2_col.bus_info > div > p { padding: 1rem 0; margin: 0; font-size: 1rem; line-height: 1.9rem; }
    .access_info .content_2_col.bus_info > div > p.text_light { font-size: 0.9rem; line-height: 1.5rem; }
    .access_info .content_2_col.bus_info > div.s_col > p { padding: 0; }
    .access_info .content_2_col.bus_info > div.s_col > h3 { font-size: 1.2rem; text-align: left; line-height: 0; border-bottom: 1px solid grey; padding-bottom: 1.5rem; margin-bottom: 0.5rem; }
    .access_info .content_2_col.bus_info > div.s_col > h3.second { margin-top: 2.5rem; }

    .access_info .content_2_col.bus_info.info_2 > div > h3 { font-size: 1.5rem; line-height: 2.5rem; }
    .access_info .content_2_col.bus_info.info_2 p { margin-top: 0; }
}
/*** 松本は関東・関西から意外と近い ------------------------------- ***/

/*** SOUNDs MATSUMOTO ------------------------------- ***/
.sounds_matsumoto { margin-top: 4rem;  }
.sounds_matsumoto .title img { width: 75%; display:block; margin: auto; padding-bottom: 2rem; }
.sounds_matsumoto .content_2_col { padding: 0; display: flex; flex-direction: column; align-items: center; }
.sounds_matsumoto .content_2_col .l_col { width: auto;}
.sounds_matsumoto .content_2_col img.s_col { width: 60%; margin-bottom: 1rem; }

@media print, screen and (min-width: 640px) {
    .sounds_matsumoto { margin-top: 4rem; }
    .sounds_matsumoto .title img { width: 45%; }
    .sounds_matsumoto .content_2_col { padding: 0 3rem; flex-direction: row; flex-direction: row-reverse; }
    .sounds_matsumoto .content_2_col .l_col { width: 80%;}
    .sounds_matsumoto .content_2_col img.s_col { width: 20%; height: fit-content; margin-top: 1rem; }
}
/*** SOUNDs MATSUMOTO ------------------------------- ***/