﻿.NEW-HEADER-STYLE li.LOGO a,
.NEW-HEADER-STYLE li.ICON a {
    color: black;
}



SEO-BLOCK,
SEO-TEXTS {
    clear: both;
    display: block;
}



SEO-BLOCK h1,
SEO-TEXTS h2,
SEO-TEXTS p,
SEO-BLOCK a {
    text-transform: uppercase;
}

SEO-BLOCK h1,
SEO-TEXTS h2 {
    margin-top: 0;
}

SEO-BLOCK h1 strong.HIDDEN-STYLE,
SEO-TEXTS h2 strong.HIDDEN-STYLE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3 strong.HIDDEN-STYLE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3.SHRINK-STYLE strong.HIDDEN-STYLE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4 strong.HIDDEN-STYLE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4.ENLARGE-STYLE strong.HIDDEN-STYLE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5 strong.HIDDEN-STYLE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5.COLOR-LIGHTEN strong.HIDDEN-STYLE {
    width: 0px;
    height: 0px;

    font-size: 0px;
}

SEO-BLOCK h1,
SEO-TEXTS h2,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4.ENLARGE-STYLE {
    font-size: 27px;
    font-weight: 600;
}

SEO-BLOCK h1 {
    color: white;
    text-shadow: 3px 6px 12px rgba(0, 0, 0, .85);
}

SEO-TEXTS h2 {
    color: black;
    text-shadow: 3px 6px 12px rgba(255, 255, 255, .85);
}
SEO-TEXTS h2 strong {
    display: block;
    padding-top: 9px;

    font-size: 75%;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3.SHRINK-STYLE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5 {
    font-size: 18px;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3 {
    margin: 0;

    padding-top: 12px;
    padding-bottom: 12px;
}
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3.ADD-PADDING-BOTTOM {
    padding-top: 79px;
    padding-bottom: 36px;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5 {
    margin: 0;

    padding-top: 21px;
    padding-bottom: 15px;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4.ENLARGE-STYLE {
    padding-top: 33px;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5.COLOR-LIGHTEN {
    color: #666;
}
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5.COLOR-LIGHTEN en,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5.COLOR-LIGHTEN strong {
    display: block;
}

SEO-TEXTS.TEXT-WHITE ul {
    margin-bottom: 0;
    padding-bottom: 36px;
}

SEO-BLOCK a,
SEO-TEXTS.TEXT-WHITE ul li a,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X SEO-TEXTS.TEXT-WHITE ul.TRANSFORM li a,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5.COLOR-LIGHTEN en {
    font-size: 21px;
}

SEO-TEXTS.TEXT-WHITE,
SEO-TEXTS.TEXT-WHITE h2,
SEO-TEXTS.TEXT-WHITE p,
SEO-TEXTS.TEXT-WHITE a
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .BG-COVER.MIDDLE SEO-TEXTS.TEXT-WHITE,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .BG-COVER.MIDDLE SEO-TEXTS.TEXT-WHITE h2,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .BG-COVER.MIDDLE SEO-TEXTS.TEXT-WHITE p,
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .BG-COVER.MIDDLE SEO-TEXTS.TEXT-WHITE a {
    color: white;
    text-shadow: 3px 6px 12px rgba(0, 0, 0, .85);
}

SEO-BLOCK a {
    display: block;

    max-width: 300px;

    padding: 9px 27px;

    color: black;
    background-color: rgba(255, 255, 255, .95);
}
SEO-BLOCK a:hover {
    color: white;
    background-color: black;
}

/* === === === === === === === === === ... ... ... === === === */

.COVER-WIDTH > div.REPLENISH-BLOCK,
.COVER-WIDTH > div.FINAL-BLOCK {
    display: none;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH.BACKGROUND-F2F2F2 a.BUTTON {
    padding: 12px 36px;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div > div.FOOTER-CONSUMMATION-BIT {
    padding: 18px 6px 0 6px;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div hr {
    margin: 0;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5.FOOTER-CONSUMMATION-BIT {
    padding-bottom: 12px;
}
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div.FOOTER-PADDING-BOTTOM > h5.FOOTER-CONSUMMATION-BIT {
    padding: 12px 0 12px 0;
}

SEO-TEXTS.TEXT-WHITE ul {
    padding-inline-start: 0;
}
SEO-TEXTS.TEXT-WHITE li {
    list-style-type: none;
}
SEO-TEXTS.TEXT-WHITE li::before {
    content: "．";
    font-weight: bold;
}

/* === === === === === === === === === ... ... ... === === === WeChat Block === */

#WEIXIN {
    color: #4d4d4d;
}

#WEIXIN icon {
    width: 135px;
    height: 135px;
    border-radius: 135px;

    text-align: center;
    background-color: #1aad19;
}
#WEIXIN icon i {
    color: white;
    font-size: 75px;
}

#WEIXIN border img {
    width: 225px;
    height: 225px;

    display: block;

    border: 1px solid transparent;
    border-radius: 12px;

    padding: 1px;
    background-color: #ccc;
}

#WEIXIN p,
#WEIXIN span {
    padding-left: 6px;
    padding-right: 6px;
}

#WEIXIN p {
    font-size: 24px;
    font-weight: 600;
}

#WEIXIN p middle {
    height: 57px;
}
#WEIXIN p middle img {
    width: auto;
    height: 30px;

    display: block;
}

#WEIXIN span {
    display: block;
    font-size: 15px;
}

