﻿@font-face {
    font-family: PingFang;
    src: url('fonts/PingFang.ttc')
}

@font-face {
    font-family: MyriadPro;
    src: url('fonts/MyriadPro-Regular.otf')
}

@font-face {
    font-family: Arvo;
    src: url('Arvo-Bold.ttf')
}

@font-face {
    font-family: Arvo-Bold;
    src: url('fonts/Arvo-Bold.ttf')
}

@font-face {
    font-family: Raleway-Bold;
    src: url('fonts/Raleway-Bold.ttf')
}

@font-face {
    font-family: Raleway-Light;
    src: url('fonts/Raleway-Light.ttf')
}

@font-face {
    font-family: Raleway-Medium;
    src: url('fonts/Raleway-Medium.ttf')
}

@font-face {
    font-family: Raleway-Regular;
    src: url('fonts/Raleway-Regular.ttf')
}

@font-face {
    font-family: DFHeiStd-W7;
    src: url('fonts/DFHeiStd-W7.otf')
}

@font-face {
    font-family: DFHeiStd-W5;
    src: url('fonts/DFHeiStd-W5.otf')
}

@font-face {
    font-family: DFHeiStd-W3;
    src: url('fonts/DFHeiStd-W3.otf')
}

@font-face {
    font-family: 華康儷中黑;
    src: url('fonts/DFLiHei-Md-HK-BF-02.ttf')
}

@font-face {
    font-family: CenturyGothic;
    src: url('fonts/Century-Gothic.ttf')
}

@font-face {
    font-family: DIN-Regular;
    src: url('fonts/DIN-Regular.ttf')
}

@font-face {
    font-family: Ariall;
    src: url('fonts/Arial(1).ttf')
}

@font-face {
    font-family: Arial-Bold;
    src: url('fonts/Arial-Bold.ttf')
}

body,
div,
ul,
li,
header,
aside,
nav,
form,
section,
footer,
input,
select,
option {
    margin: 0;
    padding: 0;
}

.border_new {
    display: flex;
    width: 1100px;
    height: 250px;
    align-items: center;
}

.eight_pic_img {
    width: 3.5rem;
}

.arrow_right_gray {
    width: 1rem;
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}

.arrow_mid_gray {
    width: 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-right: 190px;
}

.div_eight_text {
    font-size: 21px;
    padding-top: 15px;
    color: #434343;
    font-family: DFHeiStd-W5;
}

.eight_div2 {
    display: flex;
    justify-content: flex-end;
}

.eight_img {
    padding: 80px;
    background-color: white;
    /* background-color: white; */
}

.eight_div1 {
    display: flex;
    justify-content: center;
    align-items: center;
}

.eight_div3 {
    display: flex;
    justify-content: center;
    align-items: center;
}

.e_img {
    width: 1.2rem;
}

.d_img {
    width: 600px;
    height: 600px;
}

.block_new_d {
    display: flex;
    justify-content: center;
}

.block_b_table_pic {
    width: 5rem;
    margin-top: 1rem;
    cursor: pointer;
}

.block_b_table_botpic {
    width: 5rem;
    height: 5rem;
    cursor: pointer;
}

.div1text {
    font-size: 0.9rem;
    /* font-weight: bold; */
    height: calc(100%/3);
    width: 100%;
    background-color: white;
    display: flex;
    align-items: center;
    font-family: Arvo-Bold;
}

.div1text_w5 {
    font-family: DFHeiStd-W5;
    margin-left: 10px;
}

.div2text {
    font-size: 21px;
    height: calc(100%/3);
    width: 100%;
    line-height: 30px;
    font-family: DFHeiStd-W5;
    background-color: white;
    display: flex;
    align-items: center;
    color: #6d6d6d;
    padding-top: 10px;
}

.d1 {
    display: flex;
    align-items: flex-end;
}

.div3text {
    border-radius: 1rem 1rem 1rem 1rem;
    font-size: 22px;
    height: 1.3rem;
    font-family: DFHeiStd-W5;
    width: 620px;
    margin-top: 20px;
    background-color: #f8b62d;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: -45px;
    left: 310px;
}

.div3text_bot {
    border-radius: 1rem 1rem 1rem 1rem;
    font-size: 22px;
    height: 1.3rem;
    font-family: DFHeiStd-W5;
    width: 731px;
    margin-top: 20px;
    background-color: #f8b62d;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: -45px;
    left: 258px;
}

