@charset "utf-8";

/* pattern common
================================================== */
.custom_citypromotion #tmp_page_id{
    position: relative;
    z-index: 8;
}
/* title */
.city_title{
    margin-bottom: 19px;
    padding-top: 47px;
    background-repeat: no-repeat;
    background-position: left top;
    font-size: 211.11%;
    line-height: 1.7;
    font-weight: bold;
    color: #222222;
}
.city_title .title_txt{
    display: inline-block;
    padding: 0 27px 19px 0;
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/pattern_ttl_wave.png) no-repeat right bottom;
    color: inherit;
}
.city_title .title_mark{
    color: #0079c6;
}
.city_subtitle{
    position: relative;
    margin: 0 0 11px -4px;
    font-size: 144.44%;
    padding: 10px 0;
    line-height: 1.7;
    font-weight: bold;
    z-index: 1;
}
.city_subtitle:before{
    content: '';
    position: absolute;
    bottom: 2px;
    left: 3px;
    padding-top: calc((38/1144) * 100%);
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/pattern_subttl_wave1.png) no-repeat;
    background-size: 100% 100%;
    width: 100%;
    max-width: 200px;
    height: 0;
    color: inherit;
    z-index: -1;
}
.city_subtitle.pattern_blue{
    font-size: 155.56%;
}
.city_subtitle.pattern_blue:before{
    bottom: 3px;
    left: 2px;
    padding-top: calc((42/224) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/pattern_subttl_wave2.png);
    max-width: 220px;
}

/* thumbnail */
.thumbnail_item > a{
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    height: 100%;
    border: 1px solid #12a6e9;
    color: #282828;
    line-height: 1.7;
    text-decoration: none;
}
.thumbnail_item .thumbnail_img{
    overflow: hidden;
    flex-shrink: 0;
}
.thumbnail_item .thumbnail_img img{
    vertical-align: top;
    width: 100%;
    height: auto;
}
.thumbnail_item .thumbnail_des{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 1;
    padding: 9px 17px 12px;
}
.thumbnail_item .thumbnail_title{
    display: inline-block;
    padding: 3px 0 3px 13px;
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/arrow_link_rgt.png) no-repeat 0 13px;
    background-size: 6px auto;
    font-weight: 500;
    color: inherit;
}
.thumbnail_item .thumbnail_title + .thumbnail_text{
    margin-top: 14px;
    padding-top: 9px;
    border-top: 1px solid #a4d0e4;
}
.thumbnail_item .thumbnail_text{
    font-size: 88.89%;
    color: #222222;
}

/* btn */
.btn_simple,
.btn_show_more,
#tmp_gallery_modal .modal_btn_close{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 13px 30px 15px 23px;
    background-color: #ffffff;
    width: 100%;
    max-width: 280px;
    border: 1px solid #02a1f9;
    border-radius: 27px;
    font-size: 88.89%;
    font-weight: 500;
    line-height: 1.5;
    color: #0063a6;
    text-decoration: none;
}
.btn_simple p,
.btn_show_more p,
#tmp_gallery_modal .modal_btn_close p{
    display: flex;
    align-items: flex-start;
}
.btn_simple p:after{
    content: '';
    position: absolute;
    top: 1px;
    bottom: 0;
    right: -25px;
    margin: auto 0;
    width: 49px;
    height: 1px;
    border-bottom: 1px solid #02a1f9;
    z-index: 1;
    pointer-events: none;
}
.btn_show_more{
    padding-left: 22px;
    padding-right: 42px;
}
#tmp_gallery_modal .modal_btn_close p:after,
.btn_show_more p:before,
.btn_show_more p:after{
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
}
#tmp_gallery_modal .modal_btn_close p:after,
.btn_show_more p:before{
    right: 23px;
    width: 14px;
    height: 2px;
    border-top: 2px solid #0063a6;
}
.btn_show_more p:after{
    right: 29px;
    width: 2px;
    height: 14px;
    border-left: 2px solid #0063a6;
}
.btn_show_more:has(.hide) p:after{
    transform: rotate(90deg);
}
.btn_simple a,
.btn_show_more a,
#tmp_gallery_modal .modal_btn_close a{
    display: inline-block;
    text-decoration: none;
    color: inherit;
}

/* list thumnails */
.list_thumbnail{
    display: flex;
    flex-flow: row wrap;
    gap: 20px;
}
.list_thumbnail .thumbnail_item{
    list-style: none;
    width: calc(25% - 15px);
}

/* main */
.custom_citypromotion #tmp_wrap_main{
    padding-bottom: 0;
}
#tmp_wrap_main:has(.sec_learn){
    position: relative;
}
#tmp_wrap_main:has(.sec_learn):after{
    content: '';
    position: absolute;
    bottom: 2px;
    left: 50%;
    margin-left: 241px;
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/learn_pattern_btm.png) no-repeat;
    background-size: auto 400px;
    width: 742px;
    max-width: calc(50% - 241px);
    height: 400px;
    color: inherit;
    pointer-events: none;
    z-index: 1;
}
.custom_citypromotion #tmp_pankuzu{
    margin: 0;
    padding: 54px 0 64px;
    background-color: #e1f4ff;
}
.custom_citypromotion #tmp_pankuzu p{
    margin: 0 25px;
}
.custom_citypromotion #tmp_footer{
    margin-top: 0;
}
.custom_citypromotion .pnavi{
    z-index: 10;
}

