* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}


ul,
li {
    list-style: none;
}

:root {
    --blue: #1683ce;
    --title-gray-bg: #959595;
}

html, body {
    scroll-behavior: smooth;
    font-family: \5fae\8f6f\96c5\9ed1;
    font-size: 1em;
}

h1, h2, h3, h4, strong {
    font-weight: normal;
}

button, input, select {
    background-color: transparent;
    border: none;
    cursor: pointer;
    color: inherit;
}
button:focus,
input:focus,
select:focus {
    outline: none;
}
div[class*="selector"] {
    cursor: pointer;
}

a {
    color: inherit;
    text-decoration: none;
}
a:hover {
    color: var(--blue);
}

.container {
    width: 1260px;
    margin-left: auto;
    margin-right: auto;
}

.container_100 {
    width: 100%;
}

img {
    border: 1px solid #efefef;
    transition: all .2s ease;
}

.bg-grey {
    background-color: #e5e5e5;
}

.box {
    background-color: white;
    border-radius: 6px;
    box-shadow: 3px 0 5px rgba(229,229,229,.5);
}

.site-header {
    display: flex;
    align-items: center;
    color: #424242;
    background-color: white;
    padding: 5px 30px;
}
.site-header img {
    border: 0;
}
.site-header .logo:first-child {
    margin-right: 25px;
}
.site-header .nav {
    flex-grow: 2;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.site-header .nav > ul {
    margin-right: 20px;
    display: flex;
    align-items: center;
    font-size: 18px;
    line-height: 1;
}
.site-header .nav > ul > li {
    padding: 0 10px;
}
.site-header .nav > ul > li:not(:first-child) {
    border-left: 1px solid #818181;
}
.site-header .nav .btn {
    line-height: 30px;
    height: 30px;
    border: 1px solid #d9dcde;
    font-size: 14px;
}
.site-header .nav .btn > a {
    padding: 0 15px;
    display: inline-block;
}
.site-header .nav .btn > a:hover {
    color: unset;
}
.site-header .nav .btn-register {
    border-radius: 15px 0 0 15px;
    border-width: 1px 0 1px 1px;
    color: #666;
    background-color: #f5f7fa;
}
.site-header .nav .btn-login {
    border-radius: 0 15px 15px 0;
    border-width: 1px 1px 1px 0;
    background-color: var(--blue);
    color: white;
}
.site-header .user-nav {
    font-size: 14px;
    position: relative;
    color: #666;
    line-height: 30px;
    cursor: pointer;
}
.site-header .user-nav .user {
    background-image:  url(../../images/en/icon_user.png),  url(../../images/icon_nav_arrow.png);
    background-position: 0 center, right center;
    background-repeat: no-repeat;
    padding: 0 23px 0 20px;
}
.site-header .user-nav:hover .user {
    background-image:  url(../../images/en/icon_user.png),  url(../../images/icon_nav_arrow_2.png);
}
.site-header .user-nav:hover > ul {
    display: block;
}
.site-header .user-nav > ul {
    border-radius: 6px;
    border: 1px solid #d2d2d2;
    background-color: white;
    position: absolute;
    top: 30px;
    left: 0;
    width: 114px;
    text-align: center;
    display: none;
}
.site-header .user-nav li {
    background:  url(../../images/icon_userinfo.png) 15px center no-repeat;
    padding-left: 22px;
}
.site-header .user-nav li:nth-child(2) {
    background-image:  url(../../images/icon_manage.png);
}
.site-header .user-nav li:nth-child(3) {
    background-image:  url(../../images/icon_lock.png);
}
.site-header .user-nav li:nth-child(4) {
    background-image:  url(../../images/icon_logout.png);
}

.slogan {
    background: #05050f  url(../../images/slogan.jpg) center no-repeat;
    height: 295px;
    box-shadow: 0 10px 10px rgba(229,229,229,.5);
    border-top: 1px solid #D9DCDE;
    border-bottom: 1px solid #D9DCDE;
}
.slogan_vsso {
    background: #05050f  url(../../images/slogan_vsso.jpg) center no-repeat;
    height: 254px;
    box-shadow: 0 10px 10px rgba(229,229,229,.5);
    border-top: 1px solid #D9DCDE;
    border-bottom: 1px solid #D9DCDE;
}

.site-footer {
    text-align: center;
    background-color: #424242;
    color: #fff;
    font-size: 16px;
    line-height: 2;
    padding: 30px 0 50px;
}
.site-footer ul {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 0;
}
.site-footer li {
    padding: 0 10px;
    line-height: 1;
}
.site-footer li:not(:last-child) {
    border-right: 1px solid ;
}


.floatbar {
    position: fixed;
    transform: translateY(-50%);
    right: 0;
    top: 50%;
    font-size: 14px;
    color: #111;
    padding: 10px;
    transition: .2s width ease;
    height: 226px;
    cursor: pointer;
    background:  url(../../images/floatbar_close.png) center no-repeat;
    width: 20px;
    line-height: 1;
}
.floatbar.open {
    background:  url(../../images/floatbar_open.png) center no-repeat;
    width: 92px;
    padding: 25px 13px 22px 24px;
}
.floatbar.open:hover {
    background-image:  url(../../images/floatbar_hover.png);
}
.floatbar ul {
    width: 0;
    overflow: hidden;
    transition: .2s width ease;
}
.floatbar li {
    display: none;
}
.floatbar.open ul {
    width: 56px;
}
.floatbar.open li {
    display: block;
}

.floatbar a {
    display: block;
    padding: 40px 0 8px;
    background-repeat: no-repeat;
    background-position: center 8px;
    border-bottom: 1px solid #fafafa;
    white-space: nowrap;
    text-align: center;
}
.floatbar .feedback a{
    background-image:  url(../../images/contactus.png);
}

.floatbar .contactus a{
    background-image:  url(../../images/chat.png);
}

.floatbar .gotop a{
    background-image:  url(../../images/top.png);
    border: 0;
}

.pagination {
    padding: 0 70px;
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    line-height: 30px;
    color: #666;
}
.pagination input {
    width: 30px;
    height: 30px;
    margin: 0 2px;
}
.pagination button {
    padding: 0 5px;
}
.pagination select,
.pagination input,
.pagination a,
.pagination span,
.pagination button {
    border: 1px solid #CCC;
    background-color: #F7F7F7;
    line-height: 30px;
    text-align: center;
}
.pagination a,
.pagination span {
    padding: 0 8px;
    border-collapse:collapse;
    min-width: 36px;
}
.pagination a.none {
    pointer-events: none;
}
.pagination span,
.pagination a.act,
.pagination a:hover{
    border-color: var(--blue);
    color: var(--blue);
    background-color: white;
}
.pagination a.act {
    pointer-events: none;
}
.pagination a.none {
    pointer-events: none;
    color: #AAA;
}
.pagination .page {
    display: flex;
    justify-content: center;
    align-items: center;
}
.pagination .page .page_list {
    display: flex;
    max-width: 84px;
    overflow: hidden;
}
.pagination .page ul {
    width: 999999px;
    height: 32px;
    display: flex;
    margin-left: 0;
    margin-bottom: 0;
    padding: 0;
}
.pagination select {
    border: 1px solid #CCC;
    height: 30px;
    padding: 0 8px;
    appearance: none;
}



.search {
    width: 800px;
    margin: 0 auto;
    font-size: 16px;
}
.search-tabs {
    display: flex;
    color: white;
    padding: 0 20px;
}
.search-tabs span {
    width: 100px;
    line-height: 32px;
    text-align: center;
    border-radius: 16px;
    color: #464646;
    background-color: rgba(255,255,255,.7);
    margin: 0 8px 5px 0;
    cursor: pointer;
    display: block;
}
.search-tabs .selected {
    background: white;
    color: var(--blue);
}
.search-input-wrap {
    background-color: white;
    height: 52px;
    background-color: white;
    border-radius: 36px;
    line-height: 52px;
    display: flex;
    align-items: center;
}
.search-input-wrap input {
    width: 680px;
    padding-left: 30px;
    font-size: 16px;
}
.search-input-wrap button {
    width: 100px;
    text-align: center;
}
.search-input-wrap button img {
     border: 0;
}

[class*="-main"] {
    min-height: calc(100vh - 573px);
    margin-bottom: 50px;
}

.alert_shadow { width: 100%; height: 100vh; background: rgba(0, 0, 0, .7); position: fixed; top:0; left:0; z-index: 999; }
.alert { width: 600px; background: #FFF; border-radius: 6px; position: fixed; top: 40%; left: 50%; margin-left: -300px; font-size: 18px; z-index: 1000; }
.alert .title { width:100%; height: 50px; line-height: 50px; border-bottom: 2px solid; position: relative; box-sizing: content-box; }
.alert .title .title_text { padding: 0 2em 0 4em;  }
.alert .title .title_close { position: absolute; top: -20px; right: -20px; width: 50px; height: 50px; border-radius: 50%; border: 2px solid #FFF; text-align: center; font-size: 36px; background: #888; color: #FFF; font-weight: 700px; line-height: 40px; cursor: pointer; }
.alert .cont { padding: 2em; }
.alert .bottom { padding: 1em 2em; text-align: center; }
.alert .bottom button { width: 120px; height: 40px; line-height: 40px; color: #FFF; background-color: var(--blue); border: 0 solid var(--blue); font-size: 16px; border-radius: 4px; }
.alert_yellow .title { border-bottom-color: #FF8E14; }
.alert_yellow .title .title_text { background: url("./../images/alert/alert_yellow_icon_a.png") 2em center no-repeat; }
.alert_red .title { border-bottom-color: #FF2B00; }
.alert_red .title .title_text { background: url("./../images/alert/alert_red_icon_a.png") 2em center no-repeat; }
.alert_green .title { border-bottom-color: #68BB8D; }
.alert_green .title .title_text { background: url("./../images/alert/alert_green_icon_a.png") 2em center no-repeat; }

.feedback_shadow { width: 100%; height: 100vh; background: rgba(0, 0, 0, .7); position: fixed; top:0; left:0; }
.feedback_box { width: 800px; position: fixed; top: 45%; left: 50%; margin-left: -400px; background-color: #FFF; border-radius: 6px; margin-top: -260px; }
.feedback_box .feed_title { height: 40px; line-height: 40px; position: relative; padding: 0 1.4em; font-size: 1.2em; font-weight: 700; }
.feedback_box .feed_title .feed_btn_close { position: absolute; top: 0; right: 0; background-color: #666; color: #FFF; padding: 0 2em; cursor: pointer; border-radius: 0 5px 0 6px; font-size: .9em; }
.feedback_box .feed_cont { padding: 1em 3em; line-height: 2em; }
.feedback_box .feed_cont table {  }
.feedback_box .feed_cont table th { padding: .6em .1em .6em 2em; font-weight: 500; }
.feedback_box .feed_cont table th span { font-weight: 700; color: #F00; padding-right: .5em; }
.feedback_box .feed_cont table td { padding: .6em .1em; }
.feedback_box .feed_cont table .top { vertical-align: top; }
.feedback_box .feed_cont table .right { text-align: right; }
.feedback_box .feed_cont input { border: 1px solid #DDD; width: 300px; height: 30px; padding: 0 .5em; font-size: .9em; }
.feedback_box .feed_cont input.leng { width: 500px; }
.feedback_box .feed_cont textarea { border: 1px solid #DDD; width: 500px; height: 200px; padding: .5em; font-size: 1.1em; }
.feedback_box .feed_footer { text-align: center; margin: 0 1em 2em; }
.feedback_box .feed_footer button { width: 100px; background-color: var(--blue); font-size: 1.1em; padding: .5em 1em; color: #FFF; text-align: center; border-radius: 4px; }

.request_shadow { width: 100%; height: 100vh; background: rgba(0, 0, 0, .7); position: fixed; top:0; left:0; }
.request_box { width: 900px; position: fixed; top: 45%; left: 50%; margin-left: -450px; background-color: #FFF; border-radius: 6px; margin-top: -260px; }
.request_box .req_title { height: 40px; line-height: 40px; position: relative; padding: 0 1.4em; font-size: 1.2em; font-weight: 700; }
.request_box .req_title .req_btn_close { position: absolute; top: 0; right: 0; background-color: #666; color: #FFF; padding: 0 2em; cursor: pointer; border-radius: 0 5px 0 6px; font-size: .9em; }
.request_box .req_cont { padding: 1em 3em; line-height: 2em; height: 350px; overflow-y: auto; }
.request_box .req_cont table {  }
.request_box .req_cont table th { padding: .6em .1em .6em 2em; font-weight: 500; }
.request_box .req_cont table th span { font-weight: 700; color: #F00; padding-right: .5em; }
.request_box .req_cont table td { padding: .6em .1em; }
.request_box .req_cont table .top { vertical-align: top; }
.request_box .req_cont table .right { text-align: right; }
.request_box .req_cont input { border: 1px solid #DDD; width: 200px; height: 30px; padding: 0 .5em; font-size: .9em; }
.request_box .req_cont select { border: 1px solid #DDD; width: 200px; height: 30px; padding: 0 .5em; font-size: .9em; }
.request_box .req_cont input.leng { width: 500px; }
.request_box .req_cont hr { border: 1px solid #EEE; margin: 2em 0; }
.request_box .req_cont dl { margin: 1em 2em; line-height: 1.4em; }
.request_box .req_cont dt { font-weight: 700; color: #333; }
.request_box .req_cont dd { margin: .3em 1em; color: #555; }
.request_box .req_cont dd span { margin-right: 1em; }
.request_box .req_footer { margin: 1em 1em 2em; }
.request_box .req_footer .cluause_box { padding: .4em 2em; color: var(--blue); font-weight: 700; }
.request_box .req_footer .cluause_box input { width: 12px; height: 12px; margin-right: .6em; }
.request_box .req_footer .footer_option { text-align: center; }
.request_box .req_footer button { width: 100px; background-color: var(--blue); font-size: 1.1em; padding: .5em 1em; color: #FFF; text-align: center; border-radius: 4px; }
