*{
    margin: 0;
    padding: 0;
    list-style: none;
    font-family: 'Noto Sans TC' , sans-serif,"微軟正黑體",Arial;
}
h2{
    color: #3e3a39;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 2px;
}
p{
    color: #3e3a39;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 2px;
}
.wrap{
    width: 100%;
    margin: auto;
    overflow: hidden;
}.content{
    max-width: 1920px;
}
/* header */
.header{
    width: 100%;
    margin: auto;
    background-color: #fff;
    position: fixed;
    z-index: 1000;
}
.header .logo{
    max-width: 1100px;
    height: 80px;
    margin: auto;
    display: flex;
    justify-content: left;
    align-items: center;
}
.header .logo a{
    text-decoration: none;
}
.header .logo img{
    width: 150px;
    margin: 0 20px;
}

.f_m,.water a.f_m,.hide,.f_m2,.water a.w5{
	display: none;
} 
.water{
	position: fixed;
	bottom: 7%;
	right: 1%;
	z-index: 200;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}
.water.visible {
    opacity: 1;
}
.water a{
	display: block;
	width: 156px;
	height: 136px;
	transition: 0.3s;
	margin-bottom: 15px;
	cursor: pointer;
}
.w1{
	background: url(../img/w1.png) no-repeat center;
	background-size: contain;
    transition: 1s ease-in-out;
}
.w2{
	background: url(../img/w2.png) no-repeat center;
	background-size: contain;
    transition: 1s ease-in-out;
}
.w1:hover{
    transform: translateX(-15px);
}
.w2:hover{
    transform: translateX(-15px);
}
.water.fullw{
	bottom:37%;
}
.water.fullw .w2,.water.fullw .w1{
	display: none;
}
/* kv */
.kv{
    background: url(../img/kv_bg.png)no-repeat center top;
    max-width: 1920px;
    height: 707px;
    position: relative;
    top: 0;
    left: 0;
    z-index: 2;
}
.kv .kv_usa{
    background: url(../img/usa.png)no-repeat center right;
    width: 1093px;
    height: 204px;
    position: absolute;
    bottom: -5px;
    right: 0;
}
.kv .kv_title{
    max-width: 1300px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    z-index: 20;
}
.kv .kv_title .kv_t1 img{
    width: 888px;
    margin: 144px 0 0 -278px;
}
.kv .kv_title .kv_t2 img{
    width: 676px;
    margin: 130px 45px 0 -49px;
}
.kv .kv_t3{
    background: url(../img/kv_t3.png)no-repeat;
    width: 174px;
    height: 176px;
    position: absolute;
    top: 138px;
    left: calc(50% - -402px);
}
.kv .kv_i1{
    background: url(../img/kv_i1.png)no-repeat;
    width: 34px;
    height: 34px;
    position: absolute;
    top: 120px;
    left: calc(50% - 540px);
    animation: kv_i1 5s infinite;
}
.kv .kv_i2{
    background: url(../img/kv_i2.png)no-repeat;
    width: 261px;
    height: 261px;
    position: absolute;
    top: -92px;
    left: calc(50% - 38px);
    transform:translate(-50%,-50%);
    animation: kv_i2 8s ease-in infinite alternate;
}
.kv .kv_i3{
    background: url(../img/kv_i3.png)no-repeat;
    width: 187px;
    height: 187px;
    position: absolute;
    top: 227px;
    left: calc(50% - -286px);
    transform-origin:50%,50%;
    animation: kv_i3 5s infinite;
}
@keyframes kv_i1{
    0% { transform:translateY(20px);}
    50% {transform:translateY(50px);}
    100% {transform:translateY(20px);}
    }
@keyframes kv_i2 {
    0%{transform:rotate(0deg);}
    100%{transform:rotate(720deg);}
    }
@keyframes kv_i3{
    0% { transform:translateY(50px);}
    20% {transform:translateY(20px);}
    100% {transform:translateY(50px);}
    }