.d_bot_Pnumber {
    border: 1px #f8b62d solid;
    border-radius: 1.1rem 1.1rem 1.1rem 1.1rem;
    font-size: 0.7rem;
    height: 80px;
    width: 450px;
    display: flex;
    background-color: white;
    margin-top: 80px;
}

.e_bot_Pnumber {
    border-radius: 1.6rem 1.6rem 1.6rem 1.6rem;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    font-size: 0.7rem;
    height: 90px;
    width: 400px;
    display: flex;
    background-color: #f8b62d;
    border: 2px white solid;
    position: absolute;
    left: 50%;
    margin-left: -235px;
    margin-top: 30px;
}

.d_round_text {
    border-radius: 1rem 1rem 1rem 1rem;
    font-size: 0.6rem;
    font-family: DFHeiStd-W5;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 1rem;
    background-color: #f8b62d;
    color: white;
    display: flex;
    align-self: flex-end;
    align-items: center;
    margin-bottom: 10px;
}

.big_pic {
    width: 100%;
    height: 31.37%;
}

.t3d_img {
    width: 0.2rem;
    margin-left: 0.3rem;
}

.t3d_div {
    cursor: pointer;
    font-family: Raleway-Bold;
    font-size: 0.4rem;
    font-weight: bold;
    width: 145px;
    height: 52px;
    background-color: #f8b62d;
    display: flex;
    color: white;
    align-items: center;
    justify-content: center;
    border-radius: 1.2rem;
}

.d_round_text1 {
    border-radius: 1rem 1rem 1rem 1rem;
    font-size: 0.7rem;
    padding-left: 1rem;
    padding-right: 1rem;
    height: 1rem;
    background-color: plum;
    display: flex;
    align-self: flex-end;
    align-items: center;
}

.block_b_table_readmore {
    width: 6rem;
}

.footter {
    margin-top: 0px;
    width: 100%;
    height: 3.2rem;
    background-color: #f8b62d;
    ;
    display: flex;
    align-items: center;
}

.block_d_bot {
    margin-top: 0px;
    width: 100%;
    height: 200px;
    background-color: #f8b62d;
    margin-bottom: 60px;
}

.top_pic {
    width: 100%;
    height: 16rem;
    background-color: black;
}

.block_e_title {
    font-family: Arvo-Bold;
    padding-top: 90px;
    font-size: 1.4rem;
    color: black;
    /* font-weight: bold; */
}

.block_e_addus {
    font-family: 華康儷中黑;
    padding-top: 21px;
    /* font-weight: bold; */
    font-size: 1rem;
    color: black;
}

.block_e_backdiv {
    margin-top: 3rem;
    width: 1440px;
    height: 950px;
    /* border: solid 1px black; */
    background-color: white;
}

.block_e_usepic {
    width: 100%;
    height: 16rem;
    background-color: black;
}

.block_e {
    margin-bottom: 5rem;
    background-image: url("images/process_bg.jpg");
    width: 100%;
    height: 1100px;
    justify-content: center;
    display: flex;
    text-align: center;
    background-color: white;
    background-size: cover;
}

.d_text1 {
    font-family: Arvo-Bold;
    width: 100%;
    font-size: 1.3rem;
    font-weight: bold;
    height: 2rem;
    display: flex;
    align-items: flex-end;
    background-color: white;
}

.d_text2 {
    width: 100%;
    height: 48px;
    /* font-weight: bold; */
    background-color: white;
    display: flex;
    font-family: 華康儷中黑;
}

.d_text3 {
    width: 100%;
    height: 2.8rem;
    background-color: white;
    display: flex;
}

.d_text4 {
    width: 100%;
    line-height: 34px;
    font-size: 20px;
    display: flex;
    align-items: flex-end;
    background-color: white;
    color: #959595;
    font-family: DFHeiStd-W5;
}

.d_text5 {
    width: 100%;
    height: 1.8rem;
    background-color: white;
    display: flex;
}

.d_text6 {
    width: 100%;
    height: 1rem;
    background-color: white;
}

.d_text7 {
    width: 100%;
    height: 1rem;
    background-color: white;
}

.d_text8 {
    width: 100%;
    height: 1rem;
    background-color: white;
}

.pumber_left {
    margin-left: 1rem;
    display: flex;
    align-items: center;
    font-size: 20px;
    line-height: 25px;
    color: #f8b62d;
    width: 3rem;
    font-family: DFHeiStd-W5;
    background-color: white;
}

.e_pumber_left {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.6rem;
    color: white;
    width: 3rem;
    background-color: #f8b62d;
}

