@charset "UTF-8";

/*-----------------------------------------------------------------------------------
    
    Author's Layout | Version: 1.0

-----------------------------------------------------------------------------------*/
/* ----------------------------------------------------------------
    - Basic
    - Header
    - Edit
    - Search
    - Main
    - Footer
---------------------------------------------------------------- */

/* ----------------------------------------------------------------
    - Basic -
-----------------------------------------------------------------*/

    /*   #00b7fd   */
    body {
        /*    padding-bottom: 40px;*/
        color: #5a5a5a;
        background: url(../image/bg.jpg) no-repeat;
        background-size: cover;
        font-family: 'Microsoft Yahei', "思源黑体", "Noto Sans SC", sans-serif;
        font-size: 1.25rem;
        padding-top: 85px;
    }

    a:link,
    a:visited {
        color: black;
    }

    pre {
        tab-size: 8;
    }

    .contain-wrap {
        /*padding-top: 450px;*/
        padding-top: 20vw;
    }
    .contain-wrap.carousel1 {
        background: url('../image/carousel1.png') no-repeat;
        background-size: contain;
    }
    .contain-wrap.carousel2 {
        background: url('../image/carousel2-2.png') no-repeat;
        background-size: contain;
    }
    .contain-wrap.carousel3 {
        background: url('../image/carousel3.png') no-repeat;
        background-size: contain;
    }

    .container {
        /*    padding: 10px;*/
    }

    .center {
        text-align: center;
    }

    #nav2,
    .bottommenu {
        display: none;
    }