/* === === === === === === === === === ... ... ... === === === Magazine Model Auxiliary Code === */

.POSITION-BACKGROUND {
    z-index: 3;
    position: relative;

    height: 100vh;
    background-image: url((../../index/transform.jpg);
}

/*
.POSITION-BACKGROUND > block {
    width: 100%;
    height: 100vh;

    padding: 12px;
    display: block;

    color: white;
    text-shadow: 3px 6px 9px rgba(0, 0, 0, .65);
}
*/

.POSITION-BACKGROUND > block {
    top: 0;
    left: 0;
    position: absolute;
}
.POSITION-BACKGROUND > block > div {
    height: 100vh;

    padding: 12px 36px;

    color: white;
    text-shadow: 3px 6px 9px rgba(0, 0, 0, .65);
}



.PICTURE-STYLE > p.LABEL span,
.PICTURE-STYLE > p.TITLE {
    font-size: 24px;
}

.PICTURE-STYLE > p.LABEL span {
    padding-left: 3px;
    padding-right: 3px;
}
.PICTURE-STYLE > p.TITLE span {
    display: block;
    font-size: 21px;
}



.PICTURE-STYLE MASSEUSE middle {
    height: 99px;
}
.PICTURE-STYLE MASSEUSE img {
    display: block;
}

.PICTURE-STYLE MASSEUSE > p {
    padding-left: 0;
    padding-bottom: 12px;

    width: 100%;
    max-width: 100%;

    overflow: auto;
    white-space: inherit;
    text-overflow: inherit;

    font-size: 15px;
}

/* === === === === === === === === === ... ... ... === === === */

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div.FOOTER-PADDING-BOTTOM > img {
    box-shadow: 1px 3px 6px rgba(0, 0, 0, .35);
}

/*
.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X transform {
    background-image: url(https://images.unsplash.com/photo-1553532434-5ab5b6b84993);
}
*/

.NEW-HEADER-STYLE .COLOR-WIDTH > div a::before {
    font-family: 'Noto Serif Display', 'Noto Serif TC';

    animation-name: flash;
    animation-duration: 1.5s;
    animation-iteration-count: 1;
}

.NEW-HEADER-STYLE .COLOR-WIDTH > div a.CHINESE-BUTTON::before {
    content: "中文導覽";
    font-weight: 400;
}
.NEW-HEADER-STYLE .COLOR-WIDTH > div a.ENGLISH-BUTTON::before {
    content: "ENGLISH";
    font-weight: 600;
}

/* === === === === === === === === === ... ... ... === === === */

MASSEUSE {
    clear: both;
    display: block;
    border-bottom: 1px solid #ccc;
}
MASSEUSE:hover {
    animation-name: fadeIn;
    animation-duration: 2s;
    animation-fill-mode: both;
}

MASSEUSE.TRANSPARENT-SOLID {
    border-bottom: 1px solid transparent;
}

MASSEUSE.ADD-COLOR {
    padding: 12px;
    background-color: rgba(255, 219, 219, .85);
                      rgba(255, 138, 151, .85);
                      rgba(255, 189, 196, .75);
    box-shadow: 3px 6px 9px rgba(0, 0, 0, .35);

    /*
    animation-name: fadeIn;

    animation-duration: 2s;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
    */
}

MASSEUSE middle {
    height: 111px;
    text-align: left;
}

MASSEUSE img {
    max-width: 75px;
    border-radius: 75px;
}
MASSEUSE p {
    margin: 0;
    padding-left: 12px;

    width: calc(360px - 24px - 3px - 75px);
    max-width: calc(100vw - 24px - 3px - 75px);

    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}



.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .BG-COVER.MIDDLE MASSEUSE.ADD-COLOR p {
    width: auto;

    color: black;
    text-shadow: none;
}



lattice p {
    margin-bottom: 0;

    font-size: 18px;
}
lattice inline {
    display: inline-block;

    padding-left: 3px;

    font-size: 12px;
}
lattice size {
    display: block;

    font-size: 15px;
}

/* === === === === === === === === === ... ... ... === === === */

.ANIMATE-LEFT-MIN .HEIGHT-RWD.ANIMATE-ADD {
    animation-name: fadeIn;
    animation-duration: 1.5s;
    animation-iteration-count: 1;
}

.ANIMATE-LEFT-MIN .NAVIGATION ul.FILL-ZERO {
    padding: 0;
}

.ANIMATE-LEFT-MIN .NAVIGATION ul li.LOGO.NARROW-DOWN {
    display: none;
}

.ANIMATE-LEFT-MIN .NAVIGATION ul li.ICON.NARROW-DOWN {
    width: 360px; calc(360px - 24px);
    padding-right: 0;
    text-align: inherit;
}
.ANIMATE-LEFT-MIN .NAVIGATION ul li.ICON.NARROW-DOWN a {
    width: 180px; 168px; 53px; calc(136px / 3);
    height: 42px;

    padding-right: 6px;
    background-color: transparent;
}

/*
.ANIMATE-LEFT-MIN .NAVIGATION ul li.LOGO.NARROW-DOWN,
.ANIMATE-LEFT-MIN .NAVIGATION ul li.LOGO a {
    width: 135px;
}

.ANIMATE-LEFT-MIN .NAVIGATION ul li.ICON.NARROW-DOWN {
    width: calc(360px - 135px - 24px);
}
.ANIMATE-LEFT-MIN .NAVIGATION ul li.ICON.NARROW-DOWN a {
    width: auto;
}
*/

.BG-WHITE.BECOME-TRANSPARENT.BG-COVER {
    background-color: black; transparent;
    background-image: url(masseuse/12.gif);
}

.ANIMATE-LEFT-MIN .NAVIGATION ul.BLACK-BACKGROUND {
    color: white;
    background-color: black;

    top: auto; inherit;
    bottom: 0;
}

.ANIMATE-LEFT-MIN .HEIGHT-FIXED.BG-COVER.MAX-VW,
.ANIMATE-LEFT-MIN .HEIGHT-FIXED-SCROLL.BG-COVER.MAX-VW {
    width: 100vw;
    height: calc(100vh - 42px);

    color: white;

    /*
    background-image: url(masseuse/12.gif);
    */
}

.ANIMATE-LEFT-MIN .HEIGHT-FIXED.BG-COVER.MAX-VW > div,
.ANIMATE-LEFT-MIN .HEIGHT-FIXED-SCROLL.BG-COVER.MAX-VW > div {
    clear: both;

    position: absolute;

    left: 0;
    right: 0;
    bottom: 95px; calc(95px + 24px);
}



.masseuse {
    padding: 24px 12px;
}

.masseuse p,
.masseuse span {
    margin: 0;
    display: block;
}

.masseuse p {
    font-size: 18px;
}
.masseuse p size {
    display: block;
    font-size: 21px;
}
.masseuse p size::before {
    content: "－\00a0";
}
.masseuse p size::after {
    content: "\00a0－";
}

.masseuse p inline {
    display: inline-block;
    padding-left: 3px;

    font-size: 12px;
}

.masseuse span {
    font-size: 15px;
}

.masseuse img {
    display: block;

    padding: 12px;
    max-width: 225px;

    border-radius: 50% 50% 50% 50% / 50% 50% 50% 50%;
}

/* === === === === === === === === === ... ... ... === === === */

DIALOG {
    display: inline-block;

    padding: 12px;
    position: relative;

    background: #ffbfc6; rgba(255, 179, 187, .85); #ffbfc6; #00aabb;

    border: 1px solid transparent;
    border-radius: 6px; .4em;
}

DIALOG:hover {
    animation-name: fadeIn;
    animation-duration: 2s;
    animation-fill-mode: both;
}

DIALOG:after {
    content: "";

    top: 50%;
    right: 0;
    position: absolute;

    width: 0;
    height: 0;

    margin-top: -12px;
    margin-right: -12px;

    border: 12px solid transparent;
    border-right: 0;

    border-left-color: #ffbfc6; rgba(255, 179, 187, .85); #ffbfc6; #00aabb;
}

DIALOG.RGBA {
    color: black; white;
    background: white; rgba(255, 255, 255, .75);
}
DIALOG.RGBA:after {
    border-left-color: white; rgba(255, 255, 255, .75);
}

DIALOG middle {
    height: 75px;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .BG-COVER.MIDDLE DIALOG p {
    margin: 0;
    padding-right: 12px;

    font-size: 15px;
    text-align: right;
    text-shadow: none;
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X DIALOG img {
    max-width: 75px;
    border-radius: 75px;
}



ABSOLUTE {
    clear: both;
    display: block;
}
ABSOLUTE > div {
    top: 79px;
    right: 0;
    position: absolute;
    padding: 24px 12px 12px 12px;
}
ABSOLUTE > div MASSEUSE middle {
    height: 111px;
    text-align: right;
}

/*
ABSOLUTE > div::after {
    margin: 0;
    display: block;

    content: "\f078";
    font-weight: 900;
    font-family: "Font Awesome 6 Free";

    animation-name: fadeInDown;
    animation-duration: 1.75s;
    animation-fill-mode: both;
    animation-iteration-count: infinite;

    color: white;

    font-size: 36px;
    text-align: right;
    text-shadow: 3px 6px 12px rgba(0, 0, 0, .425);
}

ABSOLUTE > div MASSEUSE::after {
    width: auto;

    margin: 0;
    display: block;

    content: url(index/content.jpg);

    animation-name: fadeInRight;
    animation-duration: 4.65s;
    animation-fill-mode: both;

    padding-top: 24px;

    text-align: right;
}
*/

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .BG-COVER.MIDDLE p.THICKEN {
    padding: 12px;
    text-shadow: 3px 6px 12px rgba(0, 0, 0, .85);
}

.ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X MASSEUSE img.SMALL-BORDER {
    display: block;

    max-width: 125px;
    border-radius: 125px;

    box-shadow: none; 3px 6px 12px rgba(0, 0, 0, .425);
}

/* === === === === === === === === === ... ... ... === === === */

#MASSEUSE.BG-COVER {
    display: block;
    background-image: url(masseuse/12.gif);
}

#MASSEUSE.BG-COVER,
#MASSEUSE.BG-COVER a {
    color: white;
}

#MASSEUSE.BG-COVER h6,
#MASSEUSE.BG-COVER p {
    margin: 0;
    text-shadow: 3px 6px 9px rgba(0, 0, 0, .5);
}

