@charset "utf-8";
html, body {
height: 100%;
}
body {
font-size: 14px;
font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'PingFang SC', 'Microsoft YaHei', 'Source Han Sans SC', 'Noto Sans CJK SC', 'WenQuanYi Micro Hei', sans-serif;
background-color: #f5f7fa;
}
button:focus {
outline: 0 !important;
}
input[type=text], textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.form-control:focus {
border-color: #ccc;
box-shadow: inset 0 1px 1px #f5f5f5, 0 0 8px #ccc;
}
.no_line, .no_line:hover{
text-decoration: none;
}
.invisible{
display: none;
}
.pt100{
padding-top: 100px;
}
.animate__animated.animate__fadeIn {
--animate-duration: 0.5s;
} header{ position: relative; z-index:99999;background-color: #f9f9f9; }
header .logo a{ display:block; font-size:0;}
header .top_bar{ border-bottom: solid 1px #efefef; height: 38px;}
header .top_bar .biaoyu{ font-size: 12px;color: #747474; line-height: 38px; }
header .top_bar .right{ position: relative; z-index: 4; }
header .top_bar .right ul li{ margin-left: 20px; }
header .top_bar .right ul li:first-child{ margin-left: 0; }
header .top_bar .right ul li a{ position: relative; display:block; padding-left:20px; font-size: 12px;color: #747474; line-height: 39px; background-position: left; background-repeat: no-repeat; background-size: 14px auto; }
header .top_bar .right ul li a .imgbox{ display: none; position: absolute; left: calc((100% - 120px) / 2); top: 100%; z-index: 1; padding: 5px; width: 130px; font-size: 0; background: #fff; border:solid 1px #f2f2f2; box-shadow: 3px 3px 5px rgba(0,0,0,0.1) }
header .top_bar .right ul li a:hover .imgbox{ display:block; }
header .top_bar .right ul li a .imgbox:before{ content: ""; position: absolute; left: 50%; bottom: 100%; z-index: 1; margin-left: -8px; width: 0; height: 0; border-left: solid 8px transparent; border-right: solid 8px transparent; border-bottom: solid 8px #f2f2f2; }
header .top_bar .right ul li a .imgbox img{ max-width: 100%; }
header .top_bar .right .tel{ font-family: Impact; font-size: 22px;color: #333; line-height: 39px; }
.topnav {
font-size: 14px;
}
.topnav h1{
font-size: 14px;
display: inline;
}
.navbar {
height: 110px;
padding-top: 50px;
transition: all 0.1s;
-webkit-transition: all 0.1s;
background-color: #0494CF;
border-color: transparent;
transition: all 0.3s;
-webkit-transition: all 0.3s;
}
#bs-example-navbar-collapse-1{
padding-right: 10px;
}
.navbar .brand-logo{
height: 30px;
transition: all 0.4s;
-webkit-transition: all 0.4s;
}
.scrolled-nav .brand-logo{
height: 24px;
transition: all 0.4s;
-webkit-transition: all 0.4s;
}
.navbar-default .navbar-brand,
.navbar-default .navbar-nav>li>a {
font-size: 16px;
color: #f4f4f4;
font-weight: 700;
}
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:hover {
color: #fff;
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
color: #fff;
background-color: transparent;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
border-color: transparent;
}
.navbar-collapse.collapse.in {
max-height: none;
}
.scrolled-nav {
background-color: rgba(16, 148, 207, 0.8);
height: 50px !important;
padding: 0px !important;
transition: all 0.3s;
-webkit-transition: all 0.3s;
border-bottom: none;
z-index: 3;
}
.scrolled-nav .topnav .navbar-header .navbar-brand,
.scrolled-nav .topnav .navbar-nav li a {
color: #fff;
transition: all 0.1s;
-webkit-transition: all 0.1s;
}
.navbar-nav>li>.dropdown-menu {
margin-top: 4px;
}
.scrolled-nav .dropdown-menu>li>a {
color: #333 !important;
}
.scrolled-nav .dropdown-menu>li>a:hover {
color: #0095CC !important;
}
.navbar-default .navbar-nav>li{
margin-right: 5px;
}
.navbar-default .navbar-nav>li.current,
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:focus {
background-color: rgba(255,255,255,0.2);
color: #fff;
border-radius: 4px;
}
.scrolled-nav .navbar-nav>li.current{
border-radius: 0;
}
.navbar-default .navbar-nav>li>a:focus {
background-color: transparent;
color: #fff;
}
.scrolled-nav .topnav .navbar-nav li a:hover,
.scrolled-nav .topnav .navbar-nav li a:focus {
background-color: rgba(255,255,255,0.2);
color: #fff;
border-radius: 0;
} .navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown-menu>li>a {
line-height: 2;
}
.navbar .dropdown-menu {
-webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
background: #fff;
border: none;
top: 50px;
left: -5px !important;
width: 200px;
border-top-left-radius: 10px !important;
border-bottom-left-radius: 10px !important;
border-top-right-radius: 10px !important;
border-bottom-right-radius: 10px !important;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
padding: 10px 0;
}
.scrolled-nav .dropdown-menu {
top: 48px !important;
}
.dropdown-menu::before {
content: '';
position: absolute;
height: 10px;
width: 10px;
border: 1px solid #ffffff;
transform: rotate(45deg);
background-color: #ffffff;
border-right: none;
border-bottom: none;
top: -5px;
left: 46px;
}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
color: #0494CF;
background-color: transparent;
} .home-swiper {
margin-top: 70px;
padding: 0;
background-color: #fff;
width: 100%;
height: auto;
background-size: cover;
background-position: center;
}
.home-swiper img{
width: 100%;
} .navbar-toggle.x .icon-bar:nth-of-type(1) {
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: 10% 10%;
-ms-transform-origin: 10% 10%;
transform-origin: 10% 10%;
}
.navbar-toggle.x .icon-bar:nth-of-type(2) {
opacity: 0;
filter: alpha(opacity=0);
}
.navbar-toggle.x .icon-bar:nth-of-type(3) {
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 10% 90%;
-ms-transform-origin: 10% 90%;
transform-origin: 10% 90%;
} .navbar-toggle.x.collapsed .icon-bar:nth-of-type(1) {
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
}
.navbar-toggle.x.collapsed .icon-bar:nth-of-type(2) {
opacity: 1;
filter: alpha(opacity=100);
}
.navbar-toggle.x.collapsed .icon-bar:nth-of-type(3) {
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
}  .about_list_met_95_2_4{
padding: 0 140px;
}
.about_list_met_95_2_4 .ab_cont {
margin: 100px 0 100px 0;
}
.about_list_met_95_2_4 .ab_cont ul {
margin: 0;
padding: 0;
overflow: hidden;
display: flex;
justify-content: space-between
}
.about_list_met_95_2_4 .ab_cont li {
list-style: none;
width: 156px;
height: 156px;
border-radius: 50%;
background-color: #dedede;
text-align: center;
padding-top: 30px;
}
.about_list_met_95_2_4 .ab_cont h3 {
font-size: 30px;
font-weight: bold;
color: #000000;
}
.about_list_met_95_2_4 .ab_cont h3 + p {
color: #999999;
}
.about_list_met_95_2_4 .ab_cont h3 span {
color: #116bc4
}
.about_list_met_95_2_4 .ab_cont li:hover {
background-color: #116bc4
}
.about_list_met_95_2_4 .ab_cont li:hover h3,.about_list_met_95_2_4 .ab_cont li:hover h3 + p,.about_list_met_95_2_4 .ab_cont li:hover h3 span {
color: #ffffff
}
.about_list_met_36_9_18.met-index-body {
padding: 70px 0;
background-color: #ffffff;
background-image: url(https://dry-eye.cn/wp-content/themes/yixin2/static/images/bg-footer.webp);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
background-attachment: fixed;
font-size: 16px;
} .product-content{
margin-top: 20px;
margin-bottom: 20px;
padding: 0;
}
.product-content a{
text-decoration: none !important;
}
.card{
padding: 20px;
background-color: #fff;
margin-bottom: 20px;
}
.card h4{
text-align: center;
text-decoration: none;
}
.card .index-icon-div{
overflow: hidden;
}
.card img{
width: 320px;
height: 360px;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: .2s ease-in-out;
transition: .2s ease-in-out;
}
.card:hover img{
width: 320px;
height: 360px;
-webkit-transform: scale(1.08);
transform: scale(1.08);
}
.card:hover h4{
color: #0494CF;
}
.card .details {
width: 70%;
height: 68%;	
padding: 5% 8%;
position: absolute;
content: "";
top: 44%;
left: 50%;
transform: translate(-50%, -50%) rotateY(90deg);
transform-origin: 50%;
background: rgba(0,0,0,0.65);	
opacity: 0;
transition: all 0.4s ease-in;
color: #fff;
}
.card .details h1{
font-size:18px;
margin-top: 30px;
margin-bottom: 40px;
}
.card:hover .details {
transform: translate(-50%, -50%) rotateY(0deg);
opacity: 1;
}
.content-desc{
font-family: Tahoma, 'Courier New', Courier, monospace;
color: #0f3141;
}
.page-left{
background-color: #fff;
padding-top: 10px;
padding-bottom: 10px;
}
.page-left dl a{
display: inline-block;
width: 100%;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 15px;
text-decoration: none;
}
.page-left dl a:hover{
color: #fff;
background-color: #49bff6;
padding-left: 15px;
}
.page-right{
background-color: #fff;
margin-bottom: 20px;
}
.page-right img{
width: 100%;
}
.page-banner{
width: 100%;
margin-bottom: 20px;
}
.block-header{
display: block;
margin-top: 20px;
margin-bottom: 20px;
padding: 10px 0 10px 15px;
width: 100%;
background-color: #37b9f4;
color: #fff;
}
.stacked{
padding-top: 10px;
padding-bottom: 10px;
}
.stacked h1{
font-size: 20px;
color: #fff;
background-color: #37b9f4;
padding: 8px 10px;
}  footer {
padding: 30px 0;
line-height: 25px;
background-color: #1f2d3d;
}
footer .spiner{
color: #007aff;
margin: 0 5px;
}
footer a{
color: #c2c2c2;
}
footer a:hover{
text-decoration: none;
color: #afafaf;
}
footer p.copyright {
color: #c2c2c2;
}
footer img {
opacity: 0.5;
transition: all 0.1s;
-webkit-transition: all 0.1s;
}
footer img.kexin {
filter: grayscale(0.5);
}
footer img:hover {
cursor: pointer;
opacity: 1;
filter: none;
}
.wrapper-404{
margin-bottom: 40px;
}
.content-404 {
margin-top: 200px;
margin-bottom: 230px;
}
.content-404 h1 {
font-family: "Abril Fatface", serif;
background-color: transparent;
color: #EDEDED;
text-align: center;
font-size: 9em;
margin: 0;
text-shadow: -1px 0 #BFC0C0, 0 1px #BFC0C0, 1px 0 #BFC0C0, 0 -1px #BFC0C0;
}
.content-404 h3 {
font-family: "Lato", sans-serif;
font-size: 2em;
text-transform: uppercase;
text-align: center;
color: #BFC0C0;
margin-top: -20px;
font-weight: 900;
}

@media (min-width: 320px) and (max-width: 480px) {
#bs-example-navbar-collapse-1{
overflow-x: hidden;
}
.navbar .brand-logo{
height: 24px;
}
.stacked{
padding-top: 10px;
padding-bottom: 10px;
}
.home-swiper {
margin-top: 50px;
overflow-x: hidden;
}
.text-product{
font-size: 12px;
padding: 0 15px;
}
.page-banner{
margin-top: 70px;
}
.about_list_met_95_2_4 .ab_cont ul {
overflow-x: hidden;
display: contents;
}
.about_list_met_95_2_4 .ab_cont ul li {
overflow-x: hidden;
margin-bottom: 20px;
}
.page-right{
margin-top: 20px;
margin-bottom: 20px;
}
.online {
right: 8px;
top: 60%;
}
.onlineIco {
width: 28px;
height: 28px;
}
.online li {
margin: 4px 0;
width: 28px;
height: 28px;
}
.onlineIco:hover {
width: 100px;
}
.onlineIco i {
width: 28px;
height: 28px;
line-height: 28px;
font-size: 10px;
text-align: center;
margin-right: 5px;
}
.onlineCon {
font-size: 14px;
}
.copyrights{
display: block;
}
.box {
margin: 20px 0;
}
#qr-code-img {
width: 86%;
margin: 7%;
}
.modal-pop.active {
margin: 10%;
} .navbar-default .navbar-nav>li>a {
color: #44a6d1;
}
.navbar-header{
border-bottom: none;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
background-color: transparent;
}
.navbar {
height: 50px;
padding: 0px;
}
.navbar-default .navbar-toggle {
border-color: transparent;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #fff;
}
.navbar-default a.navbar-brand {
color: #444;
font-size: 14px;
}
.navbar-collapse {
background-color: rgba(255, 255, 255, 0.95);
}
.scrolled-nav .topnav .navbar-nav li a {
color: #444;
padding: 10px 0 20px 20px;
}
.content-section-c {
margin-top: 50px;
}
footer {
padding: 30px 0 40px 0;
}
}