@charset "utf-8";

:root {
    --wlSpace: calc((100vw - var(--container)) / 2 - 2.5rem);
    --wlFont: clamp(1rem, 1.2vw, 1.375rem);
    --wlFont-b: clamp(1.5rem, 2vw, 2.375rem)
}

.decoBall {
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 120%;
    transform: translateY(-50%);
    overflow: hidden;
    pointer-events: none
}

.decoBall__img {
    position: absolute;
    aspect-ratio: 1;
    object-fit: cover;
    z-index: -1
}

/*!保健觀(共用)*/
.blockHeight--wellness {
    padding: 0;
    overflow: hidden
}

.wlBlock {
    position: relative
}

.wlTitle {
    position: relative;
    padding-bottom: clamp(1rem, 1vw, 2rem);
    z-index: 1;
    display: inline-flex;
    flex-direction: column;
    margin-bottom: clamp(1rem, 1vw, 2rem)
}

.wlTitle--centerLine {
    justify-content: center
}

.wlTitle--centerLine:before {
    content: '';
    position: absolute;
    height: .125rem;
    width: clamp(1rem, 215%, 80vw);
    background: #c4c4c4;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%)
}

.wlTitle--centerLine:after {
    content: '';
    position: absolute;
    height: .125rem;
    width: 100%;
    background: var(--mainColor);
    left: 50%;
    bottom: 0;
    transform: translateX(-50%)
}

.wlTitle__tt {
    letter-spacing: .12em;
    color: #3a7179;
    font-weight: 500;
    margin-bottom: 1rem;
    margin-right: -.12em;
    font-size: clamp(1.875rem, 2.5vw, 2.75rem);
}

.wlTitle__tt.--medium {
    font-size: var(--wlFont-b);
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: clamp(1rem, 1.4vw, 1.5rem)
}

.wlTitle__tt.--large {
    font-size: clamp(2rem, 3.5vw, 3.875rem);
    font-weight: 700
}

.wlTitle__sub {
    color: #898989;
    font-size: clamp(.875rem, 1.1vw, 1.25rem);
    font-weight: 700;
    letter-spacing: .03em;
    margin-right: -.03em
}

.wlBrief {
    font-size: var(--wlFont);
    letter-spacing: .1em;
    line-height: 1.95
}

.wlBrief--center {
    text-align: center
}

.wlTtTag {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    gap: 1rem
}

.wlTtTag .wlTag {
    margin-bottom: .625rem
}

.wlTagDot {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1.5rem
}

.decoLine .line.--main:after {
    content: '';
    position: absolute;
    width: clamp(3rem, 7vw, 7.5rem);
    height: .125rem;
    background: var(--mainColor)
}

.decoLine .line.--green:after {
    content: '';
    position: absolute;
    width: clamp(4rem, 10vw, 10rem);
    height: .125rem;
    background: var(--subColor)
}

/*!保健觀(kv)*/
.wlBlock--kv .breadCrumbs-block {
    margin: 1.5rem 0
}

.wlBlock--kv {
    position: relative;
    z-index: 1
}

.wlBlock--kv:before {
    content: '';
    position: absolute;
    opacity: .15;
    width: clamp(8rem, 14vw, 14.25rem);
    left: 25%;
    bottom: 0;
    background: url(../images/wellness/ball.png) center/cover;
    aspect-ratio: 1;
    z-index: -2
}

.wlBlock--kv:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 85%;
    background: linear-gradient(to top, #f6f5f7, transparent);
    left: 0;
    bottom: 4rem;
    z-index: -3
}

.wlKvBox {
    display: flex;
    align-items: center;
    margin-left: max(calc(50% - var(--container)/ 2), var(--containerPadding));
    padding-left: 1rem
}

.wlKvBox__text {
    width: 50%;
    margin-right: -25%;
    position: relative;
    z-index: 1;
}

.wlKvBox__pic {
    position: relative;
    width: 75%;
    border-radius: clamp(3rem, 12vw, 12.5rem) 0 0 0;
    overflow: hidden;
    margin: 0
}

.wlKvSub {
    position: absolute;
    display: flex;
    flex-direction: row-reverse;
    font-size: clamp(.875rem, 1vw, 1.25rem);
    letter-spacing: .35em;
    gap: .625rem;
    color: #666;
    /* right: clamp(3rem,4vw,5rem); */
    /* top: clamp(4rem,8vw,10rem); */
    right: 5%;
    top: 10%;
    position: absolute;
    z-index: 1
}

.wlKvSub__txt {
    background: #fff;
    writing-mode: vertical-rl;
    padding: 1rem .25rem
}

.wlKvTt__sub {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    width: 85%
}

.wlKvTt__sub__big {
    font-family: 'Noto Serif TC', serif;
    font-size: clamp(1.3rem, 3vw, 2.375rem);
    letter-spacing: .3em;
    font-weight: 600;
    color: var(--darkGreen)
}

.wlKvTt__sub__big .mk {
    color: var(--subColor)
}

.wlKvTt__sub__small {
    font-size: var(--wlFont);
    letter-spacing: .18em
}

.wlKvTt__mj {
    font-size: clamp(2rem, 3.5vw, 4rem);
    font-family: 'Noto Serif TC', serif;
    font-weight: 700;
    color: var(--darkGreen);
    letter-spacing: clamp(.12em, .3vw, .3em);
    display: inline-block;
    position: relative;
    z-index: 1
}

.wlKvTt__mj:after {
    content: '';
    position: absolute;
    width: calc(100% + 2rem);
    height: 100%;
    background: linear-gradient(to left, transparent, rgba(255, 255, 255, .7));
    left: -1rem;
    top: 0;
    z-index: -1
}

.decoLineDot {
    display: block;
    width: 100%;
    height: .25rem;
    background: #ddd;
    margin: 2rem 0
}

.wlKvTt {
    display: flex;
    flex-direction: column;
    gap: 2.5rem
}

.wlKvTt .decoLine {
    width: 85%;
    justify-content: space-between;
    margin: 1rem 0
}

.wlKvTt .line {
    max-width: 30rem
}

