/* CSS Document */
:root {
  /* 主色调体系 */
  --primary: #336ca6;
  --primary-hover: #295b8e;
  --primary-light: #f0f5fc;
  --primary-border: #d1dceb;
  --primary-text: #204c78;

  /* 功能色体系 */
  --success: #198754;
  --success-hover: #157347;
  --warning: #ffc107;
  --warning-hover: #ffb300;
  --danger: #dc3545;
  --danger-hover: #bb2d3b;
  --info: #0dcaf0;

  /* 中性色体系 */
  --text-primary: #212529;
  --text-secondary: #6c757d;
  --text-disabled: #adb5bd;
  --bg-body: #ffffff;
  --bg-card: #f8f9fa;
  --bg-dark: #343a40;
  --border-default: #dee2e6;
  --border-focus: #78a3e8;
}

@font-face {
    font-family: 'Kanit-Medium';
    src: local('Kanit-Medium'),
         url('../Fonts/Kanit-Medium.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
    font-size-adjust: 0.5;
}
@font-face {
    font-family: 'PlusJakartaSans-Regular';
    src: local('PlusJakartaSans-Regular'),
         url('../Fonts/PlusJakartaSans-Regular.ttf') format('truetype');
    font-style: normal;
    font-display: swap;
    font-size-adjust: 0.5;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  height: 100%;
  scroll-behavior: smooth;
}

body{background:#fff;height:100%;margin:0;padding:0;font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;font-size:16px;line-height: 1.5;color: #51516C;}

.h1,h1{font-family: 'Kanit-SemiBold', sans-serif;font-weight:600;line-height: 1.3;color:#23232F;font-size: 40px;}

.h2,h2{font-family: 'Kanit-SemiBold', sans-serif;font-weight:500;line-height: 1.3;color:#23232F;font-size: 48px;}

.h3,h3{font-family: 'Kanit-SemiBold', sans-serif;font-weight:600;line-height: 1.3;color:#23232F;font-size: 40px;}

.h4,h4{font-family: 'Kanit-SemiBold', sans-serif;font-weight:600;line-height: 1.3;color:#23232F;font-size: 36px;}

.h5,h5{font-family: 'Kanit-Medium', sans-serif;font-weight:500;line-height: 1.3;color:#23232F;font-size: 24px;}

.h6,h6{font-family: 'Kanit-Medium', sans-serif;font-weight:500;line-height: 1.3;color:#23232F;font-size: 18px;}

.title-widget{font-family: 'Kanit-Medium', sans-serif;font-weight:500;color:#23232F;font-size: 16px;}

/*Loader=================================================================================*/
#preloader{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#fff;background:rgba(255,255,255,.8);z-index:10000;line-height:100%}
#preloader .preloader-center{position:absolute;bottom:50%;top:50%;left:0;right:0}
#preloader .loading-logo{text-align:center;margin:0 auto 5px}
#preloader .load-spinner{margin:0 auto;width:250px;text-align:center}
.load-spinner>div{width:20px;height:20px;background-color:var(--primary);border-radius:100%;display:inline-block;-webkit-animation:bouncedelay 1.4s infinite ease-in-out;animation:bouncedelay 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.load-spinner .bounce1{-webkit-animation-delay:-.64s;animation-delay:-.64s}
.load-spinner .bounce2{-webkit-animation-delay:-.48s;animation-delay:-.48s}
.load-spinner .bounce3{-webkit-animation-delay:-.32s;animation-delay:-.32s}
.load-spinner .bounce4{-webkit-animation-delay:-.16s;animation-delay:-.16s}
@-webkit-keyframes bouncedelay{0%,100%,80%{-webkit-transform:scale(0)}
40%{-webkit-transform:scale(1)}
}
@keyframes bouncedelay{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}
40%{transform:scale(1);-webkit-transform:scale(1)}
}
.nav-overlay{background: #000;filter: alpha(opacity=100);opacity: 0;height: 100%;width: 100%;position: fixed;top: 0;left: 0;z-index: 10000; display:none;}
ul, ol, li {list-style: none;padding: 0;margin: 0;}
.tab-content li {list-style: disc;padding-left: 20px;margin-bottom: 5px;}
a {color: #51516C;text-decoration: none;outline: 0;}
a:active, a:hover, a:link, a:visited {text-decoration: none;outline: 0;}
a:hover {color: var(--primary-hover);}
a.blue, a.blue:link, a.blue:visited {color: #2096f6;text-decoration: underline;}
a.blue:hover {color: #1880e8;}
button, input, select, textarea {outline: none;}
._btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.btn::-moz-focus-inner {border-color: transparent;}
.btn-wayonbio {background-color: var(--primary);color: var(--bg-body) !important;border-color: var(--primary);transition: background-color 0.2s ease;}
.btn-wayonbio:hover {background-color: var(--primary-hover);}
input:focus {background-color: transparent !important;}
p {margin-bottom: 10px;}
form code {background: transparent;}
textarea.form-control {height: auto;}
.form-group {margin-bottom: 15px;}
form.required-validate .help-block {display: block;margin-top: 5px;margin-bottom: 10px;color: #737373;}
.has-error .form-control {
    border-color: #a94442;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}
.has-error .checkbox, .has-error .checkbox-inline, .has-error .control-label, .has-error .help-block, .has-error .radio, .has-error .radio-inline, .has-error.checkbox label, .has-error.checkbox-inline label, .has-error.radio label, .has-error.radio-inline label {
    color: #a94442!important;
}
ul.dropdown-menu{padding: 10px 0;font-size: 14px;}
ul.dropdown-menu li{padding: 5px 10px;}
ul.dropdown-menu li:hover{background-color: #f8f8f8;}
ul.dropdown-menu li a{display: block;}
.zm-uppercase{text-transform: uppercase;}
#back-top{position:fixed;bottom:25px;right:25px;padding:0;margin:0;z-index:999999999;box-shadow:0 2px 6px rgba(0,0,0,0.2);border-radius: 5px;}
#back-top a{text-decoration:none;width:38px;height:38px;display:block;background-color:#757679;color:#FFF;font-size:25px;z-index:9999999;text-align:center;transition:all .3s ease 0s;-webkit-transition-duration:.3s;-webkit-transition-timing-function:ease;border-radius:5px;}
#back-top a:hover{background-color:var(--primary-hover);transition:all .3s ease 0s;-webkit-transition-duration:.3s;-webkit-transition-timing-function:ease;color:#fff}
hr.line{height: 5px;border: none;background-color: var(--bg-dark);}
.breadcrumb{font-size: 14px;}
.breadcrumb li.active{color: var(--primary);font-weight: 700;}

.ct-ml-5{margin-left: 5px;}

.ct-ml-10{margin-left: 10px;}

.ct-pl-10{padding-left: 10px;}

.ct-ml-15{margin-left: 15px;}

.ct-ml-20{margin-left: 20px;}

.ct-ml-30{margin-left: 30px;}

.ct-mr-5{margin-right: 5px;}

.ct-mr-10{margin-right: 10px;}

.ct-mr-15{margin-right: 15px;}

.ct-mr-20{margin-right: 20px;}

.ct-mr-30{margin-right: 30px;}

.ct-mt-5{margin-top: 5px;}

.ct-mt-10{margin-top: 10px;}

.ct-mt-15{margin-top: 15px;}

.ct-mt-20{margin-top: 20px;}

.ct-mt-24{margin-top: 24px;}

.ct-mt-30{margin-top: 30px;}

.ct-mt-32{margin-top: 32px;}

.ct-mt-48{margin-top: 48px;}

.ct-mb-5{margin-bottom: 5px;}

.ct-mb-10{margin-bottom: 10px;}

.ct-mb-15{margin-bottom: 15px;}

.ct-mb-20{margin-bottom: 20px;}

.ct-mb-24{margin-bottom: 24px;}

.ct-mb-30{margin-bottom: 30px;}

.ct-mb-32{margin-bottom: 32px;}

.ct-mb-48{margin-bottom: 48px;}

/* 搜索栏 */
.search-bar{margin: 40px 0;}
.search-bar form{width: 70%;margin: auto;}
.search-bar form .dropdown>a{font-size: 15px;height: 50px;line-height: 48px;display: inline-block;padding: 0 10px;border: 1px solid #ccc;border-right: none;border-top-left-radius: 4px;border-bottom-left-radius: 4px;}
.search-bar form .dropdown>a i{margin: 0 10px;position: relative;top: 1px;}
.search-bar form .input-group{background-color: rgb(255 255 255 / 80%);}
.search-bar form .input-group input{height: 50px;line-height: 50px;box-shadow: none;background-color: transparent;}
.search-bar form .sub-part{margin-left: 0!important;position: relative;}
.search-bar form .sub-part .removebox{font-size: 25px;position: absolute;left: -30px;top: 7px;}
.search-bar form .sub-part button{height: 50px;border-top-left-radius: 0;border-bottom-left-radius: 0;}
.search-bar form small.help-block{position: absolute;}

/* 咨询区 */
.inquiry-form .btn-submit {background-color: var(--primary);color: #fff;border: none;padding: 0.5rem 2rem;border-radius: 0.25rem;}
.inquiry-form .btn-submit:hover {background-color: var(--primary-hover);}


.panel-group .panel {margin-bottom: 20px;background-color: #fff;border: 1px solid #e8f0f8;border-radius: 4px;-webkit-box-shadow: 0 1px 1px rgb(0 0 0 / 5%);box-shadow: 0 1px 1px rgb(0 0 0 / 5%);font-size: 15px;}
.panel-group .panel-heading{background: #e8f0f8;padding: 8px 15px;}
.panel-group .panel-heading h5{font-size: 20px;margin: 0;}
.panel-group .steps-item{padding: 15px 0;}
.panel-group .steps-item .first-level-category{padding: 5px 15px;}

.titleTop {text-transform: lowercase;font-size: 14px;}
.titleTop p a:nth-child(1){text-transform: capitalize;}
.titleTop p a{color: #2096f6;}

@media screen and (max-width:1199px){
    .h1,h1{font-size: 38px;}
    .h2,h2{font-size: 46px;}
    .h3,h3{font-size: 38px;}
    .h4,h4{font-size: 34px;}
    .h5,h5{font-size: 22px;}
    .h6,h6{font-size: 16px;}
    body{font-size: 15px;}
}
@media screen and (max-width:991px){
    .h1,h1{font-size: 36px;}
    .h2,h2{font-size: 44px;}
    .h3,h3{font-size: 36px;}
    .h4,h4{font-size: 32px;}
    .h5,h5{font-size: 20px;}
    body{font-size: 14px;}
}
@media screen and (max-width:767px){
    .h1,h1{font-size: 34px;}
    .h2,h2{font-size: 42px;}
    .h3,h3{font-size: 34px;}
    .h4,h4{font-size: 30px;}
    .h5,h5{font-size: 18px;}
    .search-bar form{width: 100%;}
}