* { margin: 0; padding: 0; font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; } a:hover, a:active, a:link, a:visited { text-decoration: none; } li { list-style: none; } /* .padT80{padding-top: 80px;} */ .padB80 { padding-bottom: 80px; } .padT50 { padding-top: 80px; } .padB50 { padding-bottom: 80px; } .padB120 { padding-bottom: 120px; } .navbar-default { background-color: #fff; margin-bottom: 0; border: none; border-radius: 0; z-index: 99; transition: all .3s; color: #333333; } .navbar-default1 { background-color: transparent; margin-bottom: 0; border: none; border-radius: 0; z-index: 99; transition: all .3s; position: fixed; top: 0; left: 50%; transform: translateX(-50%); color: #fff; width: 100%; } .navbar-default1 .navbar-nav>.active>a, .navbar-default1 .navbar-nav>.active>a:hover { color: #fff !important; font-weight: 700; background-color: transparent; transition: all .5s; border-bottom: 2px solid #fff !important; } .title h2 { position: relative; padding: 20px 0; text-align: center; color: #333; } .title2 h2 { position: relative; padding: 0px 0 20px; text-align: center; color: #333; font-weight: 600; } .title h2:after { width: 50px; height: 2px; display: block; content: ""; margin-top: 20px; position: absolute; left: 50%; transform: translateX(-50%); } .navbar-toggle { margin-top: 20px; transition: all .3s; } .scorllNavtol { margin-top: 13px; transition: all .3s; } .greyBg { background-color: #fff; } /**/ .nav li { width: 100px; text-align: center; font-size: 16px; } .nav li a { padding-top: 10px; padding-bottom: 10px; color: #333 !important; } .navbar-default1 .nav li a { padding-top: 10px; padding-bottom: 10px; color: #fff !important; } .logo h1 { margin: 20px; transition: all .3s; } .logo h1 img { z-index: 9999; height: 40px; } .logo h1 span { color: #FFFFFF; } .nav { position: relative; margin-top: 20px; margin-bottom: 20px; transition: all .3s; } .navBg { position: absolute !important; left: 0; height: 40px; color: #6398d8; transition: all .5s; } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover { color: #333; font-weight: 700; background-color: transparent; transition: all .5s; border-bottom: 2px solid #333 !important; } .scrollNav { margin-top: 10px !important; margin-bottom: 10px !important; transition: all .3s; } .scrollLogo h1 { margin: 15px !important; font-size: 28px; transition: all .3s; } .scrollNavbar { background-color: #fff; position: fixed; top: 0; width: 100%; transition: all .3s; } .scrollNavbar1 { background-color: #fff !important; position: fixed; top: 0; width: 100%; transition: all .3s; color: #333 !important; z-index: 222; } .scrollNavbar1 .nav li a, .scrollNavbar1 .navbar-collapse .container .nav .active { color: #333 !important; } .scrollNavbar1 .navbar-nav>.active>a, .scrollNavbar1 .navbar-nav>.active>a:hover { color: #333 !important; border-bottom: 2px solid #333 !important; } .scorllNavtol ul li a /*banner*/ .carousel-control.left, .carousel-control.right { background-image: none; } .carousel-inner .item img { min-height: 200px; } .inabout { padding: 50px 0; } .inabout .left { float: left; padding: 30px 0; } .inabout .left .tit { font-size: 30px; color: #333; margin-bottom: 10px; } .inabout .left .xian { height: 1px; width: 60px; background: #287ab6; margin-bottom: 10px; } .inabout .left .nr { font-size: 16px; color: #555; line-height: 35px; margin-bottom: 20px; max-height: 175px; overflow: hidden; } .inabout .left .more { display: block; width: 160px; height: 35px; line-height: 35px; border: 1px solid #7ebae6; text-align: center; font-size: 14px; color: #287ab6; } .inabout .left .more:hover { background: #287ab6; color: #fff; } .inabout .right { float: left; } .inabout .right img { width: 100%; height: auto; } /*honor*/ .honty:hover { box-shadow: 0px 30px 50px 0px rgba(0, 0, 0, 0.15); transition: all .5s ease-in-out; } .honty { background: #FDFEFF; z-index: 999; margin-top: -62px; box-shadow: 0px 6px 50px -4px rgba(0, 0, 0, 0.1); border-radius: 8px 8px 8px 8px; transition: all .5s; cursor: pointer; color: #333; } @media (min-width:992px) { .honty { padding: 96px 0 104px 0; } } @media (min-width:767px) and (max-width: 992px) { .honty { padding: 66px 0 86px 0; } .tycon { margin-top: 24px; } } @media (max-width:767px) { .honty { padding: 76px 0 86px 0; margin-top: 30px; } .tycon { margin-top: 24px; } } /* .honty>div{padding:25px 0 0;} */ .ty { margin: auto; width: 60px; height: 60px; text-align: center; border-radius: 50%; } .ty span { color: #FFFFFF; font-size: 32px; line-height: 50px; } .tycon { text-align: center; margin-top: 24px; font-size: 22px; color: #333; line-height: 30px; } .tycon h3 { font-size: 40px; color: #333; margin-top: 0; font-weight: 600; } .honty .tycon p { color: #000; } .tycon1{ display: flex; align-items:center; justify-content: center; } .tycon1 div{ flex: 1; } .tycon1 img { display: none; width: 40px; } .honty:hover .tycon h3 { color: #00ACBA; margin-top: 0; } .honty:hover .tycon p { color: #666666; } .honty:hover .tycon1 img { display: block; } .container1{ position: absolute; top: 0; left: 50%; transform: translateX(-50%); } .index { position: relative; width: 100%; min-height: 764px; background: linear-gradient(166deg, #6DCFFF 0%, #5BC7FF 100%); color: #FFFFFF; overflow: hidden; } .indexBox{ width: 62%; min-height: 764px; /* height: 100%; */ float: right; background-image: url(../images/Slice50.png); background-repeat: no-repeat; } @media (min-width:992px) { .indexHear { margin-top: 154px; font-size: 24px; } .indexHearTitle { font-size: 48px; margin-top: 84px; } .toothEHearTitle { font-size: 48px; margin-bottom: 15px; } .toothEHear { font-size: 24px; } .toothEHeartext { margin-top: 50px; } .indexbox33 { margin-top: 70px; } video { margin: 80px 0; height: 563px; object-fit: cover; } .toothEHearTitle1 { margin-top: 120px; } .row1{ margin-bottom: 40px; } .row2{ margin-bottom: 0px; } .tycon1 img { width: 40px; height: 28px; margin-left: 10px; } } @media (min-width:769px) and (max-width: 992px) { .index { min-height: 640px; } .indexBox{ min-height: 640px; } .indexHear { margin-top: 104px; font-size: 22px; } .indexHearTitle { font-size: 36px; margin-top: 64px; } .indexHear img { margin-top: 70px; } .toothEHearTitle { font-size: 36px; } .toothEHear { font-size: 22px; } .clinic { min-height: 360px !important; } video { margin: 50px 0; height: 400px; object-fit: cover; } .tycon h3 { font-size: 36px!important; } .tycon1 img { width: 30px; height: 20px; margin-left: 4px; } } @media (max-width:767px) { .index { min-height: 650px; } .indexBox{ min-height: 650px; } .container1{ width: 80%; margin: auto; } .indexHear { margin-top: 104px; font-size: 20px; } .indexHearTitle { font-size: 26px; margin-top: 64px; } .indexHear img { margin-top: 40px; width: 100%; } .indexHearImg { max-width: 540px; margin: auto; } .indexHearImg2 img{ max-width: 588px; margin: auto; } .toothEHearTitle { font-size: 26px; } .toothEHear { font-size: 20px; } .toothEHeartext { margin-bottom: 50px; } .indexHearImg1 { margin-top: 30px; margin-bottom: 30px; } video { margin:30px 0; height: 263px; object-fit: cover; } .play { width: 60px !important; height: 60px !important; } .toothEHear { font-size: 20px !important; } .toothEItemImg { padding-top: 30px !important; } .toothEItemText { padding: 38px 0 22px 0!important; } .indexbox2 img { width: 80px!important; height: 80px!important; } .tycon1 img { width: 40px; height: 28px; margin-left: 10px; /* margin-top: 35px; */ } } .indexHear { height: 100%; font-size: 24px; font-weight: 400; } .indexHear img { width: 100%; } .indexHearTitle { /* font-size: 48px; */ font-weight: 600; margin-top: 84px; margin-bottom: 30px; } .homepageBox { background: #FFFFFF; box-shadow: 0px 7px 20px -11px rgba(0, 0, 0, 0.15); border-radius: 8px 8px 8px 8px; opacity: 1; margin: auto; width: 100%; } .homepageBox img { /* margin: 50px 152px 47px 87px; */ width: 100%; padding: 40px 64px; } .homepageBoxItem { height: 150px; background-color: #fff; font-size: 16px; font-weight: 400; color: #666666; line-height: 45px; padding-left: 32px; } .homepageBoxItemTit { font-size: 24px; font-weight: 600; color: #333333; line-height: 32px; padding: 20px 0 8px 0; } .line { width: 64px; height: 2px; background: #00ACBA; opacity: 1; } /* 底部 */ .foot { width: 100%; min-height: 70px; height: 100%; padding: 25px 0; background-color: #212121; font-size: 12px; font-weight: 400; color: #B0B0B0; text-align: center; line-height: 20px; } .foot a{ margin-left: 8px; } .foot a img{ width: 20px; height: 20px; } #name, #email, #text { width: calc(50% - 4px); margin: 0; margin-bottom: 20px; height: 30px; line-height: 30px; padding-left: 10px; border: 1px solid #CCC; } #text { width: 100%; } .newdetcon { text-align: center; } .newdetcon img { padding: 30px 0; } .newdetitle { color: #666; text-align: center; } .newdetime { padding-top: 10px; } .newdetime span { padding: 0 10px; color: #888; } .newdetcon p { line-height: 1.8; font-size: 16px; color: #777; text-align: left; } .pager li a { color: #888; } .pager li:hover a { background-color: #6398d8; color: #FFFFFF; border-color: #6398d8; } /*responsive*/ @media (min-width:769px) and (max-width: 992px) { .abIntr h3 { margin-top: 40px; } } @media only screen and (max-width: 768px) { .newRec { margin-top: 20px; margin-bottom: 30px; } .nav li { width: 100%; } .abIntr h3 { margin-top: 10px; } .nav { border: none; box-shadow: none; } .navbar-collapse { border-color: #888 !important; } } .homepageBox { background-color: #F5F7FA; } /* 客户 */ .clientHred { min-height: 540px; } .clinic2 { background-image: url(../images/clinic1.png); } .clinic { width: 100%; min-height: 480px; background-image: url(../images/clinic1.png); } .clinicItem { height: 228px; width: 100%; background-color: #F4F7FA; text-align: center; font-size: 16px; line-height: 24px; margin: auto; border-radius: 8px 8px 8px 8px; margin-bottom: 32px; } .clinicItem img { width: 80px; height: 80px; margin-top: 34px; } .preventItemTitle { line-height: 26px; font-size: 18px; font-weight: 600; } .title { font-weight: 600; } .title h2 { font-weight: 600; } .clinicBox1 { position: relative; } .clinicBox1 img { width: 100%; } .clinicBox1 video { width: 100%; } .play { width: 96px; height: 96px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } /* 牙e通 */ /* @media (min-width:992px) { .toothEHearTitle { margin-top: 48px; margin-bottom: 20px; } } @media (min-width:767px) and (max-width: 992px){ toothEHearTitle { font-style: 36px; } } @media (max-width:767px) { .toothEHearTitle { font-style: 28px; } .toothEItemText { font-style: 28px; padding: 80px 0 42px 0; } .toothTitle { font-size: 26px; } } */ .toothE1 { /* min-height: 540px; */ height: 100%; } .toothEHear { margin-top: 80px; font-size: 24px; font-weight: 400; color: #333333; } .toothEHear1 { margin: 40px 0 60px; } .container .toothEHear2{ color: #fff; } .toothEHear2 .toothEHearTitle2{ color: #fff; } .toothEHear img { width: 100%; vertical-align: middle; } .toothE1 { background-image: url(../images/Slice48.png); background-repeat: no-repeat; background-position: left; background-origin: left; } .toothEHearTitle { /* font-size: 48px; */ font-weight: 600; color: #333333; /* line-height: 64px; */ /* margin-top: 54px; margin-bottom: 20px; */ } .toothEHeartext { vertical-align: middle; /* margin: auto; */ } .toothEItemText { /* height: 80px; */ width: 100%; font-size: 24px; font-weight: 400; color: #333333; /* margin: auto; */ padding: 188px 0 92px 0; } .toothEItemText1 { text-align: end; width: 80%; } .toothTitle { font-size: 38px; font-weight: 600; color: #333333; line-height: 46px; margin-bottom: 15px; } .toothEItemImg { padding-top: 86px; height: 320px; } .toothEItemImg img { width: 100%; } .toothEItemImg1 { max-height: 320px; max-width: 480px; margin: auto } .toothEItemImg2 { max-height: 320px; max-width: 544px; } /* 聚医 */ .jyPainPoints { width: 100%; height: 100%; background: #FFFFFF; box-shadow: 0px 6px 26px -4px rgba(0, 62, 67, 0.1); border-radius: 8px 8px 8px 8px; position: relative; font-size: 16px; font-weight: 400; color: #333333; line-height: 24px; padding: 32px 0 32px 32px; /* text-align: start; */ text-align: right; /* position:static; */ margin-top: 20px; /* background-origin:right; */ } .jyPainPointsBg { position: absolute; top: 0; right: 0; } .jyPainPoints1 { background: url(../images/indexBg11.png) no-repeat; background-origin: right; background-position: right; } .jyPainPoints2 { background: url(../images/indexBg12.png) no-repeat; background-origin: right; background-position: right; } .jyPainPoints3 { background: url(../images/indexBg13.png) no-repeat; background-origin: right; background-position: right; } .jyPainPoints img { width: 100%; } .jyPainPointsTitle { font-size: 24px; font-weight: 600; line-height: 32px; } .line1 { width: 32px; height: 2px; background: #00ACBA; margin: 6px 0 8px 0; } .jyPainPointsText { z-index: 999; width: 100%; text-align: start; } @media (min-width:767px) and (max-width: 992px) { .jyPainPoints { height: 300px; } } .indexbox2 { font-size: 24px; font-weight: 400; color: #000000; line-height: 32px; text-align: center; display: flex; justify-content: space-around; align-items: center; /* padding-top:100px; */ /* padding-bottom: 20px; */ } @media (min-width:992px) { .jyBox { padding: 100px 0; } } @media (min-width:767px) and (max-width: 992px) { .jyBox { padding: 60px 0; } } @media (max-width:767px) { .jyBox { padding: 60px 0; } .jyBox1 { padding-bottom: 60px; } } .indexbox2 img { width: 100px; height: 100px; margin-bottom: 18px; } img { width: 100%; } .img img { width: 100%; } .indexbox33 { font-size: 16px; font-weight: 400; color: #333333; /* margin:auto ; */ /* margin-top: 60px; */ vertical-align: middle; } .indexboxTitle { font-size: 30px; font-weight: 600; line-height: 38px; } .indexBoxText { width: 80%; margin: 24px 0 14px 0; } .indexbox33 span { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background-color: #333; margin: 3px 9px; } .indexbox3 { margin-top: 100px; }