/* ----------------------------------------------------------------
    - Header -
-----------------------------------------------------------------*/

    .navbar,
    .navbar-collapse {
        height: 89px;
    }
    .navbar-collapse {
        background-image: none;
        background-color: transparent;
        display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
        justify-content: space-between;
    }

    .logo {
        margin-top: 13px;
        max-width: 230px;
        width: 20vw;
        height: 10vh;
        max-height: 73px;
    }

    .logo2 {
        display: none;
    }

    .hamburger {
        padding: 8px 8px;
        display: none;
        cursor: pointer;
        transition-property: opacity, filter;
        transition-duration: 0.15s;
        transition-timing-function: linear;
        font: inherit;
        color: inherit;
        text-transform: none;
        background-color: transparent;
        border: 0;
        margin: 0;
        overflow: visible;
    }

    .hamburger:hover {
        opacity: 0.7;
    }

    .hamburger.is-active:hover {
        opacity: 0.7;
    }

    .hamburger.is-active .hamburger-inner,
    .hamburger.is-active .hamburger-inner::before,
    .hamburger.is-active .hamburger-inner::after {
        background-color: #fff787;
    }

    .hamburger-box {
        width: 40px;
        height: 24px;
        display: inline-block;
        position: relative;
    }

    .hamburger-inner {
        display: block;
        top: 50%;
        margin-top: -2px;
    }

    .hamburger-inner,
    .hamburger-inner::before,
    .hamburger-inner::after {
        width: 40px;
        height: 4px;
        background-color: #fff787;
        border-radius: 4px;
        position: absolute;
        transition-property: transform;
        transition-duration: 0.15s;
        transition-timing-function: ease;
    }

    .hamburger-inner::before,
    .hamburger-inner::after {
        content: "";
        display: block;
    }

    .hamburger-inner::before {
        top: -10px;
    }

    .hamburger-inner::after {
        bottom: -10px;
    }

    .hamburger--spin .hamburger-inner {
        transition-duration: 0.22s;
        transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    .hamburger--spin .hamburger-inner::before {
        transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
    }

    .hamburger--spin .hamburger-inner::after {
        transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    .hamburger--spin.is-active .hamburger-inner {
        transform: rotate(225deg);
        transition-delay: 0.12s;
        transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    .hamburger--spin.is-active .hamburger-inner::before {
        top: 0;
        opacity: 0;
        transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
    }

    .hamburger--spin.is-active .hamburger-inner::after {
        bottom: 0;
        transform: rotate(-90deg);
        transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    .side-collapse,
    .navbar-toggle,
    .navbar-inverse,
    .navbar-nav {
        background-color: transparent;
        background-image: none;
    }

    .navbar {
        background-color: #fff;
        background-image: none;
        border-bottom: 1px solid #00b7fd;
        box-shadow: 0 2px 8px rgba(0, 183, 253, 0.6);
    }

    .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
        border-color: transparent;
    }

    .navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav > li > a {
        text-shadow: none;
    }

    #nav1.navbar-nav {
        display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
        justify-content: space-between;
    }

    .navbar-nav li a {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        color: inherit;
        line-height: 20px;
        display: block;
        width: 100%;
        height: 89px;
        padding: 10px 10px 10px 20px;
        margin: 0;
    }

    .navbar-mav span {
        width: 1rem;
        text-align: center;
        margin-right: 0.16rem;
        display: inline-block;
    }

    #nav1 li a {
        max-width: 95px;
        width: 15vw;
        height: 20vw;
        max-height: 89px;
        float: left;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .navbar-toggle {
        margin-top: 5px;
    }

    .side-colse-btn {
        height: 30px;
        border-bottom: transparent !important;
    }
    .side-colse-btn .hamburger {
        padding: 0;
        margin: 0;
        position: absolute !important;
        top: 0;
        right: 0;
        z-index: 9;
    }
    .close-icon {
      position: relative;
      display: inline-block;
      width: 30px;
      height: 30px;
      overflow: hidden;
    }
    .close-icon::before,
    .close-icon::after {
      content: ' ';
      position: absolute;
      background: #a5cfe6;
      height: 3px;
      width: 100%;
      border-radius: 4px;
      top: 50%;
      left: 0;
      margin-top: -1px;
    }
    .close-icon::before {
      -webkit-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      transform: rotate(45deg);
    }
    .close-icon::after {
      -webkit-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      transform: rotate(-45deg);
    }

    #nav2 li a {
        font-size: 1.5rem;
        color: #fff;
        text-align: left;
    }

    .iconfont:after {
        content: "";
        padding-right: 1rem;
    }

    .nav1menu1 {
        background: url('../image/navmenu1.png');
    }

    .nav1menu1:hover {
        background: url('../image/menuhover1.png');
    }

    .nav1menu2 {
        background: url('../image/navmenu2.png');
    }

    .nav1menu2:hover {
        background: url('../image/menuhover2.png');
    }

    .nav1menu3 {
        background: url('../image/navmenu3.png');
    }

    .nav1menu3:hover {
        background: url('../image/menuhover3.png');
    }

    .nav1menu4 {
        /*    background: 'url(../image/navmenu4.png');*/
        background: url('../image/navmenu24.png');
    }

    .nav1menu4:hover {
        background: url('../image/menuhover4.png');
    }

    .nav1menu5 {
        /*    background: 'url(../image/navmenu5.png');*/
        background: url('../image/navmenu35.png');
    }

    .nav1menu5:hover {
        background: url('../image/menuhover5.png');
    }

    .nav1menu6 {
        /*    background: 'url(../image/navmenu6.png');*/
        background: url('../image/navmenu36.png');
    }

    .nav1menu6:hover {
        background: url('../image/menuhover6.png');
    }

    .nav1menu7 {
        background: url('../image/navmenu7.png');
    }

    .nav1menu7:hover {
        background: url('../image/menuhover7.png');
    }

    .nav1menu8 {
        background: url('../image/navmenu8.png');
    }

    .nav1menu8:hover {
        background: url('../image/menuhover8.png');
    }

    .newmarqee {
        /*width: 100vw;*/
        height: 38px;
        background: #e4f4ff;
        position: relative;
        bottom: 0;
    }

    .nav1menu01 {
        background: url('../image/navmenu01.png');
    }

    .nav1menu01:hover {
        background: url('../image/navmenu01hover.png');
    }

    .nav1menu02 {
        background: url('../image/navmenu02.png');
    }

    .nav1menu02:hover {
        background: url('../image/navmenu02hover.png');
    }

    .nav1menu03 {
        background: url('../image/navmenu03.png');
    }

    .nav1menu03:hover {
        background: url('../image/navmenu03hover.png');
    }

    .nav1menu04 {
        background: url('../image/navmenu04.png');
    }

    .nav1menu04:hover {
        background: url('../image/navmenu04hover.png');
    }

    .nav1menu05 {
        background: url('../image/navmenu05.png');
    }

    .nav1menu05:hover {
        background: url('../image/navmenu05hover.png');
    }

    .nav1menu06 {
        background: url('../image/navmenu06.png');
    }

    .nav1menu06:hover {
        background: url('../image/navmenu06hover.png');
    }

    .nav1menu07 {
        background: url('../image/navmenu07.png');
    }

    .nav1menu07:hover {
        background: url('../image/navmenu07hover.png');
    }

    .nav1menu08 {
        background: url('../image/navmenu08.png');
    }

    .nav1menu08:hover {
        background: url('../image/navmenu08hover.png');
    }

    .nav1menu09 {
        background: url('../image/navmenu09.png');
    }

    .nav1menu09:hover {
        background: url('../image/navmenu09hover.png');
    }

    .nav1menu10 {
        background: url('../image/navmenu10.png');
    }

    .nav1menu10:hover {
        background: url('../image/navmenu10hover.png');
    }

    .nav1menu11 {
        background: url('../image/navmenu11.png');
    }

    .nav1menu11:hover {
        background: url('../image/navmenu11hover.png');
    }

    .nav1menu12 {
        background: url('../image/navmenu12.png');
    }

    .nav1menu12:hover {
        background: url('../image/navmenu12hover.png');
    }

    .nav1menu13 {
        background: url('../image/navmenu13.png');
    }

    .nav1menu13:hover {
        background: url('../image/navmenu13hover.png');
    }

    .nav1menu14 {
        background: url('../image/navmenu14.png');
    }

    .nav1menu14:hover {
        background: url('../image/navmenu14hover.png');
    }

    .nav1menu15 {
        background: url('../image/navmenu15.png');
    }

    .nav1menu15:hover {
        background: url('../image/navmenu15hover.png');
    }

    .nav1menu16 {
        background: url('../image/navmenu16.png');
    }

    .nav1menu16:hover {
        background: url('../image/navmenu16hover.png');
    }

    #nav2 li a span {
        /*    float: left;*/
        display: inline-block;
        margin-right: 5px;
        /*    text-align: left;*/
        /*    overflow: hidden;*/
    }

    #nav2 li {
        display: inline-block;
        text-align: left;
        width: 93% !important;
        box-sizing: border-box;
    }

    #nav2 li .iconfont {
        color: #ffff86;
        font-size: 2.5rem !important;
        width: 30px !important;
        float: left;
        text-align: center;
    }

    #nav2 li .navtext {
        width: 60% !important;
        text-align: left;
        float: left;
        line-height: 2.5vh;
    }

    #nav2 img {
        height: 100%;
        width: 80%;
        max-height: 3.5vh;
    }