/* splide */
.city_carousel{
    display: flex;
    flex-direction: column-reverse;
    gap: 18px 0;
}
.city_carousel .splide__controls {
    display: flex;
	align-items: center;
    flex-flow: row wrap;
    gap: 12px 24px;
}
.city_carousel .splide__progress {
    display: flex;
	align-items: flex-end;
    padding-bottom: 4px;
}
.city_carousel .progress_current {
    font-size: 166.67%;
	color: #0063a6;
    font-weight: 500;
    line-height: 1;
}
.city_carousel .progress_total {
	position: relative;
    margin-bottom: 1px;
	padding-left: 16px;
    font-size: 88.89%;
    line-height: 1;
    color: #222222;
}
.city_carousel .progress_total:before {
	content: '';
    position: absolute;
    bottom: 0;
    left: 9px;
    border-left: 1px solid #222222;
    width: 1px;
    height: 90%;
    transform: rotate(16deg);
}
.city_carousel .splide__arrow {
    position: relative;
    display: block;
	width: 30px;
    height: 30px;
	text-indent: -9999px;
	opacity: 1;
	transform: none;
	background-color: transparent;
	background-image: -moz-linear-gradient(#ffffff 0 0), -moz-linear-gradient(45deg, #02a1f9 0%, #7ae62a 100%);
	background-image: -o-linear-gradient(#ffffff 0 0), -o-linear-gradient(45deg, #02a1f9 0%, #7ae62a 100%);
	background-image: linear-gradient(#ffffff 0 0), linear-gradient(45deg, #02a1f9 0%, #7ae62a 100%);
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
    border: 2px solid transparent;
	background-repeat: no-repeat;
}
.city_carousel .splide__arrow:before{
    content: '';
    position: absolute;
    top: -1px;
    bottom: 0;
    margin: auto 0;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 100% auto;
    width: 32px;
    height: 8px;
    z-index: 1;
    pointer-events: none;
    transition: transform 0.3s ease-in-out;
}
.city_carousel .splide__arrow--prev{
    left: 0;
    margin-right: 14px;
}
.city_carousel .splide__arrow--prev:before{
    left: 9px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/slide_arrow_prev_pc.png);
}
.city_carousel .splide__arrow--next{
    right: 0;
}
.city_carousel .splide__arrow--next:before{
    right: 9px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/slide_arrow_next_pc.png);
}
.city_carousel .splide__toggle {
	position: relative;
	display: inline-block;
	padding: 2px 0 2px 39px;
	min-width: 88px;
    min-height: 28px;
    font-size: 88.89%;
	color: #222222;
	text-align: left;
	text-decoration: none;
    bottom: -1px;
}
.city_carousel .splide__toggle:before{
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #222222;
    color: #ffffff;
    display: block;
    left: 0;
    top: -1px;
    border: 2px solid #222222;
    transform: translate(0);
    transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}
.city_carousel .splide__toggle__pause:before,
.city_carousel .splide__toggle__play:before{
    content: '';
    position: absolute;
    display: block;
    top: 8px;
    width: 6px;
    height: 12px;
    transform: translate(0);
}
.city_carousel .splide__toggle__pause:before{
    left: 12px;
    border-left: 2px solid #ffffff;
    border-right: 2px solid #ffffff;
    transition: border-color 0.3s ease-in-out;
}
.city_carousel .splide__toggle__play:before{
    left: 13px;
    border-style: solid;
	border-width: 6px 0 6px 6px;
	border-color: transparent transparent transparent #ffffff;
}
.city_carousel .splide__toggle:after{
    display: none;
}

/* openning
================================================== */
#tmp_city_opening{
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 10px;
    background-color: #FFFFFF;
    width: 100%;
    height: 100vh;
    color: #000000;
    z-index: 9999;
}
#tmp_city_opening .opening_inner{
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: max(558px, calc((558/1156) * 100%));
    max-width: 1036px;
    max-height: 100%;
}
#tmp_city_opening .opening_txt{
    position: absolute;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 0;
    color: inherit;
    text-indent: -9999px;
    opacity: 0;
	transform: translateY(40px) scale(0.7);
	transition-duration: 0.05s;
}
/* row1 */
#tmp_city_opening .row1 .txt1{
    top: calc((9/558) * 100%);
    left: calc((13/1036) * 100%);
    padding-top: calc((78/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row1_txt1.png);
    width: calc((54 / 1036) * 100%);
}
#tmp_city_opening .row1 .txt2{
    top: calc((32 / 558) * 100%);
    left: calc((72 / 1036) * 100%);
    padding-top: calc((22/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row1_txt2.png);
    width: calc((50/1036) * 100%);
}
#tmp_city_opening .row1 .txt3{
    top: calc((9 / 558) * 100%);
    left: calc((125 / 1036) * 100%);
    padding-top: calc((78/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row1_txt3.png);
    width: calc((68/1036) * 100%);
}
#tmp_city_opening .row1 .txt4{
    top: calc((44 / 558) * 100%);
    left: calc((192 / 1036) * 100%);
    padding-top: calc((42/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row1_txt4.png);
    width: calc((42/1036) * 100%);
}
#tmp_city_opening .row1 .txt5{
    top: calc((32 / 558) * 100%);
    left: calc((241 / 1036) * 100%);
    padding-top: calc((22/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row1_txt5.png);
    width: calc((42/1036) * 100%);
}
#tmp_city_opening .row1 .txt6{
    top: calc((11 / 558) * 100%);
    left: calc((287 / 1036) * 100%);
    padding-top: calc((76/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row1_txt6.png);
    width: calc((70/1036) * 100%);
}
#tmp_city_opening .row1 .txt7{
    top: calc((55 / 558) * 100%);
    left: calc((355 / 1036) * 100%);
    padding-top: calc((34/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row1_txt7.png);
    width: calc((40/1036) * 100%);
}
/* row2 */
#tmp_city_opening .row2 .txt1{
    top: calc((101 / 558) * 100%);
    left: calc((6 / 1036) * 100%);
    padding-top: calc((128/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row2_txt1.png);
    width: calc((130/1036) * 100%);
}
#tmp_city_opening .row2 .txt2{
    top: calc((146 / 558) * 100%);
    left: calc((123 / 1036) * 100%);
    padding-top: calc((80/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row2_txt2.png);
    width: calc((78/1036) * 100%);
}
#tmp_city_opening .row2 .txt3{
    top: calc((156 / 558) * 100%);
    left: calc((209 / 1036) * 100%);
    padding-top: calc((66/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row2_txt3.png);
    width: calc((60/1036) * 100%);
}
#tmp_city_opening .row2 .txt4{
    top: calc((98 / 558) * 100%);
    left: calc((273 / 1036) * 100%);
    padding-top: calc((132/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row2_txt4.png);
    width: calc((106/1036) * 100%);
}
#tmp_city_opening .row2 .txt5{
    top: calc((1 / 558) * 100%);
    left: calc((388 / 1036) * 100%);
    padding-top: calc((230/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row2_txt5.png);
    width: calc((232/1036) * 100%);
}
#tmp_city_opening .row2 .txt6{
    top: calc((160 / 558) * 100%);
    left: calc((588 / 1036) * 100%);
    padding-top: calc((78/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row2_txt6.png);
    width: calc((84/1036) * 100%);
}
/* row3 */
#tmp_city_opening .row3 .txt1{
   top: calc((261 / 558) * 100%);
    left: 0;
    padding-top: calc((256/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row3_txt1.png);
    width: calc((220/1036) * 100%);
}
#tmp_city_opening .row3 .txt2{
    top: calc((250 / 558) * 100%);
    left: calc((219 / 1036) * 100%);
    padding-top: calc((264/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row3_txt2.png);
    width: calc((222/1036) * 100%);
}
#tmp_city_opening .row3 .txt3{
    top: calc((267 / 558) * 100%);
    left: calc((424 / 1036) * 100%);
    padding-top: calc((260/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row3_txt3.png);
    width: calc((160/1036) * 100%);
}
#tmp_city_opening .row3 .txt4{
    top: calc((134/ 558) * 100%);
    left: calc((601 / 1036) * 100%);
    padding-top: calc((404/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row3_txt4.png);
    width: calc((436/1036) * 100%);
}
#tmp_city_opening .row3 .txt5{
    top: calc((441 / 558) * 100%);
    left: calc((891 / 1036) * 100%);
    padding-top: calc((118/1036) * 100%);
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/opening/opening_row3_txt5.png);
    width: calc((132/1036) * 100%);
}

