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.0%;
    top: 3.5%;
    left: 2%;
}

.thing_02 {
    width: 52.4%;
    top: 28%;
    right: -1%;
    -webkit-mask: url("../images/thing_02.png") no-repeat center center;
    mask: url("../images/thing_02.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_03 {
    width: 34.4%;
    bottom: 11.5%;
    right: 8.5%;
}

.thing_04 {
    width: 68.2%;
    bottom: 4%;
    left: 0%;
}

.thing_05 {
    width: 43.7%;
    bottom: 0%;
    left: 33%;
    z-index: 1;
}

.thing_05-1 {
    width: 20.4%;
    bottom: 8%;
    left: 56%;
    z-index: 1;
    pointer-events: none;
}

.thing_06 {
    width: 100.0%;
    top: 20.5%;
    left: 0%;
}

.thing_07 {
    width: 26.2%;
    top: 7.25%;
    right: 4.5%;
}

.thing_08 {
    width: 90.6%;
    bottom: 8%;
    left: 5%;
    -webkit-mask: url("../images/thing_08.png") no-repeat center center;
    mask: url("../images/thing_08.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_09 {
    width: 26.6%;
    top: 29.5%;
    left: 48.5%;
    -webkit-mask: url("../images/thing_09.png") no-repeat center center;
    mask: url("../images/thing_09.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_09 img {
    opacity: 0;
}

.thing_10 {
    width: 35.9%;
    top: 9%;
    left: 0%;
}

.thing_11 {
    width: 64.3%;
    top: 10.5%;
    left: 17%;
}

.thing_12 {
    width: 36.1%;
    top: 82%;
    right: 1%;
    -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: 86.9%;
    top: -3%;
    left: 10%;
}

.thing_14_btn {
    width: 92.4%;
    top: 52.5%;
    left: 4%;
    -webkit-mask: url("../images/thing_14_btn.png") no-repeat center center;
    mask: url("../images/thing_14_btn.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_15 {
    width: 53.4%;
    top: 21.85%;
    left: 8.25%;
}

.thing_16 {
    width: 53.4%;
    top: 31%;
    left: 8.25%;
}

.thing_17 {
    width: 42.4%;
    top: 40.8%;
    left: 8.25%;
}

.thing_18 {
    width: 90.6%;
    bottom: 20.1%;
    left: 4.8%;
}

.thing_19 {
    width: 83.8%;
    top: 23.5%;
    left: 7.8%;
}

.thing_20 {
    width: 96.4%;
    top: 31%;
    left: 2%;
    -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: 48.1%;
    top: 41.3%;
    right: 1.8%;
}

.thing_22 {
    width: 55.8%;
    bottom: 0.7%;
    right: 2%;
}

.thing_23 {
    width: 96.6%;
    top: 12.65%;
    left: 1.75%;
    -webkit-mask: url("../images/thing_23.png") no-repeat center center;
    mask: url("../images/thing_23.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_24_popup {
    width: 41.9%;
    top: 48.8%;
    right: 0%;
    cursor: pointer;
}

.thing_25_popup {
    width: 42.6%;
    top: 92.25%;
    left: 5.5%;
    cursor: pointer;
}

.thing_26 {
    width: 88.4%;
    top: 3%;
    left: 6%;
}

.thing_27 {
    width: 87.9%;
    top: 8.5%;
    left: 6%;
}

.thing_28 {
    width: 94.3%;
    top: 52%;
    left: 2%;
    -webkit-mask: url("../images/thing_28.png") no-repeat center center;
    mask: url("../images/thing_28.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_29 {
    width: 100.0%;
    top: 33%;
    left: 0%;
}

.thing_30 {
    width: 100.0%;
    top: 4.25%;
    left: 0%;
}

.thing_31 {
    width: 42.8%;
    top: 27%;
    left: 0%;
    -webkit-mask: url("../images/thing_31.png") no-repeat center center;
    mask: url("../images/thing_31.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_32 {
    width: 100.0%;
    top: 1%;
    left: 0%;
}

.thing_33 {
    width: 36.1%;
    top: 52.5%;
    right: 1%;
    -webkit-mask: url("../images/thing_33.png") no-repeat center center;
    mask: url("../images/thing_33.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_34 {
    width: 86.9%;
    top: 62%;
    left: 7%;
    -webkit-mask: url("../images/thing_34.png") no-repeat center center;
    mask: url("../images/thing_34.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
    scale: 1.1;
}


.thing_36 {
    width: 42.3%;
    top: 8.5%;
    left: 4.8%;
    z-index: 1;
}

.thing_37 {
    width: 42.3%;
    top: 8.5%;
    right: 3.75%;
    z-index: 1;
}

.thing_38 {
    width: 46.9%;
    top: 17.2%;
    left: 2.7%;
    -webkit-mask: url("../images/thing_38.png") no-repeat center center;
    mask: url("../images/thing_38.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_39 {
    width: 46.9%;
    top: 17%;
    right: 1.25%;
    -webkit-mask: url("../images/thing_39.png") no-repeat center center;
    mask: url("../images/thing_39.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}


.thing_41 {
    width: 42.3%;
    top: 8.1%;
    left: 4.8%;
    z-index: 1;
}

.thing_42 {
    width: 42.3%;
    top: 8.1%;
    right: 3.8%;
    z-index: 1;
}

.thing_43 {
    width: 47%;
    top: 16.8%;
    left: 2.68%;
    -webkit-mask: url("../images/thing_43.png") no-repeat center center;
    mask: url("../images/thing_43.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.thing_44 {
    width: 43.7%;
    top: 16.8%;
    right: 4.8%;
    -webkit-mask: url("../images/thing_44.png") no-repeat center center;
    mask: url("../images/thing_44.png") no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.popBtn01 {
    width: 63%;
    height: 100%;
    right: 0%;
    top: 0%;
    cursor: pointer;
}

.popBtn02 {
    width: 63%;
    height: 100%;
    left: 0%;
    top: 0%;
    cursor: pointer;
}

.popBtn03 {
    width: 63%;
    height: 100%;
    right: 0%;
    top: 0%;
    cursor: pointer;
}

.mail {
      width: 100%;
    height: 30%;
    top: 16%;
    left: 0;
}