@charset "UTF-8";
/* ------------------------------------------------------------------ */
/* box__search__result */
/* .box__search__result .gsc-resultsbox-visible {
    border-top: 1px solid var(--color-line-gray2);
} */

.box__search__result .gcsc-more-maybe-branding-root,
.box__search__result .gcsc-find-more-on-google-root,
.box__search__result .gsc-branding, 
.box__search__result .gcsc-branding {
    visibility: hidden;
}

.box__search__result .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);
}

.box__search__result .gsc-selected-option-container {
    box-shadow: initial;
}

.box__search__result .gsc-tabsArea {
    border: initial;
    border-radius: initial;
}

.box__search__result .gsc-tabHeader {
    font-size: 22px;
    font-weight: 400;
    line-height: 27px;
    min-width: initial;
    padding: 0 12px 12px 12px;
}

.box__search__result .gsc-above-wrapper-area {
    padding: 10px 0;
}

.box__search__result .gsc-results {
    width: 100%;
}

/* title 下方的線 */
/* .box__search__result .article a {
    border-bottom: 2px dotted var(--color-pink);
} */

.box__search__result .gsc-tabHeader.gsc-tabhActive {
    border-bottom: 2px solid var(--color-brown)!important;
    color: var(--color-brown)!important;
}


.box__search__result .gsc-tabsArea,
.box__search__result .gsc-above-wrapper-area {
    border-bottom: 1px solid var(--color-line-gray2)!important;
}

.box__search__result .gsc-control-cse {
    background-color: initial!important;
    border: initial!important;
}

.box__search__result .gsc-webResult.gsc-result {
    border: initial !important;
    padding: 40px 0;
}

.box__search__result .gsc-thumbnail-inside,
.box__search__result .gsc-url-top,
.box__search__result .gsc-table-result, 
.box__search__result .gs-promotion-table {
    padding-left: 0px;
    padding-right: 0px;
}

.box__search__result .gsc-webResult.gsc-result:not(:first-child) {
    border-top: 1px solid var(--color-line-gray2) !important;
}

.box__search__result .gsc-control-cse .gs-spelling, 
.box__search__result .gsc-control-cse .gs-result .gs-title, 
.box__search__result .gsc-control-cse .gs-result .gs-title * {
    font-size: 22px;
    line-height: 30px;
}

.box__search__result .gsc-control-cse, 
.box__search__result .gsc-control-cse .gsc-table-result {
    font-family: var(--font-noto);
    font-size: 16px;
    line-height: 24px;
}

/* 與搜尋相關的關鍵字 */
.box__search__result .gsc-control-cse .gs-result .gs-title b, 
.box__search__result .gs-webResult .gs-snippet b {
	font-weight: 400;
    font-size: 100%;
    color: var(--color-brown);
}

/* 所有標題的顏色 */
.box__search__result .gs-result .gs-title *, 
.box__search__result .gsc-cursor-page, .gs-spelling a {
	color: #000;
}

/* 來源 */
.box__search__result .gs-promotion .gs-visibleUrl, 
.box__search__result .gs-webResult .gs-visibleUrl {
    color: var(--color-gray-hard);
    margin: 8px 0;
    font-size: 14px;
    line-height: 20px;
}


/* 放大縮圖 開始 */

.gs-web-image-box, 
.gs-promotion-image-box {
    float: left !important;
    margin-left: 0px !important;
}

.box__search__result .gs-web-image-box {
    padding: 0 !important;
    width: calc(155px + 45px) !important;
}

.box__search__result .gs-web-image-box .gs-image {
    display: block !important;
    max-width: calc(140px + 45px) !important;
    max-height: 120px;
    width: 100%;
    height: 120px;
}

.box__search__result .gs-result .gs-image, 
.box__search__result .gs-result .gs-promotion-image {
    border: initial !important;
    border-radius: var(--img-radius-s);
}


.box__search__result .gcsc-find-more-on-google-magnifier {
    fill: var(--color-brown);
}


.box__search__result .gcsc-find-more-on-google {
    color: var(--color-brown);
    display: inline-block;
    margin-left: 0px;
    padding-top: 2px;
}



/* 分頁設定 頁碼 */
.box__search__result .gsc-results .gsc-cursor-box {
    border-top: 1px solid var(--color-line-gray2) !important;
    padding: 20px 0;
    margin: 10px 0px;
}

.box__search__result .gsc-results .gsc-cursor-box .gsc-cursor-current-page {
    color: #C09568 !important;
}

.box__search__result .gsc-results .gsc-cursor-box .gsc-cursor-page {
    color: #000;
    margin-right: 0px;
}

.box__search__result .gsc-results .gsc-cursor-box .gsc-cursor-page:not(:last-child) {
    margin-right: 20px;
}

/* .box__search__result .gsc-results .gsc-cursor-box .gsc-cursor-page {
    padding: 6px 9.9px;
    border-radius: 50%;
} */


.box__search__result .gcsc-more-maybe-branding-box {
    border: initial;
    border-radius: initial;
}

/* ------------------------------------------------------------------ */
.is-display-none {
    display: none !important;
}
/* ------------------------------------------------------------------ */
section > div.effect-bg-bottom.is-effect-pc,
section > div.effect-bg-top.is-effect-pc {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    overflow-x: clip;

    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 1;

    -webkit-transition: opacity .3s ease-in-out 0s;
    -o-transition: opacity .3s ease-in-out 0s;
    -moz-transition: opacity .3s ease-in-out 0s;
    transition: opacity .3s ease-in-out 0s;
}


section > div.effect-bg-bottom.is-effect-pc.is-out,
section > div.effect-bg-top.is-effect-pc.is-out {
    opacity: 0;
}


section > div.effect-bg-bottom.is-effect-pc {
    align-items: flex-end;
}

section > div.effect-bg-top.is-effect-pc {
    align-items: flex-start;
}

section > div.effect-bg-bottom.is-effect-pc.is-center {
    align-items: center;
}

section > div.effect-bg-top.is-effect-pc.is-center {
    align-items: center;
}

section > div.effect-bg-bottom.is-effect-pc > img,
section > div.effect-bg-top.is-effect-pc > img {
    width: 1680px;
}

section.box__search__result > div.effect-bg-top.is-effect-pc {
    /* top: -90px; */
    top: -160px;
}

section.box__search__result > div.effect-bg-bottom.is-effect-pc {
    top: initial;
    bottom: 25%;
}


section.box__search__result .box__container .box__body {
    --sr-body-100-min-h: 100px;
    --sr-body-300-min-h: 300px;

    -webkit-transition: all .2s ease-out 0s;
    -o-transition: all .2s ease-out 0s;
    -moz-transition: all .2s ease-out 0s;
    transition: all .2s ease-out 0s;
}


/* ------------------------------------------------------------------ */
.box__photo__large2 .box__container .box__body .body__photo.btn-no-work,
.box__events__slide .splide .splide__slide.btn-no-work,
.box__flower__photos__slide .splide .splide__slide.btn-no-work,
.box__photos__text__slide .splide .splide__slide.btn-no-work,
.box__intro__photos__slide .splide .splide__slide.btn-no-work,
.box__circle__photos__slide .splide .splide__slide.btn-no-work {
    pointer-events: none;
    cursor: default;
}


/* ------------------------------------------------------------------ */
.box__videos__list .box__container.box__title,
.box__downloads__list .box__container.box__title {
    margin-bottom: 80px;
}

.box__videos__list .box__container .box__body,
.box__downloads__list .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);

    display: grid;
    align-items: stretch;
    
    grid-column-gap: 3%;
    grid-row-gap: 80px;
    justify-content: space-between;
    grid-template-columns: repeat(3, minmax(270px, 100%));
    grid-auto-rows: auto;
}