/* mainvisual
================================================== */
.mainvisual_top{
    position: relative;
    margin-bottom: 20px;
    margin-top: -25px;
    z-index: 7;
}
.mainvisual_top::before{
    content: "";
    position: absolute;
    left: 50%;
    width: 50%;
    height: 560px;
    background: url(/shared/templates/rn2026_citypromotion_top/images/icon/bg_mainvisual_top.png) no-repeat;
    background-position: 38px -8px;
    top: -31px;
    pointer-events: none;
}
.mainvisual_top .mainvisual_top_flex{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    position: relative;
}
.mainvisual_top .mainvisual_top_flex ul li a .name_ttl{
    margin-top: 1px;
    font-size: 150%;
}
.mainvisual_top .mainvisual_top_flex .mv_tll{
    display: flex;
    align-items: center;
    padding-bottom: 9px;
}
.mainvisual_top .mainvisual_top_flex .mv_tll h1{
    min-width: 260px;
    height: 140px;
    background: #ffffff url(/shared/templates/rn2026_citypromotion_top/images/icon/txt_bg_mv.png) no-repeat;
    text-indent: -9999px;
    font-size: 150%;
}
.mainvisual_top .mainvisual_top_flex .mv_tll p{
    padding: 6px 0 7px 10px;
    background: url(/shared/templates/rn2026_citypromotion_top/images/icon/bg_mv_tll.png) no-repeat right 8px bottom;
    font-weight: 500;
}
.mainvisual_top .mainvisual_top_flex ul{
    list-style: none;
    width: calc(48% - 4px);
    display: flex;
    gap: 16px;
    padding-top: 28px;
    justify-content: right;
}
.mainvisual_top .mainvisual_top_flex ul a{
    font-size: 88.9%;
    line-height: 1.3;
    text-align: center;
    display: block;
    text-decoration: none;
    background: #0079c6 url(/shared/templates/rn2026_citypromotion_top/images/icon/arrow_mv_top.png) no-repeat center bottom 16px;
    color: #ffffff;
    padding: 16px 10px 35px;
    border: 2px solid #0079c6;
    font-weight: 500;
    border-radius: 35px;
}
.mainvisual_top .mainvisual_top_flex ul a span{
    text-align: center;
    display: block;
}
.mainvisual_top .mainvisual_top_flex ul li{
    width: calc( (100% - 32px) / 3);
}
.sec_mainvisual .mv_main{
    position: relative;
    padding-top: 10px;
    padding-bottom: 40px;
    z-index: 6;
}
.sec_mainvisual .scroll{
    position: absolute;
    top: calc(15% + 3px);
    left: calc(-2% + -5px);
    z-index: 9;
}
.sec_mainvisual .scroll a{
    display: block;
    height: 176px;
    padding: 0 8px;
}
.sec_mainvisual .scroll::before{
    content: "";
    width: 1px;
    height: 94px;
    position: absolute;
    bottom: -114px;
    left: 7px;
    background-color: #222222;
}
.sec_mainvisual .scroll::after{
    content: "";
    position: absolute;
    width: 9px;
    height: 9px;
    background-color: #000000;
    border-radius: 50px;
    bottom: -45px;
    left: 3px;
    animation: scroll 2.5s linear infinite;
}
.sec_mainvisual .scroll.is_paused::after{
    animation-play-state: paused;
}
.sec_mainvisual .scroll p{
    width: 13px;
    height: 60px;
    background: url(/shared/templates/rn2026_citypromotion_top/images/icon/scroll_txt.png) no-repeat;
}
.sec_mainvisual .scroll span{
    display: block;
    position: relative;
    z-index: -1;
    text-indent: -9999px;
}
.sec_mainvisual .mv_main::before{
    content: "";
    height: calc(64% + 1px);
    width: 100%;
    background-color: #0079c6;
    position: absolute;
    bottom: 0;
    left: 0;
}
.sec_mainvisual_wrap{
    position: relative;
    margin-left: max(40px, calc((100% - 1200px) / 2));
    padding-left: 30px;
}
.sec_mainvisual_wrap:before{
    bottom: -129px;
    left: -26px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/discover_pattern_lft_top.png);
    width: 126px;
    height: 126px;
    content: '';
    position: absolute;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 100% auto;
    pointer-events: none;
    z-index: 1;
}
.sec_mainvisual_wrap::after{
     content: "";
    position: absolute;
    width: calc(55% + 2px);
    height: 49%;
    left: calc(-50% + 20px);
    top: calc(60% - 100px);
    background: url(/shared/templates/rn2026_citypromotion_top/images/icon/af_bg_mv.png) no-repeat;
    background-size: 100% auto;
    z-index: 1;
    margin-top: -11px;
    pointer-events: none;
}
.mainvisual_cap{
    position: absolute;
    z-index: 2;
    font-weight: bold;
    color: #222222;
    background: #d2f25b url(/shared/templates/rn2026_citypromotion_top/images/icon/koma_bg.png) no-repeat right 13px top calc(50% - 2px);
    padding: 10px 125px 11px 15px;
    top: -10px;
    left: 0;
}
.mainvisual_cap::before{
    content: "";
    position: absolute;
    width: 30px;
    height: 18px;
    bottom: -18px;
    left: 0;
    background: url(/shared/templates/rn2026_citypromotion_top/images/icon/bg_caption_01.png) no-repeat;
}
.mainvisual_cap::after{
    content: "";
    position: absolute;
    width: 20px;
    height: 100%;
    right: -19px;
    top: 0;
    background: url(/shared/templates/rn2026_citypromotion_top/images/icon/bg_caption_02.png) no-repeat right top;
    background-size: auto 100%;
}
#tmp_splide_mv{
       flex-direction: column;
}
#tmp_splide_mv .splide__slide{
    width: 100%;
}
#tmp_splide_mv_thumbnail img,
#tmp_splide_mv .splide__slide img{
    width: 100%;
    height: auto;
    vertical-align: top;
}
#tmp_splide_mv .splide_mv_item{
    position: relative;
}
#tmp_splide_mv .slide_tmb_main .splide_mv_item a{
    outline-offset: -2px;
}
#tmp_splide_mv .splide_mv_item a{
    display: block;
}
#tmp_splide_mv .splide_mv_item .mv_item_txt{
    position: absolute;
    bottom: 82px;
    display: block;
    max-width: 90%;
}
#tmp_splide_mv .no-splide .splide_mv_item .mv_item_txt,
.no_javascript #tmp_splide_mv .splide_mv_item .mv_item_txt{
    opacity: 1;
    visibility: visible;
}
#tmp_splide_mv .mv_item_txt{
    visibility: hidden;
    opacity: 0;
    transition: opacity 1s ease-in-out,visibility 1s ease-in-out;
}
#tmp_splide_mv .mv_item_txt.is-show {
    opacity: 1;
    visibility: visible;
}
#tmp_splide_mv_thumbnail .splide_mv_item .mv_item_txt{
    display: none;
}
#tmp_splide_mv .splide_mv_item .txt_ttl{
    position: relative;
    display: block;
    background-color: #ffffff;
    min-width: 357px;
    margin-top: -3px;
}
#tmp_splide_mv .splide_mv_item .txt_ttl::after{
    content: "";
    position: absolute;
    right: -48px;
    top: 0;
    width: 50px;
    height: 100%;
    clip-path: polygon(0 0, 100% 1%, calc(100% - 32px) 103%, 0% 100%);
    background-color:#ffffff
}
#tmp_splide_mv .splide_mv_item .txt_ttl::before{
    width: 193px;
    height: 117px;
    content: "";
    position: absolute;
    left: -16px;
    top: -40px;
    background: url(/shared/templates/rn2026_citypromotion_top/images/icon/af_mv_txt.png) no-repeat;
    z-index: 1;
    pointer-events: none;
}
#tmp_splide_mv .splide_mv_item .txt_ttl > span{
    background-color: #ffffff;
    color: #222222;
    padding: 15px 30px 8px 40px;
    font-weight: 500;
    display: inline-block;
    text-decoration: none;
    max-height: 82px;
    overflow: auto;
}
#tmp_splide_mv .splide_mv_item a .txt_ttl > span{
    background:  url(/shared/templates/rn2026_citypromotion_top/images/icon/arrow_link_rgt.png) no-repeat 40px 25px;
    background-size: 6px auto;
    padding-left: 55px;
}
#tmp_splide_mv_thumbnail .splide__track--nav > .splide__list > .splide__slide.is-active{
    border-radius: 3px;
}
#tmp_splide_mv .slide_tmb_main .splide__list{
    background-color: #FFFFFF;
    color: #222222;
}
#tmp_splide_mv .splide_mv_item .txt_ttl a:hover{
    text-decoration: underline;
}
#tmp_splide_mv .splide_mv_item .txt_label{
    position: relative;
    z-index: 2;
    display: inline-block;
    max-width: 60%;
}
#tmp_splide_mv .splide_mv_item .txt_label > span{
    color: #222222;
    font-weight: 500;
    font-size: 83.3%;
    background-color: #d2f25b;
    display: inline-block;
    padding: 1px 29px 1px 39px;
    clip-path: polygon(0 0, 100% 1%, 89% 100%, 0% 100%);
}
#tmp_splide_mv .splide_mv_item .txt_label::before{
    content: "";
    width: calc(100% + 5px);
    height: calc(100% - 4px);
    position: absolute;
    left: 0;
    top: 12px;
    background-color: #87d746;
    z-index: -1;
     clip-path: polygon(0 0, 100% 1%, 90% 100%, 0% 100%);
}
#tmp_splide_mv_thumbnail{
    border: 2px solid #02a1f9;
    border-right: 0;
    background-color: #ffffff;
    padding: 16px 19px 17px 17px;
    margin-left: 40px;
    margin-top: -58px;
    position: relative;
}
#tmp_splide_mv_thumbnail .splide__list {
    flex-wrap: wrap;
    transform: translateX(0) !important;
    gap: 4%;
    width: calc(59% + 5px);
}
#tmp_splide_mv_thumbnail .splide__list .splide__slide{
    width: calc( (100% - 20%) / 6 ) !important;
}
#tmp_splide_mv_thumbnail .splide__list .splide__slide::before{
    position: absolute;
    right: -19%;
    width: 1px;
    height: calc(100% - 6px);
    background-color: #a4d0e4;
    content: "";
    top: 3px;
}
#tmp_splide_mv .splide__controls{
    z-index: 2;
    position: absolute;
    left: calc(64% - 1px);
    bottom: -1%;
}
@keyframes scroll {
	0% {
		opacity: 0;
        transform: translateY(0px);
	}
	10% {
		opacity: 1;
        transform: translateY(10px);
	}
	80% {
		opacity: 1;
	}
	100% {
		opacity: 0;
        transform: translateY(70px);
	}
}
.sec_mainvisual .mv_link{
    margin: 30px auto 38px;
    right: 12px;
}

