.pos-1:before {
    -webkit-mask-position: 0% 0
}

.pos-2:before {
    -webkit-mask-position: 2.56% 0
}

.pos-3:before {
    -webkit-mask-position: 5.13% 0
}

.pos-4:before {
    -webkit-mask-position: 7.69% 0
}

.pos-5:before {
    -webkit-mask-position: 10.26% 0
}

.pos-6:before {
    -webkit-mask-position: 12.82% 0
}

.pos-7:before {
    -webkit-mask-position: 15.38% 0
}

.pos-8:before {
    -webkit-mask-position: 17.95% 0
}

.pos-9:before {
    -webkit-mask-position: 20.51% 0
}

.pos-10:before {
    -webkit-mask-position: 23.08% 0
}

.pos-11:before {
    -webkit-mask-position: 25.64% 0
}

.pos-12:before {
    -webkit-mask-position: 28.21% 0
}

.pos-13:before {
    -webkit-mask-position: 30.77% 0
}

.pos-14:before {
    -webkit-mask-position: 33.33% 0
}

.pos-15:before {
    -webkit-mask-position: 35.9% 0
}

.pos-16:before {
    -webkit-mask-position: 38.46% 0
}

.pos-17:before {
    -webkit-mask-position: 41.03% 0
}

.pos-18:before {
    -webkit-mask-position: 43.59% 0
}

.pos-19:before {
    -webkit-mask-position: 46.15% 0
}

.pos-20:before {
    -webkit-mask-position: 48.72% 0
}

.pos-21:before {
    -webkit-mask-position: 51.28% 0
}

.pos-22:before {
    -webkit-mask-position: 53.85% 0
}

.pos-23:before {
    -webkit-mask-position: 56.41% 0
}

.pos-24:before {
    -webkit-mask-position: 58.97% 0
}

.pos-25:before {
    -webkit-mask-position: 61.54% 0
}

.pos-26:before {
    -webkit-mask-position: 64.1% 0
}

.pos-27:before {
    -webkit-mask-position: 66.67% 0
}

.pos-28:before {
    -webkit-mask-position: 69.23% 0
}

.pos-29:before {
    -webkit-mask-position: 71.79% 0
}

.pos-30:before {
    -webkit-mask-position: 74.36% 0
}

.pos-31:before {
    -webkit-mask-position: 76.92% 0
}

.pos-32:before {
    -webkit-mask-position: 79.49% 0
}

.pos-33:before {
    -webkit-mask-position: 82.05% 0
}

.pos-34:before {
    -webkit-mask-position: 84.62% 0
}

.pos-35:before {
    -webkit-mask-position: 87.18% 0
}

.pos-36:before {
    -webkit-mask-position: 89.74% 0
}

.pos-37:before {
    -webkit-mask-position: 92.31% 0
}

.pos-38:before {
    -webkit-mask-position: 94.87% 0
}

.pos-39:before {
    -webkit-mask-position: 97.44% 0
}

.pos-40:before {
    -webkit-mask-position: 100% 0
}

.aproicon {
    font-size: 0;
    display: block;
    transition: all .35s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-property: transform
}

.aproicon:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    -webkit-mask-image: url("../../images/new/layout/aproicon.svg");
    -webkit-mask-size: auto 100%;
    -webkit-mask-repeat: no-repeat;
    background-color: #000;
    transition: all .35s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition-property: background-color;
    width: 30px;
    height: 30px
}

.faq_body .answer h1,
.faq_body .answer h2,
.faq_body .answer h3,
.faq_body .answer h4,
.faq_body .answer h5,
.faq_body .answer h6 {
    font-family: var(--font-family);
    font-size: clamp(18px, 1.25vw, 30px)
}

.faq_body .answer strong,
.faq_body .answer strong span {
    font-weight: bold !important
}

.faq_body .answer table {
    border: 1px solid var(--color-border);
    border-collapse: collapse;
    width: auto !important
}

.faq_body .answer table caption {
    padding-bottom: .5em;
    font-weight: bold;
    font-size: 1.125em;
    text-align: left;
    background-color: rgba(0, 0, 0, 0) !important
}

.faq_body .answer table tr {
    border-bottom: 1px solid var(--color-border)
}

.faq_body .answer table tr:nth-of-type(2n + 1) {
    background-color: #f9f9f9
}

.faq_body .answer table th,
.faq_body .answer table td {
    border: none !important;
    border-left: 1px solid var(--color-border) !important;
    padding: .25em .5em
}