.box__videos__list .box__container .box__body .body__item,
.box__downloads__list .box__container .box__body .body__item {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.box__videos__list .box__container .box__body .body__item.is-noytid {
    opacity: 0.5;
}

.box__videos__list .box__container .box__body .body__item.is-noytid .item__con .con__photo.aspect-ratio {
    pointer-events: none;
    cursor: default;
}

.box__videos__list .box__container .box__body .body__item .item__con,
.box__downloads__list .box__container .box__body .body__item .item__con {
    position: relative;
    display: flex;
    flex-direction: column;
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo,
.box__downloads__list .box__container .box__body .body__item .item__con .con__photo {
    position: relative;
    border-radius: var(--img-radius-s);
    overflow: hidden;
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio {
    pointer-events: auto;
    cursor: pointer;
    --pic-wh-rate: calc(208/272);
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio > div .photo__bg {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

    -webkit-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;


    background-size: cover  !important;
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio > div .photo__bg .icon__arrow {
    --circle-w: 16%;
    --arrow-w: 55%;
    position: relative;
    width: var(--circle-w); /* 佔總寬度的50%，也可以換成任何你想要的寬度 */
    padding-top: var(--circle-w);  /* 也是佔總寬度的50%，因此長寬一樣長 */
    /* background: var(--model-color); */
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio > div .photo__bg .icon__arrow::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    background: var(--model-color);
    border-radius: 50%;
    overflow: hidden;
    transform: scale(1);

    -webkit-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio > div .photo__bg .icon__arrow > img {
    position: absolute;
    top: 50%;
    left: 54%;
    width: var(--arrow-w);
    height: var(--arrow-w); /* 高和寬都填滿容器 */
    
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio > div .photo__bg:hover {
    background-size: cover !important;
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio > div .photo__bg:hover .icon__arrow::before {
    transform: scale(0);
}

.box__videos__list .box__container .box__body .body__item .item__con .con__photo.aspect-ratio > div .photo__bg:hover .icon__arrow > img {
    transform:  translate(-50%, -50%) scale(1.3);
}


.box__videos__list .box__container .box__body .body__item .item__con .con__title,
.box__downloads__list .box__container .box__body .body__item .item__con .con__title {
    margin: 5px 0 20px 0;
    --icon-h: 35px;
    display: flex;
    flex-direction: row;
}

.box__downloads__list.no-icon .box__container .box__body .body__item .item__con .con__title .title__icon {
    display: none;
}

.box__downloads__list .box__container .box__body .body__item .item__con .con__title .title__icon {
    display: flex;
    margin-right: 10px;
}

.box__downloads__list .box__container .box__body .body__item .item__con .con__title .title__icon > img {
    height: var( --icon-h);
    width: auto;
}

.box__videos__list .box__container .box__body .body__item .item__con .con__title .title__text,
.box__downloads__list .box__container .box__body .body__item .item__con .con__title .title__text {
    --fsize2: calc(var(--fsize) - 1px);
    font-size: var(--fsize2);
    font-weight: 400;
    line-height: calc(var(--fsize2) + 8px);
    padding-top: calc((var(--icon-h) - calc(var(--fsize2) + 8px)) * 0.5);

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

/* ------------------------------------------------------------------ */
@-webkit-keyframes rotate-center {
    0% {
        -webkit-transform: rotate(0);
                transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}

@keyframes rotate-center {
    0% {
        -webkit-transform: rotate(0);
                transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}
/* box__lyrics */
.box__lyrics .box__container.box__title {
    margin-bottom: 80px;
}

.box__lyrics .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);

    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
}

.box__lyrics .box__container .box__body > li {
    position: relative;
    flex: 0 0 auto;
}

.box__lyrics .box__container .box__body > li.box__con {
    width: 45%;
}

.box__lyrics .box__container .box__body > li.box__con .con__title {
    text-align: center;
    margin-bottom: 60px;
}

.box__lyrics .box__container .box__body > li.box__con .con__name {
    margin-bottom: 30px;
}

.box__lyrics .box__container .box__body > li.box__con .con__content {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}

.box__lyrics .box__container .box__body > li.box__con .con__content > li:first-child {
    margin-right: 20%;
}


.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio {
    --pic-wh-rate: calc(460/380);
    --pic-w: 45%;

    left: initial;
    transform: initial;
    -webkit-transform: initial;
    -moz-transform: initial;
    -ms-transform: initial;
    -o-transform: initial;
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con {
    position: relative;
    width: 100%;
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > img {
    border-radius: var(--img-radius-l);
    overflow: hidden;

    height: auto;
    object-fit: initial;
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg {
    position: absolute;
    top: -10px;
    left: -20px;
    z-index: 1;
    transform: scale(0.55);

    -webkit-transition: all .2s ease-out 0s;
    -o-transition: all .2s ease-out 0s;
    -moz-transition: all .2s ease-out 0s;
    transition: all .2s ease-out 0s;
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg #bar-effect {
    pointer-events: none;
    
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
    -webkit-animation: rotate-center 2s linear infinite both;
            animation: rotate-center 2s linear infinite both;

    animation-play-state: paused;

    -webkit-transition: opacity .2s ease-out 0s;
    -o-transition: opacity .2s ease-out 0s;
    -moz-transition: opacity .2s ease-out 0s;
    transition: opacity .2s ease-out 0s;
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg #bar-stop {
    transform: translate(26px, 26px);
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg #bar-stop,
.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg #bar-pause,
.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg #bar-play {
    pointer-events: auto;
    cursor: pointer;

    -webkit-transition: all .2s ease-out 0s;
    -o-transition: all .2s ease-out 0s;
    -moz-transition: all .2s ease-out 0s;
    transition: all .2s ease-out 0s;
}

/* --------------------- */
.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg.is-out {
    transform: scale(0.6);
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg.is-out #bar-stop {
    transform: translate(86px, 9px);
}

/* --------------------- */
/* control-pause */
.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg.control-pause #bar-effect {
    animation-play-state: running;
    opacity: 0.2;
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg.control-pause #bar-pause {
    opacity: 1;
}

.box__lyrics .box__container .box__body > li.box__photo.aspect-ratio > div .photo__con > svg.control-pause #bar-play {
    opacity: 0;
}

/* ------------------------------------------------------------------ */
/* box__intro__icons */
.box__intro__icons .box__container.box__title {
    margin-bottom: 50px;
}

.box__intro__icons .box__container.box__title > span {
    margin-top: 40px;
    text-align: center;
}

.box__intro__icons .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);
}

.box__intro__icons .box__container .box__body .body__item {
    --icon-w: 20%;
    --detail-w: calc(100% - var(--icon-w));
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: stretch;

    padding: 50px 0;
}

.box__intro__icons .box__container .box__body .body__item:not(:first-child) {
    border-top: 1px solid var(--color-line-gray2);
    border-bottom: 1px solid var(--color-line-gray2);
    box-sizing: border-box;
}

.box__intro__icons .box__container .box__body .body__item:first-child {
    border-top: 1px solid var(--color-line-gray2);
    box-sizing: border-box;
}


.box__intro__icons .box__container .box__body .body__item > li {
    position: relative;
    flex: 0 0 auto;
}

.box__intro__icons .box__container .box__body .body__item .item__icon {
    width: var(--icon-w);
    display: flex;
    justify-content: center;
    align-items: center;
}

.box__intro__icons .box__container .box__body .body__item .item__detail {
    width: var(--detail-w);
    padding-right: 30%;
}

.box__intro__icons .box__container .box__body .body__item .item__icon > img {
    width: 50%;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__photo-mobile.aspect-ratio {
    --pic-wh-rate: calc(500/500);
    --pic-w: 50%;
    border-radius: 50%;
    overflow: hidden;

    left: initial;
    transform: initial;
    -webkit-transform: initial;
    -moz-transform: initial;
    -ms-transform: initial;
    -o-transform: initial;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__title {
    display: flex;
    flex-direction: row;
    align-items: center;

    margin-bottom: 10px;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__title .title__icon-mobile {
    width: 71px;
    margin-right: 10px;
}


.box__intro__icons .box__container .box__body .body__item .item__icon {
    display: flex;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__photo-mobile,
.box__intro__icons .box__container .box__body .body__item .item__detail .detail__title .title__icon-mobile {
    display: none;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__row {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: row;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__row .con__head {
    position: relative;
    flex: 0 0 auto;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__row .con__text {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__row.detail__name .con__text {
    font-style: italic;
}

.box__intro__icons .box__container .box__body .body__item .item__detail .detail__recommend .con__text > a {
    text-decoration: underline;
    text-underline-offset: 0.3em;
}


/* ------------------------------------------------------------------ */
/* box__text__bg2 */
.box__text__bg2 {
    background: url(../images/text-bg2/text-bg2-bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.box__text__bg2 .box__container .box__body {
    margin-top: 100px;
    padding: 0 var(--main-inner-padding-side);
}

/* ------------------------------------------------------------------ */
/* box__intro__text2 */
.box__intro__text2 .box__container .box__body {
    display: flex;
    justify-content: center;
    margin-top: 80px;
}

.box__intro__text2 .box__container .box__body > img {
    width: 38%;
}


.box__intro__text2 .box__container .box__body.is-text2 {
    padding: 0 var(--main-inner-padding-side);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
}

.box__intro__text2 .box__container .box__body.is-text2 .body__con {
    flex: 0 0 auto;
    position: relative;
    width: 47%;
}

.box__intro__text2 .box__container .box__body.is-text2 .body__con .con__title {
    text-align: center;
    margin-bottom: 50px;
}

.box__intro__text2 .box__container .box__body.is-text2 .body__con .con__detail {
    text-align: justify;
}

/* ------------------------------------------------------------------ */
@keyframes backdrop-filter-animation {
    0% {
        backdrop-filter: blur(0px) opacity(0);
        -webkit-backdrop-filter: blur(0px) opacity(0);
    }
    100% {
        backdrop-filter: blur(6px) opacity(1);
        -webkit-backdrop-filter: blur(6px) opacity(1);
    }
}
/* box__video__lightbox */
.box__video__lightbox {
    --model-color: var(--color-brown);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    
    z-index: 20000;
    opacity: 0;
    -webkit-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
}

.box__video__lightbox.is-in {
    opacity: 1;
}

.box__video__lightbox .box__container {
    position: relative;
    width: 100%;
    height: 100%;    
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    background-color: rgba(0, 0, 0, 0.8); 
}

.box__video__lightbox.is-in .box__container {
	-webkit-animation: backdrop-filter-animation 1s ease-out 0s both;
	        animation: backdrop-filter-animation 1s ease-out 0s both;
}

.box__video__lightbox .box__container .body__btn {
    position: absolute;
    width: 100%;
    top: var(--header-h)
}

.box__video__lightbox .box__container .body__btn .btn__close {
    pointer-events: auto;
    cursor: pointer;

    --circle-w: 50px;
    position: absolute;
    width: var(--circle-w);
    height: var(--circle-w);
    right: 2%;

    display: flex;
    justify-content: center;
    align-items: center;

    background-color: var(--model-color);
    border-radius: 50%;
    overflow: hidden;
    z-index: 1;
}

.box__video__lightbox .box__container .body__btn .btn__close > img {
    width: 50%;
}

.box__video__lightbox .box__container .body__video {
    position: relative;
    width: 100vmin;
}

/* .box__video__lightbox .box__container .box__body.aspect-ratio {
    --pic-wh-rate: calc(9/16);
    --pic-w: min(85%, 1440);
} */


/* ------------------------------------------------------------------ */
/* box__intro__video */
.box__intro__video .box__container.box__title > span {
    margin-top: 40px;
    text-align: center;
}

.box__intro__video .box__container .box__body.aspect-ratio {
    margin-top: 50px;
    --pic-wh-rate: calc(460/820);
    --pic-w: calc(100% - var(--main-inner-padding-side) * 2);
}

.box__intro__video .box__container .box__body.aspect-ratio > div .body__photo.no-work {
    cursor: default;
}

.box__intro__video .box__container .box__body.aspect-ratio > div .body__photo {
    pointer-events: auto;
    cursor: pointer;
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: var(--img-radius-l);
    overflow: hidden;

    -webkit-transition: all .3s ease-in-out 0s;
    -o-transition: all .3s ease-in-out 0s;
    -moz-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s;
}

.box__intro__video .box__container .box__body.aspect-ratio > div .body__photo:hover {
    background-size: 110% !important;
}

/* ------------------------------------------------------------------ */
/* box__btn__link */
.box__btn__link .box__container {
    align-items: center;
}

/* ------------------------------------------------------------------ */
/* box__title */
.box__title__page {
    padding: 40px 0 0px 0;
}

.box__title__page.is-dspace-100 {
    padding: 40px 0 100px 0;
}

.box__title__page .box__container.box__title {
    padding: 0 var(--main-padding-side);
    align-items: flex-start;
}
/* ------------------------------------------------------------------ */
.box__label__list {
    z-index: 1;
}

.box__label__list .box__container .box__body {
    width: 85%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

    left: initial;
    transform: initial;
    -webkit-transform: initial;
    -moz-transform: initial;
    -ms-transform: initial;
    -o-transform: initial;
}

.box__label__list .box__container .box__body .con__status {
    --flower-color: var(--color-gray-hard2);
    margin-right: 15px;
    margin-bottom: 15px;
}


.box__label__list .box__container .box__body .con__status.is-actived,
.box__label__list .box__container .box__body .con__status:hover {
    --flower-color: var(--color-brown);
}


.box__label__list .box__container .box__space-mobile {
    margin-bottom: 40px;
}


.box__label__list .box__container .box__body-mobile {
    --item-h: 34px;
    position: absolute;
    width: calc(80% - var(--main-padding-side) * 2);
    left: var(--main-padding-side);
    /* left: 50%;
    transform: translateX(-50%);;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%); */

    display: flex;
    flex-direction: column;

    background-color: var(--color-bg-gray2);
    border-radius: var( --panel-radius-l);
    overflow: hidden;
    box-shadow: var(--box-shadows);

    padding: 20px 20px;
    z-index: 1;

    -webkit-transition: all .3s ease-in-out 0s;
    -o-transition: all .3s ease-in-out 0s;
    -moz-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s;
}

.box__intro__photos__slide .box__container .box__body.box__intro .intro__options {
    --item-h: 34px;
    position: absolute;
    width: calc(20%);
    max-width: 220px;
    right: calc(var(--main-padding-side) + var(--main-inner-padding-side));
    top: initial;
    display: flex;
    flex-direction: column;

    background-color: var(--color-bg-gray2);
    border-radius: var( --panel-radius-l);
    overflow: hidden;
    box-shadow: var(--box-shadows);

    padding: 20px 30px;
    z-index: 1;

    -webkit-transition: all .3s ease-in-out 0s;
    -o-transition: all .3s ease-in-out 0s;
    -moz-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s;
}

.box__intro__photos__slide .box__container .box__body.box__intro .intro__options.is-min {
    padding: 10px 30px;
    border-radius: calc(var( --panel-radius-l) * 2);
}

.box__label__list .box__container .box__body-mobile.is-min {
    padding: 10px 20px;
    border-radius: calc(var( --panel-radius-l) * 2);
}


.box__intro__photos__slide .box__container .box__body.box__intro .intro__options .options__selected,
.box__label__list .box__container .box__body-mobile .body__selected {
    position: relative;
    width: 100%;
    height: var(--item-h);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}


.box__intro__photos__slide .box__container .box__body.box__intro .intro__options .options__selected > img,
.box__label__list .box__container .box__body-mobile .body__selected > img {
    width: 12px;
    -webkit-transition: all .3s ease-in-out 0s;
    -o-transition: all .3s ease-in-out 0s;
    -moz-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s;
}

.box__intro__photos__slide .box__container .box__body.box__intro .intro__options.is-min .options__selected > img,
.box__label__list .box__container .box__body-mobile.is-min .body__selected > img {
    transform: scaleY(-1);
}

.box__intro__photos__slide .box__container .box__body.box__intro .intro__options .options__dropcon,
.box__label__list .box__container .box__body-mobile .body__dropcon {
    position: relative;
    width: 100%;
}


.box__intro__photos__slide .box__container .box__body.box__intro .intro__options .options__dropcon .dropcon__list .list__item,
.box__label__list .box__container .box__body-mobile .body__dropcon .dropcon__list .list__item {
    pointer-events: auto;
    cursor: pointer;
    height: var(--item-h);
    display: flex;
    align-items: center;
}

.box__intro__photos__slide .box__container .box__body.box__intro .intro__options .options__dropcon .dropcon__list .list__item.is-actived,
.box__label__list .box__container .box__body-mobile .body__dropcon .dropcon__list .list__item.is-actived {
    color: var(--color-brown);
}

/* ------------------------------------------------------------------ */
.box__data__list .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);
    display: grid;
    
    grid-column-gap: 3%;
    grid-row-gap: 80px;
    justify-content: space-between;
    grid-template-columns: repeat(3, minmax(270px, 100%));
    grid-auto-rows: auto;

}

/* ------------------------------------------------------------------ */
/* box__pagination */
.box__pagination .box__container .box__body {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.box__pagination .box__container .box__body .body__circle {
    --circle-w: 45px;
    position: relative;
    width: var(--circle-w);
    height: var(--circle-w);

    display: flex;
    justify-content: center;
    align-items: center;;

    border-radius: 50%;
    overflow: hidden;
    border: 1px solid var(--model-color);

    color: var(--model-color);
    font-size: 18px;

    -webkit-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;
}

.box__pagination .box__container .box__body .body__circle:not(:first-child) {
    margin-left: 10px;
}

.box__pagination .box__container .box__body .body__circle > svg > g {
    fill: var(--model-color);
    -webkit-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;
}

.box__pagination .box__container .box__body .body__circle.is-actived,
.box__pagination .box__container .box__body .body__circle:hover {
    color: #fff;
    background-color: var(--model-color);
}

.box__pagination .box__container .box__body .body__circle:hover {
    transform: scale(1.2);
}

.box__pagination .box__container .box__body .body__circle:hover > svg > g {
    fill: #fff;
}

.box__pagination.first-page .box__container .box__body .btn__left {
    display: none;
}

.box__pagination.last-page .box__container .box__body .btn__right {
    display: none;
}

/* ------------------------------------------------------------------ */
/* box__title__banner2 */
.box__title__banner2.date-to-text .box__container.box__info .info__period {
    display: none;
}

.box__title__banner2.date-to-text .box__container.box__info .info__text {
    display: flex;
    align-items: center;
}

.box__title__banner2 {
    padding: 40px 0 40px 0;
}

.box__title__banner2::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 65%;
    top: 0px;
    background-color: #fff;
}

.box__title__banner2 .box__container.box__info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    margin-bottom: 30px;
}

.box__title__banner2 .box__container.box__info .info__text {
    display: none;
    margin-bottom: 15px;
    font-weight: 400;
}

.box__title__banner2.only-date .box__container.box__info .info__place,
.box__title__banner2.only-date .box__container.box__info .info__period {
    display: none;
}

.box__title__banner2.only-date .box__container.box__info .info__date {
    display: flex;
}

.box__title__banner2 .box__container.box__info .info__status {
    margin-bottom: 15px;
}

.box__title__banner2 .box__container.box__info .info__title {
    margin-bottom: 20px;
}

.box__title__banner2 .box__container.box__info .info__date {
    display: none;
}

.box__title__banner2 .box__container.box__info .info__period {
    --date-bottom: 3px;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    margin-bottom: 15px;
}

.box__title__banner2 .box__container.box__info .info__period .period__date {
    display: flex;
    flex-direction: row;
    align-items: center;

    position: relative;
    bottom: var(--date-bottom);
}

.box__title__banner2 .box__container.box__info .info__period .period__date .date__line {
    margin: 0 10px;
}

.box__title__banner2 .box__container.box__info .info__period .period__date .date__line > span {
    position: relative;
    width: 25px;
    height: 1px;
    display: block;
    background-color: #000;
}

/* 360 - 1024 */
/* margin-left: 4px - 8px; */
.box__title__banner2 .box__container.box__info .info__period .period__date > div .date__day {
    margin-left: 8px;
}

.box__title__banner2 .box__container.box__info .info__period .period__time {
    margin-left: 40px;
    align-self: flex-end;

    position: relative;
    bottom: var(--date-bottom);
}

.box__title__banner2 .box__container.box__info .info__place {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.box__title__banner2 .box__container.box__info .info__text > p,
.box__title__banner2 .box__container.box__info .info__text .text__name,
.box__title__banner2 .box__container.box__info .info__period .period__name,
.box__title__banner2 .box__container.box__info .info__place .place__name,
.box__title__banner2 .box__container.box__info .info__place .place__address {
    font-weight: 400;
}

.box__title__banner2 .box__container.box__info .info__text .text__name,
.box__title__banner2 .box__container.box__info .info__period .period__name,
.box__title__banner2 .box__container.box__info .info__place .place__name {
    margin-right: 20px;
    border: 1px solid #000;
    border-radius: var(--flower-status-radius);
    background-color: #fff;
    position: relative;
}

.box__title__banner2 .box__container.box__info .info__text .text__name > p,
.box__title__banner2 .box__container.box__info .info__period .period__name > p,
.box__title__banner2 .box__container.box__info .info__place .place__name > p {
    position: relative;
    display: flex;
    padding: 2px 16px;
}


.box__title__banner2 .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);
}

.box__title__banner2 .box__container .box__body .body__photo.aspect-ratio {
    --pic-wh-rate: calc(410/820);
    border-radius: var(--img-radius-l);
    overflow: hidden;
}


/* ------------------------------------------------------------------ */
/* box__intro */
.box__intro .box__container .box__body {
    padding: 0 calc(var(--main-inner-padding-side) + var(--main-inner-off-padding-side));
    display: flex;
    flex-direction: column;
    align-items: center;
}

.box__intro .box__container .box__body .body__subtitle {
    margin-top: 5px;
    margin-bottom: 40px;
}


/* ------------------------------------------------------------------ */
/* box__photocon__align 增加 photo-to-con  || con-to-photo */
.box__photocon__align .box__container .box__body {
    --body-con-w: 45%;
    --space-w: 7%;
    --body-photo-w: calc(100% - var(--body-con-w) - var(--space-w));
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    /* align-items: stretch; */
    align-items: center;

    padding: 0 var(--main-inner-padding-side);
}


.box__photocon__align.photo-to-con .box__container .box__body {
    flex-direction: row;
}

.box__photocon__align.con-to-photo .box__container .box__body {
    flex-direction: row-reverse;
}

.box__photocon__align .box__container .box__body > li {
    position: relative;
    flex: 0 0 auto;
}

.box__photocon__align .box__container .box__body > li.body__photo {
    width: var(--body-photo-w)
}

.box__photocon__align .box__container .box__body > li.body__con {
    width: var(--body-con-w);
    align-self: center;
}

.box__photocon__align .box__container .box__body > li.body__photo .photo__img.aspect-ratio {
    --pic-wh-rate: calc(340/410);
    border-radius: var(--img-radius-l);
    overflow: hidden;
}

.box__photocon__align .box__container .box__body > li.body__photo .photo__tips {
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


.box__photocon__align .box__container .box__body > li.body__con > div {
    position: relative;
    width: 100%;
}

.box__photocon__align .box__container .box__body > li.body__con > div.con__title,
.box__photocon__align .box__container .box__body > li.body__con > div.con__subtitle {
    text-align: center;
    letter-spacing: 0.2rem;
}

.box__photocon__align .box__container .box__body > li.body__con > div.con__subtitle {
    margin-top: 5px;
    margin-bottom: 40px;
}

.box__photocon__align .box__container .box__body > li.body__con > div.con__detail {
    text-align: justify;
    display: flex;
    flex-direction: column;
}

.box__photocon__align .box__container .box__body > li.body__con > div.con__btn {
    margin-top: 40px;
}

.box__photocon__align.no-btn .box__container .box__body .body__con .con__btn {
    display: none;
}

.box__photocon__align.no-title .box__container .box__body .body__con .con__subtitle,
.box__photocon__align.no-title .box__container .box__body .body__con .con__title {
    display: none;
}

/* ------------------------------------------------------------------ */
/* box__photo__large */
.box__photo__large2 .box__container .box__body,
.box__photo__large .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);
}

.box__photo__large .box__container .box__body .body__photo.aspect-ratio {
    --pic-wh-rate: calc(380/820);
    border-radius: var(--img-radius-l);
    overflow: hidden;
}

.box__photo__large2 .box__container .box__body .body__photo {
    position: relative;
    display: flex;
    border-radius: var(--img-radius-l);
    overflow: hidden;
}


.box__photo__large2 .box__container .box__body .body__tips,
.box__photo__large .box__container .box__body .body__tips {
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.box__photo__large2 .box__container .box__body.box__btn__more {
    margin-top: 40px;
}

.box__photo__large2.no-btn .box__container .box__body.box__btn__more {
    display: none;
}

/* ------------------------------------------------------------------ */
.box__photo__lightbox {
    --d-width: 90vmin;
    --d-height: 90vmin;
    --d-wh: 80vmin;
    --model-color: var(--color-brown);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    
    z-index: 20000;
    opacity: 0;
    -webkit-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
}

.box__photo__lightbox.is-in {
    opacity: 1;
}

.box__photo__lightbox .box__container {
    position: relative;
    width: 100%;
    height: 100%;    
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    background-color: rgba(0, 0, 0, 0.8);
}

.box__photo__lightbox.is-in .box__container {
	-webkit-animation: backdrop-filter-animation 1s ease-out 0s both;
	        animation: backdrop-filter-animation 1s ease-out 0s both;
}

.box__photo__lightbox .box__container .body__pic {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    -webkit-transition: all .15s ease-out 0s;
    -o-transition: all .15s ease-out 0s;
    -moz-transition: all .15s ease-out 0s;
    transition: all .15s ease-out 0s;
}

.box__photo__lightbox .box__container .body__pic.d-width {
    position: relative;
    width: var(--d-width);
    height: auto;
}

.box__photo__lightbox .box__container .body__pic.d-height {
    position: relative;
    height: var(--d-height);
    width: auto;
}

.box__photo__lightbox .box__container .body__pic.d-wh {
    position: relative;
    width: var(--d-wh);
    height: auto;
}

.box__photo__lightbox .box__container .body__pic > img {
    width: 100%;
    height: 100%;
}

.box__photo__lightbox .box__container .body__pic .pic__tips {
    margin-top: 5px;
    position: relative;
    width: 100%;

    align-self: flex-start;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.box__photo__lightbox .box__container .body__pic .pic__tips.is-none {
    display: none;
}


/* box__intro__photos__slide */
.box__intro__photos__slide .box__container {
    max-width: initial;
    padding: 0 0;
}

.box__intro__photos__slide .box__container .box__body.box__intro {
    max-width: var(--main-max-width);
    padding: 0 calc(var(--main-padding-side) + var(--main-inner-padding-side) + var(--main-inner-off-padding-side));
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 40px;
}

.box__intro__photos__slide .box__container .box__body.box__intro .intro__subtitle {
    margin-top: 5px;
    margin-bottom: 40px;
}

.box__intro__photos__slide .box__container .box__body.box__intro .intro__options {
    display: none;
}

.box__intro__photos__slide .box__container .box__body.box__intro.is-api {
    z-index: 1;
}

.box__intro__photos__slide .box__container .box__body.box__intro.is-api .intro__detail {
    display: none;
}

.box__intro__photos__slide .box__container .box__body.box__intro.is-api .intro__options {
    display: flex;
}


.box__intro__photos__slide .box__container .box__body .splide .splide__slide .slide__con {
    opacity: 0;
    transform: scale(0.5);

    -webkit-transition: all .3s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -o-transition: all .3s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -moz-transition: all .3s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    transition: all .3s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
}

.box__intro__photos__slide .box__container .box__body .splide .splide__slide .slide__con.is-in {
    opacity: 1;
    transform: scale(1);
}

.box__intro__photos__slide .box__container .box__body .splide .splide__slide .slide__con .con__photo.aspect-ratio {
    --pic-wh-rate: calc(310/410);
    border-radius: var(--img-radius-l);
    overflow: hidden;
}

.box__intro__photos__slide .box__container .box__body .splide .splide__slide .slide__con .con__photo {
    pointer-events: auto;
    cursor: pointer;
}

.box__intro__photos__slide .box__container .box__body .splide .splide__slide:hover .slide__con .con__photo > div > img {
    transform: scale(1.1);
}

.box__intro__photos__slide .box__container .box__body .splide .splide__slide .slide__con .con__tips {
    margin-top: 5px;
}

.box__intro__photos__slide .box__container .box__body .splide .splide__slide .slide__con .con__tips > p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



/* ------------------------------------------------------------------ */
/* box__steps__list */
.box__steps__list .box__container .box__body {
    padding: 0 var(--main-inner-padding-side);
    display: flex;
    flex-direction: column;
}

.box__steps__list .box__container .box__body.box__title {
    align-items: center;
}

/* .box__steps__list.is-date .box__container .box__body.box__list .list__item {
    --item-head-w: 100px;
} */

.box__steps__list .box__container .box__body.box__list .list__item {
    --item-head-w: 100px;
    --item-text-w: calc(100% - var(--item-head-w));

    padding: 30px calc( var(--main-inner-off-padding-side));
    display: flex;
    flex-direction: row;
}

.box__steps__list .box__container .box__body.box__list .list__item:not(:last-child) {
    border-bottom: 1px solid var(--color-line-gray);
    box-sizing: border-box;
}

.box__steps__list .box__container .box__body.box__list .list__item > span {
    margin-right: 15px;
    position: relative;
    display: flex;
}

.box__steps__list.is-fwidth .box__container .box__body.box__list .list__item > span {
    flex: 0 0 auto;
    width: var(--item-head-w);
}

.box__steps__list .box__container .box__body.box__list .list__item > a,
.box__steps__list .box__container .box__body.box__list .list__item > div,
.box__steps__list .box__container .box__body.box__list .list__item > p {
    flex: 1 1;
    position: relative;
    display: flex;

    -webkit-transition: all .15s ease-out 0s;
    -o-transition: all .15s ease-out 0s;
    -moz-transition: all .15s ease-out 0s;
    transition: all .15s ease-out 0s;

    /* display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden; */
    /* flex: 0 0 auto;
    width: var(--item-text-w); */
}

.box__steps__list .box__container .box__body.box__list .list__item > a.btn-no-work,
.box__steps__list .box__container .box__body.box__list .list__item > div.btn-no-work,
.box__steps__list .box__container .box__body.box__list .list__item > p.btn-no-work {
    pointer-events: none;
    cursor: default;
}

.box__steps__list .box__container .box__body.box__list .list__item > a:hover,
.box__steps__list .box__container .box__body.box__list .list__item > div:hover,
.box__steps__list .box__container .box__body.box__list .list__item > p:hover {
    color: var(--color-gray-hard2)
}

/* ------------------------------------------------------------------ */
/* box__photos__text__2columns */
.box__photos__text__2columns .box__container .box__body {
    padding: 0 calc(var(--main-inner-padding-side) + var(--main-inner-off-padding-side));
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
}

.box__photos__text__2columns .box__container .box__body .body__item {
    position: relative;
    flex: 0 0 auto;
    width: 47%;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.box__photos__text__2columns .box__container .box__body .body__item .item__intro {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 40px;
}

.box__photos__text__2columns .box__container .box__body .body__item .item__intro .intro__subtitle {
    margin-top: 5px;
    margin-bottom: 40px;
}


.box__photos__text__2columns .box__container .box__body .body__item .item__photo .photo__img.aspect-ratio {
    --pic-wh-rate: calc(275/360);
    border-radius: var(--img-radius-m);
    overflow: hidden;
}

.box__photos__text__2columns .box__container .box__body .body__item .item__photo .photo__tips {
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* ------------------------------------------------------------------ */
/* box__map */
.box__map {
    padding: 80px 0 0 0;
}

.box__map .box__container {
    max-width: initial;
    padding: 0 0;
    overflow: hidden;
}

.box__map .box__container.box__title .marks__tips {
    margin-top: 50px;
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    font-size: 14px;
}

.box__map .box__container.box__title .marks__tips > li {
    position: relative;
    flex: 0 0 auto;
    width: 35%;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.box__map .box__container.box__title .marks__tips > li:not(:first-child) {
    margin-left: 10%;
}

.box__map .box__container.box__title .marks__tips > li > img {
    margin-right: 10px;
    width: 24px;
}

.box__map .box__container .box__body {
    /* touch-action: auto; */
    /* --canvas-map-h: 1000px; */
    --canvas-map-h: 1250px;
    max-width: 1100px;
    width: 100%;
    height: var(--canvas-map-h);
}

.box__map .box__container .box__body.cover-mobile {
    z-index: 1;
    position: absolute;
    width:1023px;
    height: 980px;
    clip-path: polygon(1023px 0px, 1023px 980px, 0px 980px, 0px 0px, 1023px 0px, 735px 1px, 289px 1px, 289px 790px, 735px 790px, 735px 1px); 
}

.box__map .box__container .box__body.info-mobile {
    z-index: 2;
    pointer-events: none;
    position: absolute;
    width: 100%;
    display: flex;
    align-items: flex-end;
    padding: 0 var(--main-padding-side);
}

.box__map .box__container .box__body.info-mobile .body__con {
    pointer-events: auto;
    --now-status-color: var(--color-map-status-activity);
    position: relative;
    width: 100%;
    background-color: #fff;
    border-radius: var(--panel-radius-l);
    border: 1px solid var(--now-status-color);
    box-sizing: border-box;
    overflow: hidden;

    padding: 10px 20px 20px 20px;
    margin-bottom: 30px;
}

.box__map .box__container .box__body.info-mobile .body__con .con__title {
    --btn-close-w: 35px;
    position: relative;
    display: flex;
    justify-content: space-between;
}

.box__map .box__container .box__body.info-mobile .body__con .con__title .title__img {
    flex: 0 0 auto;
    width: calc(100% - var(--btn-close-w));
}

.box__map .box__container .box__body.info-mobile .body__con .con__title .title__img > img {
    width: 220px;
}

.box__map .box__container .box__body.info-mobile .body__con .con__title .title__btn {
    pointer-events: auto;
    cursor: pointer;
    position: relative;
    top: 8px;
    flex: 0 0 auto;
    width: var(--btn-close-w);
    height: var(--btn-close-w);
    border-radius: 50%;
    background-color: var(--now-status-color);
    overflow: hidden;

    display: flex;
    justify-content: center;
    align-items: center;
}

.box__map .box__container .box__body.info-mobile .body__con .con__title .title__btn > img {
    width: 60%;
}

.box__map .box__container .box__body.info-mobile .body__con .con__detail {
    padding: 0px 14px;
    position: relative;
    --fsize: 15px;
    font-size: var(--fsize);
    line-height: calc(var(--fsize) + 8px);
}

.box__map .box__container .box__body.info-mobile .body__con .con__btn {
    pointer-events: auto;
    cursor: pointer;
    margin-top: 10px;
    padding: 0px 14px;
    position: relative;
}

.box__map .box__container .box__body.info-mobile .body__con .con__btn .btn__more {
    position: relative;
    width: 120px;
    padding: 8px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--now-status-color);
    border-radius: var(--btn-radius-m2);
    overflow: hidden;
}

.box__map .box__container .box__body.info-mobile .body__con .con__btn .btn__more > img {
    width: 75px;
}
/* ----------------------------------------------------------------- */
/* box__related__links */
/* .box__related__links {
    margin-bottom: 100px;
} */

.box__related__links .box__container {
    /* max-width: var(--main-max-width2); */
    max-width: initial;
    padding: 0 0;
}

.box__related__links .box__container.box__title {
    margin-bottom: 40px;
}

.box__related__links .box__container .box__body {
    max-width: var(--main-max-width2);
    padding: 0 var(--main-inner-padding-side);
}

.box__related__links .box__container .box__body .body__socials {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.box__related__links .box__container .box__body .body__socials > a:hover {
    background-color: var(--color-gray-hard);
}

.box__related__links .box__container .box__body .body__socials > a {
    position: relative;
    flex: 0 0 auto;
    width: 49%;
    background-color: var(--color-brown);
    display: flex;
    justify-content: center;
    align-items: center;

    padding: 22px 0;
    border-radius: var(--btn-radius-m);
    overflow: hidden;

    -webkit-transition: all .15s ease-out 0s;
    -o-transition: all .15s ease-out 0s;
    -moz-transition: all .15s ease-out 0s;
    transition: all .15s ease-out 0s;
}

.box__related__links .box__container .box__body .body__socials > a > img {
    width: 40%;
}

.box__related__links .box__container .box__body .body__brands {
    margin-top: 20px;
    display: grid;
    grid-row-gap: 20px;
    grid-column-gap: 20px;
    justify-content: space-between;
    grid-template-columns: repeat(3, minmax(260px, 100%));
    grid-auto-rows: auto;
}

.box__related__links .box__container .box__body .body__brands .brands__item {
    display: flex;
    justify-content: center;
    align-items: center;

    border: 1px solid var(--color-gray-hard2-light);
    box-sizing: border-box;
    border-radius: var(--btn-radius-s);
    overflow: hidden;

    /* -webkit-transition: all .15s ease-out 0s;
    -o-transition: all .15s ease-out 0s;
    -moz-transition: all .15s ease-out 0s;
    transition: all .15s ease-out 0s; */
}

.box__related__links .box__container .box__body .body__brands .brands__item:hover > img {
    transform: scale(1.05);
}
/* ------------------------------------------------------------------ */
/* box__ytvideo */
.box__ytvideo .box__container {
    max-width: initial;
    padding: 0 0;
}

/* ------------------------------------------------------------------ */
/* box__title__banner */
.box__title__banner .box__container .body__con > div.effect-bg-center {
    pointer-events: none;
    --rate: 0.85;
    --f-w: calc(263px * var(--rate));
    --f-h: calc(232px * var(--rate));
    position: absolute;
    width: calc(100% + var(--main-padding-side));
    left: calc(-1 * var(--main-padding-side));
    top: 20px;
    overflow: hidden;
    z-index: -1;
}

.box__title__banner .box__container .body__con > div.effect-bg-center > img {
    position: relative;
    width: var(--f-w);
    height: var(--f-h);
    left: calc((100% - var(--f-w))/2 - 50px);
}

/* box__title__banner  date-to-text 日期切換成文字*/
.box__title__banner {
    padding: 40px 0 0 0;
}

.box__title__banner .box__container {
    max-width: initial;
    padding: 0 0;
}

.box__title__banner .box__container .box__body .body__con {
    position: relative;
    max-width: var(--main-max-width);
    padding: 0 var(--main-padding-side);
    margin: 0 auto 70px auto;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
    z-index: 1;
}

.box__title__banner .box__container .box__body .body__con .con__title > h1 {
    margin-bottom: 10px;
}

.box__title__banner .box__container .box__body .body__con .con__title .title__subtext {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.box__title__banner .box__container .box__body .body__con .con__title .title__subtext .title__mark {
    position: relative;
    display: flex;
    align-items: center;
    margin-left: 10px;
    height: 35px;
    width: auto;
}


.box__title__banner .box__container .box__body .body__con .con__title .title__subtext .title__mark > img {
    height: 100%;
    width: auto;
}

.box__title__banner .box__container .box__body .body__con .con__info {
    padding-top: 5px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__date {
    display: flex;
    flex-direction: row;
    align-items: center;
}

/* ------------ */
.box__title__banner .box__container .box__body .body__con .con__info .info__date {
    padding-right: 4px;
    display: flex;
    margin-bottom: 10px;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__text {
    display: none;
}

.box__title__banner.date-to-text .box__container .box__body .body__con .con__info .info__date {
    display: none;
}

.box__title__banner.date-to-text .box__container .box__body .body__con .con__info .info__text {
    padding-right: 4px;
    display: flex;
    margin-bottom: 10px;
    text-align: right;
    position: relative;
    width: max-content;
}
/* ------------ */
.box__title__banner .box__container .box__body .body__con .con__info .info__date .date__line {
    margin: 0 10px;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__date .date__line > span {
    position: relative;
    width: 25px;
    height: 1px;
    display: block;
    background-color: #000;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__date .date__num {
    letter-spacing: 3px;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__date .date__day {
    margin-left: 8px;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__address {
    padding-right: 6px;
    margin-bottom: 20px;

    --fsize2: calc(var(--fsize) - 1px);
    font-size: var(--fsize2);
    font-weight: 400;
    line-height: calc(var(--fsize2) + 5px);
}

.box__title__banner .box__container .box__body .body__con .con__info .info__status {
    position: relative;
    width: max-content;

    display: flex;
    flex-direction: row;
    align-items: center;

    background-color: var(--color-bg-gray2);
    border-radius: var(--crowds-status-radius);
    overflow: hidden;

    padding: 0 4px;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__status > p.status__name {
    flex: 0 0 auto;
    padding: 8px 24px 8px 30px;
}

.box__title__banner .box__container .box__body .body__con .con__info .info__status > p.status__text {
    margin: 3px 0;
    padding: 6px 30px;
    background-color: var(--color-bg-gray);
    border-radius: var(--crowds-status-radius);
    overflow: hidden;
}

.box__title__banner .box__container .box__body .body__banner {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.box__title__banner .box__container .box__body .body__banner::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 8px;
    background-color: var(--model-color);
    bottom: 0;
}

.box__title__banner .box__container .box__body .body__banner img {
    min-width: 1440px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

/* ------------------------------------------------------------------ */
/* box__sheets */
.box__sheets {
    --sheets-item-h: 40px;
    --sticky-top: -40px;
    --padding-top: calc((var(--header-h) - var(--sheets-item-h))/2 - var(--sticky-top));
    /* padding: calc((var(--header-h) - var(--sheets-item-h))/2 - var(--sticky-top)) 0 calc((var(--header-h) - var(--sheets-item-h))/2) 0; */
    padding: var(--padding-top) 0 var(--padding-top) 0;
    position: sticky;
    top: var(--sticky-top);
    z-index: 9999;
}

.box__sheets .box__container {
    max-width: initial;
    padding: 0 0;

    -webkit-transition: all .2s ease-out 0s;
    -o-transition: all .2s ease-out 0s;
    -moz-transition: all .2s ease-out 0s;
    transition: all .2s ease-out 0s;
}

.box__sheets .box__container.is-down {
    transform: translateY(var(--header-h));
}

/* .box__sheets .box__container .splide .splide__list.is-center {
    justify-content: center;
} */

.box__sheets .box__container .splide .splide__slide {
    display: flex;
    justify-content: center;
}

.box__sheets .box__container .splide .splide__slide .slide__item {
    flex: 1 0 auto;

    pointer-events: auto;
    cursor: pointer;
    height: 50px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;

    border: 1px solid rgba(150, 150, 150, 0.2);
    box-sizing: border-box;

    border-radius: var(--btn-radius-s);
    overflow: hidden;

    -webkit-transition: all .15s ease-out 0s;
    -o-transition: all .15s ease-out 0s;
    -moz-transition: all .15s ease-out 0s;
    transition: all .15s ease-out 0s;
}

.box__sheets .box__container .splide .splide__slide .slide__item:hover {
    background-color: var(--color-bg-gray2);
}

.box__sheets .box__container .splide .splide__slide .slide__item.is-actived {
    background-color: var(--model-color);
    color: #fff;
}



/* ------------------------------------------------------------------ */
/* box__info */
.box__info .box__container .box__body {
    --body-detail-w: 45%;
    --space-w: 5%;
    --body-pic-w: calc(100% - var(--body-detail-w) - var(--space-w));
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;

    padding: 0 var(--main-inner-padding-side);
}

.box__info .box__container .box__body > li {
    position: relative;
    flex: 0 0 auto;
}

.box__info .box__container .box__body > li.body__detail {
    width: var(--body-detail-w);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.box__info .box__container .box__body > li.body__detail .detail__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 50px;
}

.box__info .box__container .box__body > li.body__detail .detail__text {
    margin-bottom: 50px;
}

.box__info.no-btn .box__container .box__body > li.body__detail .detail__btn {
    display: none;
}

.box__info .box__container .box__body > li.body__detail .detail__btn {
    margin-bottom: 50px;
    position: relative;
    display: flex;
    width: 100%;
    /* justify-content: flex-start !important; */
}

/* .box__info .box__container .box__body > li.body__detail .detail__btn > a {
    font-size: 16px !important;
    padding: 12px 0px !important;
    max-width: 160px !important;
} */


.box__info .box__container .box__body > li.body__pic.aspect-ratio {
    --pic-wh-rate: calc(380/510);
    --pic-w: var(--body-pic-w);

    left: 0;
    transform: initial;
    -webkit-transform: initial;
    -moz-transform: initial;
    -ms-transform: initial;
    -o-transform: initial;
}

.box__info .box__container .box__body > li.body__pic.aspect-ratio > div > img {
    border-radius: var(--img-radius-l);
    overflow: hidden;
}

/* ------------------------------------------------------------------ */
@-webkit-keyframes border-radius-in {
    0% {
        border-radius: 50%;
    }
    100% {
        border-radius: 0%;
    }
}

@keyframes border-radius-in {
    0% {
        border-radius: 50%;
    }
    100% {
        border-radius: 0%;
    }
}
/* box__events__slide */
.box__events__slide.no-btn .box__container.box__btn__more {
    display: none;
}

.box__events__slide .box__container {
    max-width: initial;
    padding: 0 0;
}


.box__events__slide .box__container.box__btn__more {
    margin-top: 20px;
}

.box__events__slide .box__container .splide {
    padding: 50px 0;
}

.box__events__slide .box__container .splide .splide__slide {
    position: relative;
    display: flex;
    justify-content: center;
}

.box__data__list .box__container {
    min-height: 200px;
}

.box__data__list .box__container .box__body .body__item {
    --item-w: 100%;
    position: relative;
    width: var(--item-w);
    height: var(--item-w);
    /* 手機版 safari 不支援 動態 overflow：hidden 遮照 可改用 clip-path */
    /* overflow: hidden; */
    border-radius: 50%;

    transform: scale(0);

    -webkit-transition: all .4s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -o-transition: all .4s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    -moz-transition: all .4s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
    transition: all .4s cubic-bezier(0.175, 0.885, 0.320, 1.275) 0s;
}

.box__data__list .box__container .box__body .body__item::after {
    pointer-events: none;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    background-color: var(--color-brown);
    opacity: 1;

    -webkit-transition: all .2s ease-out 0.1s;
    -o-transition: all all .2s ease-out 0.1s;
    -moz-transition: all .2s ease-out 0.1s;
    transition: all .2s ease-out 0.1s;
}

.box__data__list .box__container .box__body .body__item.is-in::after {
    opacity: 0;
}

.box__data__list .box__container .box__body .body__item.is-in {
    --item-w: 100%;
    border-radius: 50%;
    transform: scale(1);

	-webkit-animation: border-radius-in 0.3s ease-out 0.2s both;
	        animation: border-radius-in 0.3s ease-out 0.2s both;
}

.box__data__list .box__container .box__body .body__item .item__con .con__pic:hover > img,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__pic:hover > img {
    transform: scale(1.1);
}

.box__data__list .box__container .box__body .body__item .item__con .con__pic > img,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__pic > img {
    transform: scale(1);
}


.box__data__list .box__container .box__body .body__item,
.box__events__slide .box__container .splide .splide__slide {
    position: relative;
    cursor: default;
}

.box__data__list .box__container .box__body .body__item .item__con .con__pic,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__pic {
    aspect-ratio: 544/416;
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.box__data__list .box__container .box__body .body__item .item__con .con__pic > img,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__pic > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.box__data__list .box__container .box__body .body__item .item__con,
.box__events__slide .box__container .splide .splide__slide .slide__con {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.box__data__list .box__container .box__body .body__item .item__con .con__pic,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__pic {
    border-radius: var(--img-radius-s);
    overflow: hidden;
    margin-bottom: 8px;
}

.box__data__list .box__container .box__body .body__item .item__con .con__date,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__date {
    margin-bottom: 6px;
    min-height: calc(var(--fsize) + 6px);
}

.box__data__list .box__container .box__body .body__item .item__con .con__title,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__title {
    margin-bottom: 20px;
    --fsize: 16px;
    /* 兩杭 */
    min-height: calc((var(--fsize) + 6px)* 2);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;

}

.box__data__list .box__container .box__body .body__item .item__con .con__status,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__status {
    /* --flower-color: var(--color-event-red-light); */
    --flower-color: var(--color-gray-hard2) !important;
}

.box__data__list .box__container .box__body .body__item .item__con .con__status:hover,
.box__events__slide .box__container .splide .splide__slide .slide__con .con__status:hover {
    color: var(--color-brown);
    border: 1px solid var(--color-brown);
}

/* ------------------------------------------------------------------ */
/* box__text__bg */
.box__text__bg {
    --panel-margin-top: 15%;
}

.box__text__bg .box__container {
    max-width: initial;
    padding: 0 0;
}

.box__text__bg .box__container .box__bg {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;

    display: flex;
    align-items: flex-start;
}

.box__text__bg .box__container .box__bg picture {
    position: relative;
    display: flex;
    width: 100%;
}

.box__text__bg .box__container .box__body {
    margin-top: var(--panel-margin-top);
    position: relative;
    width: var(--main-width);
    max-width: var(--main-max-width);

    /* padding: 0 var(--main-inner-padding-side); */
    padding: 0 calc(var(--main-padding-side) + var(--main-inner-padding-side));
}

.box__text__bg .box__container .box__body .body__panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #fff;
    border-radius: var(--panel-radius-l);
    overflow: hidden;
    padding: 70px;
}

.box__text__bg .box__container .box__body .body__panel .panel__title {
    display: flex;
    flex-direction: column;
    align-items: center;

    margin-bottom: 50px;
}

/* ------------------------------------------------------------------ */
/* box__photos__text__slide */
.box__photos__text__slide .box__container {
    max-width: initial;
    padding: 0 0;
}

.box__photos__text__slide .box__container .splide {
    padding: 50px 0;
}

.box__photos__text__slide .box__container .splide .splide__slide:hover .slide__con .con__pic.aspect-ratio > div > img {
    transform: scale(1.1);
}

.box__photos__text__slide .box__container .splide .splide__slide .slide__con {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.box__photos__text__slide .box__container .splide .splide__slide .slide__con .con__pic {
    margin-bottom: 20px;
}

.box__photos__text__slide .box__container .splide .splide__slide .slide__con .con__pic.aspect-ratio {
    --pic-wh-rate: calc(280/240);
}

.box__photos__text__slide .box__container .splide .splide__slide .slide__con .con__pic.aspect-ratio > div {
    /* border-radius: 320px; */
    border-radius: 500px;
    overflow: hidden;
}

.box__photos__text__slide .box__container .splide .splide__slide .slide__con .con__pic.aspect-ratio > div > img {
    transform: scale(1);
}

.box__photos__text__slide .box__container .splide .splide__slide .slide__con .con__title {
    margin-bottom: 30px;
}

.box__photos__text__slide .box__container .splide .splide__slide .slide__con .con__detail {
    text-align: justify;
    line-height: calc(var(--fsize) + 5px);
}

/* ------------------------------------------------------------------ */
/* box__flower__photos__slide */
.box__flower__photos__slide .box__container {
    max-width: initial;
    padding: 0 0;
}

.box__flower__photos__slide .box__container .splide {
    padding: 50px 0;
}



/* ------------------------------------------------------------------ */
/* box__news */
.box__news .box__container .box__body {
    --main-w: 36%;
    --space-w: 5%;
    --con-w: calc(100% - var(--main-w) - var(--space-w));
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;

    padding: 0 var(--main-inner-padding-side);
}

.box__news .box__container.box__title {
    margin-bottom: 40px;
}

.box__news .box__container .box__body > ul {
    position: relative;
    flex: 0 0 auto;
}

.box__news .box__container .box__body > ul.body__main {
    width: var(--main-w);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.box__news .box__container .box__body > ul.body__main .main__con {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.box__news .box__container .box__body > ul.body__main .main__pic.aspect-ratio {
    /* --pic-wh-rate: calc(208/382); */
    /* --pic-wh-rate: calc(240/380); */
    --pic-wh-rate: calc(416/544);
    margin-bottom: 10px;

    overflow: hidden;
    border-radius: 10px;
}

.box__news .box__container .box__body > ul.body__main .main__pic.aspect-ratio > div > img {
    border-radius: var(--img-radius-m);
    overflow: hidden;
}

.box__news .box__container .box__body > ul.body__main .main__title {
    margin-bottom: 25px;
    -webkit-transition: all .2s ease-out 0s;
    -o-transition: all .2s ease-out 0s;
    -moz-transition: all .2s ease-out 0s;
    transition: all .2s ease-out 0s;
}

.box__news .box__container .box__body > ul.body__main .main__status {
    --flower-color: var(--color-event-red-light);
}

.box__news .box__container .box__body > ul.body__main .main__status:hover {
    color: var(--color-brown);
    border: 1px solid var(--color-brown);
}

.box__news .box__container .box__body > ul.body__con {
    width: var(--con-w);
}

.box__news .box__container .box__body > ul.body__con .con__list .list__item {
    --date-w: 100px;
    --space-w: 6%;
    --text-w: calc(100% - var(--date-w) - var(--space-w));
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;

    margin-top: 15px;
    padding: 0 20px 15px 20px;

    -webkit-transition: all .2s ease-out 0s;
    -o-transition: all .2s ease-out 0s;
    -moz-transition: all .2s ease-out 0s;
    transition: all .2s ease-out 0s;
}

.box__news .box__container .box__body > ul.body__main .main__con .main__pic:hover > div > img {
    transform: scale(1.1);
}

/* .box__news .box__container .box__body > ul.body__main .main__con:hover .main__title, */
.box__news .box__container .box__body > ul.body__con .con__list .list__item:hover {
    color: var(--color-gray-hard2)
}

.box__news .box__container .box__body > ul.body__con .con__list .list__item:not(:last-child) {
    border-bottom: 1px solid var(--color-line-gray);
    box-sizing: border-box;
}

.box__news .box__container .box__body > ul.body__con .con__list .list__item > p {
    position: relative;
    flex: 0 0 auto;
}

.box__news .box__container .box__body > ul.body__con .con__list .list__item .item__date { 
    width: var(--date-w);
    margin-right: var(--space-w);
}

.box__news .box__container .box__body > ul.body__con .con__list .list__item .item__text {
    width: var(--text-w);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.box__news .box__container .box__body > ul.body__con .con__btn {
    margin-top: 40px;
}
/* ------------------------------------------------------------------ */
/* box__circle__photos__slide */
.box__circle__photos__slide .box__container {
    --fsize: 16px;
    --line-height: calc(var(--fsize) + 6px);
    --off-bottom: 60px;
    --circle-w: 50px;
    max-width: initial;
    padding: 0 0;
    overflow: hidden;
}

.box__circle__photos__slide .box__container::before {
    content: "";
    position: absolute;
    width: 100vw;
    height: 1px;
    top: calc(50% - var(--off-bottom) / 2);
    background-color: var(--model-color);
}

.box__circle__photos__slide .box__container .splide::before,
.box__circle__photos__slide .box__container .splide::after {
    content: "";
    position: absolute;
    width: var(--circle-w);
    height: var(--circle-w);
    top: calc(50% - var(--off-bottom) / 2);
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);


    background-color: var(--model-color);
    border-radius: 50%;

    z-index: 10;
}

.box__circle__photos__slide .box__container .splide::before {
    left: calc(-1 * var( --circle-w)/2);
}
.box__circle__photos__slide .box__container .splide::after {
    right: calc(-1 * var( --circle-w)/2);
}

.box__circle__photos__slide .box__container .splide .splide__slide {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    position: relative;

    padding: 0 0 calc(var(--off-bottom)) 0;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con {
    /* pointer-events: auto;
    cursor: pointer; */
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con .con__img {
    position: relative;
    /* 需要按照比例 在 1024:3 1200:4 1400:5 1600:6 需要呈現的數量 */
    /* 需要以此造成整個置中 max-width 200px */
    /* 超過補上假的小球 */
    border-radius: 50%;
    overflow: hidden;

    -webkit-transition: all .4s ease-in-out 0s;
    -o-transition: all .4s ease-in-out 0s;
    -moz-transition: all .4s ease-in-out 0s;
    transition: all .4s ease-in-out 0s;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con .con__img::after {
    pointer-events: none;
    content: "More";
    position: absolute;
    width: 0%;
    height: 0%;
    top: 50%;
    left: 50%;
    background-color: rgba(0,0,0,0.5);

    -webkit-transition: all .3s ease-in-out 0s;
    -o-transition: all .3s ease-in-out 0s;
    -moz-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s;

    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    border-radius: 50%;

    display: flex;
    justify-content: center;
    align-items: center;

    color: rgba(255, 255, 255, 0);
    font-family: 'Barlow';
    font-size: 18px;
    font-weight: 500;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con .con__img:hover::after {
    color: rgba(255, 255, 255, 1);
    width: 100%;
    height: 100%;
}

/* ----- */
.box__circle__photos__slide .box__container .splide .splide__slide .slide__con.is-zoom-in .con__img {
    width: 100%;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con.is-zoom-in .con__text {
    opacity: 1;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con.is-zoom-out .con__img {
    width: 15%;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con.is-zoom-out .con__text {
    opacity: 0;
}
/* ----- */

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con .con__text {
    position: absolute;
    min-height: 55px;
    /* bottom: calc(-1 * 40px); */
    /* bottom: calc(-1 * 20px); */
    top: calc(50%);

    -webkit-transition: opacity .2s ease-in-out 0.2s;
    -o-transition: opacity .2s ease-in-out 0.2s;
    -moz-transition: opacity .2s ease-in-out 0.2s;
    transition: opacity .2s ease-in-out 0.2s;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__con .con__text > p {
    font-size: var(--fsize);
    line-height: var(--line-height);
    text-align: center;

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__circles {
    display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__circles .circles__item {
    position: relative;
    width: 15px;
    height: 15px;
    display: block;
    background-color: var(--model-color);
    border-radius: 50%;
    margin: 0 10px;

    -webkit-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__circles .circles__item.is-size4 {
    width: 35px;
    height: 35px;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__circles .circles__item.is-size3 {
    width: 30px;
    height: 30px;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__circles .circles__item.is-size2 {
    width: 25px;
    height: 25px;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__circles .circles__item.is-size1 {
    width: 20px;
    height: 20px;
}

.box__circle__photos__slide .box__container .splide .splide__slide .slide__circles .circles__item.is-size0 {
    /* width: 15px;
    height: 15px; */
    width: 10px;
    height: 10px;
}

.box__circle__photos__slide .box__container .splide__paginate {
    position: absolute;
    width: 100%;
    bottom: 0.5em;
    display: flex;
    justify-content: center;
    z-index: 20;
}

.box__circle__photos__slide .box__container .splide__paginate .page__point {
    pointer-events: auto;
    cursor: pointer;
    position: relative;
    width: 12px;
    height: 12px;
    background-color: var(--color-gray-hard);
    border-radius: 50%;
}

.box__circle__photos__slide .box__container .splide__paginate .page__point::after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    top: 50%;
    left: 50%;

    -webkit-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;

    transform: translate(-50%, -50%) scale(0);
    -webkit-transform: translate(-50%, -50%) scale(0);
    -moz-transform: translate(-50%, -50%) scale(0);
    -ms-transform: translate(-50%, -50%) scale(0);
    -o-transform: translate(-50%, -50%) scale(0);

    border: 1px solid var(--color-gray-hard);
    box-sizing: border-box;
}

.box__circle__photos__slide .box__container .splide__paginate .page__point:hover::after {
    transform: translate(-50%, -50%) scale(1);
}

.box__circle__photos__slide .box__container .splide__paginate .page__point:not(:first-child) {
    margin-left: 10px;
}

.box__circle__photos__slide .box__container .splide__paginate .page__point.is-actived {
    background-color: var(--model-color);
}

.box__circle__photos__slide .box__container .splide__paginate .page__point.is-actived::after {
    border: 1px solid var(--model-color);
    transform: translate(-50%, -50%) scale(1);
}
/* ----------------------------------------------------------------- */
/* box__index__kv */

.box__index__kv {
    margin-top: calc(-1 * var(--header-h));
    padding: 0 0;
}

.box__index__kv .box__container.box__bg {
    position: absolute;
    width: 100%;
    height: 650px;
    background: url(../images/index/index-kv/index-kv-bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.box__index__kv .box__container.box__title {
    max-width: var(--main-max-width);
    padding: calc(100px + var(--header-h)) calc(var(--main-padding-side) * 1.5) 40px calc(var(--main-padding-side) * 1.5);
    align-items: flex-start;
    justify-content: initial;
}

.box__index__kv .box__container.box__subtitle {
    position: relative;
    width: 860px;
    align-items: initial;
    justify-content: flex-end;
}

.box__index__kv .box__container.box__title > img {
    width: 289px;
}

.box__index__kv .box__container.box__subtitle > img {
    width: 440px;
}

.box__index__kv .box__container.box__link {
    padding: 80px 0 100px 0;
}

.box__index__kv .box__container.box__link > div.effect-bg-center {
    pointer-events: none;
    --rate: 0.85;
    --f-w: calc(610px * var(--rate));
    --f-h: calc(350px * var(--rate));
    position: absolute;
    width: calc(100% + var(--main-padding-side));
    left: calc(-1 * var(--main-padding-side));
    top: 15px;
    overflow: hidden;
    z-index: 1;
}

.box__index__kv .box__container.box__link > div.effect-bg-center > img {
    position: relative;
    width: var(--f-w);
    height: var(--f-h);
    /* left: calc((100% - var(--f-w))/2 - 50px); */
    left: calc((100% - var(--f-w))/2 - 400px);
}

.box__index__kv .box__container.box__link .link__btn {
    position: relative;
    background-color: var(--color-brown);
    border-radius: var(--btn-radius-m);
    padding: 20px min(6%, 100px);
    overflow: hidden;
    z-index: 2;
}

.box__index__kv .box__container.box__link .link__btn > picture {
    display: flex;
    justify-content: center;
}

.box__index__kv .box__container.box__link .link__btn img {
    width: 90%;
}

.box__other__info__slide .box__container .splide__arrows,
.box__index__kv .box__container .splide__arrows {
    --circle-w: 60px;
    pointer-events: none;
    position: absolute;
    width: 100%;
    max-width: 990px;
    height: 100%;

    padding: 50px 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    z-index: 1;
}

.box__other__info__slide .box__container .splide__arrows.is-none,
.box__index__kv .box__container .splide__arrows.is-none {
    display: none;
}

.box__other__info__slide .box__container .splide__arrows > li,
.box__index__kv .box__container .splide__arrows > li {
    pointer-events: auto;
    cursor: pointer;
    flex: 0 0 auto;
    position: relative;
    width: var(--circle-w);
    height: var(--circle-w);
    border-radius: 50%;
    background-color: var(--model-color);
    display: flex;
    justify-content: center;
    align-items: center;

    -webkit-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -moz-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s;
}

.box__index__kv .box__container .splide__arrows > li.arrow__left.is-not-work,
.box__index__kv .box__container .splide__arrows > li.arrow__right.is-not-work,
.box__other__info__slide .box__container .splide__arrows > li.arrow__left.is-not-work,
.box__other__info__slide .box__container .splide__arrows > li.arrow__right.is-not-work {
    pointer-events: none;
    cursor: default;
    background-color: var(--color-gray-hard);
    transform: scale(1);
}

.box__other__info__slide .box__container .splide__arrows > li > img,
.box__index__kv .box__container .splide__arrows > li > img {
    width: 15px;
}

/* ----------------------------------------------------------------- */
/* box__other__info__slide */
.box__other__info__slide.no-crowds .box__container .splide .slide__con .con__status {
    display: none !important;
}

.box__other__info__slide.no-crowds .box__container .splide .slide__con .con__info {
    margin-top: 30px;
}

.box__index__kv .box__container,
.box__other__info__slide .box__container {
    max-width: initial;
    padding: 0 0;

    display: flex;
    flex-direction: row;
    justify-content: center;
}


.box__index__kv .box__container .splide,
.box__other__info__slide .box__container .splide {
    width: 860px;
    padding: 50px 0;
}

.box__index__kv .box__container .splide .splide__slide .slide__con,
.box__other__info__slide .box__container .splide .splide__slide .slide__con {
    position: relative;
    padding: 10px;
    background-color: #fff;
    border-radius: var(--panel-radius-m);
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__pic.aspect-ratio,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__pic.aspect-ratio {
    --pic-wh-rate: calc(110/180);
    margin-bottom: 10px;
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__pic.aspect-ratio > div img,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__pic.aspect-ratio > div img {
    border-radius: var(--img-radius-ss);
    overflow: hidden;
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__title,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__title {
    margin-bottom: 10px;
    font-weight: 500;
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__date,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__date {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;

    margin-bottom: 10px;
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__date .date__data,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__date .date__data {
    font-weight: 500;
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__status,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__status {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;

    margin-bottom: 10px;   
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__status .date__data,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__status .date__data {
    padding: 6px 30px;
    border-radius: var(--crowds-status-radius);
    overflow: hidden;
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__info,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__info {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    padding: 12px 0;
    border: 1px solid var(--color-line-gray);
    box-sizing: border-box;

    -webkit-transition: all .15s ease-out 0s;
    -o-transition: all .15s ease-out 0s;
    -moz-transition: all .15s ease-out 0s;
    transition: all .15s ease-out 0s;
}

.box__index__kv .box__container .splide .splide__slide .slide__con .con__info:hover,
.box__other__info__slide .box__container .splide .splide__slide .slide__con .con__info:hover {
    color: #fff;
    background-color: #000
}
/* ----------------------------------------------------------------- */
/* box__traffic__info */
.box__traffic__info .box__container {
    align-items: center;
}

.box__traffic__info .box__container > ul {
    --body-info-top: 22px;
    position: relative;
    width: 100%;
    /* width: 75%;
    min-width: 900px; */
    padding: 0 var(--main-inner-padding-side);
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}

.box__traffic__info .box__container > ul:first-child {
    margin-bottom: 40px;
}

.box__traffic__info .box__container > ul > li:first-child {
    display: flex;
    flex-direction: row;
    align-items: center;

    padding: 12px 26px;
    background-color: #fff;
    border: 1px solid var(--model-color);
    box-sizing: border-box;

    border-radius: var(--panel-radius-m);
    overflow: hidden;
}

.box__traffic__info .box__container > ul .mrt__icon > img,
.box__traffic__info .box__container > ul .bus__icon > img {
    width: 45px;
}

.box__traffic__info .box__container > ul .mrt__info,
.box__traffic__info .box__container > ul .bus__info {
    position: relative;
    width: 100%;
    margin-top: var(--body-info-top);
    margin-left: 50px;
}

.box__traffic__info .box__container > ul .bus__info > ul:not(:first-child) {
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid var(--color-line-gray);
    box-sizing: border-box;
}

.box__traffic__info .box__container > ul .bus__info .info__con .con__list {
    margin-top: 20px;
    display: grid;
    grid-row-gap: 15px;
    grid-column-gap: 15px;
    grid-template-columns: repeat(4, minmax(150px, 100%));
    grid-auto-rows: auto;
}

.box__traffic__info .box__container > ul .bus__info .info__line {
    position: relative;
    width: 100%;
    
}

.box__traffic__info .box__container > ul .bus__info .info__line > span::after {
    --off-w: 30px;
    content: "";
    position: relative;
    width: calc(100% + var(--off-w));
    height: 1px;
    left: calc(-1 * var(--off-w));
    display: flex;
    background-color: var(--color-line-gray);
}

.box__traffic__info .box__container > ul.body__btn {
    margin-top: 60px;
}

/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */
@media only screen and (min-width:360px) {
    .box__search__result .box__container .box__body {
        padding: 0 0;
    }

    .box__search__result .gsc-tabHeader {
        width: 50% !important;
    }

    .box__search__result .gsc-table-cell-snippet-close, 
    .box__search__result .gs-promotion-text-cell {
        margin-top: 15px;
    }


    .box__search__result .gsc-control-cse {
        padding: 0em;
    }

    .box__search__result .gs-web-image-box {
        width: 100% !important;
    }

    .box__search__result .gs-web-image-box, 
    .box__search__result .gs-promotion-image-box {
        float: initial !important;
        margin-left: 0px !important;
    }

    .box__search__result .gs-web-image-box .gs-image {
        max-width: initial !important;
        max-height: initial!important;
        width: 99.9% !important;
        height: 200px !important;
    }

    .box__search__result .gsc-control-cse, 
    .box__search__result .gsc-control-cse .gsc-table-result {
        font-size: 14px;
        line-height: 22px;
    }

    .box__search__result .gsc-results .gsc-cursor-box {
        border-top: initial !important;
        border: initial !important;
        /* border: 1px solid #dfe1e5!important; */
        padding: 0px 0;

        display: flex;
        justify-content: center;
    }

    section.box__search__result .box__container .box__body {
        min-height: var(--sr-body-100-min-h);
    }

    section.box__search__result > div.effect-bg-bottom.is-effect-pc {
        display: flex;
    }


    .box__flower__photos__slide .box__container.box__title {
        padding-bottom: 0px;
    }

    /* box__photo__lightbox */
    .box__photo__lightbox {
        --d-width: 90vmin;
        --d-height: 125vmin;
        --d-wh: 90vmin;
    }

    /* ------------------------------------------------------------------ */
    /* box__lyrics */
    .box__lyrics .box__container.box__title {
        margin-bottom: 0px;
    }

    .box__lyrics .box__container .box__body {
        padding: 0 0;
        flex-direction: column;
        justify-content: initial;
        align-items: initial;
    }
    
    .box__lyrics .box__container .box__body > li.box__con {
        width: 100%;
    }
    
    .box__lyrics .box__container .box__body > li.box__con .con__content {
        flex-direction: column;
        justify-content: initial;
    }

    .box__lyrics .box__container .box__body > li.box__con .con__content > li:first-child {
        margin-right: 0%;
    }
    
    .box__lyrics .box__container .box__body > li.box__photo.aspect-ratio {
        margin-top: 50px;
        --pic-w: 100%;
    }
    /* ------------------------------------------------------------------ */
    /* box__intro__icons */
    .box__intro__icons .box__container .box__body {
        padding: 0 0;
    }

    .box__intro__icons .box__container .box__body .body__item .item__icon {
        display: none;
    }
    
    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__photo-mobile,
    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__title .title__icon-mobile {
        display: flex;
    }

    .box__intro__icons .box__container .box__body .body__item .item__detail {
        width: 100%;
        padding-right: 0;
    }

    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__photo-mobile.aspect-ratio {
        --pic-wh-rate: calc(500/500);
        --pic-w: 80%;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }

    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__title {
        margin-bottom: 0px;
    }

    /* ------------------------------------------------------------------ */
    /* box__text__bg2 */
    .box__text__bg2 {
        height: 1200px;
        background: url(../images/text-bg2/text-bg2-bg-s.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .box__text__bg2 .box__container .box__body {
        padding: 0 0;
    }
    /* ------------------------------------------------------------------ */
    /* box__intro__text2 */
    .box__intro__text2 .box__container .box__body > img {
        width: 100%;
    }

    .box__intro__text2 .box__container .box__body.is-text2 {
        padding: 0 0;
        flex-direction: column;
        justify-content: initial;
        align-items: initial;
    }

    .box__intro__text2 .box__container .box__body.is-text2 .body__con {
        width: 100%;
    }

    .box__intro__text2 .box__container .box__body.is-text2 .body__con.body__left {
        margin-bottom: 80px;
    }

    /* box__intro__video */
    .box__intro__video .box__container .box__body.aspect-ratio {
        --pic-w: calc(100%);
    }
    /* ------------------------------------------------------------------ */
    /* box__ytvideo */
    .box__ytvideo .box__container {
        max-width: initial;
        padding: 0 0;
    }

    .box__ytvideo .box__container .box__body .embed-responsive-item.embed-responsive::before {
        padding-top: 75%;
    }
    
    /* ----------------------------------------------------------------- */
    /* box__pagination */
    .box__pagination .box__container .box__body .body__circle {
        --circle-w: 35px;
        font-size: 14px;
    }

    .box__pagination .box__container .box__body .body__circle > svg {
        width: 13px;
    }
    /* ----------------------------------------------------------------- */
    /* box__data__list */
    .box__videos__list .box__container .box__body,
    .box__downloads__list .box__container .box__body,
    .box__data__list .box__container .box__body {
        padding: 0 0;
        grid-column-gap: 0%;
        grid-row-gap: 50px;
        grid-template-columns: repeat(1, minmax(270px, 100%));
    }
    
    /* box__label__list */
    .box__label__list .box__container .box__space-mobile,
    .box__label__list .box__container .box__body-mobile {
        display: flex;
    }

    .box__label__list .box__container .box__body {
        width: 100%;
        display: none;
    }
    /* ----------------------------------------------------------------- */
    /* box__title__banner2 */
    .box__title__banner2 .box__container {
        padding: 0 0;
    }

    .box__title__banner2 .box__container.box__info {
        padding: 0 var(--main-padding-side);
    }

    .box__title__banner2 .box__container .box__body {
        padding: 0 0;
    }

    .box__title__banner2 .box__container.box__info .info__period {
        /* flex-direction: column; */
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .box__title__banner2 .box__container.box__info .info__period .period__date {
        margin-bottom: 10px;
    }

    .box__title__banner2 .box__container.box__info .info__period .period__time {
        margin-left: 86px;
        align-self: initial;
    }

    .box__title__banner2 .box__container .box__body .body__photo.aspect-ratio {
        /* --pic-wh-rate: calc(700/820); */
        border-radius: 0;
    }

    /* ----------------------------------------------------------------- */
    .box__intro .box__container .box__body {
        padding: 0 0;
    }
    /* ----------------------------------------------------------------- */
    /* box__photocon__align */
    .box__photocon__align .box__container {
        padding: 0 0;
    }

    .box__photocon__align .box__container .box__body {
        padding: 0 0;
    }

    .box__photocon__align .box__container .box__body > li.body__photo .photo__img.aspect-ratio {
        /* --pic-wh-rate: calc(340/410); */
        border-radius: 0;
    }

    .box__photocon__align .box__container .box__body .body__con {
        padding: 0 var(--main-padding-side);
    }

    .box__photocon__align .box__container .box__body > li.body__photo .photo__tips {
        padding-left: var(--main-padding-side);
    }

    .box__photocon__align.photo-to-con .box__container .box__body {
        flex-direction: column;
    }
    
    .box__photocon__align.con-to-photo .box__container .box__body {
        flex-direction: column;
    }

    .box__photocon__align .box__container .box__body > li.body__photo {
        width: 100%;
        margin-bottom: 20px;
    }
    
    .box__photocon__align .box__container .box__body > li.body__con {
        width: 100%;
    }

    /* ----------------------------------------------------------------- */
    /* box__photo__large */
    .box__photo__large .box__container {
        padding: 0 0;
    }
    
    .box__photo__large2 .box__container .box__body,
    .box__photo__large .box__container .box__body {
        padding: 0 0;
    }

    .box__photo__large .box__container .box__body .body__photo.aspect-ratio {
        /* --pic-wh-rate: calc(700/820); */
        border-radius: 0;
    }

    .box__photo__large2 .box__container .box__body .body__tips,
    .box__photo__large .box__container .box__body .body__tips {
        margin-left: var(--main-padding-side);
    }

    /* ----------------------------------------------------------------- */
    /* box__intro__photos__slide */
    .box__intro__photos__slide .box__container .box__body.box__intro {
        /* padding: 0 0; */
        padding: 0px var(--main-padding-side) 0px var(--main-padding-side);
    }
    
    .box__intro__photos__slide .box__container .box__body.box__intro.is-api {
        margin-bottom: calc(40px + 54px);
    }

    .box__intro__photos__slide .box__container .box__body.box__intro.is-api .intro__options {
        display: flex;
        width: calc(100%);
        right: initial;
        /* top: calc(54px + 40px); */
        bottom: -2.5em;
    }

    /* ----------------------------------------------------------------- */
    /* box__steps__list */
    .box__steps__list .box__container .box__body {
        padding: 0 0;
    }
    
    .box__steps__list .box__container .box__body.box__list .list__item {
        padding: 30px 0;
        flex-direction: column;
    }

    /* .box__steps__list .box__container .box__body.box__list .list__item > span {
        width: 100%;
    }
    
    .box__steps__list .box__container .box__body.box__list .list__item > div,
    .box__steps__list .box__container .box__body.box__list .list__item > p {
        width: 100%;
    } */

    /* box__photos__text__2columns */
    .box__photos__text__2columns .box__container {
        padding: 0 0;
    }

    .box__photos__text__2columns .box__container .box__body {
        padding: 0 0;
        flex-direction: column;
        justify-content: initial;
        align-items: initial;
    }

    .box__photos__text__2columns .box__container .box__body .body__item {
        width: 100%;
    }

    .box__photos__text__2columns .box__container .box__body .body__item:first-child {
        margin-bottom: 60px;
    }

    .box__photos__text__2columns .box__container .box__body .body__item .item__intro {
        padding: 0 var(--main-padding-side);
    }

    .box__photos__text__2columns .box__container .box__body .body__item .item__photo .photo__img.aspect-ratio {
        border-radius: 0;
    }

    /* ----------------------------------------------------------------- */
    /* box__map */
    .box__map .box__container .box__body {
        --canvas-map-h: 980px;
    }

    .box__map .box__container.box__title {
        padding: 20px 0 20px 0;
    }

    .box__map .box__container .box__body.cover-mobile,
    .box__map .box__container .box__body.info-mobile {
        display: flex;
    }

    .box__map .box__container .box__body.cover-mobile {
        width:1023px;
        height: 784px;
        clip-path: polygon(1023px 0px, 1023px 784px, 0px 784px, 0px 0px, 1023px 0px, 612px 70px, 377px 70px, 377px 637px, 612px 637px, 612px 70px); 
    }

    /* ----------------------------------------------------------------- */
    /* box__related__links */
    .box__related__links .box__container.box__title {
        margin-bottom: 0px;
    }

    .box__related__links .box__container {
        padding: 0 var(--main-padding-side);
    }

    .box__related__links .box__container .box__body {
        padding: 0 0;
    }

    .box__related__links .box__container .box__body .body__socials {
        flex-direction: column;
        justify-content: initial;
        align-items: initial;
    }

    .box__related__links .box__container .box__body .body__socials > a {
        width: 100%;
    }

    .box__related__links .box__container .box__body .body__socials > a:first-child {
        margin-bottom: 10px;
    }

    .box__related__links .box__container .box__body .body__brands {
        margin-top: 10px;
        grid-row-gap: 10px;
        grid-column-gap: 10px;
        grid-template-columns: repeat(2, minmax(140px, 100%));
    }

    /* ----------------------------------------------------------------- */
    /* box__index__kv */
    .box__index__kv .box__container.box__bg {
        background: url(../images/index/index-kv/index-kv-bg-s.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .box__index__kv .box__container.box__link > div.effect-bg-center > img {
        left: calc((100% - var(--f-w))/2 - 300px);
    }

    .box__index__kv .box__container.box__title {
        margin-bottom: 150px;
    }

    .box__index__kv .box__container.box__title > img {
        width: 210px;
    }

    .box__index__kv .box__container.box__subtitle {
        display: none;
    }

    .box__other__info__slide .box__container .splide__arrows,
    .box__index__kv .box__container .splide__arrows {
        --circle-w: 60px;
        top: -80px;
        justify-content: center;
        align-items: flex-start;
    }

    .box__other__info__slide .box__container .splide__arrows > li:first-child,
    .box__index__kv .box__container .splide__arrows > li:first-child {
        margin-right: 15px;
    }

    /* ----------------------------------------------------------------- */
    /* box__title__banner */
    .box__title__banner .box__container .body__con > div.effect-bg-center > img {
        left: calc((100% - var(--f-w))/2 + 150px);
    }

    .box__title__banner .box__container .box__body .body__con {
        flex-direction: column;
        align-items: flex-start;
        margin: 0 auto 0px auto;
    }

    .box__title__banner .box__container .box__body .body__con .con__title {
        margin-bottom: 35px;
    }

    .box__title__banner .box__container .box__body .body__con .con__info .info__date .date__day {
        margin-left: 4px;
        /* font-size: 18px; */
    }

    .box__title__banner .box__container .box__body .body__con .con__info {
        align-self: flex-end;
    }

    .box__title__banner .box__container .box__body .body__banner {
        margin-top: -15px;
    }

    .box__title__banner .box__container .box__body .body__banner img {
        min-width: initial;
    }

    /* ----------------------------------------------------------------- */
    /* box__info */
    .box__info .box__container .box__body {
        flex-direction: column;
        justify-content: initial;
        align-items: initial;

        padding: 0 0;
    }

    .box__info .box__container .box__body > li.body__detail {
        width: 100%;
        /* margin-bottom: 40px; */
    }

    .box__info .box__container .box__body > li.body__pic.aspect-ratio {
        --pic-w: 100%;
    }

    /* ----------------------------------------------------------------- */
    /* box__text__bg */
    .box__text__bg {
        --panel-margin-top: 250px;
    }

    .box__text__bg .box__container .box__bg {
        height: 100%;
    }

    .box__text__bg .box__container .box__body {
        padding: 0 var(--main-padding-side);
    }

    .box__text__bg .box__container .box__body .body__panel {
        padding: 60px 20px;
    }

    /* ----------------------------------------------------------------- */
    /* box__news */
    .box__news .box__container.box__title {
        margin-bottom: 0px;
    }

    .box__news .box__container .box__body {
        flex-direction: column;
        justify-content: initial;
        align-items: initial;
        padding: 0 0;
    }

    .box__news .box__container .box__body > ul.body__con,
    .box__news .box__container .box__body > ul.body__main {
        width: 100%;
    }

    .box__news .box__container .box__body > ul.body__con {
        margin-top: 50px;
    }

    .box__news .box__container .box__body > ul.body__con .con__list .list__item {
        flex-direction: column;
        justify-content: initial;
        align-items: initial;
        padding: 0 0px 15px 0px;
    }

    .box__news .box__container .box__body > ul.body__con .con__list .list__item .item__date {
        margin-bottom: 10px;
    }

    .box__news .box__container .box__body > ul.body__con .con__list .list__item .item__text {
        width: 100%;
    }

    /* ----------------------------------------------------------------- */
    /* box__circle__photos__slide */
    .box__circle__photos__slide .box__container.box__title {
        padding-bottom: 0;
    }

    .box__circle__photos__slide .box__container .splide .splide__slide .slide__circles {
        display: none;
    }

    .box__circle__photos__slide .box__container .splide .splide__slide .slide__con.is-zoom-out .con__img {
        width: 100%;
    }

    .box__circle__photos__slide .box__container .splide::before, 
    .box__circle__photos__slide .box__container .splide::after {
        display: none;
    }

    /* ----------------------------------------------------------------- */
    /* box__traffic__info */
    .box__traffic__info .box__container {
        align-items: initial;
    }

    .box__traffic__info .box__container > ul {
        width: 100%;
        padding: 0 0;
        min-width: initial;
        flex-direction: column;
        align-items: initial;
    }

    .box__traffic__info .box__container > ul > li:first-child {
        width: 160px;
    }

    .box__traffic__info .box__container > ul .mrt__info, 
    .box__traffic__info .box__container > ul .bus__info {
        margin-left: 0px;
        padding: 0 20px;
    }

    .box__traffic__info .box__container > ul .bus__info .info__con .con__list {
        grid-row-gap: 15px;
        grid-column-gap: 15px;
        grid-template-columns: repeat(2, minmax(130px, 100%));
    }
}
@media only screen and (min-width:768px) {
    .box__search__result .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }

    .box__search__result .gsc-tabHeader {
        width: 50% !important;
        /* max-width: 200px; */
    }

    .box__search__result .gsc-table-cell-snippet-close, 
    .box__search__result .gs-promotion-text-cell {
        margin-top: 0px;
    }

    .box__search__result .gsc-control-cse {
        padding: 0em;
    }

    .box__search__result .gs-web-image-box {
        width: calc(155px + 45px) !important;
    }

    .box__search__result .gs-web-image-box, 
    .box__search__result .gs-promotion-image-box {
        float: left !important;
        margin-left: 0px !important;
    }

    .box__search__result .gs-web-image-box .gs-image {
        max-width: calc(140px + 45px) !important;
        max-height: 120px !important;
        width: 100% !important;
        height: 120px !important;
    }

    .box__search__result .gsc-control-cse, 
    .box__search__result .gsc-control-cse .gsc-table-result {
        font-size: 16px;
        line-height: 24px;
    }

    .box__search__result .gsc-results .gsc-cursor-box {
        border-top: 1px solid var(--color-line-gray2) !important;
        border: initial !important;
        padding: 20px 0;
        display: flex;
        justify-content: center;
    }


    section.box__search__result .box__container .box__body {
        min-height: var(--sr-body-300-min-h);
    }

    section.box__search__result > div.effect-bg-bottom.is-effect-pc {
        display: none;
    }

    /* box__photo__lightbox */
    .box__photo__lightbox {
        --d-width: 90vmin;
        --d-height: 90vmin;
        --d-wh: 80vmin;
    }

    /* ------------------------------------------------------------------ */
    .box__map .box__container .box__body.cover-mobile {
        width: 1023px;
        height: 980px;
        clip-path: polygon(1023px 0px, 1023px 980px, 0px 980px, 0px 0px, 1023px 0px, 735px 1px, 289px 1px, 289px 790px, 735px 790px, 735px 1px); 
    }
    /* ------------------------------------------------------------------ */
    .box__lyrics .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
    }
    
    .box__lyrics .box__container .box__body > li.box__con {
        width: 45%;
    }
    
    .box__lyrics .box__container .box__body > li.box__con .con__content {
        flex-direction: row;
        justify-content: flex-start;
    }

    .box__lyrics .box__container .box__body > li.box__con .con__content > li:first-child {
        margin-right: 10%;
    }
    
    .box__lyrics .box__container .box__body > li.box__photo.aspect-ratio {
        margin-top: 0px;
        --pic-w: 45%;
    }
    /* ------------------------------------------------------------------ */
    /* box__intro__icons */
    .box__intro__icons .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }

    .box__intro__icons .box__container .box__body .body__item .item__icon {
        display: flex;
    }
    
    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__photo-mobile,
    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__title .title__icon-mobile {
        display: none;
    }

    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__title .title__icon-mobile {
        width: 80px;
    }

    .box__intro__icons .box__container .box__body .body__item .item__detail {
        width: var(--detail-w);
        padding-right: 30%;
    }

    .box__intro__icons .box__container .box__body .body__item .item__detail .detail__title {
        margin-bottom: 10px;
    }

    /* ------------------------------------------------------------------ */
    /* box__text__bg2 */
    .box__text__bg2 {
        height: initial;
        background: url(../images/text-bg2/text-bg2-bg.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .box__text__bg2 .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }
    /* ------------------------------------------------------------------ */
    /* box__intro__text2 */
    .box__intro__text2 .box__container .box__body > img {
        width: 38%;
    }

    .box__intro__text2 .box__container .box__body.is-text2 {
        padding: 0 var(--main-inner-padding-side);
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }

    .box__intro__text2 .box__container .box__body.is-text2 .body__con {
        width: 47%;
    }

    .box__intro__text2 .box__container .box__body.is-text2 .body__con.body__left {
        margin-bottom: 0px;
    }


    /* box__intro__video */
    .box__intro__video .box__container .box__body.aspect-ratio {
        --pic-w: calc(100% - var(--main-inner-padding-side) * 2);
    }
    /* ----------------------------------------------------------------- */
    /* box__ytvideo */
    .box__ytvideo .box__container .box__body .embed-responsive-item.embed-responsive::before {
        padding-top: var(--rate);
    }
    /* ----------------------------------------------------------------- */
    /* box__pagination */
    .box__pagination .box__container .box__body .body__circle {
        --circle-w: 45px;
        font-size: 18px;
    }

    .box__pagination .box__container .box__body .body__circle > svg {
        width: 15px;
    }
    /* ----------------------------------------------------------------- */
    /* box__data__list */
    .box__videos__list .box__container .box__body,
    .box__downloads__list .box__container .box__body,
    .box__data__list .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
        
        grid-column-gap: 3%;
        grid-row-gap: 80px;
        grid-template-columns: repeat(2, minmax(270px, 100%));
    }

    /* box__label__list */
    .box__label__list .box__container .box__space-mobile,
    .box__label__list .box__container .box__body-mobile {
        display: none;
    }

    .box__label__list .box__container .box__body {
        width: 85%;
        display: flex;
    }
    /* ----------------------------------------------------------------- */
    /* box__title__banner2 */
    .box__title__banner2 .box__container {
        padding: 0 var(--main-padding-side);
    }

    .box__title__banner2 .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }

    .box__title__banner2 .box__container.box__info .info__period {
        /* flex-direction: row; */
        /* align-items: baseline; */
        align-items: center;
        flex-wrap: nowrap;
    }

    .box__title__banner2 .box__container.box__info .info__period .period__date {
        margin-bottom: 0px;
    }

    .box__title__banner2 .box__container.box__info .info__period .period__time {
        margin-left: 40px;
        align-self: flex-end;
    }

    .box__title__banner2 .box__container .box__body .body__photo.aspect-ratio {
        --pic-wh-rate: calc(410/820);
        border-radius: var(--img-radius-l);
    }

    /* ----------------------------------------------------------------- */
    /* box__intro */
    .box__intro .box__container .box__body {
        padding: 0 calc(var(--main-inner-padding-side) + var(--main-inner-off-padding-side));
    }
    /* ----------------------------------------------------------------- */
    /* box__photocon__align */
    .box__photocon__align .box__container {
        padding: 0 var(--main-padding-side);
    }

    .box__photocon__align .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }

    .box__photocon__align .box__container .box__body > li.body__photo .photo__img.aspect-ratio {
        /* --pic-wh-rate: calc(340/410); */
        border-radius: var(--img-radius-l);
    }

    /* ----------------------------------------------------------------- */
    /* box__photocon__align */
    .box__photocon__align .box__container .box__body .body__con {
        padding: 0 0;
    }

    .box__photocon__align .box__container .box__body > li.body__photo .photo__tips {
        padding-left: 0;
    }

    .box__photocon__align.photo-to-con .box__container .box__body {
        flex-direction: row;
    }
    
    .box__photocon__align.con-to-photo .box__container .box__body {
        flex-direction: row-reverse;
    }

    .box__photocon__align .box__container .box__body > li.body__photo {
        width: var(--body-photo-w);
        margin-bottom: 0px;
    }
    
    .box__photocon__align .box__container .box__body > li.body__con {
        width: var(--body-con-w);
        /* 對標圖下方的出處 扣回來 */
        margin-bottom: 20px;
    }

    /* ----------------------------------------------------------------- */
    /* box__photo__large */
    .box__photo__large .box__container {
        padding: 0 var(--main-padding-side);
    }

    .box__photo__large2 .box__container .box__body,
    .box__photo__large .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }

    .box__photo__large .box__container .box__body .body__photo.aspect-ratio {
        --pic-wh-rate: calc(380/820);
        border-radius: var(--img-radius-l);
    }

    .box__photo__large2 .box__container .box__body .body__tips,
    .box__photo__large .box__container .box__body .body__tips {
        margin-left: 0px;
    }

    /* box__intro__photos__slide */
    .box__intro__photos__slide .box__container .box__body.box__intro {
        padding: 0 calc(var(--main-padding-side) + var(--main-inner-padding-side) + var(--main-inner-off-padding-side));
    }

    /* ----------------------------------------------------------------- */
    /* box__steps__list */
    .box__steps__list .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }

    .box__steps__list .box__container .box__body.box__list .list__item {
        --item-head-w: 80px;
        padding: 30px calc( var(--main-inner-off-padding-side));
        flex-direction: row;
        align-items: baseline;
    }

    /* .box__steps__list .box__container .box__body.box__list .list__item > span {
        width: var(--item-head-w);
    }
    
    .box__steps__list .box__container .box__body.box__list .list__item > div,
    .box__steps__list .box__container .box__body.box__list .list__item > p {
        width: var(--item-text-w);
    } */

    /* box__photos__text__2columns */
    .box__photos__text__2columns .box__container {
        padding: 0 var(--main-padding-side);
    }

    .box__photos__text__2columns .box__container .box__body {
        /* padding: 0 calc(var(--main-inner-padding-side) + var(--main-inner-off-padding-side)); */
        padding: 0 calc(var(--main-inner-padding-side));
        flex-direction: row;
        justify-content: space-between;
        align-items: stretch;
    }

    .box__photos__text__2columns .box__container .box__body .body__item {
        width: 47%;
    }

    .box__photos__text__2columns .box__container .box__body .body__item:first-child {
        margin-bottom: 0px;
    }

    .box__photos__text__2columns .box__container .box__body .body__item .item__intro {
        padding: 0 0;
    }

    .box__photos__text__2columns .box__container .box__body .body__item .item__photo .photo__img.aspect-ratio {
        border-radius: var(--img-radius-m);
    }

    .box__map .box__container .box__body.info-mobile {
        width: 70%;
    }

    /* ----------------------------------------------------------------- */
    /* box__related__links */
    .box__related__links .box__container .box__body {
        padding: 0 var(--main-inner-padding-side);
    }

    .box__related__links .box__container .box__body .body__socials {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    .box__related__links .box__container .box__body .body__socials > a {
        width: 49%;
    }

    .box__related__links .box__container .box__body .body__socials > a:first-child {
        margin-bottom: 0px;
    }

    /* ----------------------------------------------------------------- */
    /* box__text__bg */
    .box__text__bg .box__container .box__bg {
        height: 60%;
    }
}
@media only screen and (min-width:1024px) {
    /* box__lyrics */
    .box__lyrics .box__container.box__title {
        margin-bottom: 80px;
    }

    .box__lyrics .box__container .box__body > li.box__con .con__content > li:first-child {
        margin-right: 20%;
    }

    .box__flower__photos__slide .box__container.box__title {
        padding-bottom: 50px;
    }

    /* box__steps__list */
    .box__steps__list .box__container .box__body.box__list .list__item {
        --item-head-w: 100px;
    }

    /* box__intro__photos__slide */
    .box__intro__photos__slide .box__container .box__body.box__intro.is-api {
        margin-bottom: calc(40px);
    }

    .box__intro__photos__slide .box__container .box__body.box__intro.is-api .intro__options {
        display: flex;
        width: calc(20%);
        right: calc(var(--main-padding-side) + var(--main-inner-padding-side));
        /* top: initial; */
        bottom: initial;
    }

    /* box__data__list */
    .box__videos__list .box__container .box__body,
    .box__downloads__list .box__container .box__body,
    .box__data__list .box__container .box__body {
        grid-template-columns: repeat(3, minmax(270px, 100%));
    }

    /* ----------------------------------------------------------------- */
    /* box__map */
    .box__map .box__container.box__title {
        padding: 20px 0 40px 0;
    }

    .box__map .box__container .box__body {
        --canvas-map-h: 1250px;
    }

    .box__map .box__container .box__body.cover-mobile,
    .box__map .box__container .box__body.info-mobile {
        display: none;
    }

    /* ----------------------------------------------------------------- */
    /* box__related__links */
    /* .box__related__links .box__container {
        padding: 0 0;
    } */
    .box__related__links .box__container.box__title {
        margin-bottom: 40px;
    }

    .box__related__links .box__container .box__body .body__brands {
        margin-top: 20px;
        grid-row-gap: 20px;
        grid-column-gap: 20px;
        grid-template-columns: repeat(3, minmax(260px, 100%));
    }

    /* ----------------------------------------------------------------- */
    /* box__index__kv */
    .box__index__kv .box__container.box__bg {
        background: url(../images/index/index-kv/index-kv-bg.jpg);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .box__index__kv .box__container.box__link > div.effect-bg-center > img {
        left: calc((100% - var(--f-w))/2 - 400px);
    }

    .box__index__kv .box__container.box__subtitle {
        display: flex;
    }

    .box__index__kv .box__container.box__title {
        margin-bottom: 0px;
    }

    .box__index__kv .box__container.box__title > img {
        width: 289px;
    }

    .box__other__info__slide .box__container .splide__arrows,
    .box__index__kv .box__container .splide__arrows {
        --circle-w: 50px;
        top: 0px;
        justify-content: space-between;
        align-items: center;
    }

    .box__other__info__slide .box__container .splide__arrows > li:first-child,
    .box__index__kv .box__container .splide__arrows > li:first-child {
        margin-right: 0px;
    }

    /* ----------------------------------------------------------------- */
    /* box__title__banner */
    .box__title__banner .box__container .body__con > div.effect-bg-center > img {
        left: calc((100% - var(--f-w))/2 - 50px);
    }

    .box__title__banner .box__container .box__body .body__con {
        flex-direction: row;
        justify-content: space-between;
        /* align-items: flex-end; */
        align-items: stretch;
        margin: 0 auto 50px auto;
    }

    .box__title__banner .box__container .box__body .body__con .con__title {
        margin-bottom: 0px;
    }

    .box__title__banner .box__container .box__body .body__con .con__info .info__date .date__day {
        margin-left: 8px;
        /* font-size: 24px; */
    }

    .box__title__banner .box__container .box__body .body__con .con__info {
        align-self: initial;
    }

    .box__title__banner .box__container .box__body .body__banner {
        margin-top: 0;
    }

    .box__title__banner .box__container .box__body .body__banner img {
        min-width: 1440px;
    }

    /* ----------------------------------------------------------------- */
    /* box__info */
    .box__info .box__container .box__body {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;

        padding: 0 var(--main-inner-padding-side);
    }

    .box__info .box__container .box__body > li.body__detail {
        width: var(--body-detail-w);
        /* margin-bottom: 0px; */
    }

    .box__info .box__container .box__body > li.body__pic.aspect-ratio {
        --pic-w: var(--body-pic-w);
    }

    /* ----------------------------------------------------------------- */
    /* box__text__bg */
    .box__text__bg {
        --panel-margin-top: 15%;
    }

    .box__text__bg .box__container .box__bg {
        height: 100%;
    }

    .box__text__bg .box__container .box__body {
        padding: 0 calc(var(--main-padding-side) + var(--main-inner-padding-side));
    }

    .box__text__bg .box__container .box__body .body__panel {
        padding: 70px;
    }

    /* ----------------------------------------------------------------- */
    /* box__news */
    .box__news .box__container.box__title {
        margin-bottom: 40px;
    }

    .box__news .box__container .box__body {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        padding: 0 var(--main-inner-padding-side);
    }

    .box__news .box__container .box__body > ul.body__main {
        width: var(--main-w);
    }

    .box__news .box__container .box__body > ul.body__con {
        margin-top: 0px;
    }

    .box__news .box__container .box__body > ul.body__con {
        width: var(--con-w);
    }

    .box__news .box__container .box__body > ul.body__con .con__list .list__item {
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        padding: 0 20px 20px 20px;
    }

    .box__news .box__container .box__body > ul.body__con .con__list .list__item .item__date {
        margin-bottom: 0px;
    }

    .box__news .box__container .box__body > ul.body__con .con__list .list__item .item__text {
        width: var(--text-w);
    }

    /* ----------------------------------------------------------------- */
    /* box__circle__photos__slide */
    .box__circle__photos__slide .box__container.box__title {
        padding-bottom: 50px;
    }

    .box__circle__photos__slide .box__container .splide .splide__slide .slide__circles {
        display: flex;
    }

    .box__circle__photos__slide .box__container .splide .splide__slide .slide__con.is-zoom-out .con__img {
        width: 15%;
    }

    .box__circle__photos__slide .box__container .splide::before, 
    .box__circle__photos__slide .box__container .splide::after {
        display: flex;
    }

    /* ----------------------------------------------------------------- */
    /* box__traffic__info */
    .box__traffic__info .box__container {
        align-items: center;
        padding-top: 50px;
    }

    .box__traffic__info .box__container > ul {
        /* width: 75%;
        min-width: 900px; */
        padding: 0 var(--main-inner-padding-side);
        flex-direction: row;
        align-items: flex-start;
    }

    .box__traffic__info .box__container > ul > li:first-child {
        /* width: initial; */
        flex: 0 0 auto;
        /* width: 20%; */
        width: 190px;
        /* justify-content: center; */
    }

    .box__traffic__info .box__container > ul .mrt__info, 
    .box__traffic__info .box__container > ul .bus__info {
        padding: 0 0;
        margin-left: 50px;
    }

    .box__traffic__info .box__container > ul .bus__info .info__con .con__list {
        grid-row-gap: 15px;
        grid-column-gap: 15px;
        grid-template-columns: repeat(4, minmax(160px, 100%));
    }

}

@media only screen and (min-width:1200px) {}
@media only screen and (min-width:1300px) {}
@media only screen and (min-width:1400px) {
    /* ------------------------------------------------------------------ */
    /* box__lyrics */
    .box__lyrics .box__container .box__body {
        padding: 0 calc(var(--main-inner-padding-side) * 2);
    }
    /* ------------------------------------------------------------------ */
    /* box__ytvideo */
    .box__ytvideo .box__container {
        max-width: var(--main-max-width);
        padding: 0 var(--main-padding-side);
    }

    .box__ytvideo .box__container .box__body {
        border-radius: var(--panel-radius-l);
        overflow: hidden;
    }

}

@media only screen and (min-width:1600px) {}
@media only screen and (min-width:1900px) {}