html, body {
    margin: 0;
    padding: 0;
}
p, a, li, li a, div {
    color: #585858;
}
.text-own {
    color: rgb(88, 88, 88) !important;
}
li {
    font-size: 12pt;
}
a:hover {
    text-decoration: none;
}
.phone-color{
    color:rgb(132, 173, 221);
}
.title-color{
    color: rgb(197, 127, 47) !important;
}
.sectitle-color{
    color: rgb(156, 122, 80);
}

table p{
    margin: 10px 0;
    padding: 0px 2px;
}

.seo-link {
    color: rgb(65, 110, 173);
}
.seo-link:hover {
    color: rgb(173, 90, 65);
}


img {
    width: 100%;
}

.ul-lineheight-unset {
    line-height: unset;
}
.ul-li-mb0 li{
    margin: 0 !important;
}
.ul-li-mb3 li {
    margin-bottom: 3rem!important;
}

.ol-li-mb0 li{
    margin: 0 !important;
}
.ol-li-mb10 li{
    margin-bottom: 10px;
}
.ol-li-mb30 li{
    margin-bottom: 30px;
}
.ol-li-mt50 li{
    margin-top: 50px;
}
.pl-1rem {
    padding-left: 1rem;
}

.ol-li-maincolor li {
    color: rgb(88, 88, 88)!important;
}
.ol-li-sectitle-color li {
    color: rgb(156, 122, 80);;
}

.ul-li-singlecolor li{
    color: rgb(88, 88, 88)!important;
}




.scroll{
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    display: none;
}
.scroll-bg {
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    border-radius:50%;
    background: rgb(216, 164, 113);
    animation: move 2s infinite;
}
#side-banner {
    position: fixed;
    top: 0;
    bottom: fit-content;
    left: 0px;
    border-radius: 0px 10px 0px 0px;
    /*box-shadow: 0.1em 0em 5px 2px rgba(34, 34, 34, 0.3);*/
}
#side-banner .side-container {
    width: fit-content; 
    height: 100vh;
}
#side-banner ul {
    list-style-type: none;
    margin-top: 250px;
    padding: 0;
}
#side-banner .side-container img{
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
    width: 35px;
    height: 100%;

}



#side-banner-mobile {
    margin-right: auto;
    margin-left: auto;
    margin-top: 50px;
    margin-bottom: 50px;
    display: none;
}
#side-banner-mobile ul {
    list-style-type: none;
    padding: 0;
}
#side-banner-mobile ul li{
    float: right;
}
#side-banner-mobile .side-container img{
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
    width: 35px;
    height: 35px;
}

@keyframes move {
    0% {
      transform: scale(1) 
    }
    50% {
      transform: scale(1.2) 
    }
    100% {
      transform: scale(1) 
    }
  }

@media (max-width:576px) {
    .scroll{
        bottom: 50px;
        right: 30px;
    }
    @keyframes move {
        0% {
          transform: scale(.6) 
        }
        50% {
          transform: scale(.8) 
        }
        100% {
          transform: scale(.6) 
        }
      }
    #side-banner-mobile {
        display: block;
    }
    #side-banner {
        display: none;
    }
    table p{
        font-size: 9pt;
    }
  }

/*==================================main-area=========================================*/
header h1 {
    font-size: 24pt;
}
.top-number  {
    line-height: 48px;
    background-color: rgb(255, 254, 254);
    padding-top: 10px;
    padding-bottom: 10px;
    z-index: 999999999999999;
}
.top-number .number a {
    font-size: 12pt;
    padding: 0;
    margin: auto;
    color: rgb(112, 112, 112);
    margin-left: 58px;  
}
.top-number a:hover {
    color: rgb(31, 31, 31);
    font-weight: 600;
}
.top-number .lang {
    text-align: right;
    padding-right: 45px;
}
.top-number .lang img {
    width: 25px;
    margin: 0 2px;
}

.navbar {
    background-color:white;
    line-height: 20px;
    z-index: 9999;
}
.navbar .call-mobile{
    display: none;
}
.navbar .call-mobile img{
    width:50px;
}
.navbar-toggler img {
    width: 50px;
}
.navbar .navbar-brand{
    color: rgb(39, 39, 39);
    margin-left: 40px;
}
.navbar .navbar-brand img {
    width: 75px;
}
.navbar .navbar-nav {
    margin-right: 10px;
}
.navbar .nav-item a {
    color: rgb(59, 59, 59);
    /*font-weight: 600;*/
    font-size: 13pt;
}
.navbar .nav-item a:hover {
    color: rgb(59, 139, 192);
}
.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
    color: rgb(230, 149, 57);
    font-size: 16pt;
    line-height: 7px;
}

