/*---------------- P24 ----------------*/

.P26Frame {
    background-color: #c2d500;
    width: 100%;
    padding: 0 20%;
    text-align: center;
    margin: 0 auto;
}

.P26List {
    margin-bottom: 30px;
}


/*平板橫式*/

@media (orientation: landscape) and (min-width: 576px) and (max-width: 1366px) {
    .P26Frame {
        background-color: #c2d500;
        width: 100%;
        padding: 0 20%;
        text-align: center;
        margin: 0 auto;
    }
    .P26List {
        margin-bottom: 30px;
    }
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P26Frame {
        background-color: #c2d500;
        width: 100%;
        padding: 0 10%;
        text-align: center;
        margin: 0 auto;
    }
    .P26List {
        margin-bottom: 4%;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P26Frame {
        background-color: #c2d500;
        width: 100%;
        padding: 0 5%;
        text-align: center;
        margin: 0 auto;
    }
    .P26List {
        margin-bottom: 4% !important;
    }
    .P26List2 {
        margin-bottom: 30px !important;
    }
}


/*---------------- P24 ----------------*/

.P24Frame {
    position: absolute;
    height: auto;
    z-index: 2;
    top: 35%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    text-align: center;
    margin: 0 auto;
    padding: 0% 15.3%;
}

.P24_01 {
    width: 100% !important;
}

.P24_02 {
    width: 50% !important;
}

.P24_03 {
    margin-top: 4%;
    width: 90% !important;
}

.P24_04 {
    margin-top: 4%;
    width: 90% !important;
}

.P24_05 {
    padding-right: 6%;
    width: 100% !important;
}

.P24_06 {
    padding-left: 10%;
    width: 100% !important;
}

.P25Frame {
    position: absolute;
    z-index: 2;
    bottom: 8%;
    left: 50%;
    transform: translate(-50%, 0%);
    width: 65% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P24Frame {
        top: 35%;
        padding: 14% 15%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P24Frame {
        padding: 14% 9.8%;
        text-align: center;
        margin: 0 auto;
    }
    .P24_02 {
        width: 40% !important;
    }
    .P24_03 {
        margin-top: 4%;
        width: 80% !important;
    }
    .P24_04 {
        margin-top: 4%;
        width: 80% !important;
    }
}


/*---------------- P23 ----------------*/

.P23Frame {
    position: absolute;
    height: auto;
    z-index: 2;
    top: 45%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    text-align: center;
    margin: 0 auto;
    padding: 0% 15.3%;
}

.P23_01 {
    width: 100% !important;
}

.P23_02 {
    width: 100% !important;
}

.P23_03 {
    margin-top: 8%;
    width: 43% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P23Frame {
        top: 50%;
        padding: 14% 7.5%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P23Frame {
        padding: 14% 9.8%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P22 ----------------*/

.P22Frame {
    padding: 0% 14%;
    text-align: center;
    margin: 0 auto;
}

.P22L {
    padding: 0 5% 6% 0;
    text-align: left;
}

.P22R {
    padding: 0 0 6% 5%;
    text-align: left;
}

.P22_01 {
    margin-bottom: 8%;
    width: 100% !important;
}

.P22_02 {
    width: 100% !important;
}

.P22_03 {
    margin-bottom: 6%;
    width: 62% !important;
}

.P22_04 {
    margin-bottom: 5%;
    width: 100% !important;
}

.P22_05 {
    margin-bottom: 6%;
    width: 100% !important;
}

.P22_07 {
    margin-bottom: 6%;
    width: 42% !important;
}

.P22_09 {
    margin-bottom: 6%;
    width: 58% !important;
}

.P22_11 {
    margin-bottom: 6%;
    width: 57% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P22Frame {
        padding: 0% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P22Frame {
        padding: 14% 14%;
        text-align: center;
        margin: 0 auto;
    }
    .P22L {
        padding: 0 0 0 0;
        margin: 0 0 10% 0 !important;
    }
    .P22R {
        padding: 0 0 0 0;
        margin: 0 0 10% 0 !important;
    }
    .P22_01 {
        margin-bottom: 5%;
        width: 60% !important;
    }
    .P22_02 {
        width: 60% !important;
        margin-bottom: 5%;
    }
}


/*---------------- P21 ----------------*/

.P21Frame {
    padding: 10% 14%;
    text-align: center;
    margin: 0 auto;
}

.P21_01 {
    width: 100% !important;
}

.P21_02 {
    margin-top: 10%;
    width: 50% !important;
}

.P21_03 {
    margin-top: 5%;
    margin-bottom: 10%;
    width: 100% !important;
}

.P21_04 {
    width: 85% !important;
}

.P21_09 {
    margin-top: 10%;
    width: 100% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P21Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P21Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P20 ----------------*/

.P20Frame {
    position: absolute;
    height: auto;
    z-index: 2;
    top: 70%;
    left: 50%;
    width: 70%;
    transform: translate(-50%, -50%);
    text-align: center;
    margin: 0 auto;
}

.P20_01 {
    width: 100% !important;
}

.P20_02 {
    width: 85% !important;
}

.P20_05 {
    margin-top: 14%;
    width: 80% !important;
}


/*---------------- P19 ----------------*/

.P19_02 {
    width: 40% !important;
}

.P19_03 {
    width: 70% !important;
}

.P19_06 {
    margin-top: 12%;
    width: 72% !important;
}

.P19_09 {
    margin-top: 6%;
    margin-bottom: 14%;
    width: 100% !important;
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P19_06 {
        margin-top: 6%;
        width: 72% !important;
    }
}


/*---------------- P13 ----------------*/

.P13Frame {
    padding: 6% 14% 10% 14%;
    text-align: center;
    margin: 0 auto;
}

.P13_01 {
    width: 100% !important;
}

.P13_02 {
    width: 100% !important;
}

.P13_03 {
    margin-top: 4%;
    margin-bottom: 8%;
    width: 100% !important;
}

.P13Shodow {
    width: 100%;
    height: 4em;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P13Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P13Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
    .P13Shodow {
        width: 100%;
        height: 2em;
    }
}


/*---------------- P12 ----------------*/

.P12_02 {
    width: 40% !important;
}

.P12_03 {
    width: 70% !important;
}

.P12_06 {
    margin-top: 12%;
    width: 72% !important;
}

.P12_09 {
    margin-top: 6%;
    margin-bottom: 14%;
    width: 100% !important;
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P12_06 {
        margin-top: 6%;
        width: 72% !important;
    }
}


/*---------------- P11 ----------------*/

.P11Frame {
    padding: 6% 14% 10% 14%;
    text-align: center;
    margin: 0 auto;
}

.P11_01 {
    width: 100% !important;
}

.P11_02 {
    margin-bottom: 4%;
    width: 47% !important;
}

.P11_03 {
    width: 100% !important;
}

.P11_04 {
    width: 13% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P11Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P11Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P10 ----------------*/

.P10_02 {
    width: 40% !important;
}

.P10_03 {
    width: 70% !important;
}

.P10_06 {
    margin-top: 12%;
    width: 72% !important;
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P10_06 {
        margin-top: 6%;
        width: 72% !important;
    }
}


/*---------------- P09 ----------------*/

.P09Frame {
    padding: 10% 14%;
    text-align: center;
    margin: 0 auto;
}

.P09_01 {
    position: relative;
    z-index: 1;
    width: 100% !important;
}

.P09_02 {
    margin-top: 18%;
    margin-bottom: 4%;
    width: 90% !important;
}

.P09_03 {
    margin-bottom: 6%;
    width: 100% !important;
}

.P09_07 {
    margin-left: 10%;
    width: 9.5% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P09Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P09Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P08 ----------------*/

.P08Frame {
    padding: 5% 14%;
    text-align: center;
    margin: 0 auto;
}

.P08_01 {
    position: relative;
    z-index: 1;
    width: 100% !important;
}

.P08_02 {
    margin-top: 18%;
    margin-bottom: 4%;
    width: 81% !important;
}

.P08_03 {
    margin-bottom: 6%;
    width: 98% !important;
}

.P08_04 {
    margin-bottom: 6%;
    width: 96% !important;
}

.P08_05 {
    width: 97.2% !important;
}

.P08_07 {
    margin-top: 10%;
    width: 13.5% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P08Frame {
        padding: 5% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P08Frame {
        padding: 5% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P07 ----------------*/

.P07Frame {
    padding: 10% 14%;
    text-align: center;
    margin: 0 auto;
}

.P07_01 {
    position: relative;
    z-index: 1;
    width: 100% !important;
}

.P07_02 {
    margin-top: 18%;
    margin-bottom: 4%;
    width: 96% !important;
}

.P07_03 {
    margin-bottom: 6%;
    width: 96% !important;
}

.P07_03_line {
    border-top: 2px solid #5d7832;
    width: 15%;
    margin-left: 4%;
    margin-bottom: 6%;
}

.P07_04 {
    margin-bottom: 6%;
    width: 96% !important;
}

.P07_05 {
    margin-bottom: 6%;
    width: 96% !important;
}

.P07_06 {
    margin-bottom: 5%;
    width: 96% !important;
}

.P07_07 {
    margin-left: 10%;
    width: 7.5% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P07Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P07Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P06 ----------------*/

.P06Frame {
    padding: 5% 14%;
    text-align: center;
    margin: 0 auto;
}

.P06_01 {
    position: relative;
    z-index: 1;
    width: 100% !important;
}

.P06_02 {
    margin-top: 18%;
    width: 93% !important;
}

.P06_03 {
    margin-top: 10%;
    width: 93% !important;
}

.P06_04 {
    margin-top: 10%;
    width: 95% !important;
}

.P06_05 {
    margin-top: 6%;
    width: 10.5% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P06Frame {
        padding: 5% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P06Frame {
        padding: 5% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P05 ----------------*/

.P05Frame {
    padding: 10% 14%;
    text-align: center;
    margin: 0 auto;
}

.P05_01 {
    margin-top: 0%;
    width: 70% !important;
}

.P05_02 {
    margin-top: 5%;
    margin-bottom: 15%;
    width: 100% !important;
}

.P05_03 {
    position: relative;
    z-index: 1;
    width: 100% !important;
}

.P05_04 {
    width: 85% !important;
}

.P05_05 {
    margin-left: 4%;
    width: 67% !important;
}

.P05_06 {
    margin-top: 18%;
    margin-left: 4%;
    width: 97% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P05Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P05Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P04 ----------------*/

.P04_02 {
    width: 40% !important;
}

.P04_06 {
    margin-top: 12%;
    width: 72% !important;
}

.P04_09 {
    width: 100% !important;
}

.P04_09m {
    width: calc(100vh * 2.39);
    height: 100vh;
    background-image: url("../images/P04_09.jpg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P04_06 {
        margin-top: 6%;
        width: 72% !important;
    }
}


/*---------------- P03 ----------------*/

.P03Frame {
    padding: 14%;
    text-align: center;
    margin: 0 auto;
}

.P03_01 {
    position: relative;
    z-index: 1;
    width: 100% !important;
}

.P03_02 {
    margin-left: 10%;
    width: 7.5% !important;
}

.P03_03 {
    margin-top: 18%;
    width: 84% !important;
}

.P03_04 {
    margin-top: 12%;
    width: 97% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P03Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P03Frame {
        padding: 14% 6%;
        text-align: center;
        margin: 0 auto;
    }
}


/*---------------- P02 ----------------*/

.P02Frame {
    position: absolute;
    height: auto;
    z-index: 2;
    top: 52%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    text-align: center;
    margin: 0 auto;
}

.P02_01 {
    width: 100% !important;
}

.P02_02 {
    width: 40% !important;
}

.P02_03 {
    width: 70% !important;
}

.P02_04 {
    margin-top: 10%;
    width: 70% !important;
}

.P02_05 {
    margin-top: 6%;
    width: 70% !important;
}

.P02_06 {
    margin-top: 12%;
    width: 92% !important;
}

.P02_07 {
    margin-top: 12%;
    width: 50% !important;
}

.P02_09 {
    width: 100% !important;
}

.P02_09m {
    width: calc(100vh * 1.777);
    height: 100vh;
    background-image: url("../images/P02_09.jpg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.FloatDecoFrame01 {
    position: absolute !important;
    z-index: 999 !important;
    right: 10%;
    top: 87%;
}

.FloatDecoFrame02 {
    position: absolute !important;
    z-index: 999 !important;
    right: 10%;
    top: -7%;
}

.FloatDecoFrame03 {
    position: absolute !important;
    z-index: 999 !important;
    right: 10%;
    top: -1.8%;
}

.FloatDeco {
    width: 30%;
}

.container-fluid {
    overflow-x: scroll;
    padding: 0;
    justify-content: center !important;
}

.fingerBG {
    position: absolute;
    z-index: 1;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
    width: 100%;
    height: 50px;
}

.finger {
    position: absolute;
    z-index: 2;
    bottom: 10px;
    width: 60px;
    filter: drop-shadow(0 0 2px rgba(0, 55, 173, 0.81));
    transform: translate(-50%, 0%);
}

.ImgZoom {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    background-color: rgba(255, 255, 255, 1);
    color: #747474;
    padding: 8px 10px;
    margin: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P02_05 {
        margin-top: 0%;
        width: 70% !important;
    }
    .P02_06 {
        margin-top: 6%;
        width: 92% !important;
    }
    .FloatDecoFrame01 {
        position: absolute !important;
        z-index: 999 !important;
        right: 10%;
        top: 84%;
    }
    .FloatDecoFrame02 {
        position: absolute !important;
        z-index: 999 !important;
        right: 10%;
        top: -10%;
    }
    .FloatDecoFrame03 {
        position: absolute !important;
        z-index: 999 !important;
        right: 10%;
        top: -2%;
    }
    .FloatDeco {
        width: 20%;
    }
}


/*---------------- P01 ----------------*/

.P01Frame {
    position: absolute;
    height: auto;
    z-index: 2;
    left: 50%;
    width: 100%;
    transform: translate(-50%, 0%);
    text-align: center;
    margin: 0 auto;
}

.P01_01 {
    width: 100% !important;
}

.P01_02 {
    margin-top: 15%;
    width: 65% !important;
}

.P01_03 {
    margin-top: 3%;
    width: 50% !important;
}

.P01_04 {
    width: 30% !important;
}

.P01_05 {
    margin-top: 51%;
    width: 30% !important;
}

.P01_06 {
    position: absolute;
    z-index: 2;
    bottom: 10%;
    left: 50%;
    transform: translate(-50%, 0%);
    width: 60% !important;
}

.P01_07 {
    position: absolute;
    z-index: 2;
    bottom: 0%;
    left: 0%;
    width: 18% !important;
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .P01_04 {
        width: 33% !important;
    }
    .P01_05 {
        margin-top: 56%;
        width: 33% !important;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .P01_04 {
        width: 40% !important;
    }
    .P01_05 {
        margin-top: 70%;
        width: 40% !important;
    }
}


/*---------------- 網頁寬度 ----------------*/

.PageWidth {
    width: 80% !important;
    text-align: center !important;
    margin: 0 auto !important;
    overflow: hidden;
}


/*平板橫式*/

@media (orientation: landscape) and (min-width: 576px) and (max-width: 1366px) {
    .PageWidth {
        width: 100% !important;
        text-align: center !important;
        margin: 0 auto !important;
        overflow: hidden;
    }
}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {
    .PageWidth {
        width: 100% !important;
        text-align: center !important;
        margin: 0 auto !important;
        overflow: hidden;
    }
}


/*手機直式*/

@media only screen and (max-width: 576px) {
    .PageWidth {
        width: 100% !important;
        text-align: center !important;
        margin: 0 auto !important;
        overflow: hidden;
    }
}


/*---------------- 網頁字型 ----------------*/

body,
button,
input,
select,
textarea,
div,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Helvetica Neue", Helvetica, Arial, "微軟正黑體", "メイリオ", "맑은 고딕", sans-serif !important;
}

a:link.one {
    color: #aaa !important;
    text-decoration: none !important;
    transition: all 0.3s !important;
    -webkit-transition: all 0.3s !important;
    -moz-transition: all 0.3s !important;
}

a:visited.one {
    color: #aaa !important;
    text-decoration: none !important;
}

a:hover.one {
    color: #ffe282 !important;
    text-decoration: none !important;
}

.TextBlock {
    white-space: nowrap;
    display: inline-block;
}


/*---------------- 回到上方按鈕 ----------------*/

@media only screen and (max-width: 992px) {
    #toTop {
        right: 10px;
        top: 10px !important;
    }
}


/*---------- 社群選單（手機） ----------*/

.MobileCall {
    position: fixed;
    z-index: 2000;
    bottom: 0;
    width: 100%;
    left: 0;
    background-image: linear-gradient(to top, #5d7832, #5d7832);
    padding: 4px 0 4px 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0);
}


/*---------- 表單 ----------*/

.form-control {
    border: #bbb 0 solid !important;
    border-radius: 0 !important;
    background-color: rgba(255, 255, 255, 1) !important;
    color: #000 !important;
    font-size: 18px !important;
}

::placeholder {
    color: #000 !important;
}


/*---------------- owl-carousel-2 ----------------*/

.owl-carousel-2.controlls-over .owl-dots {
    position: absolute;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0) !important;
    border-radius: 4px !important;
    text-align: center !important;
    left: 50%;
    margin: 0 auto !important;
    bottom: 0;
    transform: translate(-50%, 0);
}

.owl-carousel-2 .owl-dots .owl-dot.active span {
    background-color: #fff !important;
}

.owl-carousel-2 .owl-dots .owl-dot span {
    background: rgba(255, 255, 255, 0.6) !important;
    margin: 0 2px 0 2px !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 4px !important;
}


/*---------------- Photoswipe ----------------*/

.pswp__counter {
    height: 30px;
    margin: 15px 0 0 20px;
    font-size: 16px !important;
    line-height: 30px;
    color: #000 !important;
    text-shadow: 0 0 0 rgb(255, 255, 255) !important;
    padding: 2px 6px !important;
    background-color: #fff !important;
    opacity: 1;
}


/*---------- modal ----------*/

.modal-content {
    border-top-color: #9e9e9e !important;
    border: 0 !important;
    border-top: #333 0 solid !important;
    -webkit-border-radius: 0 !important;
}

.modal-header {
    padding: 1rem !important;
    border-bottom: 0 solid #e9ecef !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}


/*---------- 語法樣板 ----------*/


/*平板橫式*/

@media (orientation: landscape) and (min-width: 576px) and (max-width: 1366px) {}


/*平板直式*/

@media (orientation: portrait) and (min-width: 576px) and (max-width: 1366px) {}


/*手機直式*/

@media only screen and (max-width: 576px) {}

.sample code {
    max-width: 95% !important;
    margin-top: 4vh;
    margin-bottom: 1vh;
}