.kvBlock {
    position: absolute;
    background: linear-gradient(to right, #e8ebed, #d9e6e9);
    width: 50%;
    height: 5rem;
    left: 0;
    bottom: 0;
    z-index: -2
}

.decoBall__img.--kvB1 {
    opacity: .16;
    width: clamp(10rem, 15vw, 17.25rem);
    left: 0;
    top: 7%;
    transform: translateX(-30%)
}

.decoBall__img.--kvB2 {
    opacity: .15;
    width: clamp(8rem, 10vw, 10rem);
    transform: rotate(-85deg);
    left: 45%;
    top: 32%
}

.decoBall__img.--kvB3 {
    opacity: .2;
    width: clamp(8.5rem, 10vw, 11.25rem);
    transform: rotate(-280deg);
    right: -4rem;
    top: 40%
}

.decoBall__img.--kvB4 {
    opacity: .12;
    width: clamp(5rem, 8vw, 8.45rem);
    left: 6%;
    top: 48%
}

.decoBall__img.--kvB5 {
    opacity: .15;
    width: clamp(8rem, 14vw, 14.25rem);
    left: 25%;
    bottom: 0
}

/*!保健觀(health健康，從根本調理)*/
.wlBlock--health {
    position: relative;
    background: linear-gradient(to bottom, #fbfafb 0, #f6f5f7 calc(100% - 5rem), #fff calc(100% - 5rem));
    padding: 3rem 0 0;
    z-index: 1
}

.wlBlock--health:after {
    content: '';
    position: relative
}

.wlHealthBox--wrapper {
    position: relative;
    z-index: 0
}

.wlHealthBox--wrapper:before {
    content: '';
    position: absolute;
    width: 48%;
    height: 80%;
    background: linear-gradient(to right, #e8ebed, #d9e6e9);
    left: 0;
    top: -3rem;
}

.wlHealthBox--wrapper:after {
    content: '';
    position: absolute;
    background: url(../images/wellness/deco-leave.png) center/cover;
    aspect-ratio: 440/800;
    width: clamp(5rem, 13vw, 13.75rem);
    right: 0;
    bottom: 3rem
}

.wlHealthBox {
    display: flex
}

.wlTitle--flex {
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: clamp(1rem, 2vw, 2.5rem);
    flex-wrap: wrap
}

.wlTitle--flex .wlTitle {
    padding: 0;
    margin: 0
}

.wlBorad {
    padding: 3.75rem 0;
    margin: 0;
    font-size: var(--wlFont);
    line-height: 1.9;
    color: #666;
    position: relative;
    z-index: 1
}

.wlBorad:before {
    content: '';
    background: url(../images/wellness/ball.png) center/cover;
    width: clamp(4rem, 8vw, 8.4375rem);
    aspect-ratio: 1;
    position: absolute;
    opacity: .12;
    left: -4.5rem;
    top: 0;
    transform: translate(-50%, -50%) rotate(45deg)
}

.wlBorad:after {
    content: '';
    position: absolute;
    width: calc(100% + 4.5rem);
    height: 100%;
    left: calc(clamp(2rem, 4vw, 4.5rem) * -1);
    top: 0;
    background: linear-gradient(-15deg, #fff 25%, rgba(255, 255, 255, .9) 50%, rgba(255, 255, 255, 0) 100%);
    z-index: -1;
    border-radius: .75rem;
    box-shadow: inset 0 0 1rem rgba(255, 255, 255, .5), 0 .375rem .5rem rgba(0, 0, 0, .08);
}

.wlHealthBox__text {
    width: 60%;
}

.wlHealthBox__img {
    width: 70%;
    margin: 0;
    
    background-size: 115% auto;
    margin-left: -14%;
    transform: translateX(3rem);
    z-index: -1;
    position: relative
}

.wlHealthBox__img:before {
    content: '';
    position: absolute;
    background: url(../images/wellness/ball-s.png) center/cover;
    aspect-ratio: 170/300;
    width: 7.5rem;
    right: 0;
    top: 0;
    z-index: 1;
    transform: translate(60%, -34%)
}

.wlHealthBox__img:after {
    content: '';
    position: absolute;
    background: url(../images/wellness/ball.png) center/cover;
    aspect-ratio: 1;
    width: 5.875rem;
    opacity: .15;
    left: 0;
    bottom: 0;
    transform: translate(-65%, 50%);
    filter: blur(.25rem)
}

.wlHealthBox__img__pic {
    width: 960px;
    aspect-ratio: 960/640;
    object-fit: cover;
    object-position: bottom center;
    background: url(../images/wellness/health1.png);
    /* opacity:0; */
}

.wlEffBox {
    --topPic: clamp(8rem, 35vw, 25rem);
    position: relative;
    display: flex;
    gap: clamp(1rem, 2vw, 3rem)
}

.wlEffBoxlCover {
    width: clamp(10rem, 30%, 30rem);
    margin: 0;
    transform: translateY(-2rem);
    position: relative
}

.wlEffBoxlCover:after,
.wlEffBoxlCover:before {
    content: '';
    position: absolute;
    background: url(../images/wellness/ball.png) center/cover;
    aspect-ratio: 1;
    opacity: .25;
    z-index: -1
}

.wlEffBoxlCover:before {
    width: clamp(5.258rem, 12vw, 12.5rem);
    transform: translate(-20%, -15%) rotate(-45deg);
    right: 0;
    top: 0;
    filter: blur(.5rem)
}

.wlEffBoxlCover:after {
    width: clamp(5rem, 10vw, 11.125rem);
    left: 0;
    bottom: 0;
    filter: blur(.5rem);
    transform: translate(-20%, 40%) rotate(90deg)
}

.wlEffR {
    position: relative;
    width: calc(100% - clamp(10rem, 30%, 30rem));
    padding: 4rem 0 0
}

.wlEffBox__txt {
    display: grid;
    grid-template-columns: 1fr auto;
    justify-content: space-around;
    /* margin-right: calc((100vw - var(--container))/ 2); */
    gap: clamp(1.25rem, 2vw, 2rem) 1rem;
    width: 100%;
    padding-right: calc((100vw - var(--container))/ 2);

}

.wlEffBox__txt__tag {
    font-size: clamp(1.125rem, 2.5vw, 3rem);
    font-family: 'Noto Serif TC', serif;
    font-weight: 700;
    letter-spacing: .3em;
    background: url(../images/wellness/bg-txt.png) center/cover;
    position: relative;
    display: inline-block;
    color: #fff;
    padding: clamp(.5rem, 1vw, 1rem) clamp(1rem, 2vw, 2.375rem);
    border-radius: min(2.5vw, 2rem) .125rem;
}

.wlEffBoxTCover {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 1.5rem
}

.wlEffBoxTCover__pic {
    width: auto
}

.wlEffBox__txt__tt {
    grid-column: span 2;
    letter-spacing: .12em;
    color: #3a7179;
    font-weight: 500;
    margin-bottom: 1rem;
    margin-right: -.12em;
    font-size: var(--wlFont-b)
}

.wlEffBox__tImg {
    display: grid;
    grid-template-columns: auto 1fr
}

.wlEffBox__tImg__text {
    font-size: var(--wlFont);
    line-height: 1.9;
    letter-spacing: .01em
}

.wlEffBoxCover {
    margin: 0;
    margin-bottom: -2.5rem
}

.wlEffBoxCover__pic {
    width: clamp(10rem, 50vw, 55rem);
    aspect-ratio: 815/370;
    object-position: top left;
    object-fit: cover
}

/*!保健觀(是否失衡)*/
.wlBlock--balance {
    background: url(../images/wellness/bg-balance.png) center/cover
}

.wlBalTop {
    text-align: center;
    padding: 5rem 0 clamp(2rem, 3vw, 5rem);
    position: relative
}

.wlBalTop:before {
    content: '';
    position: absolute;
    background: url(../images/wellness/txt-lose1.png) center/cover;
    aspect-ratio: 1602/91;
    width: clamp(50rem, 80vw, 100rem);
    left: 50%;
    top: 0;
    transform: translate(-50%, 150%)
}

.wlBalTop:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 60%;
    background: #ecf3f3;
    left: 0;
    top: 0;
    z-index: -1
}

.wlBalTop .container {
    max-width: calc(100% - clamp(4rem, 5vw, 6rem))
}

.wlBalTt {
    font-size: clamp(1.25rem, 2vw, 2.25rem);
    font-weight: 500;
    letter-spacing: .12em;
    padding: clamp(1rem, 1.5vw, 1.625rem) clamp(1rem, 1.5vw, 1.875rem);
    border-radius: 100rem;
    display: inline-block;
    position: relative;
    color: #fff;
    overflow: hidden;
    z-index: 1;
    width: clamp(12rem, 64vw, 52.5rem);
    text-align: center
}

.wlBalTt:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, var(--mainColor), rgb(0 93 110 / 50%));
    left: 0;
    top: 0;
    z-index: -1
}

.wlBalTt:after {
    content: '';
    position: absolute;
    background: url(../images/about/frosted.png) center repeat-x;
    width: 100%;
    height: 100%;
    background-size: auto 100%;
    left: 0;
    top: 0;
    mix-blend-mode: color-dodge;
    opacity: .75
}

.wlBalTt__txt {
    display: block;
    position: relative;
    padding-right: 1.875rem
}

.wlBalTt__txt:after {
    content: '';
    position: absolute;
    background: url(../images/wellness/deco-notice.png) center/cover;
    width: clamp(2rem, 3vw, 3.75rem);
    aspect-ratio: 62/55;
    right: .5rem;
    top: 50%;
    transform: translateY(-50%)
}

.wlBalStep {
    display: flex;
    padding: clamp(3rem, 5vw, 6.25rem) 0;
    position: relative;
    z-index: 1
}

.wlBalStep__item {
    margin: 0
}

.wlBalStep__item+.wlBalStep__item {
    position: relative
}

.wlBalStep__item+.wlBalStep__item:before {
    content: '';
    position: absolute;
    width: clamp(.6rem, 1.2vw, 1.5rem);
    aspect-ratio: 1;
    background: var(--mainColor);
    clip-path: polygon(100% 50%, 0 0, 0 100%);
    left: .125rem;
    top: 50%;
    transform: translate(-50%, -50%)
}

.wlBalBtm {
    padding-bottom: 5rem;
    position: relative
}

.sliceBtm,
.sliceTop {
    height: clamp(10rem, 14vw, 13.125rem);
    display: block;
    position: relative
}

.sliceTop {
    background: url(../images/wellness/slice1.png) repeat-x;
    animation: wlBgMove 60s infinite linear;
    background-size: auto 100%
}

.sliceBtm {
    background: url(../images/wellness/slice2.png) repeat-x;
    animation: wlBgMove-r 60s infinite linear;
    background-size: auto 100%
}

@keyframes wlBgMove {
    0% {
        background-position-x: 0
    }

    100% {
        background-position-x: -200%;
    }
}

@keyframes wlBgMove-r {
    0% {
        background-position-x: 0
    }

    100% {
        background-position-x: 200%;
    }
}

.wlBalList {
    display: flex;
    padding: 1.5rem 0;
    justify-content: center
}

.wlBalList__item__tt {
    font-size: clamp(.95rem, 2vw, 2.1875rem);
    color: var(--mainColor);
    font-weight: 700;
    letter-spacing: .12em;
    padding: 1rem 2rem;
    border-bottom: 1px solid #c9c9c9;
    margin-bottom: clamp(.5rem, 1vw, 1rem)
}

.wlBalList__item__tag {
    font-size: clamp(0.75rem, 1vw, 1.25rem);
    color: #666;
    height: 3em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.wlDzCover {
    margin: 0
}

.wlBalList__item {
    text-align: center;
    padding: 1rem clamp(.75rem, 2vw, 3.75rem);
    position: relative
}

.wlBalList__item+.wlBalList__item:before {
    content: '';
    width: 1px;
    height: 65%;
    background: #d9d9d9;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%)
}

.wlDzCover__pic {
    width: clamp(5rem, 9vw, 10rem)
}

.wlBalBox--inner {
    position: relative
}

.wlBalBox--inner:after {
    content: '';
    position: absolute;
    background: url(../images/wellness/txt-modern.png) center/cover;
    aspect-ratio: 129/731;
    width: clamp(5rem, 8vw, 8.125rem);
    left: 5rem;
    top: 0;
    z-index: -1
}

.wlBalBox__tt--wrapper {
    margin-top: 4rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem
}

.wlBalBox__tt {
    text-align: center;
    display: flex;
    align-items: center
}

.wlBalBox__tt__mj {
    font-size: clamp(1.5rem, 2vw, 3.5rem);
    font-weight: 500;
    color: var(--darkGreen);
    letter-spacing: .12em;
    display: inline-block;
    padding: clamp(.75rem, 1.2vw, 1.5rem) 2rem;
    position: relative;
    border: 2px dashed #83b7b6;
    border-radius: 100rem;
    width: calc(100% - clamp(2rem, 4vw, 4.5rem)* 2);
    margin: auto
}

.wlBalBox__tt__mj .mk {
    font-size: clamp(1em, 1.2vw, 1.125em);
    color: #93cda0;
    background: #fff;
    margin-left: .5rem;
    font-weight: 900
}

.wlBalBox__tt__mj .icon {
    width: clamp(3rem, 5vw, 5.5rem);
    aspect-ratio: 1;
    transform: translateY(-12%)
}

.wlBalBox__tt--sub {
    font-size: clamp(.75rem, 1.2vw, 1.375rem);
    font-weight: 700;
    color: #898989;
    letter-spacing: .03em;
    text-align: center
}

.decoBall__img[class*="--balBB"],
.decoBall__img[class*="--balTB"] {
    opacity: .15
}

.decoBall__img.--balTB1 {
    width: clamp(2rem, 5.5vw, 5.875rem);
    opacity: .22;
    right: 0;
    top: 10%;
    transform: translate(45%, 0)
}

.decoBall__img.--balTB2 {
    width: clamp(1rem, 3.2vw, 3.5rem);
    right: 5%;
    top: 22%
}

.decoBall__img.--balTB3 {
    width: clamp(4rem, 8vw, 8.75rem);
    opacity: .22;
    left: 1%;
    top: 34%;
    filter: blur(.25rem)
}

.decoBall__img.--balTB4 {
    width: clamp(2rem, 5.5vw, 5.875rem);
    right: 0;
    top: 55%;
    transform: translate(45%, 0);
    filter: blur(.25rem)
}

.decoBall__img.--balTB5 {
    width: clamp(8rem, 14vw, 14.125rem);
    left: 17%;
    bottom: 13%
}

.decoBall__img.--balTB6 {
    width: clamp(4rem, 7vw, 7.5rem);
    right: 23%;
    bottom: 2%
}

.decoBall__img.--balBB1 {
    width: clamp(8rem, 14vw, 14.125rem);
    left: 0;
    top: 29%;
    transform: translateX(-25%) rotate(-15deg);
    filter: blur(.25rem)
}

.decoBall__img.--balBB2 {
    width: clamp(2rem, 4vw, 5rem);
    left: 10%;
    top: 24%;
    filter: blur(.125rem);
    transform: rotate(45deg)
}

.decoBall__img.--balBB3 {
    width: clamp(15rem, 35vw, 35rem);
    left: 50%;
    top: 39%;
    transform: translate(-50%, -50%);
    filter: blur(.25rem)
}

.decoBall__img.--balBB4 {
    width: clamp(3rem, 6vw, 6.25rem);
    right: 10%;
    top: 41%;
    transform: rotate(45deg);
    filter: blur(.125rem)
}

.decoBall__img.--balBB5 {
    width: clamp(6.25rem, 10vw, 10rem);
    right: 0;
    top: 21%;
    transform: translate(30%, 0) rotate(15deg);
    filter: blur(.25rem)
}

.decoBall__img.--balBB6 {
    width: clamp(6.25rem, 10vw, 10rem);
    left: 0;
    bottom: 24%;
    transform: translate(-20%, 0)
}

.decoBall__img.--balBB7 {
    width: clamp(4rem, 8vw, 8.75rem);
    opacity: .12;
    right: 0;
    bottom: 26%;
    transform: translate(15%);
    filter: blur(.125rem)
}

/*!保健觀(新文明病)*/
.wlBlock--4part:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: linear-gradient(to top, #f6f5f7, rgba(255, 255, 255, 0));
    z-index: -2
}

.wlPartTop {
    position: relative;
    background: url(../images/wellness/perface.png) right top/contain no-repeat;
    background-size: 45%
}

.wlPartTop__preface {
    padding: 3rem 0 6.25rem;
    position: relative;
    color: #fff
}

.wlPartTop__preface:before {
    content: '';
    position: absolute;
    background: var(--mainColor);
    opacity: .85;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    /* opacity: .85; */
    /* filter: brightness(0.5); */
    mix-blend-mode: multiply;
}

.wlPartTop__preface:after {
    content: '';
    position: absolute;
    background: url(../images/about/frosted.png) top center repeat-x;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    mix-blend-mode: color-dodge;
    opacity: .65;
}

.wlPartTop__preface .container {
    position: relative;
    z-index: 1
}

.wlPartTop__preface--inner {
    display: flex;
    flex-direction: column;
    align-items: center
}

.wlPartTop__preface__sub {
    font-size: 1.25rem;
    font-weight: 400;
    letter-spacing: .12em;
    border: 1px solid #fff;
    display: inline-block;
    padding: .25rem 1.25rem;
    border-radius: 100rem;
    margin-bottom: 2rem
}

.wlPartTop__preface__quote {
    font-size: var(--wlFont-b);
    font-weight: 500;
    letter-spacing: .12em;
    text-align: center;
    position: relative;
    display: inline-block;
    padding: 0 clamp(3rem, 5vw, 6rem)
}

.wlPartTop__preface__quote:after,
.wlPartTop__preface__quote:before {
    content: '';
    position: absolute;
    background: var(--quote) center/cover;
    width: clamp(1.5rem, 2vw, 2.25rem);
    aspect-ratio: 35/30;
    filter: brightness(100)
}

.wlPartTop__preface__quote:before {
    left: 0;
    top: 0;
    transform: translateY(-50%)
}

.wlPartTop__preface__quote:after {
    right: 0;
    bottom: 0;
    transform: rotate(180deg) translateY(-50%)
}

.wlPartTop__ct {
    padding: clamp(.75rem, 2vw, 3rem) 0 0;
    background: url(../images/wellness/bg-part1.png) right bottom/contain no-repeat;
    position: relative
}

.wlPartTop__ct:after {
    content: '';
    position: absolute;
    background: url(../images/wellness/ball.png) center/cover;
    width: clamp(4rem, 11vw, 11.25rem);
    aspect-ratio: 1;
    opacity: .15;
    left: 0;
    top: 45%;
    transform: translate(-25%, 0) rotate(-15deg)
}

.wlPartTop__ct--inner {
    display: flex;
    gap: 1rem
}

.wlPartTop__ct__tt,
.wlPartTop__ct__txt {
    flex: 1
}

.wlPartTop__base {
    padding-top: 4rem;
    position: relative
}

.wlPartTop__base:after {
    content: '';
    position: absolute;
    width: clamp(2rem, 6vw, 6.25rem);
    aspect-ratio: 1;
    background: url(../images/wellness/ball.png) center/cover;
    opacity: .15;
    left: 2%;
    top: 0;
    transform: translateY(-50%) rotate(15deg);
    filter: blur(.125rem)
}

.wlPartTop__base--inner {
    width: 54%
}

.wlTag--wrapper {
    display: flex;
    margin-bottom: 1.5rem;
    gap: .5rem clamp(3rem, 7vw, 7.5rem)
}

.wlTag {
    background: #005d6e;
    display: inline-block;
    color: #fff;
    font-size: clamp(1rem, 1vw, 1.25rem);
    letter-spacing: .12em;
    padding: .25rem clamp(1rem, 5vw, 1.5rem);
    border-radius: 100rem
}

.wlText__txt {
    font-size: var(--wlFont);
    line-height: 1.9;
    letter-spacing: .01em
}

.wlpTxtCover {
    text-align: right;
    margin-top: 1.5rem
}

.wlpTxtCover__pic {
    width: clamp(20rem, 33vw, 34rem)
}

.wlPCover,
.wlPTxtImg {
    margin: 0
}

.wlPTxtImg {
    transform: translateX(calc(clamp(1rem, 3vw, 4rem) * -1));
    display: inline-block
}

/*!保健觀(電/熱/動/激能)*/
.wlSpSet {
    padding-right: calc((100vw - var(--container))/ 2 - 2.5rem)
}

.wlPartMain {
    display: flex;
    flex-direction: column;
    overflow: hidden
}

.wlPartMain__item {
    display: flex;
    position: relative;
    align-items: flex-start;
    padding: clamp(1rem, 2vw, 3rem) 0;
    justify-content: space-between
}

.wlPartMain__item--blue {
    margin-top: 4rem
}

.wlPartMain__item--red:before {
    content: '';
    position: absolute;
    background: url(../images/wellness/ball-red.png) center/cover;
    width: clamp(4rem, 10vw, 11.25rem);
    aspect-ratio: 1;
    opacity: .15;
    transform: translate(40%, -70%);
    top: 0;
    right: 0
}

.wlPartMain__item--green:before {
    content: '';
    position: absolute;
    background: url(../images/wellness/ball.png) center/cover;
    width: clamp(4rem, 10vw, 11.25rem);
    aspect-ratio: 1;
    opacity: .15;
    transform: translate(50%, 0) rotate(-15deg);
    top: 42%;
    right: 0
}

.wlPartMain__item--blue:after {
    top: 15%
}

.wlPartMain__item--blue .wlPartTt__txt {
    padding: 0
}

.wlPartMain__item__tt {
    display: flex;
    width: clamp(10rem, 12vw, 12.5rem)
}

.wlPartMain__item--green .wlPartMain__item__tt {
    transform: translateY(-25%)
}

.wlPartMain__item__ct {
    display: flex;
    width: calc(100% - clamp(8rem, 12vw, 12.5rem))
}

.wlPartMain__item:last-child .wlPartMain__item__ct {
    margin-right: -8%
}

.wlPartTt {
    margin: 0;
    display: flex;
    gap: 1rem
}

.wlPartCtBox {
    width: calc(100% - clamp(10rem, 32vw, 35.5rem))
}

.wlPartPdt {
    display: flex;
    gap: 1em 2.5rem;
    margin-bottom: 2rem;
    flex-wrap: wrap
}

.wlPartTt__txt {
    display: inline-block;
    transform-origin: left top;
    color: #898989;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: .03em;
    margin-right: -.03em;
    writing-mode: vertical-rl;
    padding-top: 1rem
}

.wlPartTt__pic {
    width: clamp(8rem, 15vw, 15.625rem);
    aspect-ratio: 250/495
}

.wlPartPdt__en {
    color: var(--mainColor);
    border-radius: 100rem;
    border: .125rem solid var(--mainColor);
    font-size: 1.375rem;
    font-weight: 500;
    padding: 0 1.25rem;
    letter-spacing: .05em;
    display: inline-block
}

.wlPartPdt__tt {
    margin: 0
}

.wlPartPdt__tt__pic {
    aspect-ratio: 320/40;
    height: 2.5rem
}

.wlPartCtBox__imgG {
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.125rem;
    max-width: clamp(20rem, 64vw, 65rem);
    position: relative;
    z-index: 2;
    width: calc(100% + var(--wlSpace));
    min-width: 38rem
}

.wlPartCtBox__imgG figcaption {
    grid-column: span 2;
    font-size: clamp(1.5rem, 1.8vw, 1.875rem);
    letter-spacing: .12em;
    font-weight: 500;
    color: var(--darkGreen);
    text-align: center
}

.wlPartCtBox__tt--inner {
    font-size: clamp(1.375rem, 2vw, 2.5rem);
    letter-spacing: .12em;
    font-weight: 500;
    padding: .5rem;
    color: #fff;
    background: var(--bg);
    display: block;
    position: relative
}

.wlPartCtBox__tt--inner:after {
    content: '';
    position: absolute;
    aspect-ratio: 32/72;
    height: 100%;
    background: var(--bg);
    clip-path: polygon(0 0, 0 100%, 100% 0);
    top: 0;
    right: .5px;
    transform: translateX(100%)
}

.wlPartCtBg {
    background: url(../images/wellness/bg-p1.png) center/cover;
    position: relative;
    z-index: 0
}

.wlPartCtBox__txt {
    position: relative;
    padding: 2.5rem 0 clamp(4rem, 8vw, 8.5rem);
    color: #fff;
    line-height: 1.9;
    z-index: 0;
    font-size: var(--wlFont);
    letter-spacing: .1em
}

.wlPPdtCover {
    margin: 0;
    position: relative;
    z-index: 1
}

.wlPPdtCover__pic {
    width: clamp(10rem, 32vw, 35.5rem);
    aspect-ratio: 585/300
}

.wlPartMain__item:nth-child(1) {
    background: url(../images/wellness/bg-part1-1.png) left bottom/50% no-repeat;
}

.wlPartMain__item:nth-child(1) .wlPartCtBg:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: url(../images/wellness/bg-ct1.png?20241113)no-repeat right bottom/contain;
    left: 0;
    top: 0;
    z-index: -1
}

.wlPartMain__item:nth-child(3) .wlPartCtBg:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: url(../images/wellness/bg-ct3.png) center/cover;
    left: 0;
    top: 0;
    z-index: -1
}