#MASSEUSE.BG-COVER > div {
    width: 100%;
    max-width: 360px;

    height: 100vh;
}

#MASSEUSE.BG-COVER > div > div {
    clear: both;
    height: calc(100% / 3);
}

#MASSEUSE.BG-COVER > div > div.ABSOLUTE-HEAD {
    height: 135px;
}
#MASSEUSE.BG-COVER > div > div.ABSOLUTE-MAIN {
    height: calc(100% - calc(135px + 200px));
            calc(calc(100% - 135px) / 2);
}
#MASSEUSE.BG-COVER > div > div.ABSOLUTE-FOOTER {
    height: 200px;
}



.ABSOLUTE-HEAD > div,
.ABSOLUTE-MAIN > div,
.ABSOLUTE-FOOTER > div {
    clear: both;
    padding: 12px;
}

.ABSOLUTE-HEAD > div > div,
.ABSOLUTE-MAIN > div > div {
    clear: both;
}



.ABSOLUTE-HEAD h6.CENTER-SIZE,
.ABSOLUTE-MAIN h6.CENTER-SIZE,
.ABSOLUTE-FOOTER h6.CENTER-SIZE {
    font-size: 100px;
    text-align: center;
}

.ABSOLUTE-HEAD h6,
.ABSOLUTE-MAIN h6,
.ABSOLUTE-FOOTER h6 {
    font-size: 21px;
}