.faq_body .answer table th:first-of-type,
.faq_body .answer table td:first-of-type {
    border-left: none
}

@media(min-width: 0)and (max-width: 739px) {
    .faq_body .answer .table-wrap {
        width: 100%;
        padding-bottom: 1em
    }

    .faq_body .answer .table-wrap.ori table {
        width: 100% !important
    }

    .faq_body .answer .table-wrap.scroll {
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch
    }

    .faq_body .answer .table-wrap.scroll table {
        min-width: 500px
    }

    .faq_body .answer .table-wrap.scroll:after {
        content: "請左右捲動查看表格";
        font-size: 12px;
        color: #999
    }
}

.faq_body .answer p {
    text-align: justify;
    text-justify: distribute
}

:lang(eng) .faq_body .answer p {
    text-align: initial
}

.faq_body .answer em,
.faq_body .answer em span {
    font-style: italic !important
}

.faq_body .answer ul {
    list-style: disc;
    padding-left: 1.5em;
    padding-bottom: 2em
}

.faq_body .answer ul li {
    padding-left: .5em
}

.faq_body .answer ol {
    list-style: decimal;
    padding-left: 1.5em;
    padding-bottom: 2em
}

.faq_body .answer ol li {
    padding-left: .5em
}

.faq_body .answer u,
.faq_body .answer u span {
    text-decoration: underline !important
}

.faq_body .answer * {
    font-family: var(--font-family) !important
}

.faq_body .answer img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important
}

@media(min-width: 740px) {
    .faq .page_header {
        padding-bottom: var(--height-banner-bottom-md)
    }
}

.faq_section_wrap {
    counter-reset: faq-counter
}

.faq_section {
    border-bottom: 1px solid var(--color-border-dark);
    counter-increment: faq-counter
}

.faq_section:last-of-type {
    border-bottom: none
}

.faq_section .fz-A {
    padding-right: 1em
}

.faq_section .fz-A:before {
    /* content: counter(faq-counter, decimal-leading-zero); */
    font-weight: bold;
    display: block;
    font-family: var(--font-family-en);
    color: var(--color-main);
    padding-bottom: .25em
}

@media(min-width: 0)and (max-width: 979px) {
    .faq_section .fz-A {
        margin-bottom: 1.5em;
        margin-top: 2em
    }

    .faq_section:first-of-type .fz-A {
        margin-top: 0
    }
}

@media(min-width: 980px) {
    .faq_section {
        display: flex;
        padding-bottom: 6vw;
        padding-top: 4.8vw
    }

    .faq_section:first-of-type {
        padding-top: 0
    }

    .faq_section .fz-A {
        width: 24%
    }

    .faq_section .faq_pool {
        width: 76%
    }
}

@media(min-width: 1500px) {
    .faq_section .fz-A {
        width: 17.2%
    }

    .faq_section .faq_pool {
        width: 82.8%
    }
}

.faq_body {
    display: flex
}

.faq_body:last-of-type .item {
    border-bottom: none
}

.faq_body .cross_animate {
    position: absolute;
    right: 0;
    top: 50%;
    width: 30px;
    height: 30px;
    transform: translateY(-80%)
}

.faq_body .cross_animate:before,
.faq_body .cross_animate:after {
    content: "";
    display: block;
    width: 70%;
    border-top: 3px solid #adadad;
    position: absolute;
    left: 50%;
    top: 50%;
    transition: all .4s ease
}

.faq_body .cross_animate:before {
    transform: translate(-50%, -50%) rotate(90deg)
}

.faq_body .cross_animate:after {
    transform: translate(-50%, -50%)
}

.faq_body .item {
    width: 100%;
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 1.5em
}

.faq_body .item.active .cross_animate:before,
.faq_body .item.active .cross_animate:after {
    width: 100%;
    border-top: 3px solid var(--color-text)
}

.faq_body .item.active .cross_animate:before {
    transform: translate(-50%, -50%) rotate(45deg)
}

.faq_body .item.active .cross_animate:after {
    transform: translate(-50%, -50%) rotate(-45deg)
}

.faq_body .fz-C {
    display: block;
    position: relative;
    line-height: 1.5em;
    cursor: pointer;
    width: 100%;
    padding: 0 50px 1em 0
}

.faq_body.no-pointer {
    cursor: initial
}

.faq_body .edit_area {
    display: block;
    position: relative;
    width: 100%;
    padding: 0 50px 1em 0
}

@media(min-width: 740px) {
    .faq_body .edit_area {
        padding: 0 28% 1em 0
    }
}