.wlPartMain__item:nth-child(4) .wlPartCtBg:after {
    content: '';
    position: absolute;
    aspect-ratio: 263/188;
    background: url(../images/wellness/bg-ct4.png) center/cover;
    right: 0;
    top: 76px;
    bottom: 0;
    z-index: -1
}

.wlPartMain__item:nth-child(4) .wlPartCtBox__txt {
    color: #666
}

.wlPartCtBox__tt:has(.wlPartCtBox__tt__text) {
    padding-left: var(--wlSpace);
    display: flex;
    align-items: center;
    height: 76px;
    background: #7cc1a0
}

.wlPartCtBox__tt__pic {
    margin-bottom: 0;
    margin-left: -4.5%;
    transform: translateY(-1rem)
}

.wlPartCtBox__tt__pic img {
    width: clamp(20rem, 45vw, 46.25rem)
}

.wlPartCtBox__tt__text {
    font-size: clamp(1.25rem, 1.5vw, 2.5rem);
    font-size: clamp(1.375rem, 2vw, 2.5rem);
    letter-spacing: .12em;
    font-weight: 500;
    padding: .5rem .25rem;
    color: #fff;
    display: block;
    position: relative
}

.wlPartMain__item--red .wlPartCtBg {
    background: #d89292
}

.wlPartMain__item--red {
    background: url(../images/wellness/bg-p2.png) no-repeat right bottom
}