.ABSOLUTE-HEAD > div BLOCK-LOGO,
.ABSOLUTE-HEAD > div BLOCK-ICON {
    float: left;
}



.ABSOLUTE-HEAD > div BLOCK-LOGO {
    width: 100px;
    text-align: left;
}
.ABSOLUTE-HEAD > div BLOCK-LOGO p {
    font-size: 30px;
    font-weight: 600;

    width: 100%;

    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}



.ABSOLUTE-HEAD > div BLOCK-ICON {
    width: calc(360px - 100px - 24px);

    text-align: right;
}

.ABSOLUTE-HEAD > div BLOCK-ICON a {
    display: inline-block;

    font-size: 18px;
}
.ABSOLUTE-HEAD > div BLOCK-ICON a > icon {
    width: 39px;
    height: 39px;
    border-radius: 39px;

    text-align: center;
    background-color: rgba(0, 0, 0, .85);
}
.ABSOLUTE-HEAD > div BLOCK-ICON a:hover > icon {
    color: black;
    background-color: rgba(255, 255, 255, .85);

    animation-name: bounceIn;
    animation-duration: 2s;
    animation-fill-mode: both;
}

#MASSEUSE.BG-COVER DIALOG img {
    display: block;

    max-width: 75px;
    border-radius: 75px;
}