.secondpage {
    background-image: url(../image/second-page/top_banner.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
}
.navbar .navbar-brand .c-title{
    font-size: 28px;
    padding: 10px 0;
    letter-spacing: 4px;
}
.navbar .navbar-brand .zh-title{
    font-size: 24px;
    padding: 10px 0;
}
.navbar .navbar-brand h1 {
    margin: 0;
    padding: 0;
    font-size: 28px;
    letter-spacing: 4px;
}
.navbar .navbar-brand .e-title{
    font-size: 16px;
    padding: 5px 0;
}
.navbar .navbar-brand .e-title-enpage{
    font-size: 30px;
    padding: 5px 0;
}



@media (max-width:992px) {
    .top-number .number a {
        margin-left: 15px;
    }
    .navbar {
        box-shadow: 0 0 5px 0 rgba(34, 34, 34, 0.3);
        padding-top: 20px;
    }
    .navbar .navbar-brand{
        margin-left: 5px;
    }
    .navbar .nav-item a {
        text-align: center;
        margin: 7px 0;
    }
    .navbar .navbar-nav {
        margin-top: 40px;
        margin-bottom: 100%;
    }

}
@media (max-width:768px) {
    .navbar .nav-item a {
        font-size: 13pt;
    }
}
@media (max-width:576px) {
    .top-number a {
        font-size: 10pt;
    }
    .navbar a {
        font-size: 12pt;
    }
    .navbar .navbar-brand img {
        width: 35px;
    }
    .navbar .navbar-brand .c-title{
        font-size: 16px;
        padding: 4px 0;
    }
    .navbar .navbar-brand h1 {
        margin: 0;
        padding: 0;
        font-size: 16px;
    }
    .navbar .navbar-brand .zh-title{
        font-size: 16px;
        padding: 4px 0;
    }
    .navbar .navbar-brand .e-title{
        font-size: 14px;
        padding: 4px 0;
    }
    .navbar .navbar-brand .e-title-enpage{
        font-size: 22px;
        padding: 0;
    }
}
@media (max-width:575px) {
    .top-number .lang {
        text-align: center;
        padding: 0px;
    }
    .top-number .number {
        display: none;
    }
    .navbar .call-mobile{
        display: block;
    }
    .navbar .navbar-brand{
        margin-left: auto;
        margin-right: auto;
    }
}
@media (max-width:321px) {
    .navbar .call-mobile img{
        width: 30px;
    }
    .navbar-toggler img {
        width: 30px;
    }
    .navbar .navbar-brand .e-title-enpage{
        font-size: 18px;
        padding: 0;
    }
}



/*==============================body===========================================*/
.link-pic .link-pic-content {
    margin-bottom: 10px;
}
.mainpage {
    background-image: url(../image/top_main.jpg);
    background-position: center;
    background-size: cover;
    height: 100vh;
    width: 100%;  
}
.mainpage .text-box{
    position: absolute;
    top: 80%;
    left: 75%;
    transform: translate(-90%, -75%);
    color: white;
}
.mainpage .text-box a{
    color: white;
}
.mainpage .text-box p{
    color: white;
    padding-left: 40px;
}
.mainpage .text-box h5{
    margin-bottom: 30px;
}
@media (max-width:1200px) {
    .mainpage .text-box{
        top: 75%;
        left: 60%;
        transform: translate(-40%, -45%);
    }
}
@media (max-width:768px) {
    .mainpage{
        height: 60vh;
        margin-bottom: 40px;
    }
    .mainpage .text-box{
        top: 45%;
        left: 40%;
        transform: translate(-10%, -40%);
    }
}
@media (max-width:576px) {
    .mainpage{
        background-size: cover;
        height: 60vh;
    }
    .mainpage .text-box{
        top: 60%;
        left: 30%;
        transform: translate(-20%, -60%);
    }
    .mainpage .text-box h5{
        font-size: 18pt;
        font-weight: 600;
    }
    .mainpage .text-box p{
        font-size: 12pt;
    }
}
@media (max-width:320px) {
    .mainpage{
        background-size: cover;
        height: 50vh;
    }
    .mainpage .text-box{
        top: 50%;
        left: 30%;
        transform: translate(-20%, -60%);
    }
    .mainpage .text-box h2{
        font-size: 13pt;
    }
    .mainpage .text-box p{
        font-size: 8pt;
    }
}

.content-first .text-box, .content-second .text-box, .content-fourth .text-box, .content-fifth, .area .text-box {
    margin-top: 138px;
}
.content-first .text-box .title, .content-second .text-box .title{
    margin: auto;
    width: 60%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: -ms-fit-content;
    text-align: center;
}
.content-fourth .text-box .title, .secondary-page .text-box .title, .area .text-box .title{
    margin: auto;
    width: 20%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: -ms-fit-content;
    text-align: center;
}

.content-first .text-box .title h2, .content-second .text-box .title h2, .content-fourth .text-box h2, .secondary-page .text-box h1, .area .text-box .title{
    border-left: 15px solid rgb(230, 149, 57);
    border-bottom: 1px solid rgb(230, 149, 57);
    padding-left: 10px;
    /*font-weight: 600;*/
    font-size: 20pt;
    padding-right: 25px;
    
}

.content-first .container, .content-second .container, .content-fourth .container, .secondary-page .container, .area .container{
    margin-top: 100px;
}
.content-first .text-box .text-content{
    text-align: justify;
}
.content-first .text-box img{
    border-radius: 30px;
    box-shadow: 0px 2px 5px 0 rgba(0, 0, 0, .6);
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.content-first h3, .content-second h3{
    font-size: 12pt;
}

.content-first h4, .content-second h4{
    border-radius: 10px;
    border: 1.5px solid rgb(230, 149, 57);
    width: 170px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: -ms-fit-content;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 30px;
    color: rgb(230, 149, 57);
    /*font-weight: 600;*/
    transition: .3s all ease-in-out;
    font-size: 12pt;
    line-height: 25px;
    text-align: center;
    
}
.content-first h4:hover, .content-second h4:hover{
    background-color:rgb(230, 149, 57) ;
    color: white;
    box-shadow: .1em .1em 5px rgba(34, 34, 34, 0.4);
}

@media (min-width:768px) {
    .content-first .text-box .mobile {
        display: none;
    }
}
@media (max-width:767px) {
    .content-first .text-box .pc {
        display: none;
    }
    .content-first .text-box .mobile {
        margin-bottom: 50px;
    }
}
@media (max-width:768px) {
    .content-first .text-box, .content-second .text-box, .content-fourth .text-box, .content-fifth, .secondary-page .text-box, .area .text-box {
        margin-top: 80px;
        padding: 0 25px;
    }
    .content-first .container, .content-second .container, .content-fourth .container, .secondary-page .container, .area .container{
        margin-top: 70px;
    }
    .content-first .text-box .title h2, .content-second .text-box .title h2, .content-fourth .text-box h2, .secondary-page .text-box h1, .area .text-box .title{
        font-size: 16pt;
    }
}
@media (max-width:576px) {
    .content-first .text-box {
        margin-top: 0px;
    }
}


.media p , .media .icon{
    text-align: center;
    width: 100%;
} 
.media i {
    font-size: 200px;
    color: rgb(206, 16, 16);
    animation: youtube 2s infinite;
    margin-top: 300px;
}
@keyframes youtube {
    0% {
      transform: scale(1) 
    }
    20% {
      transform: scale(1.1) 
    }
    30% {
      transform: scale(1) 
    }
    100% {
      transform: scale(1) 
    }
  }
@media (max-width:768px) {
    .media i {
        margin-top: 100px;
    }
}
.content-second .text-box .text-content{
    text-align: justify;
}
.content-second .text-box .text-content .text-style{
    width: fit-content;
    margin-left: auto;
    margin-right: auto;    
}
.content-second .text-box img{
    border-radius: 30px;
    box-shadow: 0px 2px 5px 0 rgba(0, 0, 0, .6);
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.content-second .pc{
    display: none;
}
@media (max-width:768px) {
    .content-second .text-content{
        padding-top: 90px;
    }
}
@media (min-width:576px) {
    .content-second .mobile{
        display: none;
    }
    .content-second .pc{
        display: block;
    }
}
@media (max-width:402px) {
    .content-second .mobile{
        display: none;
    }
    .content-second .pc{
        display: block;
    }
}




.content-third  {
    text-align: center;
    margin-top: 200px;
    background-color: rgba(43, 43, 49, 0.9);
    padding-top: 30px;
}
.content-third .text-content {
    margin-bottom: 30px;
}
.content-third .title,.content-third .text-content a{
    color: white;
}
.content-third .text-content a:hover {
    color:rgb(27, 238, 192) ;
    text-decoration: underline;
}
@media (max-width:576px) {
    .content-third{
        margin-top: 100px;
    }
}

.content-fourth h3 {
    font-size: 12pt;
}


.content-fifth {
    background-image: url(../image/body_03-mobile.jpg);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}
.content-fifth .fee{
    text-align: center;
    padding-top: 150px;
}
.content-fifth .fee-box {
    border-radius: 30px; 
}
.content-fifth .fee ul {
    padding: 0;
    list-style-type: none;
    display: inline-block;
}
.content-fifth .fee ul li{
    float: right;
    margin: 0 40px;
}
.content-fifth .fee a{
    line-height: 60px;
    color: rgb(255, 255, 255);
    /*font-weight: 600;*/
    font-size: 16pt;
    text-shadow: 0.1em 0.1em rgba(34, 34, 34, 0.1);
}
.content-fifth .fee .style_1 a:hover{
    color: rgb(27, 238, 192);
    text-shadow: 0.1em 0.1em rgba(34, 34, 34, 0.6);
}
.content-fifth .fee .style_2 a:hover{
    color: rgb(19, 200, 255);
    text-shadow: 0.1em 0.1em rgba(34, 34, 34, 0.6);
}
.content-fifth .fee .style_3 a:hover{
    color: rgb(255, 239, 19);
    text-shadow: 0.1em 0.1em rgba(34, 34, 34, 0.6);
}
.content-fifth .fee i{
    border-radius: 100%;
    border: 2px solid rgb(255, 255, 255);
    width: 160px;
    line-height: 160px;
    background-color: white;
    color: rgb(230, 149, 57);
    box-shadow: 0em 0.1em 5px 0px rgba(34, 34, 34, 0.3);

}
.content-fifth .fee .style_1 a:hover i{
    border: 2px solid rgb(27, 238, 192);
    background-color: rgba(255, 255, 255,.4);
}
.content-fifth .fee .style_2 a:hover i{
    border: 2px solid rgb(19, 200, 255);
    background-color: rgba(255, 255, 255,.4);
}
.content-fifth .fee .style_3 a:hover i{
    border: 2px solid rgb(255, 239, 19);
    background-color: rgba(255, 255, 255,.4);
}


.content-fifth .service {
    margin-top: 150px;
    padding-bottom: 50px;
    background-color: rgba(43, 43, 49, 0.9);
}
.content-fifth .service .title {
    text-align: end;
    text-align: right;
    border-right: 3px solid rgb(27, 238, 192);
    height: 300px;
    transform: translateY(50%);
}
.content-fifth .service .title{
    /*font-weight: 600;*/
    padding-right: 90px;
}
.content-fifth .service .menu{
    margin-top: 70px;
}
.content-fifth .service ul{
    padding: 0;
    list-style-type: none;
}
.content-fifth .service ul li{
    margin-bottom: 15px;
}
.content-fifth .service i{
    padding-right: 10px;
}
.content-fifth .service ul li a{
    color: rgb(235, 235, 235);   
}
.content-fifth .service p{
    color: white; 
    width: 180px;
    padding-right:0;
    padding-left: 0;
    padding-bottom: 10px;
    border-bottom:1px solid rgb(223, 223, 223) ;
}
.content-fifth .service p i{
    color: rgb(27, 238, 192);
}
.content-fifth .service ul li a:hover{
    color: rgb(230, 149, 57);
}
.content-fifth .title {
    color: white;
    font-size: 20pt;
}
@media (max-width:992px) {
    .content-fifth .fee{
        background-image: url(../image/body_03-mobile.jpg);
        background-size: cover;
        background-position: center;
    }
    .content-fifth {
        background-image: none;
    }
    .content-fifth .fee ul li{
        margin: 0 20px;
    }
    .content-fifth .service .title {
        text-align: center;
        border-right: none;
        height: 60px;
        margin: auto;
        border-bottom: 3px solid rgb(27, 238, 192);
    }
    .content-fifth .service {
        margin-top: 50px;
    }
    .content-fifth .service .title{
        padding-right: 0px;
        margin-top: 30px;
    }
}
@media (max-width:768px) {
    .content-fifth .fee ul li{
        float: none;
        margin-bottom: 50px;
    }
    .content-fifth .service ul{
        padding: 0;
        list-style-type: none;
        text-align: center;
        margin-bottom: 50px;
    }
    .content-fifth .service ul li a{
        font-size: 11pt;  
    }
    .content-fifth .service p{
        margin-left:auto;
        margin-right: auto;
        margin-bottom: 20px;
    }
}
@media (max-width:576px) {
    .content-fifth .service ul li a{
        font-size: 12pt;  
    }
    .content-fifth .service p{
        margin-left:auto;
        margin-right: auto;
        text-align: center;
    }
}



.area .text-box li {
    color: rgb(100, 100, 100);
}
.area-inner {
    margin-bottom: 90px;
}
.area ul{
    list-style-type: none;
    padding: 0;
}
.area ul li {
    float: left;
}
.area-inner {
    margin-bottom: 150px;
}
.area-inner2 {
    margin-bottom: 200px;
}
.area ul {
    margin-top: 20px;
}
.area .container .inner-title {
    font-size: 15pt;
    color: rgb(43, 43, 43);
}
@media (max-width:768px) {
    .area-inner {
        margin-bottom: 200px;
    }
    .area ul li {
        margin-bottom: 10px;
    }
}
@media (max-width:576px) {
    .area-inner {
    margin-bottom: 250px;
    }
}
@media (max-width:400px) {
    .area-inner {
    margin-bottom: 250px;
    }
    .area-inner2 {
        margin-bottom: 250px;
    }
}
@media (max-width:350px) {
    .area-inner {
    margin-bottom: 280px;
    }
    .area-inner2 {
        margin-bottom: 300px;
    }
}

.content-buttom {
    background-color: rgb(252, 252, 252);
    padding-top: 50px;
    padding-bottom: 50px;
}
.content-buttom .title {
    margin-bottom: 50px;
    padding-top: 70px;
    padding-bottom: 150px;
    text-align: center;
    background-image: url(../image/body_04.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: relative;
    z-index: 3;
    /*font-weight: 600;*/
    color: rgb(48, 48, 48);
}
.content-buttom .title p{
    font-size: 18pt;
}

.content-buttom .text-box .address{
    font-size: 12pt;
    margin-bottom: 35px;
}
.content-buttom .text-box a:hover{
    color: rgb(38, 155, 128);
}
.content-buttom .text-box .city {
    background-color: rgb(240, 197, 147);
    width: 20%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: -ms-fit-content;
    margin: 0;
    padding: 5px;
    /*font-weight: 600;*/
    border-radius: 30px 0 30px 0;
    color: rgb(0, 0, 0)
}




.contact {
    margin-top: 100px;
}
.contact .title{
    font-size: 13pt;
    letter-spacing: 5px;
}
.contact .text-box h5{
    font-size: 12pt;
}
.contact .en-text{
    font-family: 'Barlow';
}
.contact .inf-content a:hover,.contact .text-box a:hover{
    color: rgb(202, 164, 120);
}
.contact ul {
    list-style-type: none;
    margin-top: 50px;
    padding: 0;
    display: inline-block;
}
.contact ul li {
    float:left;
}
.contact .icon-content{
    text-align: center;
}
.contact .contact-inner img{
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
    width: 30px;
}
@media (max-width:768px) {
    .contact .inf-content{
        margin-top: 15px;
    }
}


.inf {
    margin: auto;
    text-align: center;
    color: rgb(73, 73, 73);
    padding-bottom: 10px;
    padding-top: 80px;
    font-size: 10pt;
}
footer{
    background-color: rgb(58, 58, 58);
    padding: 7px 0;
}
footer a {
    color: white;
}
footer a:hover {
    color: rgb(230, 156, 72);
}
footer .box{
    text-align: center;
    font-size: 10pt;
    color: white;
    word-break: break-all;
}
@media (max-width:576px) {
    .inf {
        text-align: justify;
    }
}
/*==============story style css======================*/
.main {
    overflow-x: hidden;
}
.main > .animate > :last-child {
    margin-bottom: 0;
}
.main.fullscreen {
    min-height: 100vh;
}
.main.style, .main.style2, .main.style2-1, .main.style2-2 {
    overflow: hidden;
}
.main > .animate > :last-child {
    margin-bottom: 0;
}
.main.fullscreen {
    min-height: 100vh;
}
.main.style > .animate {
    -moz-transition:  2s all ease;
    -webkit-transition: 2s all ease;
    -ms-transition:  2s all ease;
    transition: 2s all ease;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    position: relative;
}
.main.style2 > .animate, .main.style2-1 > .animate, .main.style2-2 > .animate {
    -moz-transition:  1s all ease;
    -webkit-transition: 1s all ease;
    -ms-transition:  1s all ease;
    transition: 1s all ease;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    position: relative;
}
.main.style2 > .animate2{
    -moz-transition:  1.5s all ease;
    -webkit-transition: 1.5s all ease;
    -ms-transition:  1.5s all ease;
    transition: 1.5s all ease;
    transition-delay: 0ms;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    position: relative;
}
.main.style2 > .animate3{
    -moz-transition:  2.5s all ease;
    -webkit-transition: 2.5s all ease;
    -ms-transition:  2.5s all ease;
    transition: 2.5s all ease;
    transition-delay: 0ms;
    -moz-transform: translateZ(0);
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    position: relative;
}



/*.main.style2.left {
    -moz-justify-content: -moz-flex-start;
    -webkit-justify-content: -webkit-flex-start;
    -ms-justify-content: -ms-flex-start;
    justify-content: flex-start;
}*/
.main.style.left {
    -moz-justify-content: -moz-flex-start;
    -webkit-justify-content: -webkit-flex-start;
    -ms-justify-content: -ms-flex-start;
    justify-content: flex-start;
}
.main.style.inactive> .animate {
    -moz-transform: translateY(-100vh);
    -webkit-transform: translateY(-100vh);
    -ms-transform: translateY(-100vh);
    transform: translateX(-100vh);
}
.main.style2.inactive> .animate, .main.style2.inactive> .animate2, .main.style2.inactive> .animate3 {
    -moz-transform: translateY(500px);
    -webkit-transform: translateY(500px);
    -ms-transform: translateY(500px);
    transform: translateY(500px);
}






/*==================================about page======================================*/
.sort {
    padding-left: 50px;
    margin-top: 50px;
}
.sort ul {
    list-style-type: none;
}
.sort ul li {
    float: left;  
    font-size: 12pt;
    margin-right: 5px;
}
.sort ul li a:hover {
    color: rgb(100, 189, 137);
}
.sort ul li p {
    color: rgb(230, 149, 57); 
}

.secondary-page {
    margin-top: 150px;
    text-align: justify;
}
.secondary-page .container ul{
    margin-bottom: 50px;
}
.secondary-page .container ul li{
    margin-bottom: 25px;
    /*color: rgb(84, 153, 209);*/
    color: rgb(156, 122, 80);
}
.secondary-page .container h5{
    line-height: 60px;
}
.secondary-page .container h2,.secondary-page .container h3,.secondary-page .container h4,.secondary-page .container h5{
    font-size: 15pt;
    color: rgb(230, 149, 57);
    margin-top: 40px ;
    margin-bottom: 20px;
}
.secondary-page .inner {
    margin-top: 150px;
}
.secondary-page .inner ul {
    list-style-type: none;
    padding: 0;
}
.secondary-page .inner ul a:hover{
    color: rgb(230, 149, 57);
}
.secondary-page .inner ul i, .tag-green{
    color: rgb(31, 182, 149);
}
.secondary-page .inner ul li{
    margin-bottom: 15px;
}
.secondary-page .inner ul .active{
    color: rgb(230, 109, 109);
}
.secondary-page .container .list ul{
    list-style-type: none;
    padding: 0;
}
.secondary-page .container .list ul li{
    color: rgb(88, 88, 88);
}
.secondary-page .text-box a {
    color: rgb(67, 123, 196);
}
.secondary-page .text-box a:hover {
    color: rgb(218, 45, 33);
}
.secondary-page .text-box .inner a {
    color: #585858;
}
.p-box p{
    margin: 0;
}


.locating-ppl-inner-4 h5{
    height: 50px;
}
.locating-ppl-inner-6 .container ul{
    margin-top: 40px;
}


.permarital-inner-1 ul{
    margin-top: 50px;
}

.inner-ul-mt ul{
    margin-top: 20px;
}
.inner-li-color .container ul li {
    color: rgb(88, 88, 88);
}
.inner-li-color-zh .container ul li {
    color: rgb(27, 27, 27);
}
.permarital-inner-1 ul li{
    padding-bottom: 10px;
}
.permarital-inner-1 ul li p , .sign-of-cheat-inner-4 ul li p ,.sign-of-cheat-inner-7 ul li p, .sign-of-cheat-inner-9 ul li p,.sign-of-cheat-inner-10 ul li p{
    margin-bottom: 8px;
}
.sign-of-cheat .container ul li{
    color: rgb(88, 88, 88);
}


@media (max-width:768px) {
    .sort {
        margin-top: 50px;
        padding-left: 0px;
    }
    .secondary-page {
        margin-top: 140px;
    }
    .locating-ppl-inner-3, .locating-ppl-inner-6 , .inner-title-mt{
        margin-top: 200px;
    }
    .locating-ppl-inner-4 h5{
        height: 55px;
    }
}
@media (max-width:576px) {
    .locating-ppl-inner-6 .container h5{
        line-height: 30px;
        margin-bottom: 20px;
    }
    .locating-ppl-inner-6 .container ul, .permarital-inner-1 ul{
        padding:0;
    }
    .inner-ul-pad ul{
        padding: 0;
    }
    .inner-ol-pad ol{
        padding: 0;
    }
    .p-box p{
        margin-bottom: 5px;
    }
}

@media (min-width:768px) {
    .applink .mobi768 {
        display: none;
    }
}
@media (max-width:767px) {
    .applink .pc {
        display: none;
    }
}

@media (max-width:460px) {
    .applink .mobi768 {
        display: none;
    }
}

@media (min-width:461px) {
    .applink .mobi400 {
        display: none;
    }
}



/*========================resume===========================*/
#resume td{
    padding: 0 30px;
}
#resume p{
    margin: 0;
}
#resume .img-box{
    overflow:hidden;
    text-align: center;
}
/*#resume img{
    width: 100%;
    transition: all 1s ease-out;
}
#resume img:hover{
    transform: scale(1.2);
}*/
#resume a:hover{
    color: rgb(230, 149, 57);
}