/* discover
================================================== */
.sec_discover{
    position: relative;
    z-index: 5;
}
.sec_discover:before,
.sec_discover:after{
    content: '';
    position: absolute;
    background-color: transparent;
    background-repeat: no-repeat;
    left: 50%;
    pointer-events: none;
    z-index: -1;
}
.sec_discover:before{
    top: -360px;
    margin-left: 264px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/discover_pattern_rgt_top.png);
    background-size: auto 598px;
    width: 646px;
    max-width: calc(50% - 264px);
    height: 598px;
}
.sec_discover:after{
    bottom: -48px;
    margin-left: 361px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/discover_pattern_rgt_btm.png);
    background-size: auto 396px;
    width: 520px;
    max-width: calc(50% - 361px);
    height: 396px;
}
.sec_discover .discover_wrapper{
    position: relative;
    margin: 0 auto;
    padding: 100px 0 160px;
    max-width: 1140px;
}
.sec_discover .discover_wrapper:after{
    content: '';
    position: absolute;
    bottom: 38px;
    right: 50%;
    margin-right: 443px;
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/discover_pattern_lft_btm.png) no-repeat;
    background-size: 100% auto;
    width: 462px;
    height: 292px;
    pointer-events: none;
    z-index: -1;
}
.sec_discover .city_title{
    padding-top: 41px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/discover_ttl_en_pc.png);
    font-size: 200%;
}
.sec_discover .city_title .title_txt{
    padding-right: 43px;
    padding-bottom: 19px;
}
.sec_discover .btn_show_more{
    margin-top: 50px;
}

/* instagram
================================================== */
#tmp_city_instagram {
    overflow-wrap: anywhere;
}
.sec_instagram{
    position: relative;
    overflow: hidden;
}
.sec_instagram:not(:last-child){
    z-index: 2;
}
.sec_instagram:after{
    content: '';
    position: absolute;
    top: 114px;
    bottom: 0;
    left: calc((100% - 1200px)/2 + 140px);
    right: 0;
    background-color: #e1f4ff;
    color: #282828;
    pointer-events: none;
    z-index: -1;
}
.sec_instagram .instagram_wrapper{
    display: flex;
    padding: 0 0  50px calc((100% - 1200px)/2);
}
.sec_instagram .instagram_intro{
    position: relative;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    padding: 36px 23px 60px 0;
    background-color: #0079c6;
    align-self: flex-start;
    width: min(576px, 41.14%);
    color: #ffffff;
    z-index: 2;
}
.sec_instagram .instagram_intro:before{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    background-color: #0079c6;
    width: 1000%;
    height: 100%;
    color: #ffffff;
    pointer-events: none;
    z-index: -1;
}
.sec_instagram .city_subtitle{
    position: relative;
    right: -20px;
    margin: 0 auto 24px;
    min-width: 222px;
    text-align: center;
    letter-spacing: 0.015em;
}
.sec_instagram .city_subtitle:before{
    bottom: -1px;
    left: 1px;
}
.sec_instagram .intro_wrap{
    display: flex;
    align-items: center;
    gap: 0 36px;
    margin-bottom: 30px;
}
.sec_instagram .intro_logo{
    flex-shrink: 0;
    width: calc((212/552) * 100%);
}
.sec_instagram .intro_logo img{
    max-width: 100%;
    height: auto;
    vertical-align: top;
}
.sec_instagram .intro_text{
    flex: 1 auto;
    width: 100%;
    line-height: 1.7;
}
.sec_instagram .instagram_intro .btn_simple{
    padding-left: 32px;
}
.sec_instagram .instagram_intro .btn_simple p:after{
    border: none;
    background-image: linear-gradient(90deg, #02a1f9 50%, #ffffff 50%);
    background-repeat: no-repeat;
    background-size: 100% 1px;
}
.sec_instagram .instagram_cnt{
    flex: 1;
    align-self: center;
    padding: 24px 0 22px;
    width: 100%;
}
.sec_instagram .instagram_intro + .instagram_cnt{
    width: 58.86%;
}
.sec_instagram .splide__slide{
    width: 190px;
}
.sec_instagram .instagram_slide {
	margin-bottom: 2px;
}
.sec_instagram .instagram_slide a{
    display: block;
}
.sec_instagram .instagram_slide a:focus-visible{
    outline-offset: -1px;
}
.sec_instagram .instagram_slide img{
    width: 100%;
    height: auto;
    vertical-align: top;
    animation: none !important;
}
.sec_instagram .instagram_carousel .splide:first-child:not(:last-child) .instagram_slide {
	transform: translateX(-95px);
}
.sec_instagram .splide__controls{
    justify-content: flex-end;
    max-width: 1200px;
}
.sec_instagram .instagram_intro + .instagram_cnt .splide__controls{
    max-width: 631px;
}
.sec_instagram .instagram_carousel .splide{
    overflow: hidden;
}
.sec_instagram .instagram_carousel .splide__track{
    overflow: visible;
}
.sec_instagram .splide__slide .item_img:first-child {
	-webkit-transform: translateX(-90px);
	-moz-transform: translateX(-90px);
	transform: translateX(-90px);
}

/* feel
================================================== */
.sec_feel{
    position: relative;
    z-index: 3;
}
.sec_feel .feel_guide{
    position: relative;
}
.sec_feel .feel_guide:before,
.sec_feel .feel_guide:after{
    content: '';
    position: absolute;
    background-color: transparent;
    background-repeat: no-repeat;
    pointer-events: none;
    z-index: -1;
}
.sec_feel .feel_guide:before{
    top: 35px;
    left: 50%;
    margin-left: 353px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/feel_pattern_rgt_top.png);
    background-size: auto 370px;
    max-width: calc(50% - 353px);
    width: 622px;
    height: 370px;
}
.sec_feel .feel_guide:after{
    bottom: 47px;
    left: 50%;
    margin-left: 456px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/feel_pattern_rgt_btm.png);
    background-size: auto 328px;
    max-width: calc(50% - 456px);
    width: 452px;
    height: 328px;
}
.modal_opened .sec_feel .feel_guide:before,
.modal_opened .sec_feel .feel_guide:after{
    max-width: unset;
}
.sec_feel .feel_wrapper{
    position: relative;
    padding: 160px 0 160px;
    z-index: 1;
}
.sec_feel .feel_wrapper:before,
.sec_feel .feel_wrapper:after{
    content: '';
    position: absolute;
    background-color: transparent;
    background-repeat: no-repeat;
    pointer-events: none;
    z-index: -1;
}
.sec_feel .feel_wrapper:before{
    top: -29px;
    right: 50%;
    margin-right: -93px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/feel_pattern_middle.png);
    width: 248px;
    height: 80px;
}
.sec_feel .feel_wrapper:after{
    bottom: 0;
    right: 50%;
    margin-right: 337px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/feel_pattern_lft.png);
    width: 520px;
    height: 396px;
}
.sec_feel .city_title{
    margin-bottom: 39px;
    margin-left: 30px;
    padding-top: 45px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/feel_ttl_en_pc.png);
    max-width: 66%;
}
.sec_feel .city_title .title_txt{
    padding-right: 27px;
    padding-bottom: 18px;
}
.sec_feel .feel_intro{
    display: flex;
    margin-bottom: 65px;
}
.sec_feel .intro_detail{
    flex-shrink: 0;
    padding-left: 30px;
    width: 41.66%;
}
.sec_feel .intro_title{
    margin-bottom: 59px;
    padding-top: calc((226/469) * 100%);
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/feel_heading_pc.png) no-repeat;
    background-size: 100% 100%;
    width: calc((418/469) * 100%);
    max-width: 100%;
    font-size: 200%;
    height: 0;
    line-height: 1;
    color: inherit;
    text-indent: -9999px;
}
.sec_feel .intro_text{
    line-height: 1.7;
}
.sec_feel .intro_img{
    position: relative;
    flex: 1 auto;
    margin-top: -69px;
    padding-left: 26px;
    width: 100%;
    z-index: 1;
}
.sec_feel .intro_img:before{
    content: '';
    position: absolute;
    left: calc((-23 / 700) * 100%);
    top: calc((97 / 476) * 100%);
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/feel_pattern_arrow.png) no-repeat;
    background-size: 100% 100%;
    width: calc((178 / 700) * 100%);
    max-width: 100%;
    padding-top: calc((84 / 700) * 100%);
    height: 0;
    color: inherit;
}
.sec_feel .intro_img img{
    vertical-align: top;
    width: 100%;
    height: auto;
}
.sec_feel .feel_links{
    display: flex;
    flex-flow: row wrap;
    gap: 40px;
    padding-right: 22px;
}
.sec_feel .feel_links .feel_item{
    list-style: none;
    width: calc((100% - 80px) / 3);
}
.sec_feel .feel_links .feel_item_inner{
    cursor: pointer;
}
.sec_feel .feel_links .feel_item_inner,
.sec_feel .feel_links .feel_item_title{
    width: 100%;
    height: 100%;
}
.sec_feel .feel_links .feel_item_title{
    max-width: 348px;
}
.sec_feel .feel_links .feel_item p:after{
    right: -23px;
    width: 48px;
}
.sec_feel .feel_links .feel_item_cnt{
    display: none;
}
.sec_feel .feel_links .feel_item:nth-child(3n+1) .feel_item_title,
.sec_feel .feel_links .feel_item:nth-child(3n+3) .feel_item_title{
    margin: 0;
}
.sec_feel .feel_links .feel_item:nth-child(3n+3) .feel_item_inner{
    display: flex;
    justify-content: flex-end;
}
/* modal */
.modal_opened{
    overflow: auto hidden;
}
#tmp_gallery_modal {
	position: fixed;
	z-index: 801;
	top: 0;
	left: 0;
	background-color: transparent;
    padding: 30px 10px;
	width: 100%;
	height: 100%;
	color: #222222;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
    display: none;
    align-items: center;
}
#tmp_gallery_modal.show {
    display: flex;
	opacity: 1;
	visibility: visible;
}
#tmp_gallery_modal .gallery_modal {
	position: relative;
	top: 0;
    bottom: 0;
	margin: auto;
    background-color: #ffffff;
    padding: 42px min(50px, calc((50/1200) * 100%)) 49px;
	max-width: 1200px;
	max-height: 100%;
	color: #222222;
    border: 1px solid #12a6e9;
    overflow: auto;
}
#tmp_gallery_modal .modal_inner {
    margin-bottom: 52px;
}
#tmp_gallery_modal .feel_item_title{
    display: block;
    margin-bottom: 47px;
    padding: 0;
    max-width: 100%;
    border-radius: 0;
    border: none;
    font-size: 155.55%;
    font-weight: 500;
    color: #0063a6;
    line-height: 1.4;
    text-align: center;
    cursor: text !important;
}
#tmp_gallery_modal .btn_simple p{
    display: block;
}
#tmp_gallery_modal .feel_item_title:after,
#tmp_gallery_modal .btn_simple p:after{
    content: none;
}
#tmp_gallery_modal .feel_item_title:hover{
    background-color: transparent;
}
#tmp_gallery_modal .feel_item_cnt{
    display: flex;
}
#tmp_gallery_modal .feel_item_des{
    flex: 1 auto;
    padding-right: 40px;
    width: 100%;
    font-size: 88.89%;
}
#tmp_gallery_modal .feel_item_text{
    margin-bottom: 16px;
    line-height: 1.7;
}
#tmp_gallery_modal .feel_item_link{
    padding-right: 11px;
    text-align: right;
}
#tmp_gallery_modal .feel_item_link a{
    display: inline-block;
    padding: 3px 0 3px 17px;
    background: transparent url(/shared/templates/rn2026_citypromotion_top/images/icon/arrow_link_rgt.png) no-repeat 0 11px;
    background-size: 6px auto;
    color: inherit;
    text-decoration: none;
}
#tmp_gallery_modal .feel_item_img{
    flex-shrink: 0;
    padding-top: 7px;
    width: 36.36%;
}
#tmp_gallery_modal .feel_item_img img {
	max-width: 100%;
	height: auto;
	vertical-align: top;
}

