/* CSS Document */
@font-face {
    font-family: 'Kanit-SemiBold';
    src: local('Kanit-SemiBold'),
         url('https://biocytogen2024.s3.us-east-2.amazonaws.com/web/frontend/Public/webfonts/Kanit-SemiBold.ttf') format('truetype');
    font-style: normal;
}
@font-face {
    font-family: 'Kanit-Medium';
    src: local('Kanit-Medium'),
         url('https://biocytogen2024.s3.us-east-2.amazonaws.com/web/frontend/Public/webfonts/Kanit-Medium.ttf') format('truetype');
    font-style: normal;
}
@font-face {
    font-family: 'Kanit-Light';
    src: local('Kanit-Light'),
         url('https://biocytogen2024.s3.us-east-2.amazonaws.com/web/frontend/Public/webfonts/Kanit-Light.ttf') format('truetype');
    font-style: normal;
}
@font-face {
    font-family: 'Kanit-Regular';
    src: local('Kanit-Regular'),
         url('https://biocytogen2024.s3.us-east-2.amazonaws.com/web/frontend/Public/webfonts/Kanit-Regular.ttf') format('truetype');
    font-style: normal;
}
@font-face {
    font-family: 'PlusJakartaSans-Medium';
    src: local('PlusJakartaSans-Medium'),
         url('https://biocytogen2024.s3.us-east-2.amazonaws.com/web/frontend/Public/webfonts/PlusJakartaSans-Medium.ttf') format('truetype');
    font-style: normal;
}
@font-face {
    font-family: 'PlusJakartaSans-Regular';
    src: local('PlusJakartaSans-Regular'),
         url('https://biocytogen2024.s3.us-east-2.amazonaws.com/web/frontend/Public/webfonts/PlusJakartaSans-Regular.ttf') format('truetype');
    font-style: normal;
}
@font-face {
    font-family: 'PlusJakartaSans-SemiBold';
    src: local('PlusJakartaSans-SemiBold'),
         url('https://biocytogen2024.s3.us-east-2.amazonaws.com/web/frontend/Public/webfonts/PlusJakartaSans-SemiBold.ttf') format('truetype');
    font-style: normal;
}

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: 64px;}

.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 .loading-logo img{height: 40px;}
#preloader .load-spinner{margin:0 auto;width:250px;text-align:center}
.load-spinner>div{width:20px;height:20px;background-color:#00ACA1;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;}

/*启用大写字母 */
.all-caps{font-family: 'Kanit-Light', sans-serif;font-weight:300;color:#23232F;font-size: 14px;}

/*适用于正文或大段文本*/
.textBody-large{font-family: 'PlusJakartaSans-Medium', sans-serif;font-weight:500;color:#51516C;font-size: 20px;}

/*适用于正文或一般文本*/
.textBody-reg{font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;color:#51516C;font-size: 16px;}

/*适用于较小的正文或辅助文本*/
.textBody-small{font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;color:#51516C;font-size: 14px;}

/*适用于极小的正文或辅助文本*/
.textBody-tiny{font-family: 'PlusJakartaSans-Regular', sans-serif;font-weight:400;color:#51516C;font-size: 13px;}

/*通常用于链接文本*/
.textLink{font-family: 'PlusJakartaSans-SemiBold', sans-serif;font-weight:600;color:#007A72;font-size: 16px;text-decoration:underline!important;}

li,ul{list-style:none;padding:0;margin:0}

.tab-content li{list-style:inherit;}

a:active,a:hover,a:link,a:visited{text-decoration:none;outline:0;}

.btn:focus {outline:none;box-shadow:none;}

input.focus,input:focus{background-color: transparent!important;}

button, input, select, textarea {outline: none;}

.btn::-moz-focus-inner {border-color: transparent;}

a{color:#51516C;}

a:hover{color:#007A72}

a.blue,a.blue:link{color:#2096f6;text-decoration:underline}

a.green{color:#007A72;text-decoration: underline;}

p{margin-bottom: 10px;}

form code{ background:transparent;}

textarea.form-control{height:auto;}

.btn-biocytogen{background-color: #007A72;color: #fff!important;}

form.required-validate .help-block{margin-bottom: 0!important;}

[class*=" icon-"], [class^=icon-]{ margin-right:4px;}

.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;}

.zm-uppercase{text-transform: uppercase;}

.commonForm .form-group{margin: 0;}
.commonForm .input-group{background-color: rgb(255 255 255 / 80%);padding: 3px 10px;border-radius: 30px;border: 1px solid #ccc;}
.commonForm .input-group input{border: none!important;box-shadow: none!important;background-color: transparent!important;}
.commonForm .input-group button{border-radius: 50%!important;padding: 0;height: 28px;width: 28px;text-align: center;}
.commonForm .input-group button i{margin: 0;}

#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:30px;line-height:100%;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:#007a72;transition:all .3s ease 0s;-webkit-transition-duration:.3s;-webkit-transition-timing-function:ease;color:#fff}

.vrs-grid{display: grid;grid-template-columns: 25.6% 68.6%;column-gap: 65px;}

@media screen and (max-width:1199px){
    .vrs-grid{column-gap: 55px;}
}
@media screen and (max-width:991px){
    .vrs-grid{grid-template-columns: 100%;gap: 30px;}
    .vrs-grid .vrs-md-4.left-block .leftitem-box{position: static!important;width: 100%!important;height: auto!important;}
}

/* 适配 */
@media screen and (max-width:1279px){
    .h1,h1{font-size: 62px;}
    .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;}
    .all-caps{font-size: 13px;}
    .textBody-large{font-size: 18px;}
    .textBody-reg{font-size: 15px;}
    .textBody-small{font-size: 13px;}
    .textBody-tiny{font-size: 12px;}
    .textLink{font-size: 15px;}
    body{font-size: 15px;}
}
@media screen and (max-width:1023px){
    .h1,h1{font-size: 60px;}
    .h2,h2{font-size: 44px;}
    .h3,h3{font-size: 36px;}
    .h4,h4{font-size: 32px;}
    .h5,h5{font-size: 20px;}
}

/*布局*/

@media screen and (min-width:480px) and (max-width:599px){
    .container-fluid{width: 100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;}
}

@media screen and (min-width:720px) and (max-width:839px){
    .container-fluid{width: 100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;}
}

@media screen and (min-width:840px) and (max-width:1023px){
    .container-fluid{width: 100%;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;}
}

@media screen and (min-width:1024px) and (max-width:1279px){
    .container-fluid{width: 100%;max-width: 970px;min-width: 755px;margin: 0 auto;}
}

@media screen and (min-width:1280px) and (max-width:1599px){
    .container-fluid{width: 100%;max-width: 1170px;min-width: 755px;margin: 0 auto;}
}

@media screen and (min-width:1600px) and (max-width:1919px){
    .container-fluid{width: 100%;max-width: 1200px;min-width: 755px;margin: 0 auto;}
}

@media screen and (min-width:1920px){
    .container-fluid{width: 100%;max-width: 1260px;min-width: 755px;margin: 0 auto;}
}