#resume .content-box {
    padding: 0 40px;
    margin-bottom: 30px;
}
#resume .content-box p {
    font-size: 11pt;
}

@media (max-width: 400px) {
    #resume p{
        font-size: 9pt;
    }
}
@media (max-width: 320px) {
    #resume p{
        font-size: 8pt;
    }
}

/*=======================media========================*/
/*#media .media-box{
    height: 300px;
}
#media .container .title {
    text-align: left;
    width: 100%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: -ms-fit-content;
}
#media .text-container {
    text-align: center;
    height: 150px;
}
#media h5 {
    font-size: 13pt;
}
#media .first{
    padding-top: -300px;
}
#media .second{
    margin-top: 100px;
}
@media (max-width:576px) {
    #media h5 {
        line-height: 26px;
    }
    #media .container {
        margin-top: 30px;
    }
}*/
#media {
    margin-bottom: 450px;
}
#media .media-box{
    height: 300px;
}
#media .container .title {
    width: 100%;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: -ms-fit-content;
}
#media a h2 {
    font-size: 18pt;
    height: 70px;
    color: rgb(197, 127, 47);
}
#media a h2:hover {
    color: rgb(231, 177, 114);
}
#media .text-container {
    text-align: justify;
    height: 120px;
    margin-top: 20px;
}
#media .first{
    padding-top: -300px;
}
#media .second{
    margin-top: 100px;
}
@media (max-width:1600px) {
    #media .media-box{
        height: 200px;
    }
}
@media (max-width:1200px) {
    #media .media-box{
        height: 500px;
    }
    #media a h2 {
        height: unset;
    }
    #media .text-container {
        height: unset;
        margin-top: 20px;
        margin-bottom: 40px;
    }
}
@media (max-width:992px) {
    #media .media-box{
        height: 400px;
    }
}
@media (max-width:768px) {
    #media .media-box{
        height: 300px;
    }
}
@media (max-width:576px) {
    #media h5 {
        line-height: 26px;
    }
    #media .container {
        margin-top: 30px;
    }
    #media .media-box{
        height: 200px;
    }
}

