*{margin:0; padding:0; list-style:none; }
html{
font-size: 15px;
}
body {
color: #000;
font-family: "PingFang SC", "Microsoft Yahei", Verdana, Tahoma, "DejaVu Sans", sans-serif;
transition: all .5s;
}
body::-webkit-scrollbar { width: 0 !important }
img{ border:0; display: block;}
a{ text-decoration:none; color:#fff;}
a:hover{ text-decoration:none; color: #006646;}
/* index_common class */
.ic_p-15{
padding-left: 0;
padding-right: 0;
}
.ic_bt{
font-size: 3.2rem;
font-weight: bold;
}
.ic_subbt{
font-size: 2.4rem;
font-weight: 1000;
margin-top: 1rem;
}
.ic_subbt span{
color: #006646;
}
.ic_section_margin{
padding: 7rem 0;
}
.ic_des{
padding: 2rem 0;
line-height: 2.5rem;
}
.header_zhanwei{
height: 100px;
}
.readMore{
position: relative;
transition: all .5s;
}
.readMore::after{
content: "";
position: absolute;
top: 35%;
right: -20px;
width: 7px;
height: 7px;
border-top: 1px solid #000;
border-right: 1px solid #000;
transform: rotate(45deg);
}
.readMore:hover::after{
right: -30px;
}
header{
position: fixed;
width: 100%;
z-index: 11;
padding: 1rem 0;
transition: all .5s;
}
header.bg{
background-color: #000000c4;
box-shadow: 0 0 7px #333;
}
header .header_container{
width: 1700px;
margin: 0 auto;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.header_container .logo_box{
float: left;
width: auto;
height: auto;
position: relative;
}
.header_container .logo_box .pp_logo_box{
width: auto;
min-width: 600px;
height: auto;
position: absolute;
left: 320px;
top: 18px;
}
.header_container .logo_box .pp_logo_box ul li{
float: left;
width: auto;
height: auto;
margin-bottom: 10px;
}
.header_container .logo_box .pp_logo_box ul li a{
display: block;
width: auto;
height: auto;
font-size: 11px;
color: #fff;
line-height: 12px;
text-transform: uppercase;
}
.header_container .logo_box .pp_logo_box ul li a:hover{
text-decoration: underline;
}
.header_container .logo_box .pp_logo_box ul li a sup{
font-size: 6px;
}
.header_container .logo_box .pp_logo_box ul li span{
display: block;
width: auto;
height: auto;
font-size: 11px;
color: #fff;
line-height: 12px;
margin: 0 5px;
}
.header_container .header_contact{
width: 260px;
height: auto;
position: absolute;
left: 1060px;
top: 42px;
font-size: 20px;
color: #fff;
line-height: 30px;
font-weight: 600;
}
header .sreach_box{
position: relative;
}
header .sreach_box input{
background-color: transparent;
border: 2px solid #ccc;
height: 40px;
border-radius: 20px;
padding: 0 20px;
min-width: 300px;
color: #fff;
outline:none;
}
header .sreach_box button{
position: absolute;
height: 34px;
width: 60px;
border-radius: 20px;
border: none;
background-color: #006646;
right: 3px;
top: 3px;
}
header .sreach_box button i{
color: #fff;
}
/* banner */
.slideBox{ width:100%; height: 100vh; overflow:hidden; position:relative; }
.slideBox .hd{position:absolute; left: 50%; transform: translate(-50%,0); bottom:85px; z-index:1; }
.slideBox .hd ul{ overflow:hidden; zoom:1; float:left; }
.slideBox .hd ul li{ float:left; margin:0 6px; width:15px; height:15px; border-radius: 50%; line-height:14px; text-align:center; cursor:pointer; border: 3px solid #fff;}
.slideBox .hd ul li.on{color:#fff; border-color: #006646;}
.slideBox .bd{ position:relative; height:100%; z-index:0;}
.slideBox .bd li{ zoom:1; vertical-align:middle; }
.slideBox .bd img{display:block;}
.slideBox .logo_text{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.index_pro{
background: #272727 url("../images/index_pro_bg.jpg")/*tpa=https://www.yunhesj.cn/themes/default_tmp/public/static/images/index_pro_bg.jpg*/ no-repeat 100% 100%;
color: #fff;
text-align: center;
}
.index_pro a{
color: #fff;
}
.index_pro .index_pro_type>div>div{
border: 2px solid #fff;
border-radius: 10px;
}
.index_pro .index_pro_type>div>div hr{
border-color: #fff;
border-width: 2px;
}
.index_pro .index_pro_type>div>div .ul .li{
width: 50%;
line-height: 2;
padding: 0 10px;
}
.index_pro .readMore::after{
border-color: #fff;
}
.news_recommend{
border: 1px solid #dbdbdb;
margin: 4rem 0 0;
color: #000;
line-height: 2;
}
.news_recommend .data_md{
font-size: 1.6rem;
color: #006646;
font-weight: bold;
margin-bottom: 0;
}
.news_recommend .data_md span{
color: #c1c1c1;
}
.news_recommend .data_y{
color: #bfbfbf;
margin-left: 1.5rem;
}
.news_recommend h4{
line-height: 2;
font-weight: bold;
}
.news_recommend p{
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.news_recommend a{
color: #000;
}
.news_list>div>a{
display: block;
border-bottom: 1px dashed #dbdbdb;
line-height: 4rem;
margin-top: 0.67rem;
text-align: left;
color: #666;
}
.news_list>div>a>span{
float: right;
}
footer{
color: #fff;
background: #272727 url("../images/footer_bg.png")/*tpa=https://www.yunhesj.cn/themes/default_tmp/public/static/images/footer_bg.png*/ no-repeat 100% 100%;
}
footer .footer_top{
padding: 4rem;
}
footer .footer_bottom{
border-top: 1px solid #3d3d3d;
padding: 1.33rem 0;
line-height: 2;
}
/* about page */
.page_about_item>div>div{
margin-bottom: 3rem;
padding: 3rem 2rem;
border: 1px solid #e5e5e5;
}
.page_about_item>div>div .bt{
font-size: 36px;
font-weight: bold;
}
.page_about_item>div>div .des{
margin-top: 1.5rem;
font-weight: bold;
}
/* page_dupont */
.page_dupont .title{
font-size: 3.2rem;
color: #980000;
font-weight: bold;
margin-bottom: 3rem;
}
.page_dupont .subTitle{
color: #980000;
font-size: 18px;
padding: 3rem 0;
font-weight: bold;
}
.page_dupont .line{
width: 100%;
height: 6px;
background-color: #980000;
margin: 4rem 0;
}
.page_dupont .pro_type div{
margin-bottom: 1rem;
}
.page_dupont .pro_type div a{
color: #000;
border: 2px solid #e5e5e5;
line-height: 4rem;
display: block;
text-align: center;
border-radius: 5px;
transition: all .5s;
}
.page_dupont .pro_type>div:hover a{
background-color: #980000;
border: 2px solid #980000;
color: #fff;
}
.page_dupont .company_list ul li{
position: relative;
padding-left: 60px;
margin: 2rem 0;
}
.page_dupont .company_list ul li p{
margin: 0;
line-height: 2rem;
}
.page_dupont .company_list ul li p.bt{
font-weight: bold;
}
.page_dupont .company_list ul li i{
font-size: 2rem;
position: absolute;
top: 50%;
left: 5px;
transform: translate(0,-50%);
}
.page_dupont .page_dupont_newsTop{
background-color: #980000;
padding: 2rem 0;
line-height: 2.67rem;
font-size: 2.4rem;
color: #fff;
}
.page_dupont .about{
line-height: 2;
color: #666;
}
/* Contact Page */
.contact_list>div{
border-left: 1px solid #ececec;
padding: 2rem;
cursor: pointer;
transition: all .25s;
}
.contact_list>div:nth-child(3n+1){
border-left: none;
}
.contact_list>div:hover,.contact_list>div:nth-child(2n){
background-color: #fbfbfb;
}
.contact_list>div>div .bt{
font-size: 1.6rem;
font-weight: 800;
padding-bottom: 1.5rem;
color: #000;
}
.contact_list>div>div p{
color: #666;
}
.map_box{
margin-top: 5rem;
border: 1px solid #ececec;
padding: 5px;
}
/* message */
.message{
background-color: #fbfbfb;
}
/* job */
.job .ic_bt>span{color: #006646;}
.job .ic_subbt{color: #666; font-size: 2.4rem; padding-bottom: 6rem;}
.job .sideMenu .job_title{ padding: 1rem 2rem; line-height:32px; border-bottom:1px solid #e3e3e3; cursor:pointer; font-weight: bold; font-size: 1.2rem;}
.job .sideMenu .job_title:first-child{border-top:1px solid #e3e3e3;}
.job .sideMenu .job_title.on{background-color: #006646; color:#fff;}
.job .sideMenu .job_title em{ float:right; display:block; width:40px; height:32px; cursor:pointer; background:url("../images/icoAdd.png")/*tpa=https://www.yunhesj.cn/themes/default_tmp/public/static/images/icoAdd.png*/ 16px 12px no-repeat;}
.job .sideMenu .job_title.on em{ background-position:16px -57px; }
.job .sideMenu .job_content{ padding:2rem; color:#666; display:none;}
.job .sideMenu .job_content p.title{font-weight: bold; font-size: 1.2rem; color: #333;}
/* showpro page */
.para_lists{
margin-top: 5rem;
}
.para_lists>div>div{
border: 1px solid #e5e5e5;
margin: 1rem 0;
padding: 2rem 5rem;
}
.para_lists>div>div h1{
position: relative;
}
.para_lists>div>div h1:before{
content:"• ";
position: absolute;
left: -30px;
top: 5%;
}
.showpro_youshi{
background-color: #fafafa;
color: #333;
}
.showpro_youshi h1{
font-size: 2.4rem;
margin-bottom: 2rem;
font-weight: bold;
}
.showpro_youshi ul li{
line-height: 2.5;
}
.pro_lists{
padding: 4rem 0;
background-color: #f4f4f4;
}
.showpro_table{
width: 100%;
line-height: 3;
}
.showpro_table thead tr th{
color: #980000;
font-weight: 800;
}
.showpro_table tr{
padding: 1rem 0;
}
.showpro_table tr td,.showpro_table tr th{
padding-left: 2rem;
line-height: 1.8;
padding: 1rem;
}
.showpro_table tbody tr:nth-child(2n-1){
background-color: #fafafa;
}
.showpro_table tr td>a{
color: #000;
border: 1px solid #ccc;
padding: 3px 5px;
border-radius: 5px;
font-size: .9rem;
white-space: nowrap;
}
.showpro_table tr td>a:hover{
background-color: #006646;
color: #fff;
}
/* sidebar menu */
.menu{
margin-left: 3rem;
color: #fff;
cursor: pointer;
}
.menu i{
font-size: 2rem;
}
#colorlib-main-nav{
position: absolute;
top: 0;
bottom: 0;
right: 0;
padding: 100px 40px;
width: 360px;
height: 100%;
background: white;
z-index: 1002;
text-align: center;
visibility: hidden;
opacity: 0;
-webkit-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
-moz-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
-ms-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
-o-transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
transition: all 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
overflow-y: scroll;
}
.js-fullheight,.colorlib-table-cell{
height: 100%;
}
.menu-show #colorlib-page:after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
content: '';
background: rgba(0, 0, 0, 0.4);
z-index: 3;
}
.colorlib-nav-toggle{
float: right;
z-index: 1003;
position: relative;
display: block;
margin: 0 auto;
cursor: pointer;
margin-top: 0;
}
#colorlib-main-nav .colorlib-nav-toggle{
position: absolute;
top: 25px;
right: 40px;
padding: 20px;
height: 44px;
width: 44px;
background: rgba(0, 0, 0, 0.05);
line-height: 0;
padding: 0 !important;
visibility: hidden;
opacity: 0;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-ms-border-radius: 2px;
border-radius: 2px;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s
}
#colorlib-main-nav .colorlib-nav-toggle.show{
visibility: visible;
opacity: 1;
}
.menu-show #colorlib-main-nav{
visibility: visible;
opacity: 1;
right: 0px;
}
#colorlib-main-nav ul {
padding: 0;
margin: 0 0 3em 0;
}
#colorlib-main-nav ul li {
padding: 0;
margin: 0;
list-style: none;
text-align: left;
}
#colorlib-main-nav ul li a {
display: block;
color: #000;
padding: 10px 0;
text-transform: uppercase;
font-weight: 800;
line-height: 2;
border-bottom: 2px solid #fff;
transition: all .25s;
padding-left: 1em;
}
@media screen and (max-width: 768px) {
#colorlib-main-nav ul {
padding: 20px 0 0 0;
}
#colorlib-main-nav ul li a {
font-size: 16px;
}
}
#colorlib-main-nav ul li a:hover, #colorlib-main-nav ul li a:active, #colorlib-main-nav ul li a:focus {
color: black;
outline: none;
text-decoration: none;
border-bottom: 2px solid #006646;
}
#colorlib-main-nav ul li.active a {
color: #006646;
border-bottom: 2px solid #006646;
}
#colorlib-main-nav .form-group {
margin-bottom: 40px;
position: relative;
width: 100%;
}
@media screen and (max-width: 480px) {
#colorlib-main-nav .form-group {
width: 100%;
}
}
#colorlib-main-nav .form-group input::-webkit-input-placeholder {
color: #333333;
}
#colorlib-main-nav .form-group input::-moz-input-placeholder {
color: #333333;
}
#colorlib-main-nav .form-group input::-ms-input-placeholder {
color: #333333;
}
#colorlib-main-nav .form-group input::-o-input-placeholder {
color: #333333;
}
#colorlib-main-nav .form-group input::input-placeholder {
color: #333333;
}
#colorlib-main-nav #search {
font-size: 14px;
width: 100%;
padding-right: 3em;
border: none;
border: 2px solid #f2f2f2;
background: #fafafa;
color: #333333 !important;
}
#colorlib-main-nav button {
position: absolute;
top: 0;
right: -4px;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
border-radius: 0;
background: #006646;
color: #fff;
border: none;
/* padding: 16px; */
}
#colorlib-main-nav #email {
font-size: 18px;
width: 100%;
border: none;
border: 2px solid #fff;
background: #fff;
color: #333333 !important;
}
#colorlib-main-nav .gallery {
float: left;
width: 50%;
height: 150px;
position: relative;
display: table;
z-index: 0;
text-decoration: none;
}
@media screen and (max-width: 768px) {
#colorlib-main-nav .gallery {
width: 25%;
}
}
@media screen and (max-width: 480px) {
#colorlib-main-nav .gallery {
width: 50%;
}
}
@media screen and (max-width: 1600px){
.header_container .logo_box .pp_logo_box{
top: 10px;
}
.header_container .logo_box .header_contact{
left: 320px;
top: 55px;
font-size: 20px;
}
}
@media screen and (max-width: 768px){
.header_container .logo_box .pp_logo_box{
display: none;
}
.header_container .logo_box .header_contact{
display: none;
}
}
#colorlib-main-nav .gallery:after {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
content: '';
background: rgba(0, 0, 0, 0.3);
opacity: 0;
z-index: -1;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
#colorlib-main-nav .gallery span {
display: table-cell;
vertical-align: middle;
height: 150px;
opacity: 0;
-webkit-transition: 1s;
-o-transition: 1s;
transition: 1s;
}
#colorlib-main-nav .gallery span i {
color: #fff;
font-size: 20px;
}
#colorlib-main-nav .gallery:hover:after, #colorlib-main-nav .gallery:focus:after {
opacity: 1;
}
#colorlib-main-nav .gallery:hover span, #colorlib-main-nav .gallery:focus span {
opacity: 1;
}
body.menu-show{
overflow: hidden;
position: fixed;
height: 100%;
width: 100%;
}
.menu-show #colorlib-page{
transition: all 1s;
}
.colorlib-nav-toggle i {
position: relative;
display: -moz-inline-stack;
display: inline-block;
zoom: 1; *display: inline;
width: 20px;
height: 2px;
color: #000;
text-transform: uppercase;
text-indent: -55px;
background: #000;
-webkit-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .2s ease-out;
}
.menu-show .colorlib-nav-toggle i {
background: #000;
color: #fff;
}
.colorlib-nav-toggle i::before, .colorlib-nav-toggle i::after {
content: '';
width: 20px;
height: 2px;
background: #000;
position: absolute;
left: 0;
-webkit-transition: 0.2s;
-o-transition: 0.2s;
transition: 0.2s;
}
.menu-show .colorlib-nav-toggle i::before, .menu-show .colorlib-nav-toggle i::after {
background: #333333;
}
.colorlib-nav-toggle.dark i {
position: relative;
color: #fff;
background: #fff;
-webkit-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .2s ease-out;
}
.colorlib-nav-toggle.dark i::before, .colorlib-nav-toggle.dark i::after {
background: #fff;
-webkit-transition: 0.2s;
-o-transition: 0.2s;
transition: 0.2s;
}
.colorlib-nav-toggle i::before {
top: -7px;
}
.colorlib-nav-toggle i::after {
bottom: -7px;
}
.colorlib-nav-toggle:hover i::before {
top: -10px;
}
.colorlib-nav-toggle:hover i::after {
bottom: -10px;
}
.colorlib-nav-toggle.active i {
background: transparent;
}
.colorlib-nav-toggle.active i::before {
top: 0;
-webkit-transform: rotateZ(45deg);
-moz-transform: rotateZ(45deg);
-ms-transform: rotateZ(45deg);
-o-transform: rotateZ(45deg);
transform: rotateZ(45deg);
}
.colorlib-nav-toggle.active i::after {
bottom: 0;
-webkit-transform: rotateZ(-45deg);
-moz-transform: rotateZ(-45deg);
-ms-transform: rotateZ(-45deg);
-o-transform: rotateZ(-45deg);
transform: rotateZ(-45deg);
}
#colorlib-main-nav .colorlib-nav-toggle i{
top: 18px !important;
left: 0 !important;
margin: 0 !important;
padding: 0 !important;
line-height: 0;
text-indent: 0;
}
@media screen and (max-width: 1700px) {
header .header_container {
width: 94%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
html{
font-size: 10px;
}
.logo{
height: 40px;
}
.sreach_box{
display: none !important;
}
.logo_text{
max-width: 80%;
}
.ic_bt{
font-size: 2.5rem;
}
.ic_section_margin{
padding: 4rem 0;
}
.footer_top{
display: none;
}
.header_zhanwei{
height: 60px;
}
.map_box{
display: none;
}
.contact_list{
margin-top: -4rem;
margin-bottom: -4rem;
}
.page_dupont .title{
font-size: 2.4rem;
}
.page_dupont .about,.page_dupont .company_list,.showpro_youshi .about{
display: block !important;
}
.page_dupont .company_list ul{
padding-bottom: 1rem;
}
.page_dupont .company_list ul li{
padding-left: 35px;
}
.page_dupont .about .pl-5{
padding-left: 0px !important;
padding-top: 3rem;
}
.para_lists{
margin-top: 1rem;
}
.showpro_youshi .about .ml-5{
padding-left: 0 !important;
margin-left: 0 !important;
}
.showpro_youshi .about .ml-5 h1{
margin-top: 2rem;
}
.showpro_table tr td, .showpro_table tr th{
text-align: center;
padding: 0 1rem
}
.job .ic_bt{
font-size: 2.4rem;
}
.job .ic_subbt{
font-size: 1.6rem;
padding-bottom: 3rem;
}
}