.wlPartMain__item--red .wlPPdtCover:after {
    content: '';
    position: absolute;
    width: clamp(12rem, 35vw, 35.5rem);
    aspect-ratio: 585/300;
    background: url(../images/wellness/partPdt2-deco.png) center/cover;
    left: 0;
    top: 0;
    mix-blend-mode: color
}

.wlPartMain__item--blue .wlPartCtBg {
    background: #83b7b6
}

.wlPartMain__item--green .wlPartCtBg {
    background: #dceae2
}

.wlPartTxt {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    pointer-events: none;
    z-index: 0
}

.wlPartTxt:after {
    content: '';
    position: absolute;
    z-index: -1
}

.wlPartTxt--1:after {
    background: url(../images/wellness/txt-p1.png) center/cover;
    aspect-ratio: 635/195;
    width: clamp(20rem, 40vw, 40rem);
    bottom: 17.5%;
    left: 2%
}

.wlPartTxt--2:after {
    background: url(../images/wellness/txt-p2.png) center/cover;
    aspect-ratio: 465/180;
    width: clamp(12rem, 29vw, 29rem);
    bottom: 13%;
    right: 5%
}

.wlPartTxt--3:after {
    background: url(../images/wellness/txt-p3.png) center/cover;
    aspect-ratio: 525/190;
    width: clamp(14rem, 32vw, 32rem);
    bottom: 25%;
    left: 5%
}