/*=========================services==================================*/
#service {
    margin-top: 150px;
    padding-bottom: 50px;
}
#service .menu{
    margin-top: 70px;
}
#service ul{
    padding: 0;
    list-style-type: none;
}
#service ul li{
    margin-bottom: 15px;
}
#service i{
    padding-right: 10px;
}
#service ul li a{
    color: rgb(136, 136, 136);   
}
#service p{
    color: rgb(65, 151, 133); 
    padding-bottom: 10px;
    border-bottom:1px solid rgb(223, 223, 223) ;
}
#service p i{
    color: rgb(241, 138, 112);
}
#service ul li a:hover{
    color: rgb(230, 149, 57);
}
#service .style {
    margin-bottom: 50px;
}
.content-fifth .service-page{
    padding-bottom: 150px;
}

@media (max-width:576px) {
    #service {
        margin-top: 50px;
    }
}

#service .active a{
    color: rgb(230, 109, 109);
}

/*=========================contact==================================*/
.contact-btn a{
    border-radius: 10px;
    border: 1.5px solid rgb(79, 148, 226);
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 30px;
    color: rgb(79, 148, 226);
    /*font-weight: 600;*/
    transition: .3s all ease-in-out;
    font-size: 12pt;
    line-height: 25px;
}
.contact-btn a:hover {
    background-color:rgb(79, 148, 226) ;
    color: white;
    box-shadow: .1em .1em 5px rgba(34, 34, 34, 0.4);
}
.contact-link img{
    width: 35px;
  }