@media screen and (max-width:1360px){
    /* kv */
.kv{
    max-width: 1920px;
    height: 580px;
}
.kv .kv_usa{
    background-size: contain;
    width: 1043px;
    height: 154px;
}
.kv .kv_title .kv_t1 img{
    width: 708px;
    margin: 140px 0 0 -250px;
}
.kv .kv_title .kv_t2 img{
    width: 496px;
}
.kv .kv_t3{
    background-size: cover;
    width: 144px;
    height: 146px;
    position: absolute;
    top: 140px;
    left: calc(50% - -300px);
}
.kv .kv_i1{
    top: 137px;
    left: calc(50% - 450px);
}
.kv .kv_i3{
    top: 190px;
    left: calc(50% - -186px);
}
}
@media screen and (max-width:860px){
    /* water */
.water a{
    width: 116px;
    height: 96px;
}
    /* kv */
.kv{
    background: url(../img/kv_bg_lg.png)no-repeat center top;
    max-width: 1360px;
    height: 800px;
}
.kv .kv_usa{
    background-size: contain;
    width: 993px;
    height: 104px;
}
.kv .kv_title .kv_t1 img{
    width: 670px;
    margin: 120px 0 0 -170px;
}
.kv .kv_title .kv_t2 img{
    width: 480px;
    margin: -76px 24px 0 35px;
}
.kv .kv_t3{
    width: 124px;
    height: 126px;
    top: 355px;
    left: calc(50% - -125px);
}
.kv .kv_i1{
    top: 295px;
    left: calc(50% - 345px);
}
.kv .kv_i2{
    left: calc(50% - -20px);
}
.kv .kv_i3{
    top: 295px;
    left: calc(50% - -250px);
}
}
@media screen and (max-width:500px){
    /* header */
.header .logo{
    height: 50px;
}
.header .logo img{
    width: 105px;
}
    /* water */
.water a{
    width: 96px;
    height: 76px;
}
        /* kv */
.kv{
    height: 665px;
}
.kv .kv_title .kv_t1 img{
    width: 545px;
    margin: 86px 0 0 -158px;
}
.kv .kv_title .kv_t2 img{
    width: 380px;
    margin: -60px 24px 0 35px;
}
.kv .kv_t3{
    width: 94px;
    height: 96px;
    top: 295px;
    left: calc(50% - -95px);
}
.kv .kv_i2{
    left: calc(50% - -20px);
    top: -130px;
}
}
@media screen and (max-width:400px){
            /* kv */
.kv{
    height: 550px;
}
.kv .kv_usa{
    height: 70px;
}
.kv .kv_title .kv_t1 img{
    width: 430px;
    margin: 80px 0 0 -140px;
}
.kv .kv_title .kv_t2 img{
    width: 315px;
    margin: -40px 24px 0 35px;
}
.kv .kv_t3{
    width: 74px;
    height: 76px;
    top: 273px;
    left: calc(50% - -73px);
}
.kv .kv_i2{
    top: -150px;
    left: calc(50% - 50px);
}
}
/* p1 */
.cont{
    background: url(../img/bg.png)no-repeat center top;
    max-width: 1920px;
    height: 100%;
    position: relative;
    margin: auto;
    z-index: 1;
}
.p1{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.p1 .detail{
    max-width: 1100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin: 150px 20px 0;
}
.p1 .detail img{
    width: 443px;
}
.p1 .detail .h1{
    color: #ff5253;
    font-size: 36px;
    text-align: left;
    letter-spacing: 3px;
    font-weight: 400;
    margin: 20px 0;
}
.p1 .detail .h1 span{
    font-size: 25px;
    font-weight: 400;
}
@media screen and (max-width:860px){
h2{
    font-size: 20px;
}
.cont{
    background: url(../img/bg_m.png)no-repeat center top;
    background-size: cover;
    max-width: 860px;
    height: 100%;
    top: 5px;
}
    /* p1 */
.p1 .detail{
    margin: 45px 30px 0;
}
.p1 .detail img{
    width: 343px;
}
.p1 .detail h1{
    font-size: 34px;
    margin: 5px 0 20px;
    letter-spacing: 1.5px;
}
.p1 .detail span{
    font-size: 22px;
}
}
@media screen and (max-width:500px){
    h2{
        font-size: 17px;
    }
    .cont{
        background: url(../img/bg_m2.png)no-repeat center top;
        max-width: 500px;
        top: 9px;
    }
        /* p1 */
        .p1 .detail{
        margin: 20px 30px 0;
        }
    .p1 .detail h1{
        font-size: 30px;
        margin: 5px 0 5px;
    }
    .p1 .detail span{
        font-size: 14px;
    }
}
@media screen and (max-width:400px){
    h2{
        font-size: 16px;
    }
        /* p1 */
    .p1 .detail{
        margin: 15px 20px 0;
    }
    .p1 .detail img{
        width: 303px;
    }
    .p1 .detail h1{
        font-size: 22px;
    }
}
    /* p2 */
    .p2{
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .p2 .detail{
        max-width: 1100px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        margin: 250px 0px 0 50px;
    }
    .p2 .detail .title img{
        width: 362px;
        margin-bottom: 30px;
    }
    .p2 .detail .item{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }
    .p2 .detail .item img{
        width: 216px;
    }
    .p2 .detail .item p{
        padding: 0 0 20px 50px;
    }
    .p2 .detail .item span{
        color: #ff5253;
    }
    .p2 .detail .item .text_r,.text_g{
        background-color: #fff;
        padding: 50px;
        margin: 30px 0 0 50px;
        border-radius: 30px;
        position: relative;
    }
    .p2 .text_r:before{
        content: '';
        position: absolute;
        top: 75px;
        border-right: 33px solid #fff;
        left: -22px;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        display: block;
    }
    .text_g:before{
        content: '';
        position: absolute;
        top: 245px;
        border-right: 33px solid #fff;
        left: -22px;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        display: block;
    }
    .p2 .detail .item .text_r ul li{
        max-width: 590px;
        background: url(../img/icon_r.png)no-repeat top left;
        margin-top: 20px;
    }
    .p2 .detail .item .text_g ul li{
        max-width: 590px;
        background: url(../img/icon_g.png)no-repeat top left;
        margin-top: 20px;
    }
    @media screen and (max-width:860px){
        .p2 .detail{
            margin: 180px 30px 0;
        }
        .p2 .detail .title img{
            width: 282px;
        }
        .p2 .detail .item img{
            width: 175px;
        }
        .p2 .detail .item .text_r,.text_g{
            width: 100%;
            padding: 25px;
            margin: 30px 0;
        }
        .p2 .text_r:before{
            display: none;
        }
        .text_g:before{
            display: none;
        }
    }
    @media screen and (max-width:500px){
        p{
            font-size: 16px;
        }
        .p2 .detail{
            margin: 90px 30px 0;
        }
        .p2 .detail .title img{
            width: 260px;
            margin-bottom: 6px;
        }
        .p2 .detail .item img{
            width: 150px;
        }
        .p2 .detail .item img{
            width: 140px;
        }
        .p2 .detail .item p{
            padding: 0 0 30px 35px;
        }
        .p2 .detail .item .text_r,.text_g{
            padding: 10px 20px;
            margin: 20px 0;
        }
        .p2 .detail .item .text_r ul li{
            background: url(../img/icon_r_m.png)no-repeat top left;
            margin-top: 20px;
        }
        .p2 .detail .item .text_g ul li{
            background: url(../img/icon_g_m.png)no-repeat top left;
            margin-top: 20px;
        }
    }
        /* p3 */
    .p3{
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .p3 .detail{
        max-width: 1100px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: start;
        margin: 200px 0px 0 50px;
    }
    .p3 .detail .title img{
        width: 327px;
        margin-bottom: 30px;
    }
    .p3 .detail .item{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }
    .p3 .detail .item .t1,.t2{
        max-width: 500px;
        background-color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 40px 0;
        border-radius: 20px;
        margin-top: 30px;
    }
    .p3 .detail .item h2 img{
        width: 103px;
        vertical-align: middle;
    }
    .p3 .detail .item p{
        letter-spacing: 0.3px;
    }
    .p3 .detail .item span{
        color: #ff5253;
    }
    .p3 .detail .item .t1 .text,.t2 .text{
        max-width: 380px;
    }
    .p3 .detail .item .t1{
        margin-right: 15px;
    }
    .p3 .detail .item .t1 img,.t2 img{
        width: 71px;
        margin: 0 15px;
    }
    @media screen and (max-width:860px){
        .p3 .detail{
            margin: 150px 30px;
        }
        .p3 .detail .title img{
            width: 247px;
        }
        .p3 .detail .item .t1{
            margin-right: 0;
        }
        .p3 .detail .item .t1,.t2{
            max-width: 100%;
        }
        .p3 .detail .item .t1 img,.t2 img{
            width: 60px;
        }
        .p3 .detail .item .t1 .text{
            margin: 0;
            padding: 0 5px;
        }
        .p3 .detail .item h2 img{
            width: 73px;
        }
        .p3 .detail .item p{
            padding-right: 5px;
        }
    }
    @media screen and (max-width:500px){
        .p3 .detail{
            margin:25px 30px 40px;
        }
        .p3 .detail .title img{
            width: 230px;
            margin-bottom: 6px;
        }
        .p3 .detail .item{
            justify-content: flex-start;
        }
        .p3 .detail .item h2 img{
            width: 50px;
        }
        .p3 .detail .item .t1 img,.t2 img{
            width: 40px;
        }
    }
    /* p4 */
    .p4{
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .p4 .detail{
        max-width: 1100px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: start;
        margin: 200px 0px 0 100px;
    }
    .p4 .detail .title img{
        width: 328px;
        margin-bottom: 30px;
    }
    .p4 .detail .item{
        max-width: 1030px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }
    .p4 .detail .item ul li{
        background: url(../img/icon_p4.png)no-repeat top left;
        padding-left: 25px;
        line-height: 5px;
    }
    .p4 .detail .item span{
        color: #ff5253;
        line-height: 30px;
    }
    .p4 .detail .item h2{
        line-height: 35px;
        letter-spacing: 1.5px;
    }
    .p4 .detail .item p{
        line-height: 30px;
        letter-spacing: 1px;
    }
    sup{
        font-size: 11px;
        line-height: 4px;
    }
    .p4 .detail .table{
        background: url(../img/tb.png)no-repeat center top;
        margin: 30px auto;
        width: 1038px;
        height: 356px;
    }
    .p4 .detail .height{
        background: url(../img/height.png)no-repeat center top;
        margin: 50px auto;
        width: 1038px;
        height: 542px;
    }
        @media screen and (max-width:860px){
        .p4 .detail{
            margin: 25px 30px;
        }
        .p4 .detail .title img{
            width: 248px;
        }
        .p4 .detail .table{
            background: url(../img/tb_m.png)no-repeat center top;
            background-size: contain;
            width: 100%;
            height: 300px;
            margin: 15px 0;
        }
        .p4 .detail .height{
            background: url(../img/height_m.png)no-repeat center top;
            background-size: contain;
            width: 100%;
            height: 380px;
            margin: 15px 0;
        }
        }
        @media screen and (max-width:500px){
        .p4 .detail{
            margin: 0 30px;
        }
        .p4 .detail .item br{
            display: none;
        }
        .p4 .detail .title img{
            width: 230px;
            margin-bottom: 6px;
        }
        .p4 .detail .item ul li{
            background: url(../img/icon_p4_m.png)no-repeat top left;
            padding-left: 14px;
        }
        .p4 .detail span{
            font-size: 14px;
            line-height: 24px;
        }
        .p4 .detail .item h2{
            line-height: 25px;
        }
        .p4 .detail .item p{
            line-height: 24px;
        }
        .p4 .detail .table{
            margin: 10px 0px 0;
            height: 210px;
        }
        .p4 .detail .height{
            margin: 10px 0px 0;
            height: 270px;
        }
        }
        @media screen and (max-width:400px){
        .p4 .detail .table{
            height: 190px;
        }
        .p4 .detail .height{
            height: 230px;
        }
        }
    /* notice */
    .notbg{
        position: relative;
        max-width: 1920px;
        height: 100%;
        margin: auto;
    }
    .notice{
        max-width: 1060px;
        height: 100%;
        position: relative;
        top: -101px;
        right: 0;
        left: 20px;
        z-index: 50;
        margin: auto;
        padding: 280px 0 0px;
        line-height: 2.5;
    }
    .notice strong img{
        cursor: pointer;
        width: 232px;
        margin-left: 20px;
    }
    .notice .n_t{
        height: 100%;
        margin: 20px 0 0;
        padding: 0 30px 0 40px;
    }
    .notice .not_r{
        color: #ff5253;
    }
    .notice ol li{
        list-style-type: decimal;
    }
    .notice ul li{
        list-style-type: none;
        padding-left: 22px;
        text-indent: -20px;
    }
    .notice ul li b{
        font-weight: 900;
        font-size: 20px;
    }
    .notice p{
        letter-spacing: 1px;
        line-height: 2;
    }
    .notice h2{
        color: #ff5253;
        letter-spacing: 1px;
        font-weight: 700;
        line-height: 1.8;
    }
    .notice span{
        color: #ff5253;
    }
    .notice .tb2{
        width: 100%;
        display: block;
        margin: 10px auto;
    }
    .notice .tb2_m{
        display: none;
    }
    @media screen and (max-width:1360px){
        .notice .n_t{
            padding: 0 30px 0 20px;
        }
        .notice p{
            line-height: 1.4;
        }
        .notice h2{
            line-height: 1.4;
        }
    }
    @media screen and (max-width:860px){
        .notbg{
            max-width: 860px;
            top: -130px;
        }
        .notice{
            max-width: 860px;
            top: 80px;
            padding: 220px 0 0px;
        }
        .notice .n_t{
            padding: 0 30px 0 20px;
        }
        .notice .tb2{
            display: none;
        }
        .notice .tb2_m{
            width: 100%;
            display: block;
            margin: 10px auto;
        }
    }
    @media screen and (max-width:500px){
        .notice{
            max-width: 500px;
            top: 0px;
            padding: 0 20px 0 0;
        }
        .notbg{
            max-width: 500px;
            top: 0px;
            padding: 50px 0 40px;
        }
        .notice strong img{
            width: 132px;
            margin-left: 0px;
        }
        .notice .n_t{
            padding: 0 30px 0 15px;
        }
    }
    @media screen and (max-width:400px){
        .notice{
            max-width: 400px;
            top: 0px;
            padding: 0px;
        }
    }
    @media screen and (max-width:350px){
        .notbg{
            padding: 145px 0 40px;
        }
    }

    .footer{
        position: relative;
        width: 100vw;
        overflow: hidden;
    }
    .footer .copyright {
        color: #fff;
        background-color: #bf2f39;
        padding: 25px 10px 15px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        margin: auto;
    }
    .footer .copyright p{
        color: #fff;
        padding-bottom: 10px;
        font-size: 0.75vw;
        text-align: center;
        letter-spacing: 0.5px;
        font-family: "微軟正黑體";
    }
    .footer .copyright p a{
        font-size: 0.75vw;
        color: white;
        letter-spacing: 0.5px;
        text-decoration: none;
        font-family: "微軟正黑體";
    } 
    .footer .copyright .sugg{
        display: inline-block;
    }
    @media screen and (max-width:860px){
        .footer .copyright p{
            padding-bottom: 0px;
            font-size: 0.8rem;
        }
        .footer .copyright p a{
            display: inline-block;
            font-size: 0.8rem;
        }
    }
    @media screen and (max-width:500px){
        .footer .copyright p{
            padding-bottom: 0px;
        }
        .footer .copyright p a{
            display: inline-block;
        }
        .footer .copyright .sugg{
            display: none;
        }
    }