body {
    padding: 0;
    margin: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft JhengHei", Roboto, "Helvetica Neue", Arial, sans-serif;
}

img {
    max-width: 100%;
    height: auto;
    /* vertical-align: middle; */
    display: block;
}

ul,
li {
    margin: 0;
    padding: 0;
    list-style: none;
}

a {
    text-decoration: none;
}

*,
*::after,
*::before {
    box-sizing: border-box;
    scroll-behavior: smooth;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

/* 【以上內容勿動!!!  有關基本樣式設定】 */
/* 開版設定 */
.wrap {
    max-width: 1000px;
    margin: 0 auto;
    /* 【超過】 開版範圍 就不呈現 */
    overflow: hidden;
}

.container {
    max-width: 1000px;
    margin: 0 auto;

}

/* 定位 */

.thing-01 {
    width: 94.1%;
    top: 4.25%;
    left: 3%;
}

.thing-02 {
    width: 94.7%;
    top: 33.5%;
    left: 2%;
}

.thing-03 {
    width: 40.2%;
    top: 59%;
    left: 13%;
    -webkit-mask: url("../images/thing-03.png") no-repeat center center;
    mask: url("../images/thing-03.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing-04 {
    width: 26.3%;
    top: -6%;
    right: 15.5%;
}

.thing-05 {
    width: 53.1%;
    top: 41.5%;
    left: 22.5%;
    z-index: 1;
}

.thing-06 {
    width: 30.3%;
    top: 62%;
    left: 3.5%;
}

.thing-07 {
    width: 26.6%;
    top: 25.5%;
    right: 12.5%;
}

.thing-08 {
    width: 34.8%;
    top: 45%;
    right: -4%;
}

.thing-09 {
    width: 99.0%;
    top: 1.9%;
    left: 0%;
}

.thing-10 {
    width: 93.3%;
    top: 34.9%;
    left: 5.8%;
}

.thing-11 {
    width: 95.0%;
    bottom: 1.15%;
    left: 4%;
}

.thing-12 {
    width: 61.1%;
    top: -0.5%;
    left: 33%;
    -webkit-mask: url("../images/thing-12.png") no-repeat center center;
    mask: url("../images/thing-12.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing-13 {
    width: 41.3%;
    top: 21.3%;
    left: 7.9%;
    -webkit-mask: url("../images/thing103.png") no-repeat center center;
    mask: url("../images/thing-13.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing-14 {
    width: 81.3%;
    top: 32%;
    right: -13%;
    z-index: 1;
}

.thing-15 {
    width: 67.7%;
    top: 34.5%;
    left: -9.5%;
}

.thing-16 {
    width: 81.9%;
    bottom: 0%;
    left: 13%;
}

.thing-17 {
    width: 28.9%;
    top: 7%;
    right: 7.9%;
    -webkit-mask: url("../images/thing-17.png") no-repeat center center;
    mask: url("../images/thing-17.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing-18 {
    width: 92.9%;
    top: 51.5%;
    left: 7%;
    -webkit-mask: url("../images/thing-18.png") no-repeat center center;
    mask: url("../images/thing-18.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing-18-2 {
    width: 24.4%;
    top: 36%;
    left: 60.5%;
}

.thing-19 {
    width: 90.9%;
    top: 42.5%;
    left: 7%;
    -webkit-mask: url("../images/thing-19.png") no-repeat center center;
    mask: url("../images/thing-19.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing-20 {
    width: 90.8%;
    top: 38%;
    left: 7%;
    -webkit-mask: url("../images/thing-20.png") no-repeat center center;
    mask: url("../images/thing-20.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing-21 {
    width: 90.8%;
    top: 38.5%;
    left: 7%;
    -webkit-mask: url("../images/thing-21.png") no-repeat center center;
    mask: url("../images/thing-21.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.phone {
    width: 100%;
    height: 26%;
    top: 70.5%;
    right: 0%;
}

.video {
    width: 83.4%;
    height: 17.35%;
    top: 44.95%;
    left: 8.4%;
}