/* ----------------------------------------------------------------
    - Edit -
-----------------------------------------------------------------*/

    .table1 {
        border-collapse: collapse;
        font-size: 14px;
        line-height: 20px;
        /* border-top: 1px solid #bdc9d2;
        border-left: 1px solid #bdc9d2; */
    }

    .table1 td,
    .table1 th {
        padding: 5px 6px;
        /* border-right: 1px solid #bdc9d2;
        border-bottom: 1px solid #bdc9d2; */
        border:1px solid #bdc9d2;
        text-align: center;
    }
    .table1 th{
        background-color: #e8f4fc;
        color:#2991e4;
    }

    .table1 thead {
        font-size: 12px;
        line-height: 18px;
        color: white;
    }

    .table1 thead td,
    .table1 thead th {
        padding: 5px 6px;
    }

    .table1 thead th {
        text-align: center;
    }

    .table1 tbody {
        background: white;
    }

    .table1.resulttable td,
    .table1.resulttable th {
        font-size: 16px;
        padding: 2%;
    }

    .table1 p {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .detail1 {
        font-size: 14px;
        line-height: 24px;
    }

    .detail1 p {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .corner1 {
        width: 31px;
        height: 31px;
        background: url(../image/border/textborder_01.png) no-repeat;
        background-size: contain;
    }

    .corner2 {
        min-width: 50px;
        height: 31px;
        background: url(../image/border/textborder_02.png) repeat-x;
        background-size: contain;
    }

    .corner3 {
        width: 31px;
        height: 31px;
        background: url(../image/border/textborder_03.png) no-repeat;
        background-size: contain;
    }

    .corner4 {
        width: 31px;
        min-height: 50px;
        background: url(../image/border/textborder_04.png) repeat-y;
        background-size: contain;
    }

    .corner5 {
        background-color: white;
        display: block;
        min-height: 200px;
    }

    .corner6 {
        width: 31px;
        min-height: 50px;
        background: url(../image/border/textborder_06.png) repeat-y;
        background-size: contain;
    }

    .corner7 {
        width: 31px;
        height: 31px;
        background: url(../image/border/textborder_07.png) no-repeat;
        background-size: contain;
    }

    .corner8 {
        min-width: 50px;
        height: 31px;
        background: url(../image/border/textborder_08.png) repeat-x;
        background-size: contain;
    }
   
    .corner9 {
        width: 31px;
        height: 31px;
        background: url(../image/border/textborder_09.png) no-repeat;
        background-size: contain;
    }


   .bold {
        font-weight: 600;
    }

    .red {
        color: red !important;
    }

    .or {
        color: orange;
    }

/* ----------------------------------------------------------------
    - Search -
-----------------------------------------------------------------*/

    .searchbar {
        display: block;
        background: url('../image/inquire_box.png') center no-repeat;
        /*background-image: -moz-linear-gradient(90deg, #00c1ff 0%, #0099f9 100%);
        background-image: -webkit-linear-gradient(90deg, #00c1ff 0%, #0099f9 100%);
        background-image: -ms-linear-gradient(90deg, #00c1ff 0%, #0099f9 100%);*/
        display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex;
        justify-content: space-between;
        align-items: center;
        width: 850px;
        max-width: 850px;
        max-height: 134px;
        margin: 10px auto 0;
        /*height: 20vw;*/
        box-sizing: border-box;
        padding: 20px 6% 38px;
        overflow: hidden;
    }

    .search {
        display: block;
        font-size: 20pt;
        line-height: 34px;
        background: #b4d2e2;
        box-sizing: border-box;
        width: 380px;
        height: 34px;
        border: 0;
        border-radius: 10px;
        box-shadow: inset 2px 3px 7px rgba(138, 162, 175, 0.5);
        text-indent:10px;
    }

    .search:focus {
        border: none;
        outline: none;
    }

    .searchbtn {
        font-size: 0;
        color: transparent;
        display: block;
        background: url(../image/inquire_button.png) center no-repeat;
        background-size: contain;
        width: 168px;
        height: 56px;
    }
    .searchbtn:hover {
        background: url(../image/inquire_hover_button.png) center no-repeat;
        background-size: contain;
    }

    .searchtitle {
        display: block;
        font-size: 20pt;
        font-weight: 800;
        line-height: 59px;
        color: white;
        text-align: center;
        /*width: 190px;*/
        width: 22%;
        height: 78px;
    }

    .stitle1 {
        background: url(../image/searchtitle1.png) center no-repeat;
        background-size: contain;
    }

    .stitle2 {
        background: url(../image/searchtitle2-2.png) center no-repeat;
        background-size: contain;
    }

    .stitle3 {
        background: url(../image/searchtitle3.png) center no-repeat;
        background-size: contain;
    }

    .m-stitle1 {
        background: url(../image/m-searchtitle1.png) center no-repeat;
        background-size: contain;
    }

    .m-stitle2 {
        background: url(../image/m-searchtitle2-2.png) center no-repeat;
        background-size: contain;
    }

    .m-stitle3 {
        background: url(../image/m-searchtitle3.png) center no-repeat;
        background-size: contain;
    }

/* ----------------------------------------------------------------
    - Main -
-----------------------------------------------------------------*/

    .title1 {
        width: 100%;
        /*    height:20vw;*/
        text-align: center;
        padding: 30px;
        max-width: 656px;
        margin: auto;
        background: url(../image/title1.png) no-repeat;
        background-position: center;
        background-size: contain;
    }

    .title2 {
        width: 100%;
        /*    height:20vw;*/
        text-align: center;
        padding: 3vw;
        max-width: 656px;
        margin: auto;
        background: url(../image/title2.png) no-repeat;
        background-position: center;
        background-size: contain;
    }

    .title3 {
        width: 100%;
        /*    height:20vw;*/
        text-align: center;
        padding: 3vw;
        max-width: 656px;
        margin: auto;
        background: url(../image/title3.png) no-repeat;
        background-position: center;
        background-size: contain;
    }

    .title4 {
        width: 100%;
        /*    height:20vw;*/
        text-align: center;
        padding: 3vw;
        max-width: 656px;
        margin: auto;
        background: url(../image/title4.png) no-repeat;
        background-position: center;
        background-size: contain;
    }

   /* News */
        marquee {
            margin-left: 20px;
            color: #007dcb;
            line-height: 38px;
        }

        marquee:before {
            position: absolute;
            /*    display: inline-block;*/
            content: ' ';
            background: url("../image/news.png") center left no-repeat;
            background-size: contain;
            width: 17px;
            height: 15px;
            top: 10px;
            margin-left: -20px;
            /*    left: 0;*/
            /*    right: 0;*/
        }

        /*
        marquee:after {
            content: '';
            display: block;
            clear: both;
            background: #4b3532;
            height: 1px;
            margin-left: 7vw;
        }
        */

    /*tabs*/
    .tablist {
        width: 100%;

    }

    #contenttab1 {
        text-align: center;
        width: 100%;
    }

    #contenttab1 li {
        display: inline-block;
        margin-left: 1vw;
        font-size: 1.5em;
        line-height: 2em;
        width: 11vw;
        height: 4vw;
        max-width: 147px;
        max-height: 53px;
        /*    box-sizing: border-box;*/
    }

    #contenttab1 li a {
        background: url(../image/tab2.svg) no-repeat;
        position: relative;
        width: 100%;
        height: auto;
        background-size: contain;
        color: #702b2e;
        padding: 0 0 1.9vw 0;
    }

    #contenttab1 > li > a:hover,
    #contenttab1 > li > a:focus,
    #contenttab1 > li.active > a {
        background: url(../image/tab1.svg) no-repeat;
        background-position: top center;
        background-size: contain;
        color: white;
    }

    .tablnote {
        text-align: left;
        padding: 15px !important;
    }

    .rightfloat {
        position: fixed;
        background: url(../image/rightfloat.png);
        width: 249px;
        height: 470px;
        right: 0px;
        top: calc(50vh - 235px);
        z-index: 999;
    }

    .headline {
        font-size: 17px;
        line-height: 35px;
        letter-spacing: 1.5px;
        padding: 5px;
        background: #30b3fe;
        background-image: -moz-linear-gradient(top left, #147ad8, #30b3fe);
        background-image: -webkit-linear-gradient(top left, #147ad8, #30b3fe);
        background-image: -ms-linear-gradient(top left, #147ad8, #30b3fe);
        /*max-width: 20%;*/
        border-radius: 50em;
        max-width: 150px;
        color: #FFF;
        text-align: center;
        margin: 10px auto;
    }

    .service {
        display: none;
    }

    .selectbox {
        margin: auto;
        font-size: 18pt;
        text-align: center;

    }

    .selectbox label {
        display: inline-flex;
        /*    width:20%;*/
        text-align: right;
        padding: 1vw 0;
        text-align: center;
        justify-content: flex-start;
        align-items: center;
        color: #805052;

    }

    .selectbox .fm-select {
        display: inline-flex;
        /*    width:70%;*/
        padding: 1.1vw 0 0 0;
        text-align: center;
        justify-content: flex-end;
        align-items: center;
    }

    .fm-select select {
        border-radius: 50px;
        padding: 5px;

    }

/* ----------------------------------------------------------------
    - Footer -
-----------------------------------------------------------------*/
    
    /* Bottom */
        .bottommenu {
            z-index: 9999;
            position: fixed;
            bottom: 0;
            width: 100vw;
        }

        .menubtn {
            /* display: inline-block; */
            position: relative;
            float: left;
            width: 25%;
        }

        .list1 {
            list-style: decimal;
            /* margin-left: -25px; */
        }

    /* Footer */
        .footer {
            /*background: #00b7fd;*/
            color: #00b7fd;
            font-size: 1rem;
            text-align: center;
            padding: 1.5vw;
            /*margin-top: 1vw;*/
        }

        a:hover, a:focus{
            text-decoration: none !important;
        }