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

.PageWidth {
    width: 80%;
    margin: 0 auto;
}

@media only screen and (max-width:992px) {
    .PageWidth {
        width: 100% !important;
    }
}

/*---------------- 物件上下間隔 ----------------*/

.h1vh {
    height: 1vh;
}

.h2vh {
    height: 2vh;
}

.h4vh {
    height: 4vh;
}

.h6vh {
    height: 6vh;
}

.h8vh {
    height: 8vh;
}

.h10vh {
    height: 10vh;
}

.h12vh {
    height: 12vh;
}

.h14vh {
    height: 14vh;
}

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

    .m2vh {
        height: 2vh !important;
    }

    .m4vh {
        height: 4vh !important;
    }

    .m6vh {
        height: 6vh !important;
    }

    .m8vh {
        height: 8vh !important;
    }
}

/*---------------- P1 ----------------*/

.P1_01 {
    max-width: 26%;
    margin: 2%;
}

.P1_02 {
    max-width: 86%;
}

.P1_03 {
    max-width: 62%;
}

.P1_04 {
    max-width: 80%;
    padding: 3%;
}

.P1_05 {
    max-width: 80%;
    padding: 3%;
}

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

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

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

    .P1_01 {
        max-width: 40%;
        margin: 2%;
    }

    .P1_02 {
        max-width: 100%;
    }

    .P1_03 {
        max-width: 35%;
        margin-top: 6%;
    }

    .P1_04 {
        max-width: 90%;
        padding: 30px;
    }

    .P1_05 {
        max-width: 70%;
        padding: 3%;
    }
}

/*---------------- P2 ----------------*/

.P2_02 {
    max-width: 21%;
    margin: 6% 0 6% 13%;
}

.P2_04 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-44%, -40%);
    z-index: 1;
    width: 62%;
}

.P2_05,
.P2_06,
.P2_07 {
    max-width: 100%;
    padding: 5%;
}

.P2_10 {
    position: absolute;
    top: 50%;
    left: 10%;
    transform: translate(-10%, -50%);
    z-index: 1;
    width: 34%;
}

.P2_23 {
    max-width: 24%;
    margin: 4% 0;
}

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

    .P2_05,
    .P2_06,
    .P2_07 {
        max-width: 100%;
        padding: 5%;
    }
}

@media only screen and (max-width:576px) {
    .P2_02 {
        max-width: 40%;
        margin: 6% 0 6% 13%;
    }

    .P2_04 {
        max-width: 100%;
    }

    .P2_05,
    .P2_06,
    .P2_07 {
        max-width: 100%;
        padding: 0%;
        margin-bottom: 20%;
    }

}

/*---------------- P3 ----------------*/

.P3_01 {
    max-width: 100%;
}

.P3_02 {
    max-width: 100%;
}

/*---------------- P4 ----------------*/

.FloatA {
    position: relative;
    bottom: 80px;
    margin: 0 auto;
    max-width: 84%;
    background-color: #fff;
}

.P4_02 {
    max-width: 100%;
    padding: 0 10px 0 0;
}

.P4_03 {
    max-width: 77%;
}

.P4_04 {
    max-width: 85%;
}

.P4_05 {
    max-width: 95%;
}

.P4_06 {
    max-width: 72%;
}

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

    .FloatA {
        bottom: 0px;
        max-width: 100%;
    }

    .P4_02 {
        max-width: 0%;
    }

}

/*---------------- P5 ----------------*/

.FloatB {
    position: relative;
    bottom: 0px;
    margin: 0 auto;
    max-width: 84%;
    background-color: #fff;
}

@media only screen and (max-width:576px) {
    .FloatB {
        bottom: 0px;
        max-width: 100%;
    }
}

.P5_02 {
    max-width: 100%;
    padding: 0 10px 10px 0;
}

.P5_03 {
    max-width: 61%;
}

.P5_04 {
    max-width: 85%;
}

.P5_05 {
    max-width: 93%;
}

.P5_06 {
    max-width: 85%;
}

.P5_07 {
    max-width: 85%;
}

.P5_08 {
    max-width: 93%;
}

.P5_09 {
    max-width: 85%;
}

.P5_10 {
    max-width: 75%;
}

.P5_11 {
    max-width: 93%;
}

.P5_12 {
    max-width: 82%;
}

.P5_13 {
    max-width: 50%;
    margin-left: 8%;
}

.P5_14 {
    max-width: 39%;
    margin-left: 8%;
}

.P5_15 {
    max-width: 54%;
    margin-left: 8%;
}

.P5_16 {
    max-width: 42%;
    margin-left: 8%;
}

.P5_17 {
    max-width: 50%;
    margin-left: 8%;
}

.P5_18 {
    max-width: 42%;
    margin-left: 8%;
}

@media only screen and (max-width:576px) {
    .P5_13 {
        max-width: 60%;
        margin-left: 8%;
    }

    .P5_14 {
        max-width: 49%;
        margin-left: 8%;
    }

    .P5_15 {
        max-width: 64%;
        margin-left: 8%;
    }

    .P5_16 {
        max-width: 52%;
        margin-left: 8%;
    }

    .P5_17 {
        max-width: 60%;
        margin-left: 8%;
    }

    .P5_18 {
        max-width: 52%;
        margin-left: 8%;
    }
}

.P5_21 {
    max-width: 100%;
}

.P5_22 {
    margin: 20px 0 0 0;
}

.P5_23 {
    max-width: 100%;

}

.P5_24 {
    max-width: 70%;
}

.P5_25 {
    max-width: 70%;
}

.P5_26 {
    max-width: 70%;
}

.P5_27 {
    max-width: 80%;
}

.P5_28 {
    max-width: 70%;
}

.P5_29 {
    max-width: 73%;
}

/*---------------- P6 ----------------*/

.P61_04 {
    max-width: 80%;
    padding: 0 70px 0 0;
}

.P6_01 {
    max-width: 87%;
}

.P6_02 {
    max-width: 90%;

}

.P6_03 {
    max-width: 90%;
}

.P6_04 {
    max-width: 74%;
}

/*---------------- 建案資訊 ----------------*/

ul > li {
    list-style-type: square;
}

/*---------------- 全局樣式 ----------------*/

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

@media only screen and (max-width:992px) {
    #toTop {
        right: 10px;
        top: 10px !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;
}

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

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

/*---------- ScrollDown 往下捲動提示符號 ----------*/

.scrollPos {
    position: absolute;
    bottom: 50px !important;
}

.scroll {
    max-height: 50px;
    animation: down 1.5s infinite;
    -webkit-animation: down 1.5s infinite;
}

@keyframes down {
    0% {
        transform: translate(0);
    }

    20% {
        transform: translateY(20px);
    }

    40% {
        transform: translate(0);
    }
}

@-webkit-keyframes down {
    0% {
        transform: translate(0);
    }

    20% {
        transform: translateY(20px);
    }

    40% {
        transform: translate(0);
    }
}

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

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

.video-container {

position: relative;

padding-bottom: 56.25%;

padding-top: 30px;

height: 0;

overflow: hidden;

}

.video-container iframe, .video-container object, .video-container embed {

position: absolute;

top: 0;left: 0;

width: 100%;

height: 100%;}