@media (max-width:576px) {
    .contact-link .img{
        padding-bottom: 50px;
    }
    .contact-link{
        text-align: center;
        margin-top: 50px;
    }
}



/**/
.contact-banner {
    background-image: url(../image/second-page/contact.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .cost-banner {
    background-image: url(../image/second-page/cost.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .law-banner {
    background-image: url(../image/second-page/law.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .marriage-banner {
    background-image: url(../image/second-page/marriage.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .about-banner {
    background-image: url(../image/second-page/about.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .services-banner {
    background-image: url(../image/second-page/services.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  /*service*/
  .internet_investigation-banner {
    background-image: url(../image/second-page/internet_investigation.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .accident-banner {
    background-image: url(../image/second-page/accident.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .debt-banner {
    background-image: url(../image/second-page/debt.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .children-banner {
    background-image: url(../image/second-page/children.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .criminal_defense-banner {
    background-image: url(../image/second-page/criminal_defense.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .divorce_support-banner {
    background-image: url(../image/second-page/divorce_support.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .business-banner {
    background-image: url(../image/second-page/business.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .undercover_investigation-banner {
    background-image: url(../image/second-page/undercover_investigation.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  .credit_investigation-banner {
    background-image: url(../image/second-page/credit_investigation.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%;  
  }
  /*taiwan*/
  .taiwan-banner {
    background-image: url(../image/second-page/taiwan.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .keelung-banner {
    background-image: url(../image/second-page/keelung.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .taipei-banner {
    background-image: url(../image/second-page/taipei.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .n_taipei-banner {
    background-image: url(../image/second-page/new_taipei_city.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .taoyuan-banner {
    background-image: url(../image/second-page/taoyuan.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .hsinchu-banner {
    background-image: url(../image/second-page/hsinchu.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .taichung-banner {
    background-image: url(../image/second-page/taichung.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .chiayi-banner {
    background-image: url(../image/second-page/chiayi.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .tainan-banner {
    background-image: url(../image/second-page/tainan.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .kaohsiung-banner {
    background-image: url(../image/second-page/kaohsiung.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .pingtung-banner {
    background-image: url(../image/second-page/pingtung.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .taitung-banner {
    background-image: url(../image/second-page/taitung.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .hualien-banner {
    background-image: url(../image/second-page/hualien.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .yilan-banner {
    background-image: url(../image/second-page/yilan.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  /*oversea*/
  .australia-banner {
    background-image: url(../image/second-page/australia.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .canada-banner {
    background-image: url(../image/second-page/canada.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .china-banner {
    background-image: url(../image/second-page/china.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .hongkong-banner {
    background-image: url(../image/second-page/hongkong.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .india-banner {
    background-image: url(../image/second-page/india.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .indonesia-banner {
    background-image: url(../image/second-page/indonesia.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .japan-banner {
    background-image: url(../image/second-page/japan.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .korea-banner {
    background-image: url(../image/second-page/korea.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .malaysia-banner {
    background-image: url(../image/second-page/malaysia.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .philippines-banner {
    background-image: url(../image/second-page/philippines.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .singapore-banner {
    background-image: url(../image/second-page/singapore.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .thailand-banner {
    background-image: url(../image/second-page/thailand.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .united_states-banner {
    background-image: url(../image/second-page/united_states.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .vietnam-banner {
    background-image: url(../image/second-page/vietnam.jpg);
    background-position: center;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .adultery-banner {
    background-image: url(../image/second-page/adultery.jpg);
    background-position: bottom;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  .mdeia-banner {
    background-image: url(../image/second-page/media.jpg);
    background-position: top;
    background-size: cover;
    height: 60vh;
    width: 100%; 
  }
  @media (min-width:1300px) {
    .about-banner,.law-banner,.cost-banner,.contact-banner {
      background-attachment: fixed;
    }
  }
  @media (max-width:1300px) {
    .about-banner {
      background-image: url(../image/second-page/about-2.jpg);
    }
    .cost-banner {
      background-image: url(../image/second-page/cost-2.jpg);
    }
  }

  /**/
  .swing {
    animation: zoom 2s infinite;
  }
  
  .swing-2 {
    animation: zoom 2s infinite;
    animation-delay: .2s;
  }
  
  .swing-3 {
    animation: zoom 2s infinite;
    animation-delay: .4s;
  }
  
  .swing-4 {
    animation: zoom 2s infinite;
    animation-delay: .6s;
  }
  
  
  
  @keyframes zoom {
    0% {
      transform: scale(1) 
    }
    20% {
      transform: scale(1.2) 
    }
    30% {
      transform: scale(1) 
    }
    100% {
      transform: scale(1) 
    }
  }
  
  @keyframes zoom-2 {
    0% {
      transform: rotate(-30deg);
    }
    50% {
      transform: rotate(30deg);
    }
    100% {
      transform: rotate(-30deg);
    }
  }
  @keyframes zoom-3 {
    0% {
      transform: rotate(-30deg);
    }
    50% {
      transform: rotate(30deg);
    }
    100% {
      transform: rotate(-30deg);
    }
  }
  @keyframes zoom-4 {
    0% {
      transform: rotate(-30deg);
    }
    50% {
      transform: rotate(30deg);
    }
    100% {
      transform: rotate(-30deg);
    }
  }
  
/*table rwd style*/
/* 基本表格設定 */
.rwdTable {
    display: table;
    width: 100%;
    border-collapse: separate;
    border-spacing: 5px;
    text-align: center;
  }
  
  .rwdTr, .rwdTitle_gorup {
    display: table-row;
  }
  
  .rwdTh, .rwdTd {
    display: table-cell;
    vertical-align: top;
    padding: 30px 10px;
  }
  
  /* 表格單雙行顏色變化 */
  .rwdTr:nth-of-type(even), .rwdTitle_gorup:nth-of-type(even) {
    background-color: #eaeaea;
  }
  
  .rwdTh {
    color: rgb(204, 74, 74);
  }

  @media (max-width: 767.98px) {
  /* 增加外框線 */
  .rwdTable{
    border: 1px solid rgb(206, 206, 206);
    text-align: left;

  }

  /* 將表格中間的空間刪掉 */
  .rwdTable {
    border-spacing: 0px;
  }

  /* 隱藏表頭列 */
  .rwdTr:first-of-type {
    display: none;
  }
  .rwdTd:first-of-type {
    color: rgb(204, 74, 74);
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 10px;
  }
  
  .rwdTd {
    display: table; padding: 0; 
  }
 
  .rwdTd:before{
    content: attr(data-th);
    display: table-cell;
    color: rgb(92, 92, 92);
    padding: 3px 10px;
    white-space: nowrap;
    vertical-align: top;
  }

  .rwdTd span{
    padding: 3px 10px;
    display: inline-block;
  }

  .rwdTr:nth-of-type(even), .rwdTitle_gorup:nth-of-type(even) {
    background-color: #eaeaea;
  }
  
}


.anchor{
    display: block;
    height: 800px; /* 高度與navbar相同, 用來補上被navbar覆蓋的高度 */
    margin-top: -800px; /* 高度與navbar相同, 將頁面內容拉近, 不要造成額外空白 */
    visibility: hidden; /* 隱藏 */
  }