/* recommend
================================================== */
#tmp_city_recommend {
    overflow-wrap: anywhere;
}
.sec_recommend{
    position: relative;
}
.sec_recommend:not(:last-child){
    z-index: 2;
}
.sec_recommend:after{
    content: '';
    position: absolute;
    top: 114px;
    bottom: 0;
    left: calc((100% - 1200px)/2 + 140px);
    right: 0;
    background-color: #e1f4ff;
    color: #282828;
    pointer-events: none;
    z-index: -1;
}
.sec_recommend .recommend_wrapper{
    display: flex;
    padding: 0 0 48px calc((100% - 1200px)/2);
}
.sec_recommend .recommend_intro{
    position: relative;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    padding: 39px 3.15% 60px;
    background-color: #0079c6;
    align-self: flex-start;
    width: min(414px, 29.57%);
    color: #ffffff;
}
.sec_recommend .recommend_intro:before{
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    background-color: #0079c6;
    width: 1000%;
    height: 100%;
    color: #ffffff;
    pointer-events: none;
    z-index: -1;
}
.sec_recommend .city_subtitle{
    margin: 0 auto 12px;
    text-align: center;
}
.sec_recommend .intro_text{
    margin-bottom: 27px;
    line-height: 1.7;
}
.sec_recommend .recommend_intro .btn_simple{
    right: 12px;
}
.sec_recommend .recommend_intro .btn_simple p:after{
    border: none;
    background-image: linear-gradient(90deg, #02a1f9 50%, #ffffff 50%);
    background-repeat: no-repeat;  
    background-size: 100% 1px;
}
.sec_recommend .recommend_cnt{
    align-self: center;
    flex: 1;
    padding: 42px 0 40px 20px;
    width: 100%;
}
.sec_recommend .recommend_intro + .recommend_cnt{
    width: 70.43%;
}
.recommend_carousel .splide__slide{
    width: 320px;
}
.recommend_carousel .splide__slide .thumbnail_item,
.recommend_carousel .splide__slide .thumbnail_item a{
    height: 100%;
}
.recommend_carousel .thumbnail_des{
    padding: 13px 25px 17px;
}
.recommend_carousel .thumbnail_title{
    background-position: 0 14px;
}
.recommend_carousel .splide__controls{
    justify-content: flex-end;
    max-width: 1200px;
}
.sec_recommend .recommend_intro + .recommend_cnt .splide__controls{
    max-width: 773px;
}

/* learn
================================================== */
.sec_learn{
    margin-bottom: -50px;
    padding-bottom: 50px;
    overflow: hidden;
}
.sec_learn .learn_wrapper{
    position: relative;
    margin: 0 auto;
    padding-top: 160px;
    max-width: 1140px;
}
.sec_learn .learn_wrapper:before,
.sec_learn .learn_wrapper:after{
    content: '';
    position: absolute;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 100% auto;
    color: inherit;
    pointer-events: none;
}
.sec_learn .learn_wrapper:before{
    bottom: -45px;
    right: 50%;
    margin-right: 426px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/learn_pattern_lft.png);
    width: 600px;
    height: 394px;
}
.sec_learn .learn_wrapper:after{
    top: -208px;
    left: 50%;
    margin-left: 174px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/learn_pattern_rgt.png);
    width: 712px;
    height: 416px;
}
.sec_learn .city_title{
    margin-bottom: 44px;
    padding-top: 45px;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/learn_ttl_en_pc.png);
}
.sec_learn .city_title .title_txt{
    padding-right: 43px;
    padding-bottom: 13px;
}
.sec_learn .learn_cnt{
    position: relative;
}
.sec_learn .learn_cnt:before{
    content: '';
    position: absolute;
    top: 90px;
    bottom: 0;
    left: -500%;
    right: 0;
    width: 1000%;
    background-color: #e1f4ff;
    color: #222222;
    z-index: -1;
}
.sec_learn .learn_cnt > *{
    position: relative;
    z-index: 3;
}
.sec_learn .list_thumbnail{
    position: relative;
    z-index: 2;
}
.sec_learn .thumbnail_item .thumbnail_des{
    padding: 10px 14px 25px;
}
.sec_learn .thumbnail_item .thumbnail_title{
    background-position: 0 14px;
}

