@media(orientation:portrait)and (max-width:759px) {
                    html[data-template=course-detail] .js_header {
                        -webkit-backdrop-filter: none;
                        backdrop-filter: none;
                        background: transparent
                    }
                }

                .crd {
                    background: #eeead9
                }

                .crd_wrap {
                    align-items: start;
                    display: grid;
                    grid-template-columns: auto;
                    grid-template-rows: auto
                }

                .crd_side {
                    grid-column: 1/-1;
                    grid-row: 1/-1;
                    pointer-events: none;
                    position: sticky;
                    z-index: 1;
                    --sideHeadLabel_color: #6c6352;
                    --sideMain_color: #000;
                    --sideScrollTrack_color: rgba(51, 51, 51, .5);
                    --sideScrollTrackMark_color: #333;
                    --sideHead_top: calc(var(--a-s, 1px)*66)
                }

                .crd_side.is_dark {
                    --sideHeadLabel_color: #fff;
                    --sideMain_color: #fff;
                    --sideScrollTrack_color: #fff;
                    --sideScrollTrackMark_color: #999
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_side {
                        overflow: clip;
                        padding-bottom: calc(var(--a-s, 1px)*208);
                        top: 0
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_side {
                        padding-bottom: calc(var(--a-s, 1px)*98);
                        top: var(--sideHead_top)
                    }

                    .crd_sideInner {
                        --wrap_clearance_r: 0;
                        --wrap_clearance_l: 0;
                        height: calc(var(--vh-max, 1vh)*100 - var(--sideHead_top))
                    }
                }

                .crd_sideBody {
                    display: grid;
                    grid-template-rows: auto 1fr auto auto auto;
                    pointer-events: auto
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideBody {
                        height: calc(var(--vh, 1vh)*100);
                        width: calc(var(--a-s, 1px)*120);
                        grid-gap: calc(var(--a-s, 1px)*32)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideBody {
                        grid-template-rows: auto 1fr auto auto;
                        height: calc(var(--vh, 1vh)*100 - var(--sideHead_top));
                        position: relative;
                        width: calc(var(--a-s, 1px)*53.5);
                        grid-gap: calc(var(--a-s, 1px)*14)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideDots {
                        opacity: .6;
                        padding-left: calc(var(--a-s, 1px)*15)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideDots {
                        inset: 0 0 0 3px;
                        opacity: .2;
                        position: relative
                    }
                }

                .crd_sideDots_dot {
                    width: 2px
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideDots_dot {
                        margin: 0 auto
                    }
                }

                .crd_sideHead {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideHead {
                        display: grid;
                        padding-top: calc(var(--a-s, 1px)*48);
                        grid-gap: calc(var(--a-s, 1px)*32)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideHead {
                        display: grid;
                        padding-top: calc(var(--a-s, 1px)*32);
                        grid-gap: calc(var(--a-s, 1px)*14);
                        justify-content: center
                    }
                }

                .crd_sideHead:before {
                    background: #807766;
                    content: "";
                    display: block;
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideHead:before {
                        height: calc(var(--a-s, 1px)*6)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideHead:before {
                        height: calc(var(--a-s, 1px)*4)
                    }
                }

                .crd_sideHead:after {
                    background: hsla(39, 11%, 45%, .6);
                    content: "";
                    display: block;
                    position: absolute;
                    right: 0
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideHead:after {
                        height: calc(var(--a-s, 1px)*16);
                        top: calc(var(--a-s, 1px)*6);
                        width: 1px
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideHead:after {
                        height: calc(var(--a-s, 1px)*4);
                        top: calc(var(--a-s, 1px)*4);
                        width: 2px
                    }

                    .crd_sideHead_ttl {
                        color: var(--sideHeadLabel_color);
                        display: -ms-grid;
                        display: grid;
                        margin: 0 auto;
                        min-height: 3.5rem;
                        overflow: hidden;
                        place-items: center;
                        position: relative;
                        right: calc(var(--a-s, 1px)*-4);
                        transition: color .1s ease-out;
                        width: 1.9em;
                        writing-mode: vertical-rl;
                        -webkit-writing-mode: vertical-rl
                    }

                    .crd_sideHead_ttl>span {
                        font-feature-settings: normal;
                        line-height: 1.3;
                        vertical-align: top
                    }

                    .crd_sideHead_ttl ._and {
                        text-combine-upright: all
                    }
                }

                .crd_sideHeadLabel {
                    color: var(--sideHeadLabel_color);
                    display: -ms-grid;
                    display: grid
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideHeadLabel {
                        justify-items: center
                    }
                }

                .crd_sideHeadLabel>li {
                    grid-column: 1/2;
                    grid-row: 1/2
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideHeadLabel>li {
                        writing-mode: vertical-rl
                    }

                    .crd_sideHeadLabel>li ._en {
                        text-combine-upright: all
                    }
                }

                .crd_sideHeadLabel li {
                    opacity: 0;
                    transition: opacity .1s ease-out
                }

                .crd_sideHeadLabel li.is_visible {
                    opacity: 1;
                    transition: opacity .5s ease-in-out 50ms
                }

                .html_typoMode .crd_sideHeadLabel li.is_visible {
                    z-index: 1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideHeadLabel li {
                        display: grid;
                        row-gap: calc(var(--a-s, 1px)*17)
                    }

                    html:not([lang=en]) .crd_sideHeadLabel li {
                        display: block
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideHeadLabel li {
                        display: grid;
                        inset: 0 0 0 3px;
                        position: relative;
                        row-gap: calc(var(--a-s, 1px)*7)
                    }

                    html:not([lang=en]) .crd_sideHeadLabel li {
                        display: block;
                        letter-spacing: calc(var(--a-s, 1px)*9)
                    }

                    html:not([lang=en]) .crd_sideHeadLabel li.crd_sideHeadLabelItem {
                        letter-spacing: calc(var(--a-s, 1px)*9)
                    }
                }

                .crd_sideScroll {
                    position: relative
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideScroll {
                        inset: 0 0 0 3px;
                        position: relative
                    }
                }

                .crd_sideScrollInner {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideScrollInner {
                        height: 100%;
                        width: calc(var(--a-s, 1px)*32)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideScrollInner {
                        height: 100%;
                        margin: 0 auto;
                        width: calc(var(--a-s, 1px)*21)
                    }
                }

                .crd_sideScrollTrack {
                    contain: size layout;
                    display: flex;
                    flex-direction: column;
                    height: 100%;
                    justify-content: space-between;
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: 100%
                }

                .crd_sideScrollTrack:after,
                .crd_sideScrollTrack:before {
                    background: var(--sideMain_color);
                    content: "";
                    display: block;
                    height: calc(var(--a-s, 1px)*1);
                    transition: background .5s ease-in-out 50ms;
                    width: 100%
                }

                .crd_sideScrollTrackFill {
                    background: var(--sideScrollTrack_color);
                    display: block;
                    height: calc(100% - var(--a-s, 1px)*16);
                    left: calc(50% - var(--a-s, 1px)*1);
                    position: absolute;
                    scale: 1 0;
                    top: 0;
                    transform-origin: left top;
                    transition: background .5s ease-in-out 50ms;
                    width: calc(var(--a-s, 1px)*2)
                }

                .crd_sideScrollTrackMarks {
                    align-items: center;
                    color: var(--sideScrollTrackMark_color);
                    display: flex;
                    flex-direction: column;
                    height: calc(100% - var(--a-s, 1px)*32);
                    justify-content: space-between;
                    position: relative;
                    transition: color .5s ease-in-out 50ms;
                    width: 100%
                }

                .crd_sideScrollTrackMarks:before {
                    background: var(--sideMain_color);
                    content: "";
                    display: block;
                    height: calc(100% + var(--a-s, 1px)*32);
                    opacity: .1;
                    position: absolute;
                    top: calc(var(--a-s, 1px)*-16);
                    transition: background .5s ease-in-out 50ms;
                    width: calc(var(--a-s, 1px)*2)
                }

                .crd_sideScrollTrackMarks>li {
                    background: currentColor;
                    height: calc(var(--a-s, 1px)*2);
                    position: relative;
                    width: calc(var(--a-s, 1px)*2)
                }

                .crd_sideScrollTrackMarks>li.__2 {
                    height: 1px;
                    width: calc(var(--a-s, 1px)*6)
                }

                .crd_sideScrollTrackMarks>li.__3 {
                    height: 1px;
                    width: calc(var(--a-s, 1px)*15)
                }

                .crd_sideScrollTrackMarkLabel {
                    color: #999;
                    position: absolute;
                    white-space: nowrap
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideScrollTrackMarkLabel {
                        left: calc(100% + var(--a-s, 1px)*19.5);
                        top: calc(var(--a-s, 1px)*-5)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideScrollTrackMarkLabel {
                        left: calc(100% + var(--a-s, 1px)*7);
                        top: calc(var(--a-s, 1px)*-4)
                    }
                }

                .crd_sideScrollKnob {
                    align-items: center;
                    display: flex;
                    position: absolute;
                    top: 0;
                    white-space: nowrap
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideScrollKnob {
                        height: calc(var(--a-s, 1px)*32);
                        left: calc(var(--a-s, 1px)*-1);
                        width: calc(var(--a-s, 1px)*118)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideScrollKnob {
                        height: calc(var(--a-s, 1px)*26.7);
                        left: calc(var(--a-s, 1px)*-13);
                        width: auto
                    }
                }

                .crd_sideScrollKnobBg {
                    background: #fff;
                    border: 1px solid #333;
                    contain: size layout;
                    height: 100%;
                    left: 0;
                    position: absolute;
                    top: 0;
                    transition: all .5s cubic-bezier(.77, 0, .175, 1);
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideScrollKnobBg {
                        border-radius: calc(var(--a-s, 1px)*32);
                        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .1);
                        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .1)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideScrollKnobBg {
                        border-radius: calc(var(--a-s, 1px)*26.7);
                        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .1);
                        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .1)
                    }
                }

                .js_course_uiScrollKnob.is_end .crd_sideScrollKnobBg {
                    opacity: 0;
                    width: 20%
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .js_course_uiScrollKnob.is_dragging .crd_sideScrollKnobBg {
                        transition: all .2s cubic-bezier(.165, .84, .44, 1);
                        width: 200%
                    }
                }

                .crd_sideScrollKonbIcon {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideScrollKonbIcon {
                        height: calc(var(--a-s, 1px)*22);
                        margin-left: calc(var(--a-s, 1px)*5);
                        width: calc(var(--a-s, 1px)*22)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideScrollKonbIcon {
                        height: calc(var(--a-s, 1px)*13.58);
                        margin-left: calc(var(--a-s, 1px)*7);
                        margin-right: calc(var(--a-s, 1px)*3.5);
                        transition: translate .5s cubic-bezier(.77, 0, .175, 1);
                        width: calc(var(--a-s, 1px)*13.58)
                    }

                    .js_course_uiScrollKnob.is_end .crd_sideScrollKonbIcon {
                        translate: calc(var(--a-s, 1px)*10) 0
                    }
                }

                .crd_sideScrollKonbIcon svg {
                    -webkit-filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .1));
                    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .1))
                }

                .crd_sideScrollKonbDots {
                    margin-left: calc(var(--a-s, 1px)*11);
                    margin-right: calc(var(--a-s, 1px)*11);
                    position: relative;
                    transition: opacity .5s ease-in-out;
                    width: calc(var(--a-s, 1px)*2)
                }

                .js_course_uiScrollKnob.is_end .crd_sideScrollKonbDots {
                    opacity: 0
                }

                .crd_sideScrollKonbTxt {
                    align-items: center;
                    display: grid;
                    position: relative;
                    transition: all .5s ease-in-out
                }

                .js_course_uiScrollKnob.is_end .crd_sideScrollKonbTxt {
                    opacity: 0;
                    transition: all .2s ease-out
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideScrollKonbTxt {
                        padding-right: calc(var(--a-s, 1px)*7.5)
                    }

                    .js_course_uiScrollKnob.is_dragging .crd_sideScrollKonbTxt {
                        transition: all .2s cubic-bezier(.165, .84, .44, 1);
                        translate: calc(var(--a-s, 1px)*62) 0
                    }
                }

                .crd_sideScrollKonbTxt>div {
                    grid-column: 1/2;
                    grid-row: 1/2
                }

                .crd_sideScrollKnobPrepare {
                    text-align: center
                }

                .crd_side_nav {
                    display: grid;
                    row-gap: calc(var(--a-s, 1px)*4)
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_side_nav {
                        inset: 0 0 0 3px;
                        justify-items: center;
                        position: relative
                    }
                }

                .crd_side_navIcon {
                    align-items: center;
                    align-self: flex-end;
                    aspect-ratio: 1/1;
                    border-bottom: 1px solid;
                    display: flex;
                    justify-content: center;
                    --indexlink_icon_bg_df: #fff;
                    --indexlink_icon_bg_ov: #d9d5c7;
                    background: var(--indexlink_icon_bg_df)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_side_navIcon {
                        width: calc(var(--a-s, 1px)*32)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_side_navIcon {
                        width: calc(var(--a-s, 1px)*21)
                    }
                }

                @media(any-hover:hover) {
                    .crd_side_navIcon {
                        transition: background .9s cubic-bezier(.19, 1, .22, 1)
                    }

                    .crd_side_navNext:hover .crd_side_navIcon,
                    .crd_side_navPrev:hover .crd_side_navIcon {
                        background: var(--indexlink_icon_bg_ov);
                        transition: background 50ms cubic-bezier(.19, 1, .22, 1)
                    }
                }

                .crd_side_navArw {
                    aspect-ratio: 1/1;
                    rotate: 90deg
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_side_navArw {
                        width: calc(var(--a-s, 1px)*9)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_side_navArw {
                        width: calc(var(--a-s, 1px)*6)
                    }
                }

                .crd_side_navPrev .crd_side_navIcon {
                    border-bottom: none;
                    border-top: 1px solid
                }

                .crd_side_navPrev .crd_side_navArw {
                    rotate: -90deg
                }

                .crd_sideList {
                    display: flex;
                    position: relative;
                    --reservebutto_text_color_df: #fff;
                    --reservebutto_text_color_ov: #807766;
                    --reservebutto_bg_color_df: #807766;
                    --reservebutto_bg_color_ov: transparent;
                    --reservebutto_line_color_df: #fff;
                    --reservebutto_line_color_ov: transparent;
                    --reservebutto_diff: 0px;
                    color: var(--reservebutto_line_color_df)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideList {
                        align-items: stretch;
                        -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .2);
                        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .2);
                        height: calc(var(--a-s, 1px)*80);
                        justify-content: flex-start;
                        padding-left: calc(var(--a-s, 1px)*22);
                        padding-right: calc(var(--a-s, 1px)*22);
                        width: calc(var(--a-s, 1px)*120)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideList {
                        align-items: center;
                        flex-flow: column-reverse wrap-reverse;
                        justify-content: center;
                        padding: calc(var(--a-s, 1px)*14) 0;
                        transition: all .3s cubic-bezier(.165, .84, .44, 1);
                        transition-property: margin, padding;
                        width: calc(var(--a-s, 1px)*53.5)
                    }

                    .js_course_ui.is_spStatusBarHidden .crd_sideList {
                        margin-bottom: calc(var(--a-s, 1px)*-27);
                        padding: calc(var(--a-s, 1px)*27) 0
                    }
                }

                @media(any-hover:hover) {
                    .crd_sideList {
                        transition: color .9s cubic-bezier(.19, 1, .22, 1)
                    }

                    .crd_sideList:hover {
                        color: var(--reservebutto_text_color_ov);
                        transition: color 50ms cubic-bezier(.19, 1, .22, 1)
                    }
                }

                .crd_sideList:before {
                    border: 1px solid var(--reservebutto_bg_color_df);
                    content: "";
                    display: block;
                    inset: 0;
                    pointer-events: none;
                    position: absolute;
                    z-index: 0
                }

                .crd_sideList_bg {
                    background: var(--reservebutto_bg_color_df);
                    border-radius: inherit;
                    inset: 0;
                    position: absolute;
                    z-index: 0
                }

                @media(any-hover:hover) {
                    .crd_sideList_bg {
                        transition: opacity .9s cubic-bezier(.19, 1, .22, 1)
                    }

                    .crd_sideList:hover .crd_sideList_bg {
                        opacity: 0;
                        transition: opacity 50ms cubic-bezier(.19, 1, .22, 1)
                    }
                }

                .crd_sideList_body {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    position: relative
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideList_body {
                        inset: auto calc(var(--a-s, 1px)*-4) auto auto;
                        position: relative;
                        writing-mode: vertical-rl
                    }
                }

                .crd_sideList_btn {
                    align-items: center;
                    aspect-ratio: 1/1;
                    display: flex;
                    justify-content: center
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideList_btn {
                        inset: 0 0 0 auto;
                        position: absolute
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideList_btn {
                        padding-bottom: calc(var(--a-s, 1px)*8);
                        width: calc(var(--a-s, 1px)*14)
                    }
                }

                .crd_sideList_btn:after {
                    background: #fff;
                    content: "";
                    display: block;
                    position: absolute
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_sideList_btn:after {
                        height: 2px;
                        inset: auto calc(var(--a-s, 1px)*30) calc(var(--a-s, 1px)*0) calc(var(--a-s, 1px)*30)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideList_btn:after {
                        height: auto;
                        inset: calc(var(--a-s, 1px)*12) 0 calc(var(--a-s, 1px)*12) auto;
                        width: calc(var(--a-s, 1px)*1.5)
                    }
                }

                @media(any-hover:hover) {
                    .crd_sideList_btn:after {
                        transition: opacity .9s cubic-bezier(.19, 1, .22, 1)
                    }

                    .crd_sideList:hover .crd_sideList_btn:after {
                        opacity: 0;
                        transition: opacity 50ms cubic-bezier(.19, 1, .22, 1)
                    }
                }

                .crd_sideList_btnDot {
                    background: #fff;
                    border-radius: 50%;
                    height: calc(var(--a-s, 1px)*5);
                    width: calc(var(--a-s, 1px)*5)
                }

                @media(any-hover:hover) {
                    .crd_sideList_btnDot {
                        transition: background .9s cubic-bezier(.19, 1, .22, 1)
                    }

                    .crd_sideList:hover .crd_sideList_btnDot {
                        background: var(--reservebutto_text_color_ov);
                        transition: background 50ms cubic-bezier(.19, 1, .22, 1)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_sideList_btnDot {
                        inset: auto calc(var(--a-s, 1px)*-4) auto auto;
                        position: relative
                    }
                }

                .crd_body {
                    grid-column: 1/-1;
                    grid-row: 1/-1;
                    position: relative;
                    z-index: 0
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_body {
                        overflow: clip
                    }

                    .crd_section_inner {
                        --wrap_clearance_l: calc(var(--a-s, 1px)*390)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_section_inner {
                        --wrap_clearance_l: calc(var(--a-s, 1px)*85)
                    }
                }

                .crd_section_ttl {
                    align-items: center;
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: space-between;
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_section_ttl {
                        border-top: 1px solid rgba(0, 0, 0, .07);
                        margin-bottom: calc(var(--a-s, 1px)*48);
                        padding-top: calc(var(--a-s, 1px)*48)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_section_ttl {
                        border-top: 1px solid rgba(0, 0, 0, .2);
                        margin-bottom: calc(var(--a-s, 1px)*42);
                        padding-top: calc(var(--a-s, 1px)*28)
                    }
                }

                .crd_section_ttl:before {
                    content: "";
                    display: block;
                    inset: -1px auto auto 0;
                    position: absolute
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_section_ttl:before {
                        background: rgba(0, 0, 0, .4);
                        height: 1px;
                        width: calc(var(--a-s, 1px)*12)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_section_ttl:before {
                        background: rgba(0, 0, 0, .2);
                        height: 1px;
                        width: calc(var(--a-s, 1px)*13)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    html[lang=en] .crd_section_desc {
                        width: calc(var(--a-s, 1px)*602)
                    }
                }

                html[lang=en] .crd_section_desc br {
                    display: none
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_section_recommend {
                        column-gap: calc(var(--a-s, 1px)*30);
                        display: grid;
                        grid-template-columns: auto calc(var(--a-s, 1px)*360);
                        margin-top: calc(var(--a-s, 1px)*48)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_section_recommend {
                        margin-top: calc(var(--a-s, 1px)*42)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_section_recommendTxt {
                        border-bottom: 1px solid rgba(0, 0, 0, .4)
                    }

                    .crd_section_recommendHotel {
                        margin-top: calc(var(--a-s, 1px)*188)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_section_recommendHotel {
                        margin-top: calc(var(--a-s, 1px)*98)
                    }
                }

                .crd_fv {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_inner {
                        padding-top: calc(var(--a-s, 1px)*76)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_inner {
                        padding-top: calc(var(--a-s, 1px)*112)
                    }
                }

                .crd_fv_nav {
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_nav .c_localHeadNav_link {
                        display: none
                    }
                }

                .crd_fv_body {
                    position: absolute;
                    z-index: 1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_body {
                        top: calc(var(--a-s, 1px)*230)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_body {
                        height: calc(100% - var(--a-s, 1px)*112);
                        padding-top: calc(var(--a-s, 1px)*70);
                        top: calc(var(--a-s, 1px)*112);
                        width: calc(100% - var(--a-s, 1px)*100)
                    }
                }

                .crd_fv_ttlArea {
                    display: grid
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_ttlArea {
                        row-gap: calc(var(--a-s, 1px)*32)
                    }

                    html[lang=en] .crd_fv_ttlArea {
                        width: calc(var(--a-s, 1px)*360)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_ttlArea {
                        row-gap: calc(var(--a-s, 1px)*21)
                    }
                }

                .crd_fv_ttl {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_ttlDf {
                        clip-path: polygon(0 0, calc(var(--a-s, 1px)*211) 0, calc(var(--a-s, 1px)*211) calc(var(--a-s, 1px)*870), 0 calc(var(--a-s, 1px)*870))
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_ttlDf {
                        clip-path: polygon(calc(var(--a-s, 1px)*67) 0, calc(var(--a-s, 1px)*67) 100%, 100% 100%, 100% 100%, 0 100%, 0 0);
                        overflow-wrap: break-word;
                        word-break: keep-all
                    }
                }

                html.html_typoMode .crd_fv_ttlDf {
                    visibility: hidden
                }

                .crd_fv_ttlMask {
                    color: #fff;
                    position: absolute;
                    z-index: 1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_ttlMask {
                        clip-path: polygon(calc(var(--a-s, 1px)*211) 0, calc(var(--a-s, 1px)*870) 0, calc(var(--a-s, 1px)*870) calc(var(--a-s, 1px)*870), calc(var(--a-s, 1px)*211) calc(var(--a-s, 1px)*870))
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_ttlMask {
                        clip-path: inset(0 0 0 calc(var(--a-s, 1px)*67));
                        overflow-wrap: break-word;
                        word-break: keep-all
                    }
                }

                html.html_typoMode .crd_fv_ttlMask {
                    clip-path: none;
                    color: #333
                }

                .crd_fv_ttlenInner {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_ttlenDf {
                        clip-path: polygon(0 0, calc(var(--a-s, 1px)*211) 0, calc(var(--a-s, 1px)*211) calc(var(--a-s, 1px)*870), 0 calc(var(--a-s, 1px)*870))
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_ttlenDf {
                        clip-path: polygon(calc(var(--a-s, 1px)*67) 0, calc(var(--a-s, 1px)*67) 100%, 100% 100%, 100% 100%, 0 100%, 0 0);
                        overflow-wrap: break-word;
                        word-break: keep-all
                    }
                }

                .crd_fv_ttlenMask {
                    color: #fff;
                    position: absolute;
                    z-index: 1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_ttlenMask {
                        clip-path: polygon(calc(var(--a-s, 1px)*211) 0, calc(var(--a-s, 1px)*870) 0, calc(var(--a-s, 1px)*870) calc(var(--a-s, 1px)*870), calc(var(--a-s, 1px)*211) calc(var(--a-s, 1px)*870))
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_ttlenMask {
                        clip-path: inset(0 0 0 calc(var(--a-s, 1px)*67));
                        overflow-wrap: break-word;
                        word-break: keep-all
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_desc {
                        position: relative;
                                width: calc(var(--a-s, 1px) * 329);
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_desc {
                        bottom: calc(var(--a-s, 1px)*-18);
                        position: absolute
                    }
                }

                html[lang=en] .crd_fv_desc br {
                    display: none
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    html[lang=en] .crd_fv_desc {
                        width: calc(var(--a-s, 1px)*329)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    html[lang=en] .crd_fv_desc {
                        width: calc(var(--a-s, 1px)*200)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_descDf {
                        clip-path: polygon(0 0, calc(var(--a-s, 1px)*211) 0, calc(var(--a-s, 1px)*211) calc(var(--a-s, 1px)*870), 0 calc(var(--a-s, 1px)*870))
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_descDf {
                        clip-path: polygon(calc(var(--a-s, 1px)*67) 0, calc(var(--a-s, 1px)*67) calc(100% - var(--a-s, 1px)*25), 100% calc(100% - var(--a-s, 1px)*25), 100% 100%, 0 100%, 0 0)
                    }
                }

                .crd_fv_descMask {
                    color: #fff;
                    position: absolute;
                    z-index: 1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_descMask {
                        clip-path: polygon(calc(var(--a-s, 1px)*211) 0, calc(var(--a-s, 1px)*870) 0, calc(var(--a-s, 1px)*870) calc(var(--a-s, 1px)*870), calc(var(--a-s, 1px)*211) calc(var(--a-s, 1px)*870))
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_descMask {
                        clip-path: inset(0 0 calc(var(--a-s, 1px)*25) calc(var(--a-s, 1px)*67))
                    }
                }

                .crd_fv_num u {
                    text-decoration-color: rgba(154, 131, 70, .2);
                    text-decoration-skip-ink: none;
                    text-underline-offset: calc(var(--a-s, 1px)*-2)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_num u {
                        text-decoration-thickness: calc(var(--a-s, 1px)*6)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_num u {
                        text-decoration-thickness: calc(var(--a-s, 1px)*4)
                    }
                }

                .crd_fv_slider {
                    margin-left: auto;
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_fv_slider {
                        height: calc(var(--a-s, 1px)*870);
                        width: calc(var(--a-s, 1px)*870)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_fv_slider {
                        height: calc(var(--a-s, 1px)*514);
                        margin-right: calc(var(--a-s, 1px)*-20);
                        width: calc(var(--a-s, 1px)*288)
                    }

                    .crd_fv_slider .m_slider_dots {
                        right: calc(var(--a-s, 1px)*20)
                    }
                }

                .crd_fv_tagList {
                    display: grid;
                    gap: calc(var(--a-s, 1px)*32) 0;
                    margin-top: calc(var(--a-s, 1px)*48);
                    padding-top: calc(var(--a-s, 1px)*48);
                    position: relative;
                    width: calc(var(--a-s, 1px)*180)
                }

                .crd_fv_tagList:before {
                    background: rgba(0, 0, 0, .2);
                    content: "";
                    display: block;
                    height: 1px;
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: calc(var(--a-s, 1px)*12)
                }

                .crd_bucketList_list {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_bucketList_list {
                        border-top: 1px solid rgba(0, 0, 0, .07)
                    }
                }

                .crd_bucketList_item {
                    align-items: center;
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: space-between;
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_bucketList_item {
                        padding: calc(var(--a-s, 1px)*17) 0
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_bucketList_item {
                        padding: calc(var(--a-s, 1px)*14) 0
                    }

                    .crd_bucketList_item:first-child {
                        padding-top: 0
                    }
                }

                .crd_bucketList_item:after {
                    bottom: 0;
                    content: "";
                    display: block;
                    height: 1px;
                    position: absolute;
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_bucketList_item:after {
                        background-image: linear-gradient(90deg, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2) 1px, transparent 0, transparent 2px);
                        background-position: 0 0;
                        background-repeat: repeat-x;
                        background-size: 3px 1px
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_bucketList_item:after {
                        border-bottom: 1px solid rgba(0, 0, 0, .07)
                    }
                }

                .crd_bucketList_itemTtl {
                    display: flex
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_bucketList_itemTtl {
                        column-gap: calc(var(--a-s, 1px)*16)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_bucketList_itemTtl {
                        column-gap: calc(var(--a-s, 1px)*14)
                    }
                }

                .crd_bucketList_icon {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_bucketList_icon {
                        width: calc(var(--a-s, 1px)*16)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_bucketList_icon {
                        flex-shrink: 0;
                        width: calc(var(--a-s, 1px)*14)
                    }
                }

                .crd_bucketList_ttl {
                    display: grid;
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_bucketList_ttl {
                        top: calc(var(--a-s, 1px)*2)
                    }

                    html[lang=en] .crd_bucketList_ttl {
                        top: calc(var(--a-s, 1px)*4)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_bucketList_ttl {
                        top: calc(var(--a-s, 1px)*1)
                    }

                    html[lang=en] .crd_bucketList_ttl {
                        top: calc(var(--a-s, 1px)*2)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_body {
                        display: grid;
                        gap: 0 calc(var(--a-s, 1px)*24);
                        grid-template-columns: repeat(2, 1fr)
                    }
                }

                .crd_journey_map {
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_map {
                        height: calc(var(--a-s, 1px)*368);
                        order: 2;
                        width: calc(var(--a-s, 1px)*456)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journey_map {
                        margin-bottom: calc(var(--a-s, 1px)*28);
                        width: calc(var(--a-s, 1px)*290)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_mapMovingElm {
                        height: calc(var(--a-s, 1px)*48);
                        width: calc(var(--a-s, 1px)*80)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journey_mapMovingElm {
                        height: calc(var(--a-s, 1px)*35);
                        width: calc(var(--a-s, 1px)*59)
                    }
                }

                .crd_journeyImgPin,
                .crd_journeyImgPinWrap,
                .crd_journey_mapImgBg {
                    contain: size layout;
                    height: 100%;
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: 100%
                }

                .crd_journeyImgPin {
                    align-items: center;
                    color: #fff;
                    display: flex;
                    justify-content: center
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journeyImgPin {
                        height: calc(var(--a-s, 1px)*32);
                        margin-left: calc(var(--a-s, 1px)*-14);
                        margin-top: calc(var(--a-s, 1px)*-30);
                        width: calc(var(--a-s, 1px)*28)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journeyImgPin {
                        height: calc(var(--a-s, 1px)*28);
                        margin-left: calc(var(--a-s, 1px)*-12.5);
                        margin-top: calc(var(--a-s, 1px)*-25);
                        width: calc(var(--a-s, 1px)*25)
                    }
                }

                .crd_journeyImgPin.is_active .crd_journeyImgPinText {
                    color: #fff
                }

                .crd_journeyImgPinBg {
                    contain: size layout;
                    -webkit-filter: drop-shadow(0 .493px .986px rgba(0, 0, 0, .25));
                    filter: drop-shadow(0 .493px .986px rgba(0, 0, 0, .25));
                    height: 100%;
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: 100%
                }

                .crd_journeyImgPinBg svg * {
                    stroke-width: 3px
                }

                .crd_journeyImgPinText {
                    position: relative;
                    z-index: 1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journeyImgPinText {
                        top: calc(var(--a-s, 1px)*-2)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journeyImgPinText {
                        top: calc(var(--a-s, 1px)*-1)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_txtArea {
                        order: 1
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journey_scroll {
                        margin-right: calc(var(--a-s, 1px)*-20);
                        overflow-x: scroll;
                        padding-top: calc(var(--a-s, 1px)*1);
                        scrollbar-color: transparent transparent;
                        scrollbar-width: thin
                    }
                }

                .crd_journey_table {
                    align-items: start;
                    display: grid;
                    grid-template-columns: repeat(2, 1fr)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_table {
                        column-gap: calc(var(--a-s, 1px)*30)
                    }

                    .crd_journey_table.__col1 {
                        column-gap: 0
                    }

                    .crd_journey_table.__col1 ul {
                        display: grid;
                        gap: 0 calc(var(--a-s, 1px)*30);
                        grid-auto-flow: column;
                        grid-template-rows: repeat(3, auto);
                        width: calc(var(--a-s, 1px)*390)
                    }

                    .crd_journey_table.__col1 ul li {
                        width: calc(var(--a-s, 1px)*180)
                    }

                    .crd_journey_table.__col1 ul li:nth-child(9) {
                        border-top: 1px solid rgba(0, 0, 0, .07)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journey_table {
                        gap: 0 calc(var(--a-s, 1px)*33.5)
                    }

                    .crd_journey_table.__col1 ul {
                        width: calc(var(--a-s, 1px)*267)
                    }

                    .crd_journey_table.__col1 ul li {
                        width: 100%
                    }
                }

                .crd_journey_tableItem {
                    display: grid;
                    word-break: keep-all
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_tableItem {
                        row-gap: calc(var(--a-s, 1px)*30);
                        width: calc(var(--a-s, 1px)*180)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journey_tableItem {
                        width: calc(var(--a-s, 1px)*200)
                    }

                    .crd_journey_tableItem:last-child {
                        padding-right: calc(var(--a-s, 1px)*20)
                    }
                }

                .crd_journey_tableItem ul li {
                    border-bottom: 1px solid rgba(0, 0, 0, .07)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_tableItem ul li {
                        padding: calc(var(--a-s, 1px)*10) 0 calc(var(--a-s, 1px)*11) calc(var(--a-s, 1px)*4)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journey_tableItem ul li {
                        padding: calc(var(--a-s, 1px)*9) calc(var(--a-s, 1px)*0) calc(var(--a-s, 1px)*9)
                    }
                }

                .crd_journey_tableItem ul li:first-child {
                    border-top: 1px solid rgba(0, 0, 0, .07)
                }

                .crd_journey_tableItemInner {
                    column-gap: calc(var(--a-s, 1px)*6);
                    display: flex
                }

                .crd_journey_tableNum {
                    flex-shrink: 0
                }

                .crd_journey_caption {
                    color: #666
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_journey_caption {
                        margin-top: calc(var(--a-s, 1px)*32)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_journey_caption {
                        margin-top: calc(var(--a-s, 1px)*25)
                    }
                }

                .crd_spotItem {
                    background: var(--spotItem_bg);
                    color: var(--spotItem_color);
                    --spotItem_color: #333;
                    position: relative
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem {
                        padding-bottom: calc(var(--a-s, 1px)*112);
                        padding-top: calc(var(--a-s, 1px)*112);
                        --spotItem_slider_height: calc(var(--a-s, 1px)*400)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem {
                        padding-bottom: calc(var(--a-s, 1px)*70);
                        padding-top: calc(var(--a-s, 1px)*70);
                        --spotItem_slider_height: calc(var(--a-s, 1px)*168)
                    }
                }

                .crd_spotItem:before {
                    content: "";
                    display: block;
                    height: 2px;
                    left: 0;
                    position: absolute;
                    top: -1px;
                    width: 100%;
                    z-index: -1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__large {
                        --spotItem_slider_height: calc(var(--a-s, 1px)*560)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__large {
                        --spotItem_slider_height: calc(var(--a-s, 1px)*361)
                    }
                }

                .crd_spotItem.__morning+.__morning {
                    padding-top: calc(var(--a-s, 1px)*0)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__morning {
                        --spotItem_bg: #f6f3e7;
                        --spotItem_border: rgba(51, 51, 51, .4)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__morning {
                        --spotItem_bg: #f6f3e7;
                        --spotItem_border: rgba(51, 51, 51, .4)
                    }
                }

                .crd_spotItem.__morning:before {
                    background-color: #f6f3e7
                }

                .crd_spotItem.__noon+.__noon {
                    padding-top: calc(var(--a-s, 1px)*0)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__noon {
                        --spotItem_bg: #ded9c8;
                        --spotItem_border: rgba(51, 51, 51, .4)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__noon {
                        --spotItem_bg: #ded9c8;
                        --spotItem_border: rgba(51, 51, 51, .4)
                    }
                }

                .crd_spotItem.__noon:before {
                    background-color: #ded9c8
                }

                .crd_spotItem.__evening+.__evening {
                    padding-top: calc(var(--a-s, 1px)*0)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__evening {
                        --spotItem_bg: #45413a;
                        --spotItem_color: #fff;
                        --spotItem_border: hsla(0, 0%, 100%, .4)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__evening {
                        --spotItem_bg: #45413a;
                        --spotItem_color: #fff;
                        --spotItem_border: hsla(0, 0%, 100%, .4)
                    }
                }

                .crd_spotItem.__evening:before {
                    background-color: #45413a
                }

                .crd_spotItem.__evening .crd_next_lineDf {
                    background-image: linear-gradient(180deg, hsla(0, 0%, 100%, .4), hsla(0, 0%, 100%, .4) 1px, transparent 0, transparent 0);
                    background-position: 0 0;
                    background-repeat: repeat-y;
                    background-size: 1px 2px
                }

                .crd_spotItem.__evening .m_spotLink:before {
                    background: hsla(0, 0%, 100%, .07)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__evening .m_spotLink_linkItem:not(:first-child):before {
                        background-image: linear-gradient(180deg, #fff, #fff 1px, transparent 0, transparent 2px);
                        background-position: 0 0;
                        background-repeat: repeat-y;
                        background-size: 1px 3px
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__evening .m_spotLink_ttlWrap {
                        border-bottom-color: hsla(0, 0%, 100%, .07)
                    }

                    .crd_spotItem.__evening .crd_others {
                        border-top-color: hsla(0, 0%, 100%, .07)
                    }
                }

                .crd_spotItem.__evening .crd_others_ttl {
                    border-bottom-color: hsla(0, 0%, 100%, .07)
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__evening .crd_others_ttl {
                        background-image: linear-gradient(90deg, hsla(0, 0%, 100%, .2), hsla(0, 0%, 100%, .2) 1px, transparent 0, transparent 0);
                        background-position: 0 0;
                        background-position: bottom;
                        background-repeat: repeat-x;
                        background-size: 2px 1px
                    }
                }

                .crd_spotItem.__evening .crd_others_itemCopy {
                    color: hsla(0, 0%, 100%, .6)
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__evening .crd_others_item a {
                        border-bottom-color: hsla(0, 0%, 100%, .1)
                    }
                }

                .crd_spotItem.__evening .crd_others_itemTtl:before {
                    background: hsla(0, 0%, 100%, .07)
                }

                .crd_spotItem.__evening .crd_others_itemLink {
                    border-bottom-color: hsla(0, 0%, 100%, .4)
                }

                .crd_spotItem.__evening .js_img svg {
                    fill: #fff
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__evening .m_spotLink_link {
                        border-color: hsla(0, 0%, 100%, .4)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__end {
                        --spotItem_bg: #000;
                        --spotItem_color: #fff;
                        padding-bottom: calc(var(--a-s, 1px)*208);
                        padding-top: calc(var(--a-s, 1px)*188)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__end {
                        --spotItem_bg: #000;
                        --spotItem_color: #fff;
                        padding-bottom: calc(var(--a-s, 1px)*98);
                        padding-top: calc(var(--a-s, 1px)*98)
                    }
                }

                .crd_spotItem.__end .crd_next_lineDf {
                    background-image: linear-gradient(180deg, hsla(0, 0%, 100%, .4), hsla(0, 0%, 100%, .4) 1px, transparent 0, transparent 0);
                    background-position: 0 0;
                    background-repeat: repeat-y;
                    background-size: 1px 2px
                }

                .crd_spotItem.__end .crd_section_ttl {
                    border-color: hsla(0, 0%, 100%, .2)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__end .crd_section_ttl:before {
                        background: hsla(0, 0%, 100%, .4)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem.__end .crd_section_ttl:before {
                        background: #fff
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem.__end .crd_section_recommendTxt {
                        border-color: hsla(0, 0%, 100%, .2)
                    }

                    .crd_spotItem.__end .crd_section_recommendTxt .h_caption {
                        opacity: 1
                    }
                }

                @media(any-hover:hover) {
                    .crd_spotItem.__evening .crd_others_item:hover .crd_others_itemTtl:before {
                        background: hsla(0, 0%, 100%, .4)
                    }
                }

                .crd_spotItem_head {
                    display: grid
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_head {
                        margin-bottom: calc(var(--a-s, 1px)*48);
                        row-gap: calc(var(--a-s, 1px)*80)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_head {
                        margin-bottom: calc(var(--a-s, 1px)*42);
                        margin-right: calc(var(--a-s, 1px)*-20);
                        row-gap: calc(var(--a-s, 1px)*42)
                    }
                }

                .crd_spotItem_cat {
                    border-top: 1px solid var(--spotItem_border)
                }

                .crd_spotItem_catInner {
                    align-items: center;
                    background: #fff;
                    border: 1px solid #333;
                    border-radius: calc(var(--a-s, 1px)*30);
                    -webkit-box-sizing: border-box;
                    box-sizing: border-box;
                    color: #333;
                    display: flex;
                    inset: -1px auto auto 0;
                    justify-content: center;
                    position: relative;
                    width: fit-content
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_catInner {
                        height: calc(var(--a-s, 1px)*32);
                        padding: 0 calc(var(--a-s, 1px)*14)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_catInner {
                        height: calc(var(--a-s, 1px)*27.5);
                        padding: 0 calc(var(--a-s, 1px)*16)
                    }
                }

                .crd_spotItem_catInner:before {
                    background: var(--spotItem_color);
                    content: "";
                    display: block;
                    height: 1px;
                    inset: -1px auto auto 0;
                    position: absolute;
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_ttlArea {
                        display: flex;
                        justify-content: space-between
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_ttlArea {
                        column-gap: calc(var(--a-s, 1px)*0);
                        display: flex
                    }
                }

                .crd_spotItem_ttl {
                    display: grid
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_ttl {
                        row-gap: calc(var(--a-s, 1px)*24)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_ttl {
                        flex-grow: 1;
                        row-gap: calc(var(--a-s, 1px)*21)
                    }

                    .crd_spotItem_ttlEn,
                    html[lang=en] .crd_spotItem_ttl {
                        padding-right: calc(var(--a-s, 1px)*20)
                    }
                }

                .crd_spotItem_photo {
                    align-items: center;
                    background: #fff;
                    border-radius: calc(var(--a-s, 1px)*2);
                    color: #333;
                    display: flex;
                    justify-content: center;
                    position: relative;
                    text-align: center
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_photo {
                        border: 1px solid #333;
                        height: calc(var(--a-s, 1px)*120);
                        width: calc(var(--a-s, 1px)*120)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_photo {
                        border-bottom: 1px solid #333;
                        border-left: 1px solid #333;
                        border-top: 1px solid #333;
                        flex-shrink: 0;
                        height: calc(var(--a-s, 1px)*84);
                        width: calc(var(--a-s, 1px)*88)
                    }
                }

                .crd_spotItem_photo:before {
                    background: #ded9c8;
                    content: "";
                    display: block;
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_photo:before {
                        height: calc(var(--a-s, 1px)*50)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_photo:before {
                        height: calc(var(--a-s, 1px)*36.5)
                    }
                }

                .crd_spotItem_photoInner {
                    align-items: center;
                    display: grid;
                    justify-items: center;
                    position: relative;
                    z-index: 1
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_photoInner {
                        row-gap: calc(var(--a-s, 1px)*12)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_photoInner {
                        row-gap: calc(var(--a-s, 1px)*10)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_photoIcon {
                        height: calc(var(--a-s, 1px)*23.25);
                        width: calc(var(--a-s, 1px)*31)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_photoIcon {
                        height: calc(var(--a-s, 1px)*14);
                        width: calc(var(--a-s, 1px)*18.37)
                    }
                }

                .crd_spotItem_photoTime {
                    display: grid
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_spotItem_photoTime {
                        row-gap: calc(var(--a-s, 1px)*8)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_photoTime {
                        color: rgba(0, 0, 0, .6);
                        row-gap: calc(var(--a-s, 1px)*7)
                    }
                }

                .crd_spotItem .m_spotLink_linkItem {
                    pointer-events: auto
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_slider {
                        margin-right: calc(var(--a-s, 1px)*-20)
                    }
                }

                .crd_spotItem_sliderInner {
                    height: var(--spotItem_slider_height)
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_slider .m_slider_dots {
                        right: calc(var(--a-s, 1px)*20)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    html[lang=en] .crd_spotItem_disc {
                        width: calc(var(--a-s, 1px)*602)
                    }
                }

                html[lang=en] .crd_spotItem_disc br {
                    display: none
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_spotItem_disc br {
                        display: none
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others {
                        column-gap: calc(var(--a-s, 1px)*30);
                        display: flex;
                        margin-top: calc(var(--a-s, 1px)*65)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_others {
                        border-top: 1px solid rgba(0, 0, 0, .07);
                        margin-top: calc(var(--a-s, 1px)*42);
                        padding-top: calc(var(--a-s, 1px)*27.5)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_ttl {
                        border-bottom: 1px solid rgba(0, 0, 0, .07);
                        flex-shrink: 0;
                        padding-bottom: calc(var(--a-s, 1px)*17);
                        padding-top: calc(var(--a-s, 1px)*1);
                        width: calc(var(--a-s, 1px)*240)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_others_ttl {
                        padding-bottom: calc(var(--a-s, 1px)*27.5)
                    }
                }

                .crd_others_links {
                    display: flex;
                    flex-grow: 1;
                    flex-wrap: wrap;
                    justify-content: space-between;
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_links {
                        width: calc(100% - var(--a-s, 1px)*270)
                    }
                }

                .crd_others_item {
                    width: 100%
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_item:only-child a {
                        display: flex;
                        height: 100%
                    }

                    .crd_others_item:only-child .crd_others_itemInner {
                        width: 100%
                    }

                    .crd_others_item a {
                        display: block;
                        position: relative;
                        width: 100%
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_others_item a {
                        border-bottom: 1px solid rgba(0, 0, 0, .1);
                        display: block;
                        width: 100%
                    }
                }

                .crd_others_itemTtl:before {
                    --card_foot_line_color_df: rgba(0, 0, 0, .07);
                    --card_foot_line_color_ov: rgba(0, 0, 0, .4)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_itemTtl:before {
                        background: var(--card_foot_line_color_df);
                        bottom: 0;
                        content: "";
                        display: block;
                        height: 1px;
                        position: absolute;
                        width: 100%
                    }
                }

                @media(orientation:landscape)and (any-hover:hover), (orientation:portrait)and (min-width:760px)and (any-hover:hover) {
                    .crd_others_itemTtl:before {
                        transition: all .9s cubic-bezier(.19, 1, .22, 1)
                    }

                    .crd_others_item:hover .crd_others_itemTtl:before {
                        background: var(--card_foot_line_color_ov);
                        transition: all 50ms cubic-bezier(.19, 1, .22, 1);
                        transition: width 50ms cubic-bezier(.19, 1, .22, 1);
                        width: calc(100% + var(--a-s, 1px)*16)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_item:first-child .crd_others_itemTtl {
                        padding-top: calc(var(--a-s, 1px)*1)
                    }
                }

                .crd_others_itemInner {
                    align-items: end;
                    align-self: end;
                    column-gap: calc(var(--a-s, 1px)*16);
                    display: grid;
                    grid-column: 1;
                    grid-row: 5/6;
                    grid-template-columns: 1fr auto;
                    pointer-events: none
                }

                @media(any-hover:hover) {
                    .crd_others_item:hover .crd_others_itemIcon {
                        opacity: .3
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_itemTtl {
                        column-gap: calc(var(--a-s, 1px)*16);
                        display: flex;
                        display: grid;
                        grid-template-columns: auto 1fr;
                        padding-bottom: calc(var(--a-s, 1px)*17);
                        padding-top: calc(var(--a-s, 1px)*17);
                        position: relative
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_others_itemTtl {
                        display: grid;
                        padding-bottom: calc(var(--a-s, 1px)*15);
                        padding-top: calc(var(--a-s, 1px)*15);
                        row-gap: calc(var(--a-s, 1px)*9)
                    }

                    html[lang=en] .crd_others_itemTtl {
                        row-gap: calc(var(--a-s, 1px)*14)
                    }
                }

                .crd_others_itemCopy {
                    color: rgba(51, 51, 51, .6)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_itemCopy {
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap
                    }

                    .crd_others_itemName {
                        white-space: nowrap
                    }
                }

                .crd_others_itemName wbr {
                    display: none
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_others_itemLink {
                        border-bottom: 1px solid rgba(0, 0, 0, .4);
                        padding-bottom: calc(var(--a-s, 1px)*16)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_others_itemLink {
                        padding-bottom: calc(var(--a-s, 1px)*15)
                    }

                    .crd_others_itemLink:after {
                        background: currentColor;
                        bottom: -1px;
                        content: "";
                        display: block;
                        height: 1px;
                        left: auto;
                        position: absolute;
                        right: 0;
                        top: auto;
                        width: calc(var(--a-s, 1px)*12)
                    }
                }

                .crd_bottom_btn {
                    position: relative
                }

                .crd_bottom_btn:before {
                    background: #000;
                    content: "";
                    display: block;
                    height: calc(var(--a-s, 1px)*80);
                    left: 0;
                    position: absolute;
                    top: 0;
                    width: 100%
                }

                .crd_bottom_btnWrap {
                    background: #f6f3e7;
                    position: relative;
                    z-index: 1
                }

                .crd_next_line {
                    display: flex;
                    flex-direction: column;
                    height: calc(var(--line_h) + var(--line_circle)*2);
                    margin: 0 auto;
                    padding: var(--line_circle) 0;
                    position: relative;
                    width: calc(var(--a-s, 1px)*1)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_line {
                        --line_h: calc(var(--a-s, 1px)*220);
                        --line_circle: calc(var(--a-s, 1px)*7)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_line {
                        --line_h: calc(var(--a-s, 1px)*142);
                        --line_circle: calc(var(--a-s, 1px)*4);
                        left: calc(var(--a-s, 1px)*-13)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_line.__baggy {
                        --transport_obj_w: calc(var(--a-s, 1px)*76);
                        --transport_obj_h: calc(var(--a-s, 1px)*46);
                        --transport_h: calc(var(--a-s, 1px)*55);
                        --transport_x: calc(var(--a-s, 1px)*-38)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_line.__baggy {
                        --transport_obj_w: calc(var(--a-s, 1px)*60);
                        --transport_obj_h: calc(var(--a-s, 1px)*35);
                        --transport_h: calc(var(--a-s, 1px)*41);
                        --transport_x: calc(var(--a-s, 1px)*-30)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_line.__foot {
                        --transport_obj_w: calc(var(--a-s, 1px)*40);
                        --transport_obj_h: calc(var(--a-s, 1px)*69);
                        --transport_h: calc(var(--a-s, 1px)*72);
                        --transport_x: calc(var(--a-s, 1px)*-20)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_line.__foot {
                        --transport_obj_w: calc(var(--a-s, 1px)*28);
                        --transport_obj_h: calc(var(--a-s, 1px)*48);
                        --transport_h: calc(var(--a-s, 1px)*51);
                        --transport_x: calc(var(--a-s, 1px)*-14)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_line.__tram {
                        --transport_obj_w: calc(var(--a-s, 1px)*80);
                        --transport_obj_h: calc(var(--a-s, 1px)*48);
                        --transport_h: calc(var(--a-s, 1px)*55);
                        --transport_x: calc(var(--a-s, 1px)*-40)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_line.__tram {
                        --transport_obj_w: calc(var(--a-s, 1px)*60);
                        --transport_obj_h: calc(var(--a-s, 1px)*35.5);
                        --transport_h: calc(var(--a-s, 1px)*41);
                        --transport_x: calc(var(--a-s, 1px)*-30)
                    }
                }

                .crd_next_line:before {
                    background: var(--spotItem_color);
                    border-radius: 50%;
                    content: "";
                    position: absolute;
                    top: 0
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_line:before {
                        height: calc(var(--a-s, 1px)*7);
                        left: calc(var(--a-s, 1px)*-3);
                        width: calc(var(--a-s, 1px)*7)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_line:before {
                        height: calc(var(--a-s, 1px)*4);
                        left: -1.8px;
                        width: calc(var(--a-s, 1px)*4)
                    }
                }

                .crd_next_line:after {
                    border: 1px solid var(--spotItem_color);
                    border-radius: 50%;
                    content: "";
                    position: absolute
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_line:after {
                        bottom: calc(var(--a-s, 1px)*-7);
                        height: calc(var(--a-s, 1px)*7);
                        left: calc(var(--a-s, 1px)*-3);
                        width: calc(var(--a-s, 1px)*7)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_line:after {
                        bottom: calc(var(--a-s, 1px)*-4);
                        height: calc(var(--a-s, 1px)*4);
                        left: -1.8px;
                        width: calc(var(--a-s, 1px)*4)
                    }
                }

                .crd_next_lineOv {
                    background: var(--spotItem_color);
                    height: calc((var(--line_h) - var(--transport_h))*var(--progress));
                    position: absolute;
                    top: 0;
                    width: 1px
                }

                .crd_next_lineDf {
                    background-image: linear-gradient(180deg, rgba(0, 0, 0, .4), rgba(0, 0, 0, .4) 1px, transparent 0, transparent 0);
                    background-position: 0 0;
                    background-repeat: repeat-y;
                    background-size: 1px 2px;
                    bottom: 0;
                    height: calc((var(--line_h) - var(--transport_h))*(1 - var(--progress)));
                    position: absolute;
                    width: 1px
                }

                .crd_next_transport {
                    align-items: center;
                    display: flex;
                    height: var(--transport_h);
                    left: var(--transport_x);
                    position: absolute;
                    top: var(--line_circle);
                    translate: 0 calc((var(--line_h) - var(--transport_h))*var(--progress))
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_transport {
                        column-gap: calc(var(--a-s, 1px)*16)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_transport {
                        column-gap: calc(var(--a-s, 1px)*8)
                    }
                }

                .crd_next_transportInner {
                    flex-shrink: 0;
                    height: var(--transport_obj_h);
                    position: relative;
                    width: var(--transport_obj_w)
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_txt {
                        white-space: nowrap
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_txt {
                        width: calc(var(--a-s, 1px)*120)
                    }
                }

                .crd_next_img {
                    margin: 0 auto;
                    position: relative
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_img {
                        inset: 0 0 0 calc(var(--a-s, 1px)*-14)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_img.__baggy {
                        width: calc(var(--a-s, 1px)*75.68)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_img.__baggy {
                        width: calc(var(--a-s, 1px)*60)
                    }
                }

                @media(orientation:landscape), (orientation:portrait)and (min-width:760px) {
                    .crd_next_img.__foot {
                        width: calc(var(--a-s, 1px)*41)
                    }
                }

                @media(orientation:portrait)and (max-width:759px) {
                    .crd_next_img.__foot {
                        width: calc(var(--a-s, 1px)*29)
                    }
                }