@media(min-width: 1500px) {
    .faq_body .edit_area {
        padding: 0 37.4% 1em 0
    }
}

@media(min-width: 0)and (max-width: 739px) {
    .faq_body .fz-C {
        font-size: 16px
    }
}

@media(min-width: 740px) {
    .faq_body .fz-C {
        line-height: 2em;
        padding: 0 28% 1em 0
    }
}

@media(min-width: 1500px) {
    .faq_body .fz-C {
        padding: 0 37.4% 1em 0
    }
}

.faq_body .answer {
    display: none;
    padding-bottom: 4em;
    padding-top: 2.3vw;
    border-top: 1px solid #f0f0f0
}

@media(min-width: 740px) {
    .faq_body .answer {
        width: 72%
    }
}

@media(min-width: 1500px) {
    .faq_body .answer {
        width: 62.6%
    }
}

.faq_body .answer img {
    display: block;
    max-width: 100%;
    height: auto;
    margin-bottom: 2.3vw
}

.faq_body .answer .desc {
    padding-bottom: 2.3vw;
    text-align: justify;
    text-justify: distribute
}

.faq_v3 {
    counter-reset: faqv3-counter
}

.faq_v3 .faq_section {
    border: none;
    counter-increment: faqv3-counter
}

@media(min-width: 980px) {
    .faq_v3 .faq_section {
        padding-bottom: 6.5vw;
        padding-top: 0
    }
}

.faq_v3 .faq_section .fz-A {
    display: block
}

@media(min-width: 980px) {
    .faq_v3 .faq_section .fz-A {
        min-width: calc(30vw - var(--pd-inside-lg))
    }
}

.faq_v3 .faq_section .fz-A:before {
    content: "";
    display: block;
    width: 80%;
    border-top: 1px solid var(--color-text);
    margin-top: .5em
}

@media(min-width: 0)and (max-width: 979px) {
    .faq_v3 .faq_section .fz-A:before {
        width: 100%
    }
}

.faq_v3 .faq_section .fz-A strong {
    display: block;
    padding-top: .75em
}

.faq_v3 .faq_section .fz-A:after {
    content: counter(faqv3-counter, decimal-leading-zero);
    font-size: 1.25vw;
    color: var(--color-main);
    font-family: var(--font-family-en);
    display: block;
    padding-top: 1em
}

@media(min-width: 0)and (max-width: 979px) {
    .faq_v3 .faq_section .fz-A:after {
        font-size: 1rem
    }
}

@media(min-width: 980px) {
    .faq_v3 .faq_section .faq_pool {
        width: 100%;
        flex: auto;
        padding-left: 3.125vw
    }
}

@media(min-width: 740px) {
    .faq_v3 .faq_body .fz-C {
        padding: 0 28% 2.5vw 0
    }
}

@media(min-width: 1500px) {
    .faq_v3 .faq_body .fz-C {
        padding: 0 24.5% 2.5vw 0
    }
}

@media(min-width: 740px) {
    .faq_v3 .faq_body .item {
        margin-bottom: 3.2vw
    }
}

.faq_v3 .faq_body .cross_animate {
    top: 0;
    transform: none
}

@media(min-width: 740px) {
    .faq_v3 .faq_body .answer {
        width: 72%
    }
}

@media(min-width: 1500px) {
    .faq_v3 .faq_body .answer {
        width: 86%
    }
}

@media(min-width: 1500px) {
    .faq_v3 .faq_body .desc {
        padding-right: 10.5%
    }
}

@media(min-width: 0)and (max-width: 575px) {
    .inpage .page_header h1 {
        padding-bottom: 10px
    }
}

.faq_body .answer iframe {
    max-width: 100% !important
}

@media(max-width: 700px) {
    .faq_body .answer iframe {
        height: 200px !important
    }
}

.no_banner {
    margin-top: 110px
}

@media(min-width: 767px) {
    .no_banner {
        margin-top: 140px
    }
}

@media(min-width: 1199px) {
    .no_banner {
        margin-top: 220px
    }
}

#gallery {
    width: 100% !important;
    max-width: 100% !important
}

#gallery img {
    width: 100%
}

#gallery .ug-gallery-wrapper {
    max-width: 100% !important
}

.gallery_wrap {
    padding-bottom: 7vh;
    margin-top: -4vw
}

@media(min-width: 0)and (max-width: 739px) {
    .page-gallery {
        padding-top: 50px
    }

    .page-gallery .banner {
        display: none
    }
}

/*# sourceMappingURL=faq.css.map */