/* setting hover
================================================== */
.sec_instagram .instagram_slide img{
    transition: opacity 0.3s ease-in-out;
}
.mainvisual_top .mainvisual_top_flex ul a{
    transition: background-color 0.3s ease-in-out, background-image 0.3s ease-in-out, color 0.3s ease-in-out;
}
.city_carousel .splide__toggle:hover:before{
    background-color: #ffffff;
}
.city_carousel .splide__toggle:hover .splide__toggle__pause:before,
.city_carousel .splide__toggle:hover .splide__toggle__play:before{
    border-left-color: #222222;
}
.city_carousel .splide__toggle:hover .splide__toggle__pause:before{
    border-left-color: #222222;
    border-right-color: #222222;
}
.recommend_carousel .thumbnail_item > a:focus-visible{
    outline-offset: -1px;
}
.btn_simple,
.btn_show_more,
#tmp_gallery_modal .modal_btn_close,
.thumbnail_item > a{
    transition: background-color 0.3s ease-in-out;
}
.btn_simple a,
.btn_show_more a,
#tmp_gallery_modal .modal_btn_close a,
.thumbnail_item > a,
.thumbnail_item .thumbnail_title,
#tmp_splide_mv .splide_mv_item .txt_ttl > span,
#tmp_gallery_modal .feel_item_link a{
    position: relative;
}
.btn_simple:after,
.btn_show_more:after,
#tmp_gallery_modal .modal_btn_close:after,
.thumbnail_item > a:after{
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    bottom: -1px;
    right: -1px;
    border: 2px solid #02a1f9;
    border-radius: 27px;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
.city_carousel .splide__arrow:after{
    content: '';
    position: absolute;
    top: -2px;
    left: -2px;
    bottom: -2px;
    right: -2px;
    background-color: transparent;
	background-image: -moz-linear-gradient(#f3ffe0 0 0), -moz-linear-gradient(45deg, #02a1f9 0%, #7ae62a 100%);
	background-image: -o-linear-gradient(#f3ffe0 0 0), -o-linear-gradient(45deg, #02a1f9 0%, #7ae62a 100%);
	background-image: linear-gradient(#f3ffe0 0 0), linear-gradient(45deg, #02a1f9 0%, #7ae62a 100%);
    background-clip: padding-box, border-box;
    background-origin: padding-box, border-box;
	background-repeat: no-repeat;
    border: 3px solid transparent;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
.thumbnail_item > a:after{
    border-radius: 0;
}
.btn_simple a:after,
.btn_show_more a:after,
#tmp_gallery_modal .modal_btn_close a:after,
.thumbnail_item .thumbnail_title:after,
#tmp_splide_mv .splide_mv_item .txt_ttl > span:after,
#tmp_gallery_modal .feel_item_link a:after,
.city_carousel .splide__toggle:after{
    content: '';
    position: absolute;
    left: 2px;
    bottom: 0;
    border-bottom: 1px solid #0063a6;
    pointer-events: none;
    z-index: 1;
    width: 0;
    transition: width 0.3s ease-in-out;
}
.city_carousel .splide__toggle:after,
.thumbnail_item .thumbnail_title:after,
#tmp_splide_mv .splide_mv_item .txt_ttl > span:after,
#tmp_gallery_modal .feel_item_link a:after{
    border-bottom-color: #222222;
}
.thumbnail_item .thumbnail_title:after{
    left: 13px;
    bottom: 4px;
}
#tmp_splide_mv .splide_mv_item .txt_ttl > span:after{
    left: 55px;
    bottom: 8px;
}
#tmp_gallery_modal .feel_item_link a:after{
    left: 17px;
    bottom: 2px;
}
.city_carousel .splide__toggle:after{
    display: block;
    left: 39px;
}
.btn_simple:hover,
.btn_show_more:hover,
#tmp_gallery_modal .modal_btn_close:hover,
.thumbnail_item > a:hover{
    background-color: #f3ffe0;
}
.btn_simple:hover:after,
.btn_show_more:hover:after,
#tmp_gallery_modal .modal_btn_close:hover:after,
.thumbnail_item > a:hover:after,
.city_carousel .splide__arrow:hover:after{
    opacity: 1;
}
.btn_simple:hover a:after,
.btn_show_more:hover a:after,
#tmp_gallery_modal .modal_btn_close:hover a:after{
    width: calc(100% - 2px);
}
.thumbnail_item > a:hover .thumbnail_title:after{
    width: calc(100% - 13px);
}
#tmp_splide_mv .slide_tmb_main .splide_mv_item a:hover .txt_ttl > span:after{
    width: calc(100% - 85px);
}
#tmp_gallery_modal .feel_item_link a:hover:after{
    width: calc(100% - 17px);
}
.city_carousel .splide__toggle:hover:after{
    width: calc(100% - 39px);
}
.mainvisual_top .mainvisual_top_flex ul a:hover{
    background-color: #FFFFFF;
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/arrow_mv_top_hv.png);
    color: #0079c6;
    text-decoration: underline;
}
.sec_instagram .instagram_slide a:hover img{
    opacity: 0.7;
}

