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;

}

/* 定位 */
.flex {
    display: flex;
    justify-content: space-evenly;
    gap: 3%;
}

.thing01-1 {
    width: 100%;
    top: 0%;
    left: 0%;
}

.thing03-1 {
    width: 80%;
    left: 10%;
    bottom: 8.5%;
}

.thing05-1 {
    width: 80%;
    left: 10%;
    bottom: 8.5%;
}

.thing07-1 {
    width: 80%;
    left: 10%;
    bottom: 8.5%;
}

.thing09-1 {
    width: 80%;
    left: 10%;
    bottom: 8.5%;
}

.thing11-1 {
    width: 80%;
    left: 10%;
    bottom: 8.5%;
    flex-wrap: wrap;
    gap: 30px 0%;
}



input[type="radio"] {
    display: none;
}

label {
    cursor: pointer;
    transition: all .3s;
}

input[name="answerControl1"]:not(:checked)~label,
input[name="answerControl2"]:not(:checked)~label,
input[name="answerControl3"]:not(:checked)~label,
input[name="answerControl4"]:not(:checked)~label,
input[name="answerControl5"]:not(:checked)~label {
    filter: grayscale(1);
}

input[name="answerControl1"]:hover~label,
input[name="answerControl2"]:hover~label,
input[name="answerControl3"]:hover~label,
input[name="answerControl4"]:hover~label,
input[name="answerControl5"]:hover~label {
    filter: grayscale(0);
}

.thing12-1 {
    width: 87.1%;
    left: 5%;
    bottom: 5.5%;
    cursor: pointer;
}

.thing12-2 {
    width: 54.3%;
    left: 30%;
    bottom: 3%;
    mix-blend-mode: screen;
}

.thing14-1 {
    width: 54.3%;
    left: 30%;
    bottom: 4%;
    z-index: 1;
    mix-blend-mode: screen;
}

.thing15-1 {
    width: 54.3%;
    left: 30%;
    bottom: 3%;
    z-index: 1;
    mix-blend-mode: screen;
}

.thing16-1 {
    width: 54.3%;
    left: 30%;
    z-index: 1;
    bottom: 6%;
    mix-blend-mode: screen;
}

.tel {
    width: 100%;
    height: 20%;
    left: 0%;
    top: 22%;
}

.mail {
    width: 100%;
    height: 17%;
    left: 0%;
    top: 61%;
}


#lp_form {
    display: none;
}


.QA2,
.QA3,
.QA4,
.QA5,
.QA6,
.QA7 {
    max-height: 0;
    transition: max-height .5s;
    overflow: hidden;
}

@media (max-width:768px) {
    .thing03-1 {
        bottom: 7%;
    }

    .thing05-1 {
        bottom: 6.75%;
    }

    .thing07-1 {
        bottom: 8%;
    }

    .thing09-1 {
        width: 80%;
        left: 10%;
        bottom: 7.75%;
    }

    .thing11-1 {
        width: 78%;
        left: 11%;
        bottom: 6%;
        gap: 7.5px;
    }

    .thing11-1 .answer {
        width: 48%;
    }
}