#MASSEUSE.BG-COVER DIALOG p {
    margin: 0;
    padding-right: 12px;

    font-size: 15px;
    text-align: right;
    text-shadow: none;
}



.ABSOLUTE-MAIN > div {
    width: 100%;

    left: 0;
    bottom: 200px;
    position: absolute;
}



.ABSOLUTE-FOOTER > div.ENDING-BLOCK {
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;

    text-align: center;
}

/* === === === === === === === === === ... ... ... === === === */

@media screen and (max-width: 767px) {
    SEO-BLOCK {
        left: 0;
        right: 0;
        bottom: 0;

        position: absolute;

        padding: 12px 12px 48px 12px;
    }



    /* === === === === === === === === === Font Size === === === */
    SEO-BLOCK h1,
    SEO-TEXTS h2,
    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3,
    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4.ENLARGE-STYLE {
        font-size: 24px;
    }

    SEO-TEXTS h2 strong {
        font-size: 18px;
    }

    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h3.SHRINK-STYLE,
    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h4,
    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5,
    SEO-BLOCK a,
    SEO-TEXTS.TEXT-WHITE ul li a,
    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X SEO-TEXTS.TEXT-WHITE ul.TRANSFORM li a {
        font-size: 18px;
    }
}

@media screen and (max-width: 500px) {



    /* === === === === === === === === === Font Size === === === */
    SEO-BLOCK h1 {
        font-size: 21px;
    }

    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X .TRANSFORM-MAX-WIDTH > div h5.COLOR-LIGHTEN {
        font-size: 15px;
    }

    /* === === === === === === === === === ... ... ... === === === */
    MASSEUSE p {
        width: calc(100vw - 24px - 3px - 75px);
    }

    /* === === === === === === === === === ... ... ... === === === */
    .ANIMATE-LEFT-MIN .NAVIGATION ul li.ICON.NARROW-DOWN {
        width: 100vw; calc(100vw - 24px);
    }

    /* === === === === === === === === === ... ... ... === === === */
    #MASSEUSE.BG-COVER > div {
        max-width: 100vw;
    }
    .ABSOLUTE-HEAD > div BLOCK-ICON {
        width: calc(100vw - 100px - 24px);
    }

    /* === === === === === === === === === ... ... ... === === === */
    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN .SCROLL-X MASSEUSE img.SMALL-BORDER {
        max-width: 75px;
        border-radius: 75px;
    }

    ABSOLUTE > div MASSEUSE middle {
        height: 75px;
    }
}