/* accessibility
================================================== */
/* color Mv*/
.color_blue .mainvisual_top .mainvisual_top_flex .mv_tll h1,
.color_black .mainvisual_top .mainvisual_top_flex .mv_tll h1,
.color_yellow .mainvisual_top .mainvisual_top_flex .mv_tll h1{
    height: auto;
    width: 260px;
}
.color_yellow #tmp_wrapper .sec_mainvisual .scroll p{
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/scroll_txt.png) !important
}
.color_blue #tmp_wrapper .sec_mainvisual .scroll p,
.color_black #tmp_wrapper .sec_mainvisual .scroll p{
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/scroll_txt_yellow.png) !important
}
.color_blue .sec_mainvisual .scroll::after,
.color_black .sec_mainvisual .scroll::after,
.color_blue .sec_mainvisual .scroll::before,
.color_black .sec_mainvisual .scroll::before{
    background-color: #FFFF00;
}
.color_yellow #tmp_wrapper .mainvisual_top .mainvisual_top_flex ul a{
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/arrow_mv_top_black.png) !important
}
.color_blue #tmp_wrapper .mainvisual_top .mainvisual_top_flex ul a,
.color_black #tmp_wrapper .mainvisual_top .mainvisual_top_flex ul a{
    background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/arrow_mv_top_yellow.png) !important
}
.color_blue .sec_mainvisual .mv_main,
.color_black .sec_mainvisual .mv_main,
.color_yellow .sec_mainvisual .mv_main{
    border-bottom: 1px solid;
}
.color_blue #tmp_wrapper .sec_mainvisual .scroll span,
.color_black #tmp_wrapper .sec_mainvisual .scroll span,
.color_yellow #tmp_wrapper .sec_mainvisual .scroll span{
    background: transparent !important;
}
.color_blue #tmp_wrapper #tmp_splide_mv .splide_mv_item .mv_item_txt{
    background-color: #00008B !important;
}
.color_black #tmp_wrapper #tmp_splide_mv .splide_mv_item .mv_item_txt,
.color_yellow #tmp_splide_mv_thumbnail .splide__list .splide__slide::before{
    background-color: #000000 !important;
}
.color_yellow #tmp_wrapper #tmp_splide_mv .splide_mv_item .mv_item_txt,
.color_blue #tmp_splide_mv_thumbnail .splide__list .splide__slide::before,
.color_black #tmp_splide_mv_thumbnail .splide__list .splide__slide::before{
    background-color: #FFFF00 !important;
}
.color_blue .mainvisual_top .mainvisual_top_flex .mv_tll h1,
.color_black .mainvisual_top .mainvisual_top_flex .mv_tll h1,
.color_yellow .mainvisual_top .mainvisual_top_flex .mv_tll h1{
    text-indent: 0;
}
.color_blue #tmp_splide_mv .splide_mv_item .txt_label span,
.color_black #tmp_splide_mv .splide_mv_item .txt_label span,
.color_yellow #tmp_splide_mv .splide_mv_item .txt_label span{
    clip-path: inherit;
    border: 1px solid;
}
.color_blue #tmp_splide_mv .splide_mv_item .txt_ttl::after,
.color_black #tmp_splide_mv .splide_mv_item .txt_ttl::after,
.color_yellow #tmp_splide_mv .splide_mv_item .txt_ttl::after,
.color_blue .sec_mainvisual_wrap::before,
.color_black .sec_mainvisual_wrap::before,
.color_yellow .sec_mainvisual_wrap::before,
.color_blue .mainvisual_top::before,
.color_black .mainvisual_top::before,
.color_yellow .mainvisual_top::before,
.color_blue .sec_mainvisual .mv_main::before,
.color_black .sec_mainvisual .mv_main::before,
.color_yellow .sec_mainvisual .mv_main::before,
.color_blue .sec_mainvisual_wrap::after,
.color_black .sec_mainvisual_wrap::after,
.color_yellow .sec_mainvisual_wrap::after,
.color_blue #tmp_splide_mv .splide_mv_item .txt_label::before,
.color_black #tmp_splide_mv .splide_mv_item .txt_label::before,
.color_yellow #tmp_splide_mv .splide_mv_item .txt_label::before,
.color_blue #tmp_splide_mv .splide_mv_item .txt_ttl::before,
.color_black #tmp_splide_mv .splide_mv_item .txt_ttl::before,
.color_yellow #tmp_splide_mv .splide_mv_item .txt_ttl::before,
.color_blue .sec_mainvisual .mainvisual_cap::after,
.color_black .sec_mainvisual .mainvisual_cap::after,
.color_yellow .sec_mainvisual .mainvisual_cap::after,
.color_blue .sec_mainvisual .mainvisual_cap::before,
.color_black .sec_mainvisual .mainvisual_cap::before,
.color_yellow .sec_mainvisual .mainvisual_cap::before{
    display: none;
}
.color_blue .sec_mainvisual .mainvisual_cap,
.color_black .sec_mainvisual .mainvisual_cap,
.color_yellow .sec_mainvisual .mainvisual_cap{
    border: 1px solid;
}
/* color */
.color_black #tmp_wrapper .sec_instagram .instagram_intro:before,
.color_blue #tmp_wrapper .sec_instagram .instagram_intro:before,
.color_yellow #tmp_wrapper .sec_instagram .instagram_intro:before,
.color_black #tmp_wrapper .city_subtitle:before,
.color_blue #tmp_wrapper .city_subtitle:before,
.color_yellow #tmp_wrapper .city_subtitle:before,
.color_black #tmp_wrapper .sec_feel .intro_img:before,
.color_blue #tmp_wrapper .sec_feel .intro_img:before,
.color_yellow #tmp_wrapper .sec_feel .intro_img:before,
.color_black #tmp_wrapper .sec_discover:before,
.color_black #tmp_wrapper .sec_discover:after,
.color_black #tmp_wrapper .sec_discover .discover_wrapper:before,
.color_black #tmp_wrapper .sec_discover .discover_wrapper:after,
.color_black #tmp_wrapper .sec_feel .feel_guide:before,
.color_black #tmp_wrapper .sec_feel .feel_guide:after,
.color_black #tmp_wrapper .sec_feel .feel_wrapper:before,
.color_black #tmp_wrapper .sec_feel .feel_wrapper:after,
.color_black #tmp_wrapper .sec_recommend:after,
.color_black #tmp_wrapper .sec_recommend .recommend_intro:before,
.color_black #tmp_wrapper #tmp_wrap_main:has(.sec_learn):after,
.color_black #tmp_wrapper .sec_learn .learn_wrapper:before,
.color_black #tmp_wrapper .sec_learn .learn_wrapper:after,
.color_black #tmp_wrapper .sec_learn .learn_cnt:before,
.color_blue #tmp_wrapper .sec_discover:before,
.color_blue #tmp_wrapper .sec_discover:after,
.color_blue #tmp_wrapper .sec_discover .discover_wrapper:before,
.color_blue #tmp_wrapper .sec_discover .discover_wrapper:after,
.color_blue #tmp_wrapper .sec_feel .feel_guide:before,
.color_blue #tmp_wrapper .sec_feel .feel_guide:after,
.color_blue #tmp_wrapper .sec_feel .feel_wrapper:before,
.color_blue #tmp_wrapper .sec_feel .feel_wrapper:after,
.color_blue #tmp_wrapper .sec_recommend:after,
.color_blue #tmp_wrapper .sec_recommend .recommend_intro:before,
.color_blue #tmp_wrapper #tmp_wrap_main:has(.sec_learn):after,
.color_blue #tmp_wrapper .sec_learn .learn_wrapper:before,
.color_blue #tmp_wrapper .sec_learn .learn_wrapper:after,
.color_blue #tmp_wrapper .sec_learn .learn_cnt:before,
.color_yellow #tmp_wrapper .sec_discover:before,
.color_yellow #tmp_wrapper .sec_discover:after,
.color_yellow #tmp_wrapper .sec_discover .discover_wrapper:before,
.color_yellow #tmp_wrapper .sec_discover .discover_wrapper:after,
.color_yellow #tmp_wrapper .sec_feel .feel_guide:before,
.color_yellow #tmp_wrapper .sec_feel .feel_guide:after,
.color_yellow #tmp_wrapper .sec_feel .feel_wrapper:before,
.color_yellow #tmp_wrapper .sec_feel .feel_wrapper:after,
.color_yellow #tmp_wrapper .sec_recommend:after,
.color_yellow #tmp_wrapper .sec_recommend .recommend_intro:before,
.color_yellow #tmp_wrapper #tmp_wrap_main:has(.sec_learn):after,
.color_yellow #tmp_wrapper .sec_learn .learn_wrapper:before,
.color_yellow #tmp_wrapper .sec_learn .learn_wrapper:after,
.color_yellow #tmp_wrapper .sec_learn .learn_cnt:before,
.color_black #tmp_wrapper .btn_simple:after,
.color_black #tmp_wrapper .btn_show_more:after,
.color_black #tmp_wrapper #tmp_gallery_modal .modal_btn_close:after,
.color_black #tmp_wrapper .thumbnail_item > a:after,
.color_black #tmp_wrapper .city_carousel .splide__arrow:after,
.color_black #tmp_wrapper .btn_simple a:after,
.color_black #tmp_wrapper .btn_show_more a:after,
.color_black #tmp_wrapper #tmp_gallery_modal .modal_btn_close a:after,
.color_black #tmp_wrapper .thumbnail_item .thumbnail_title:after,
.color_blue #tmp_wrapper .btn_simple:after,
.color_blue #tmp_wrapper .btn_show_more:after,
.color_blue #tmp_wrapper #tmp_gallery_modal .modal_btn_close:after,
.color_blue #tmp_wrapper .thumbnail_item > a:after,
.color_blue #tmp_wrapper .city_carousel .splide__arrow:after,
.color_blue #tmp_wrapper .btn_simple a:after,
.color_blue #tmp_wrapper .btn_show_more a:after,
.color_blue #tmp_wrapper #tmp_gallery_modal .modal_btn_close a:after,
.color_blue #tmp_wrapper .thumbnail_item .thumbnail_title:after,
.color_yellow #tmp_wrapper .btn_simple:after,
.color_yellow #tmp_wrapper .btn_show_more:after,
.color_yellow #tmp_wrapper #tmp_gallery_modal .modal_btn_close:after,
.color_yellow #tmp_wrapper .thumbnail_item > a:after,
.color_yellow #tmp_wrapper .city_carousel .splide__arrow:after,
.color_yellow #tmp_wrapper .btn_simple a:after,
.color_yellow #tmp_wrapper .btn_show_more a:after,
.color_yellow #tmp_wrapper #tmp_gallery_modal .modal_btn_close a:after,
.color_yellow #tmp_wrapper .thumbnail_item .thumbnail_title:after,
.color_blue #tmp_wrapper #tmp_gallery_modal .feel_item_link a:after,
.color_black #tmp_wrapper #tmp_gallery_modal .feel_item_link a:after,
.color_yellow #tmp_wrapper #tmp_gallery_modal .feel_item_link a:after,
.color_yellow #tmp_wrapper .city_carousel .splide__toggle:after,
.color_blue #tmp_wrapper .city_carousel .splide__toggle:after,
.color_black #tmp_wrapper .city_carousel .splide__toggle:after{
    content: none;
}
.color_black #tmp_wrapper .sec_feel .intro_img img,
.color_blue #tmp_wrapper .sec_feel .intro_img img,
.color_yellow #tmp_wrapper .sec_feel .intro_img img{
    background-color: #ffffff !important;
}
.color_black #tmp_wrapper .city_carousel .splide__toggle:before,
.color_blue #tmp_wrapper .city_carousel .splide__toggle:before,
.color_yellow #tmp_wrapper .city_carousel .splide__toggle:before{
    background-color: transparent;
}
.color_black #tmp_wrapper .sec_instagram .instagram_intro,
.color_blue #tmp_wrapper .sec_instagram .instagram_intro,
.color_yellow #tmp_wrapper .sec_instagram .instagram_intro,
.color_black #tmp_wrapper .sec_recommend .recommend_intro,
.color_blue #tmp_wrapper .sec_recommend .recommend_intro,
.color_yellow #tmp_wrapper .sec_recommend .recommend_intro{
    border: 1px solid;
}
.color_black #tmp_wrapper .btn_simple p:after,
.color_blue #tmp_wrapper .btn_simple p:after,
.color_black #tmp_wrapper .city_carousel .progress_total:before,
.color_blue #tmp_wrapper .city_carousel .progress_total:before,
.color_black #tmp_wrapper .city_carousel .splide__toggle:before,
.color_blue #tmp_wrapper .city_carousel .splide__toggle:before{
    border-color: #ffff00;
}
.color_yellow #tmp_wrapper .btn_simple p:after,
.color_yellow #tmp_wrapper .city_carousel .progress_total:before,
.color_yellow #tmp_wrapper .city_carousel .splide__toggle:before{
    border-color: #000000;
}
.color_black #tmp_wrapper .sec_feel .intro_title,
.color_blue #tmp_wrapper .sec_feel .intro_title,
.color_yellow #tmp_wrapper .sec_feel .intro_title{
    height: auto;
    padding-top: 0;
    text-indent: inherit;
}
.color_black #tmp_wrapper .sec_instagram .instagram_intro .btn_simple p:after,
.color_blue #tmp_wrapper .sec_instagram .instagram_intro .btn_simple p:after,
.color_yellow #tmp_wrapper .sec_instagram .instagram_intro .btn_simple p:after,
.color_black #tmp_wrapper .sec_recommend .recommend_intro .btn_simple p:after,
.color_blue #tmp_wrapper .sec_recommend .recommend_intro .btn_simple p:after,
.color_yellow #tmp_wrapper .sec_recommend .recommend_intro .btn_simple p:after{
    background-image: none;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}