.wlPartTxt--4:after {
    background: url(../images/wellness/txt-p4.png) center/cover;
    aspect-ratio: 945/170;
    width: clamp(24rem, 59vw, 59rem);
    bottom: 27%;
    right: 2%
}

.wlPartTxt--4__txt {
    font-size: clamp(1rem, 1.5vw, 1.875rem);
    font-weight: 500;
    letter-spacing: .12em;
    border: .125rem solid var(--darkGreen);
    color: var(--darkGreen);
    padding: .375rem 2.5rem;
    border-radius: 100rem;
    display: inline-block
}

.wlPartTxt--4__txt:after {
    content: '';
    position: absolute;
    width: 7.5rem;
    aspect-ratio: 1;
    background: url(../images/wellness/ball.png) center/cover;
    transform: translate(-40%, 10%) rotate(15deg);
    opacity: .15;
    left: 0;
    z-index: -1
}

/*!保健觀(我們的開發原則)*/
.wlBlock--choice {
    background: linear-gradient(to right, #e8ebed, #d9e6e9);
    padding: 6.25rem 0;
    text-align: center
}

.wlBlock--choice .container {
    max-width: calc(100% - clamp(4rem, 5vw, 6rem));
    position: relative;
    z-index: 1
}

.wlTitle--wrapper {
    position: relative;
    z-index: 1
}

.wlBlock--choice .wlTitle--wrapper:after {
    content: '';
    position: absolute;
    aspect-ratio: 910/105;
    width: min(clamp(30rem, 55vw, 56.875rem), 100%);
    left: 50%;
    top: 0;
    transform: translate(-50%, -50%);
    z-index: -1;
    background: url(../images/wellness/txt-choice.png) center/cover
}

.wlChoiceSlogan--wrapper {
    display: flex;
    justify-content: center;
    margin: 2rem 0 3rem
}

.wlChoiceSlogan {
    position: relative;
    background: #fff;
    display: block;
    padding: 1rem clamp(5rem, 6vw, 10rem);
    font-size: clamp(1.5rem, 2vw, 2.25rem);
    color: var(--darkGreen);
    font-family: 'Noto Serif TC', serif;
    font-style: italic;
    font-weight: 700;
    letter-spacing: .23em
}

.wlChoiceSlogan:after,
.wlChoiceSlogan:before {
    content: '';
    position: absolute;
    background: var(--quote) center/cover;
    width: clamp(1.75rem, 2vw, 2.25rem);
    aspect-ratio: 35/30
}

.wlChoiceSlogan:before {
    left: clamp(1rem, 3vw, 4.5rem);
    top: 0;
    transform: translateY(-50%)
}

.wlChoiceSlogan:after {
    right: clamp(1rem, 3vw, 4.5rem);
    bottom: 0;
    transform: translateY(50%) rotate(180deg)
}

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

.wlChoiceBox__item {
    position: relative;
    padding: clamp(.75rem, 1vw, 1.25rem) clamp(.5rem, 1vw, 1.25rem);
    display: flex;
    flex-direction: column;
    gap: clamp(1rem, 1.2vw, 1.5rem)
}

.wlChoiceBox__item+.wlChoiceBox__item:before {
    content: '';
    position: absolute;
    background: #bcbcbc;
    width: 1px;
    height: 80%;
    left: 0;
    bottom: 0
}

.wlChoiveIcon {
    margin: 0;
    text-align: center
}

.wlChoiveIcon__pic {
    width: clamp(5rem, 85%, 10rem);
    aspect-ratio: 1;
    font-size: 1.25rem;
    color: #fff
}

.wlChoiceBox__item__tt {
    background: #005d6e;
    border-radius: 100rem;
    padding: clamp(.125rem,1vw,.5rem) .5rem;
    padding-left: calc(.5rem + .12em);
    color: #fff;
    text-align: center;
    margin: 0 clamp(.25rem, .5vw, 1rem);
    font-weight: 500;
    letter-spacing: .12em;
    font-size: clamp(1rem, 1.2vw, 1.25rem);
}

.wlChoiceBox__item__text {
    font-size: clamp(.875rem, .95vw, 1.025rem);
    color: #666;
    text-align: center
}

.decoBall__img[class*="--choiceB"] {
    opacity: .22
}

.decoBall__img.--choiceB1 {
    width: clamp(10rem, 15vw, 17.25rem);
    left: 0;
    top: 0;
    transform: translateX(-30%) rotate(-145deg)
}

.decoBall__img.--choiceB2 {
    width: clamp(5rem, 10vw, 10rem);
    right: 5%;
    top: 4%;
    transform: rotate(8deg);
    opacity: .17
}

.decoBall__img.--choiceB3 {
    width: clamp(5.25rem, 9vw, 11.25rem);
    top: 34%;
    left: 20%;
    transform: rotate(-8deg);
    filter: blur(1.125rem)
}

.decoBall__img.--choiceB4 {
    width: clamp(15rem, 20vw, 20rem);
    transform: translate(50%, 35%) rotate(-8deg);
    right: 0;
    top: 15%
}

.decoBall__img.--choiceB5 {
    width: clamp(18rem, 23vw, 23.5rem);
    transform: translateX(-35%) rotate(-8deg);
    left: 0;
    bottom: 10%;
    filter: blur(1rem)
}

.decoBall__img.--choiceB6 {
    width: clamp(5rem, 10vw, 11.25rem);
    right: 0;
    bottom: 0;
    transform: translate(25%, -40%) rotate(8deg)
}

/*!RWD*/
@media screen and (min-width: 992px) {
    .mbShow {
        display: none
    }

    .wlPartMain__item:nth-child(1) .wlPartMain__item__tt {
        margin-top: -2rem
    }

    .wlPartMain__item:nth-child(odd) .wlPartMain__item__tt {
        margin-left: max(calc((100vw - var(--container))/ 2 - 2.5rem), 6.25rem);
        margin-right: calc((clamp(3rem, 7vw, 7.5rem) + 2rem)* -1)
    }

    .wlPartMain__item:nth-child(even) .wlPartMain__item__tt {
        margin-right: max(calc((100vw - var(--container))/ 2 - 2.5rem), 8.75rem);
        margin-left: calc((clamp(3rem, 7vw, 7.5rem) + 2rem)* -1)
    }

    .wlPartMain__item:nth-child(odd) .wlPartTt {
        transform: translateX(-20%)
    }

    .wlPartMain__item:nth-child(even) .wlPartTt {
        flex-direction: row-reverse;
        transform: translateX(48%)
    }

    .wlPartMain__item:nth-child(even) .wlPartMain__item__ct {
        flex-direction: row-reverse
    }

    .wlPartMain__item:nth-child(even) {
        flex-direction: row-reverse;
        padding-top: 4rem
    }

    .wlPartMain__item:nth-child(odd) .wlPartCtBox__tt {
        padding-right: var(--wlSpace)
    }

    .wlPartMain__item:nth-child(odd) .wlPartCtBox__tt--inner {
        padding-left: clamp(3rem, 5vw, 7.5rem)
    }

    .wlPartMain__item:nth-child(even) .wlPartCtBox__tt--inner {
        padding-left: max(var(--wlSpace), 1rem);
        display: inline-block
    }

    .wlPartMain__item:nth-child(odd) .wlPartCtBox__txt {
        padding-left: clamp(3rem, 5vw, 7.5rem);
        padding-right: max(var(--wlSpace), 1rem)
    }

    .wlPartMain__item:nth-child(even) .wlPartCtBox__txt {
        padding-right: clamp(3rem, 7vw, 7.5rem);
        padding-left: max(var(--wlSpace), 1rem)
    }

    .wlPartMain__item:nth-child(odd) .wlPartCtBox__imgG {
        margin-right: var(--wlSpace);
        margin-left: calc(var(--wlSpace) * -.5);
        transform: translateY(-6rem);
        transform: translateY(calc(clamp(3rem, 7vw, 7rem) * -1))
    }

    .wlPartMain__item:nth-child(even) .wlPartCtBox__imgG {
        margin-left: max(var(--wlSpace), var(--containerPadding));
        margin-right: calc(var(--wlSpace) * -.5);
        transform: translateY(calc(clamp(3rem, 7vw, 7rem) * -1))
    }

    .wlPartMain__item:nth-child(odd) .wlPPdtCover {
        transform: translate(calc(clamp(3rem, 7vw, 7.5rem) + 2rem), -6%)
    }

    .wlPartMain__item:nth-child(even) .wlPPdtCover {
        transform: translate(calc((clamp(3rem, 7vw, 7.5rem) + 2rem) * -1), -6%)
    }

    .wlPartMain__item:nth-child(odd) .wlPartPdt {
        padding-left: clamp(3rem, 7vw, 7.5rem)
    }

    .wlPartMain__item:nth-child(even) .wlPartPdt {
        padding-left: var(--wlSpace)
    }

    .wlPartMain__item:nth-child(3) .wlPartMain__item__ct {
        width: 100%
    }

    .wlPartMain__item:nth-child(2) .wlPartCtBox__imgG {
        padding-left: clamp(2rem, 7vw, 7.5rem);
    }

    .wlPartMain__item:nth-child(2) .wlPartCtBox__imgG:after {
        content: '';
        position: absolute;
        background: url(../images/wellness/ball-red.png) center/cover;
        width: clamp(4rem, 10vw, 11.25rem);
        aspect-ratio: 1;
        opacity: .15;
        transform: translate(-50%, 75%);
        bottom: 0;
        left: 0;
        z-index: -1;
        filter: blur(.25rem)
    }


    .wlPartMain__item:nth-child(3) .wlPartCtBox__imgG {
        margin-left: calc(var(--wlSpace) * .375);
    }

    .wlPartMain__item:nth-child(4) .wlPartPdt {
        margin-left: clamp(16rem, 40vw, 43rem);
        display: flex
    }

    .wlPartMain__item:nth-child(4) .wlPartCtBox__txt {
        padding-top: 5rem;
        padding-right: clamp(3rem, 12vw, 13rem);
    }

    .wlPartMain__item:nth-child(4) .wlPartCtBox__txt p {
        max-width: clamp(20rem, 64vw, 65rem)
    }

    .wlPartMain__item:last-child .wlPartMain__item__ct {
        flex-direction: row
    }

    .wlPartCtBox:only-child {
        width: calc(100% - clamp(10rem, 12vw, 12.5rem) - 4rem)
    }

    .wlPartMain__item:after {
        content: '';
        position: absolute;
        width: 100%;
        height: 30%;
        left: 0;
        top: 8%;
        background: linear-gradient(to right, #e8ebed, #d9e6e9);
        z-index: -1
    }

    .wlPartMain__item--blue:after {
        height: 19vw;
    }

    .wlPartMain__item--green:after {
        opacity: .5;
        top: 5%;
        height: 25%
    }

    .wlPartMain__item--red:after {
        background: #f4eded;
        top: 0
    }

    .wlPartTxt--4__txt {
        position: absolute;
        bottom: 17.5%;
        right: 6%
    }
}

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

    /*!1640 保健觀(health健康，從根本調理)*/
    .wlEffR {
        width: 100%;
        /* padding-right:10vw; */
        /* padding-left: 10vw; */
    }

    .wlEffBoxlCover {
        /* display: none; */
        position: absolute;
        left: 0;
        top: 0;
        background: url(../images/wellness/health2-1.png) center / cover;
        width: var(--topPic);
        aspect-ratio: 9 / 13;
        z-index: 1;
    }

    .wlEffBox__txt {
        position: relative;
        display: flex;
        flex-direction: column;
        padding-left: calc(var(--topPic) + 5%);
        padding-right: var(--containerPadding);
        padding-right: 10vw;
    }

    .wlEffBox__txt .wlEffBoxTCover {
        order: 1;
        align-items: flex-start
    }

    /* .wlEffR:after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        background: url(../images/wellness/health2-1.png) center/cover;
        width: var(--topPic);
        aspect-ratio: 9/13;
        z-index: 1
    } */

    .wlEffBox__tImg {
        padding: 0 2rem;
        padding: 0 0 0 calc(var(--topPic) * .85);
    }
}

@media screen and (max-width: 1400px) {
    .wlKvTt__sub {
        flex-direction: column-reverse;
        margin-top: 2rem;
    }
}

@media screen and (max-width: 1200px) {
    .wlBalBox--inner:after {
        left: 1%
    }

    .wlChoiceBox {
        grid-template-columns: repeat(3, 1fr)
    }

    .wlChoiceBox__item:nth-child(3n+1)::before {
        display: none
    }
}

@media screen and (max-width: 991px) {
    .wlDeco {
        width: clamp(3rem, 3vw, 4rem)
    }

    .wlTitle__tt:has(.wlDeco) {
        display: flex;
        gap: 1rem 3rem;
        flex-wrap: wrap
    }

    .wlPartTop {
        /* padding-top:4rem; */
    }

    .wlPartTop__base {
        /* padding:0; */
    }

    .wlPTxtImg {
        position: absolute;
        z-index: 1;
        right: 0;
        top: 2rem;
        width: 60%;
    }

    .wlpTxtCover {
        position: absolute;
        right: 0;
        bottom: 0;
    }

    .wlBlock .container {
        max-width: 100%
    }

    .kvTextImg {
        order: -1;
        width: 70%;
    }

    .wlKvTt__sub {}

    .wlKvTt {
        gap: 1rem;
    }

    .wlKvBox {
        margin: 0
    }

    .wlKvBox__text {
        width: 80%;
        padding-left: 1rem
    }

    .wlBalStep {
        flex-wrap: wrap
    }

    .wlBalStep__item {
        width: calc(100% / 3)
    }

    .wlBalBox__tt__mj+img {
        display: none
    }

    .wlBorad br {
        display: none
    }

    .kvBlock,
    .wlHealthBox--wrapper::before {
        width: 85%;
        height: 6.5rem
    }

    .wlHealthBox--wrapper::before {
        width: 85%;
        height: 40%
    }

    .wlHealthBox__img {
        width: 80vw;
        transform: translateX(-50%);
        margin: -10% 0 0 auto;
        left: 50%;
        background: url(../images/wellness/health1-m.png) center bottom/cover no-repeat;
        background-position: 85% bottom;
        background-size: cover;
    }

    .wlHealthBox__img__pic {
        width: 100%;
        opacity: 0;
        aspect-ratio: 75/61;
    }

    .wlHealthBox {
        flex-direction: column
    }
    
    .wlHealthBox__text {
        width: 80%;
    }


    .wlEffBox__tImg {
        display: flex;
        flex-direction: column;
        padding-right: 10vw;
    }

    .wlEffBoxCover__pic {
        width: 100%;
        aspect-ratio: 960/370
    }

    .wlEffBox__tImg__text br {
        display: none
    }

    .wlPartCtBox__txt {
        padding: 1rem clamp(2rem, 4vw, 5rem);
        padding-bottom: 5rem
    }

    .wlPPdtCover,
    .wlPartCtBox__tt__pic,
    .wlPartPdt,
    .wlPartTt {
        display: none
    }


    .wlPartMain__item {
        flex-direction: column;
        margin: 0;
        padding: 3rem 0 clamp(1rem, 2vw, 3rem);
    }

    .wlPartMain__item__ct {
        width: 100%;
        flex-direction: column
    }

    .wlPartCtBox {
        width: 100%
    }

    .wlPartCtBox__tt--inner,
    .wlPartCtBox__tt__text {
        padding: .5rem clamp(1rem, 4vw, 2rem);
        font-size: clamp(1rem, 3vw, 1.5rem);
        text-align: center;
        margin: auto;
    }

    .wlPartCtBox__tt:has(.wlPartCtBox__tt__text) {
        height: auto;
    }

    .wlPartTop__ct--inner {
        flex-direction: column
    }

    .wlPartTxt--4 {
        position: relative;
        text-align: center;
        display: block;
        pointer-events: all;
        padding-bottom: 5rem;
    }

    .wlPartCtBox__imgG {
        min-width: calc(100% - 4rem);
        margin: -3rem auto 2rem;
        gap: 0.5rem;
    }

    .mbShow {
        position: relative
    }

    .mbShow img {
        position: relative;
        z-index: 1
    }

    .mbShow:after {
        content: '';
        position: absolute;
        width: 100%;
        height: 60%;
        left: 0;
        bottom: 0
    }

    .wlPartMain__item .mbShow:after {
        background: linear-gradient(to right, #e8ebed, #d9e6e9)
    }

    .wlPartMain__item--red .mbShow:after {
        background: #f4eded
    }

    .wlPartTxt:not(.wlPartTxt--4) {
        display: none
    }

    .wlPartMain__item:after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%, -50%);
        height: clamp(1.25rem, 5vw, 2.5rem);
    }

    .wlPartMain__item:first-child:after {
        background: url(../images/wellness/txt-p1-m.png) center/cover;
        aspect-ratio: 641/49
    }

    .wlPartMain__item--red:after {
        background: url(../images/wellness/txt-p2-m.png) center/cover;
        aspect-ratio: 565/49;
    }

    .wlPartMain__item--blue:after {
        background: url(../images/wellness/txt-p3-m.png) center/cover;
        aspect-ratio: 521/45;
        top: unset
    }

    .wlPartMain__item--green:after {
        background: url(../images/wellness/txt-p4-m.png) center/cover;
        aspect-ratio: 641/111;
        height: 5rem;
        transform: translate(-50%, -35%);
    }

    .wlPartTxt--4:after {
        content: none
    }

    .wlPartCtBox__imgG figcaption {
        font-size: clamp(0.875rem, 3vw, 1.5rem);
    }

    .wlPartTxt--4__txt:after {
        right: 0;
        left: unset;
        transform: translate(30%, -70%);
    }

    .wlEffBox__txt {
        padding-left: calc(var(--topPic) + 2%);
    }
}