.e_pumber_right_top {
    margin-left: 0.5rem;
    margin-top: 8px;
    font-size: 0.6rem;
    color: white;
    font-family: DFHeiStd-W5;
    background-color: #f8b62d;
    display: flex;
    align-items: center;
}

.e_pumber_right_bot {
    margin-left: 0.5rem;
    margin-bottom: 10px;
    font-size: 42px;
    font-family: Raleway-Medium;
    color: white;
    background-color: #f8b62d;
    display: flex;
    align-items: center;
}

.pumber_right {
    font-size: 42px;
    padding-bottom: 6px;
    font-family: Raleway-Medium;
    color: #f8b62d;
    background-color: white;
    display: flex;
    align-items: center;
}

.block_d_text0 {
    height: 15rem;
    /*background-color: brown;*/
    margin-left: 4rem;
}

.block_d {
    width: 1440px;
    height: 616px;
    display: flex;
    background-color: white;
}

.block_Advantage_a {
    margin-top: 0px;
    width: 100%;
    height: 8rem;
    background-color: white;
}

.block_new_b {
    display: flex;
    justify-content: center;
}

.border_d_new {
    display: flex;
    width: 1440px;
    padding-top: 130px;
}

.block_b {
    margin-top: 0px;
    width: 1440px;
    height: 12.5rem;
    display: flex;
    justify-content: center;
    background-color: white;
}

.shadow_box {
    box-shadow: 0px 0px 13px 1px #4f4f4f6b;
}

.shadow_box_img {
    box-shadow: 9px 11px 6px 2px #4f4f4f63;
}

.flexx_c {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.border {
    border: 2px #f8b62d solid;
    height: 240px;
    width: 100%;
    border-radius: 31px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.border2 {
    border: 2px #f8b62d solid;
    height: 240px;
    width: 100%;
    border-radius: 31px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.block_c_text {
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 2rem;
    width: 100%;
}

.block_new_c {
    display: flex;
    justify-content: center;
}

.block_new_c2 {
    display: flex;
    justify-content: center;
    margin-top: 80px;
}

.block_c {
    width: 1200px;
    background-color: white;
    display: flex;
    align-items: center;
}

.block_c2 {
    width: 1200px;
    background-color: white;
    display: flex;
    align-items: center;
}

.text_advan {
    font-family: Arvo-Bold;
    font-size: 1.5rem;
    padding-top: 3rem;
    text-align: center;
    /* font-weight: bold; */
}

.text_joninus {
    font-family: 華康儷中黑;
    padding-top: 0.6rem;
    font-size: 1rem;
    text-align: center;
}

.block_b_table {
    width: 1200px;
    /*  padding-left: 9rem;
    padding-right: 9rem;*/
}

.block_b_td_1 {
    width: 25%;
    text-align: center;
}

.block_c_td_1 {
    height: 6rem;
    width: 25%;
    text-align: center;
}

.block_b_td_2 {
    font-family: Arvo;
    font-weight: bold;
    text-align: center;
    font-size: 0.7rem;
    padding-top: 0.5rem;
    cursor: pointer;
}

.block_b_text1 {
    text-align: center;
    font-size: 0.5rem;
    height: 2rem;
}

.block_b_td_3 {
    font-family: DFHeiStd-W5;
    font-size: 24px;
    padding-top: 16px;
    text-align: center;
    color: #6d6d6d;
    cursor: pointer;
}

.block_b_td_4 {
    padding-top: 0.9rem;
    text-align: center;
    padding-left: 2.2rem;
    padding-right: 1.3rem;
}

.block_b_td_4_1 {
    padding-top: 1rem;
    text-align: center;
    display: flex;
    justify-content: center;
}

.block_b_td_4_2 {
    padding-top: 1rem;
    text-align: center;
    display: flex;
    justify-content: center;
}

.bar {
    height: 0.3rem;
    width: 3rem;
    margin-top: 0.8rem;
    display: flex;
    align-items: center;
    background-color: #f8b62d;
    position: absolute;
    /*一開始會在左邊 從左邊開始絕對位置給他left距離50% 再扣掉一點回來置中*/
    left: 50%;
    margin-left: -1.5rem;
}

.bar1 {
    height: 12px;
    width: 130px;
    margin-left: 40px;
    display: flex;
    background-color: #f8b62d;
    align-self: flex-end;
}

.new {
    display: flex;
    flex-wrap: wrap;
}

.bar2 {
    margin-top: 36px;
    height: 12px;
    width: 140px;
    display: flex;
    background-color: #f8b62d;
}

.flex_master1 {
    display: flex;
    justify-content: center;
}