.color_black #tmp_wrapper .city_carousel .splide__arrow--prev:before,
.color_blue #tmp_wrapper .city_carousel .splide__arrow--prev:before{
	background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/slide_arrow_prev_wh_pc.png) !important;
}
.color_yellow #tmp_wrapper .city_carousel .splide__arrow--prev:before {
	background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/slide_arrow_prev_bl_pc.png) !important;
}
.color_black #tmp_wrapper .city_carousel .splide__arrow--next:before,
.color_blue #tmp_wrapper .city_carousel .splide__arrow--next:before{
	background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/slide_arrow_next_wh_pc.png) !important;
}
.color_yellow #tmp_wrapper .city_carousel .splide__arrow--next:before {
	background-image: url(/shared/templates/rn2026_citypromotion_top/images/icon/slide_arrow_next_bl_pc.png) !important;
}
.color_yellow #tmp_wrapper .city_carousel .splide__toggle__pause:before{
    border-left-color: #0000FF;
    border-right-color: #0000FF;
}
.color_yellow #tmp_wrapper .city_carousel .splide__toggle__play:before,
.color_yellow #tmp_wrapper .city_carousel .splide__toggle:hover .splide__toggle__play:before{
    border-left-color: #0000FF;
}
.color_yellow #tmp_wrapper #tmp_gallery_modal .modal_btn_close p:after,
.color_yellow #tmp_wrapper .btn_show_more p:before,
.color_yellow #tmp_wrapper .btn_show_more p:after,
.color_yellow #tmp_wrapper .city_carousel .splide__toggle:hover .splide__toggle__pause:before{
    border-color: #0000FF;
}
.color_black #tmp_wrapper .city_carousel .splide__toggle:hover .splide__toggle__play:before,
.color_blue #tmp_wrapper .city_carousel .splide__toggle:hover .splide__toggle__play:before{
    border-left-color: #ffffff;
}
.color_black #tmp_wrapper #tmp_gallery_modal .modal_btn_close p:after,
.color_blue #tmp_wrapper #tmp_gallery_modal .modal_btn_close p:after,
.color_black #tmp_wrapper .btn_show_more p:before,
.color_black #tmp_wrapper .btn_show_more p:after,
.color_blue #tmp_wrapper .btn_show_more p:before,
.color_blue #tmp_wrapper .btn_show_more p:after,
.color_black #tmp_wrapper .city_carousel .splide__toggle:hover .splide__toggle__pause:before,
.color_blue #tmp_wrapper .city_carousel .splide__toggle:hover .splide__toggle__pause:before{
    border-color: #ffffff;
}
.color_black #tmp_wrapper .btn_simple,
.color_black #tmp_wrapper .btn_show_more,
.color_black #tmp_wrapper #tmp_gallery_modal .modal_btn_close,
.color_black #tmp_wrapper .thumbnail_item > a,
.color_blue #tmp_wrapper .btn_simple, .btn_show_more,
.color_blue #tmp_wrapper #tmp_gallery_modal .modal_btn_close,
.color_blue #tmp_wrapper .thumbnail_item > a,
.color_yellow #tmp_wrapper .btn_simple, .btn_show_more,
.color_yellow #tmp_wrapper #tmp_gallery_modal .modal_btn_close,
.color_yellow #tmp_wrapper .thumbnail_item > a{
    transition: none;
}
.color_black #tmp_wrapper .btn_simple:hover a,
.color_black #tmp_wrapper .btn_show_more:hover a,
.color_black #tmp_wrapper #tmp_gallery_modal .modal_btn_close:hover a,
.color_blue #tmp_wrapper .btn_simple:hover a,
.color_blue #tmp_wrapper .btn_show_more:hover a,
.color_blue #tmp_wrapper #tmp_gallery_modal .modal_btn_close:hover a,
.color_yellow #tmp_wrapper .btn_simple:hover a,
.color_yellow #tmp_wrapper .btn_show_more:hover a,
.color_yellow #tmp_wrapper #tmp_gallery_modal .modal_btn_close:hover a,
.color_black #tmp_wrapper #tmp_splide_mv .splide_mv_item a:hover .txt_ttl > span,
.color_blue #tmp_wrapper #tmp_splide_mv .splide_mv_item a:hover .txt_ttl > span,
.color_yellow #tmp_wrapper #tmp_splide_mv .splide_mv_item a:hover .txt_ttl > span,
.color_blue #tmp_wrapper #tmp_gallery_modal .feel_item_link a:hover,
.color_black #tmp_wrapper #tmp_gallery_modal .feel_item_link a:hover,
.color_yellow #tmp_wrapper #tmp_gallery_modal .feel_item_link a:hover,
.color_yellow #tmp_wrapper .city_carousel .splide__toggle:hover,
.color_blue #tmp_wrapper .city_carousel .splide__toggle:hover,
.color_black #tmp_wrapper .city_carousel .splide__toggle:hover,
.color_black #tmp_wrapper .thumbnail_item > a:hover .thumbnail_title,
.color_blue #tmp_wrapper .thumbnail_item > a:hover .thumbnail_title,
.color_yellow #tmp_wrapper .thumbnail_item > a:hover .thumbnail_title{
    text-decoration: underline;
}
/* fsize */
.fsize_big2 #tmp_splide_mv .splide__controls{
    left: calc(63% - 4px);
    gap: 5px;
}
.fsize_big2 .mainvisual_cap::after{
    right: -28px;
    width: 30px;
}
.fsize_big .sec_mainvisual_wrap::after,
.fsize_big2 .sec_mainvisual_wrap::after {
    z-index: -1;
}
.fsize_small #tmp_wrapper .thumbnail_item .thumbnail_title{
    background-position: 0 9px;
}
.fsize_small .mainvisual_cap::after{
    right: -15px;
}
/* furi */
.easy_on .btn_simple a,
.easy_on .btn_show_more a,
.easy_on #tmp_gallery_modal .modal_close{
    display: block;
}
/* javascript & no-splide */
.no_javascript #tmp_splide_mv .mv_item_txt .txt_label, 
.no_javascript #tmp_splide_mv .mv_item_txt .txt_ttl span{
    opacity: 1;
}
.no_javascript #tmp_splide_mv .splide .splide__list{
    flex-flow: row wrap;
    max-height: 848px;
    overflow: auto;
}
.no_javascript .city_carousel,
.no_javascript .city_carousel .splide{
    visibility: visible;
}
.no_javascript .recommend_wrapper,
.sec_recommend .recommend_wrapper:has(.recommend_carousel .no-splide),
.no_javascript .instagram_wrapper,
.sec_recommend .instagram_wrapper:has(.instagram_carousel .no-splide){
    margin: 0 auto;
    max-width: 1220px;
    padding-left: 10px;
    padding-right: 10px;
}
.no_javascript .sec_instagram .instagram_cnt,
.sec_instagram .instagram_wrapper:has(.instagram_carousel .no-splide) .instagram_cnt{
    padding-left: 20px;
}
.no_javascript .recommend_carousel .splide__list,
.recommend_carousel .no-splide .splide__list{
    flex-flow: row wrap;
    gap: 20px;
}
.no_javascript .instagram_carousel .splide__list,
.instagram_carousel .no-splide .splide__list{
    flex-flow: row wrap;
    gap: 0 2px;
}
.no_javascript .sec_instagram .instagram_carousel .splide:first-child:not(:last-child) .instagram_slide,
.sec_instagram .instagram_carousel .no-splide:first-child:not(:last-child) .instagram_slide{
    transform: none !important;
}
.no_javascript #tmp_city_opening{
    position: static;
    display: none;
}