@media screen and (max-width: 768px) {
    :root {
        --wlFont-b: clamp(1.125rem, 1.4vw, 1.5rem)
    }

    .wlKvTt {
        height: 100%;
        justify-content: flex-end;
    }

    .wlKvTt__sub {
        margin-top: 0
    }

    .wlKvBox {
        padding-left: 2rem;
        padding-bottom: 5rem;
        display: flex;
        align-items: flex-end;
        height: 100%
    }

    .wlKvBox__text {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 1.25rem;
        top: 0;
        z-index: 1
    }

    .wlKvBox__pic {
        width: 100%;
        aspect-ratio: 305/440;
        object-fit: cover;
        background: url(../images/wellness/kv-m.png) center/cover;
        margin-left: 3rem;
        /* transform: translateY(-1.5rem); */
        border-radius: 20vw 0 0 0;
    }

    .wlKvBox__pic__img {
        opacity: 0;
        height: 100%
    }

    .kvTextImg {
        position: absolute;
        left: 0;
        top: 3vw;
        transform: translateY(100%);
        width: 70vw;
    }

    .wlKvBox .line {
        background: #c9c9c9
    }

    .wlBlock .container {
        max-width: calc(100% - 1rem)
    }
    .wlBlock--choice .container{max-width: 100%;/* padding-left: 1rem; *//* padding-right: 1rem; */}
    .wlBlock--kv {}

    .wlBlock--health {
        background: linear-gradient(to bottom, #fbfafb 0, #f6f5f7 calc(100% - 32%), #fff calc(100% - 32%))
    }

    .wlBlock--health .container {
        max-width: calc(100% - 2rem)
    }

    .wlBorad {
        padding: 1.25rem 0
    }

    .wlBorad::after {
        left: -1.25rem;
        right: -1.25rem;
        width: auto
    }

    .wlBorad:before {
        left: 0;
        transform: translate(-75%, -50%) rotate(45deg);
    }

    .wlTagDot {
        flex-direction: row-reverse;
        align-items: center;
        margin-left: auto;
    }

    .wlTitle__sub {
        padding-right: 20%
    }
    
    .wlTitle--centerLine .wlTitle__sub{padding-right:0}
    .wlHealthBox__img{width:100vw}
    .wlHealthBox__text {
        width: 100%;
    }
    .wlHealthBox__text {
        margin-bottom: -2rem
    }

    .wlHealthBox__img {
        aspect-ratio: 375/305
    }

    .wlBlock--balance .container {
        max-width: 100vw;
        padding: 0 .5rem
    }

    .wlBlock--balance .wlBalBox__tt__mj {
        width: 100%;
        margin: 0 .25rem;
        padding: 1rem .25rem;
        letter-spacing: .02em;
        font-size: clamp(1.25rem, 1.2vw, 1.5rem);
        border-width: 1px;
    }

    .wlBalBox__tt__mj .icon {
        width: clamp(1.5rem, 8vw, 2rem)
    }

    .wlBalBox__tt__mj .txtBreak {}

    .wlBalBox__tt__mj .txtBreak:nth-child(1) {
        font-size: 125%;
    }

    .wlBalBox__tt__mj .mk {
        margin: 0;
        margin-right: -.4em;
        background: transparent;
    }

    .sliceBtm,
    .sliceTop {
        height: clamp(4.375rem, 5rem, 8rem)
    }

    .wlBalTt {
        width: 90%;
        /* font-size: 1.25rem; */
    }

    .wlBalTop:before {
        top: 10rem;
        transform: translate(-50%, 0);
        background: url(../images/wellness/txt-lose1.png) center / contain;
        width: 100%;
    }

    .wlBalStep {
        width: calc(100vw - 2rem);
        left: 50%;
        transform: translateX(-50%);
        gap: .5vw;
    }

    .wlBalStep__item {
        width: calc(100% / 3 - .5vw);
    }

    .wlBalStep__item:nth-child(-n+3) {
        transform: translateX(-.5vw);
    }

    .wlBalStep__item:nth-child(n+4) {
        transform: translateX(1vw);
    }

    .wlBalStep__item:nth-child(3):after {
        content: '';
        position: absolute;
        width: clamp(.6rem, 1.2vw, 1.5rem);
        aspect-ratio: 1;
        background: var(--mainColor);
        clip-path: polygon(100% 50%, 0 0, 0 100%);
        right: -.25rem;
        top: 50%;
        transform: translate(50%, -50%)
    }

    .wlBalStep__item+.wlBalStep__item:before {
        left: -.2rem;
    }

    .wlBalStep__item img {
        transform: scale(1.15);
    }

    .wlBalList {
        margin-left: -.5rem;
        margin-right: -.5rem;
        width: calc(100% + 1rem);
    }

    .wlBalList__item {
        padding: 0
    }

    .wlBalList__item__tt {
        margin: 0 .5rem .5rem;
        padding: .5rem 0;
    }

    .wlEffBox__tImg {
        display: flex;
        flex-direction: column
    }



    .wlEffR {
        /* width: 100%; */
        padding-right: 0;
    }

    .wlEffBox__txt {
        /* position: relative; */
        /* padding-left: clamp(8rem,25vw,25rem); */
        padding-left: var(--topPic);
        padding-right: var(--containerPadding);
        gap: 0;
    }



    .wlBlock--health .wlEffBox__txt__tt {
        padding-right: 0;
        padding-left: 1rem;
    }

    .wlEffBox__tImg {
        /* padding: 0 2rem; */
        padding: 0 var(--containerPadding);
    }

    .wlEffBoxTCover__pic {
        height: 2.5rem;
        object-fit: contain
    }

    .wlEffBoxTCover {
        /* transform: translateX(calc(clamp(10rem, 25vw, 25rem) * -.25)); */
    }

    div:has(>.txtBreak) {
        display: flex;
        flex-direction: column;
        padding: .5rem 1.5rem;
    }


    .wlPartTop__base--inner {
        width: 85%
    }

    .wlPartTop__preface .container {
        max-width: 100%;
        padding: 0 1rem
    }

    .wlPartTop__base {
        padding-top: 15vw;
    }

    .wlPTxtImg {
        transform: none;
        position: static;
        width: auto;
    }

    .wlpTxtCover {
        position: static;
        margin: 1rem 0 0;
    }

    .wlPartTop__preface {
        padding: 3rem 0 3.5rem
    }

    .wlPartTop__preface__quote {
        padding: clamp(1rem, 2vw, 2rem) 0 clamp(1.5rem, 2.5vw, 2.5rem);
        width: auto
    }

    .wlBalBox--inner::after {
        content: none
    }

    .wlBalBox__tt--sub {
        position: relative;
        font-weight: 500;
    }

    .wlBalBox__tt--sub::after {
        content: '';
        background: url(../images/wellness/txt-modern-m.png) center/cover;
        aspect-ratio: 581/105;
        left: 50%;
        top: 50%;
        width: 85%;
        position: absolute;
        transform: translate(-50%, -50%);
        opacity: .5
    }

    .wlPartTop {
        background-size: 95% auto;
        background-position-y: 4rem;
    }

    .wlChoiceSlogan {
        font-size: clamp(1.5rem, 5vw, 1.5rem);
    }
}

@media screen and (max-width: 640px) {
    .wlPartTop__ct {
        padding: 0
    }

    /* .wlEffR:after {
        top: 3rem;
    } */
    .wlEffBoxlCover {
        top: 5rem;
        transform: scale(1.25) translateX(-10%);
    }

    .kvBlock,
    .wlHealthBox--wrapper::before {
        /* width:100%; */
    }

    .kvBlock {
        width: 100%;
        background: linear-gradient(to right, #e8ebed 0%, #d9e6e9 85%, #fbfafb 85%, #fbfafb 100%);
    }

    .wlPartMain__item:nth-child(1) .wlPartCtBg:after{
        background: url(../images/wellness/bg-ct1.png?20241113) no-repeat right center/ auto 80%;
    }
    .wlPartMain__item:nth-child(4) .wlPartCtBg:after{
        top: 0;
        background: url(../images/wellness/bg-ct4.png) right top/ auto 100%;
    }
}

@media screen and (max-width: 480px) {
    .wlBlock .container {
        max-width: 100%
    }
    .wlBlock--choice .wlBrief{max-width: 260px;margin: auto;}
    .wlHealthBox--wrapper:after {}

    .wlPartTop__preface__sub {
        font-size: .875rem;
        margin-bottom: 1rem
    }

    .wlPartTop__preface {
        padding: 2rem 0 2.5rem
    }

    .wlPartTop__preface__quote {
        padding: 0;
        padding-bottom: 1.5rem
    }

    .wlText__txt br {
        display: none
    }

    .wlChoiceBox {
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        width: 100vw
    }

    .wlChoiveIcon {
        width: 80%;
        margin: auto
    }

    .wlPartTxt--4 {
        padding-bottom: 4rem
    }

    .wlPartMain__item:after {
        height: auto;
        width: 75%;
        transform: translate(-50%, -50%);
    }

    .wlPartTxt--4__txt {
        padding: 0.25rem 1rem;
        margin-bottom: -1rem;
    }

    .wlBalStep{
        gap: 1rem .25rem;
    }

    .wlBalStep__item {
        width: calc(100% / 3 - .25rem);
    }

    .wlBalStep__item:nth-child(-n+3) {
        transform: translateX(-.5rem);
    }

    .wlBalStep__item:nth-child(n+4) {
        transform: translateX(.5rem);
    }

    .wlBalStep__item+.wlBalStep__item:before{
        left:-1px;
    }

    .wlPartCtBox__tt--inner,
    .wlPartCtBox__tt__text {
        padding: .5rem .125rem;
    }

    
}
@media screen and (max-width: 370px) {
    .wlEffBox__txt__tag{margin-left: -2rem;margin-right: -1rem;}
}