/* === === === === === === === === === ... ... ... === === === */

@media screen and (max-width: 419px) {
    .ANIMATE-LEFT-MIN.TRANSFORM-DOWN
    .SCROLL-X transform.max-size.RELATIVE-STYLE {
        z-index: 1;
        position: relative;
    }

    .COVER-WIDTH > div.BG-FIXED.RELATIVE-STYLE {
        z-index: 0;
        position: relative;

        margin-top: -79.5px;
    }

    /* === === === === === === === === ===
    .COVER-WIDTH > div.COVER-HEIGHT {
        height: calc(100vh - 77px - 159px - 79.5px);
    }
    === === === === === === === === === */

    .COVER-WIDTH > div.REPLENISH-BLOCK {
        display: table-cell;

        height: 79.5px;

        padding: 0 12px;

        color: white; black;
        background-color: black; #f73d93;

        /* === === === === === === === === ===
        background-image: url(index/transform.webp);

        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        === === === === === === === === === */
    }

    .COVER-WIDTH > div.REPLENISH-BLOCK p,
    .COVER-WIDTH > div.FINAL-BLOCK p {
        margin: 0;
    }

    /* === === === === === === === === === ... ... ... === === === */
    ABSOLUTE > div {
        top: 49px;
    }



    /* === === === === === === === === === Font Size === === === */
    SEO-BLOCK h1 {
        font-size: 18px;
    }

    .COVER-WIDTH > div a.element, SEO-BLOCK a {
        padding: 6px 21px;

        font-size: 18px;
        font-weight: 600;
    }
}

@media screen and (max-width: 369px) {
    .COVER-WIDTH > div.BG-FIXED.RELATIVE-STYLE {
        margin-top: -59.5px;
    }

    /* === === === === === === === === ===

    .COVER-WIDTH > div.REPLENISH-BLOCK {
        height: 59.5px;
    }

    === === === === === === === === === */

    .COVER-WIDTH > div.REPLENISH-BLOCK,
    .COVER-WIDTH > div.FINAL-BLOCK,
    .COVER-WIDTH > div.FINAL-BLOCK > final,
    .COVER-WIDTH > div.FINAL-BLOCK marquee {
        height: calc(59.5px / 2);
    }

    .COVER-WIDTH > div.REPLENISH-BLOCK {
        color: black;
        background-color: white;
    }
    .COVER-WIDTH > div.FINAL-BLOCK {
        display: block;
        padding: 0 3px 0 3px;

        color: white;
        background-color: black;
    }

    .COVER-WIDTH > div.FINAL-BLOCK marquee {
        font-weight: 600;
        line-height: calc(59.5px / 2);
    }

    /* === === === === === === === === === ... ... ... === === === */

    .COVER-WIDTH > div.BG-FIXED.RELATIVE-STYLE {
        background-image: none;
        background-color: white;

        padding: 0 12px;
    }

    .COVER-WIDTH > div.BG-FIXED.RELATIVE-STYLE cover {
        display: block;

        height: 100%;
        background-image: url(index/index.gif);

        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;

        background-attachment: fixed;
    }

    SEO-BLOCK {
        padding: 24px;
    }



    /* === === === === === === === === === Font Size === === === */
    .COVER-WIDTH > div.REPLENISH-BLOCK p,
    .COVER-WIDTH > div.FINAL-BLOCK p,
    .COVER-WIDTH > div.FINAL-BLOCK marquee {
        font-size: 12px;
    }
}


