230 lines
3.9 KiB
CSS
230 lines
3.9 KiB
CSS
.header_zuo,.header_you{
|
|
display: flex;
|
|
align-items: center;
|
|
height: 40px;
|
|
}
|
|
|
|
|
|
|
|
.header{
|
|
width: 100%;
|
|
background: #333;
|
|
}
|
|
.hdlist{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.hdlist ul li{
|
|
margin-left: 8px;
|
|
}
|
|
.hdlist ul li:hover a{
|
|
color: #fff;
|
|
}
|
|
.hdlist ul li a{
|
|
color: #b0b0b0;
|
|
font-size: 12px;
|
|
position: relative;
|
|
}
|
|
.header_zuo li a::after{
|
|
position: absolute;
|
|
content: " ";
|
|
height: 11px;
|
|
width: 1px;
|
|
background: #424242;
|
|
right: -5px;
|
|
top: 3px;
|
|
}
|
|
.header_zuo li:last-child a::after {
|
|
width: 0px !important;
|
|
}
|
|
.header_you li a::after{
|
|
position: absolute;
|
|
content: " ";
|
|
height: 11px;
|
|
width: 1px;
|
|
background: #424242;
|
|
right: -5px;
|
|
top: 3px;
|
|
}
|
|
.header_you li:last-child a::after {
|
|
width: 0px !important;
|
|
}
|
|
.header_you li:last-child{
|
|
width: 120px;
|
|
height: 40px;
|
|
background: #424242;
|
|
line-height: 40px;
|
|
text-align: center;
|
|
position: relative;
|
|
}
|
|
.header_you li:last-child:hover{
|
|
background: #fff;
|
|
}
|
|
.header_you li:last-child:hover a{
|
|
color: #ff6700;
|
|
}
|
|
.yclist{
|
|
width: 316px;
|
|
height: 0px;
|
|
background: #fff;
|
|
position: absolute;
|
|
top: 40px;
|
|
right: 0px;
|
|
z-index: 31;
|
|
box-shadow: 2px 2px 5px #999;
|
|
transition: all ease 0.5s;
|
|
}
|
|
.header_you li:last-child:hover .yclist{
|
|
height: 100px;
|
|
}
|
|
|
|
.menu{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
height: 100px;
|
|
align-items: center;
|
|
}
|
|
.menu .menu_left {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.menu .menu_left .dt{
|
|
width: 55px;
|
|
height: 55px;
|
|
background: #ff6700;
|
|
display: flex;
|
|
overflow: hidden;
|
|
}
|
|
.menu .menu_left .dt img{
|
|
width: 55px;
|
|
height: 55px;
|
|
/* margin-left: -55px; */
|
|
}
|
|
.menu .menu_left .dt .hh{
|
|
margin-left: -55px;
|
|
/* transition: all ease 0.3s; */
|
|
}
|
|
.menu .menu_left .dt:hover .hh{
|
|
margin-left: 0px;
|
|
transition: all ease 0.3s;
|
|
}
|
|
.menu .menu_left .dt:hover .he{
|
|
margin-left: 55px;
|
|
transition: all ease 0.3s;
|
|
}
|
|
.menu .menu_left .dt .he{
|
|
transition: all ease 0.3s;
|
|
}
|
|
.menu .menu_left .dlogo{
|
|
height: 55PX;
|
|
margin-right: 10px;
|
|
margin-left: 15px;
|
|
}
|
|
.menu .menu_left ul{
|
|
display: flex;
|
|
}
|
|
.menu .menu_left ul li{
|
|
margin-right: 10px;
|
|
}
|
|
.menu .menu_left ul a{
|
|
color: #333;
|
|
}
|
|
.menu .menu_left ul li:hover a{
|
|
color: #ff6700;
|
|
}
|
|
.menu .menu_right {
|
|
width: 296px;
|
|
height: 50px;
|
|
display: flex;
|
|
border: 1px solid #e0e0e0;
|
|
}
|
|
.menu .menu_right input{
|
|
width: 223px;
|
|
height: 100%;
|
|
border: none;
|
|
padding: 0 10px;
|
|
}
|
|
.menu .menu_right i{
|
|
width: 52px;
|
|
height: 50px;
|
|
display: inline-block;
|
|
text-align: center;
|
|
line-height: 50px;
|
|
border-left: 1px solid #e0e0e0;
|
|
font-size: 29px;
|
|
transition: all ease 0.3s;
|
|
}
|
|
.menu .menu_right i:hover{
|
|
background: #ff6700;
|
|
color: #fff;
|
|
}
|
|
.lunbo{
|
|
position: relative;
|
|
}
|
|
.lunbo img{
|
|
width: 1226px;
|
|
}
|
|
.lb_zuo{
|
|
width: 234px;
|
|
height: 460px;
|
|
position: absolute;
|
|
background: rgba(105,101,101,.6);
|
|
top: 0px;
|
|
left: 0px;
|
|
box-sizing: border-box;
|
|
}
|
|
.lb_zuo ul{
|
|
padding: 20px 0px 20px 0px;
|
|
|
|
}
|
|
.lb_zuo ul li:hover{
|
|
background: #ff6700;
|
|
}
|
|
.lb_zuo ul li a{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
height: 42px;
|
|
}
|
|
.lb_zuo ul li a p{
|
|
font-size: 14px;
|
|
color: #fff;
|
|
margin-left: 30px;
|
|
}
|
|
.lb_zuo ul li a .xiao{
|
|
font-size: 16px;
|
|
font-weight: 600;
|
|
color: #fff;
|
|
margin-right: 20px;
|
|
}
|
|
.lunbo .zuo{
|
|
font-size: 40px;
|
|
color: rgba(105,101,101,.6);
|
|
position: absolute;
|
|
top: 185px;
|
|
left: 240px;
|
|
}
|
|
.lunbo .you{
|
|
font-size: 40px;
|
|
color: rgba(105,101,101,.6);
|
|
position: absolute;
|
|
top: 185px;
|
|
right: 6px;
|
|
}
|
|
.dd{
|
|
display: flex;
|
|
position: absolute;
|
|
right: 30px;
|
|
bottom: 20px;
|
|
}
|
|
.dd li{
|
|
width: 6px;
|
|
height: 6px;
|
|
border: 3px ;
|
|
border-radius: 100%;
|
|
background: rgba(0,0,0,.4);
|
|
border: 2px solid #fff;
|
|
border-color: hsla(0,0%,100%,.3);
|
|
margin-left: 5px;
|
|
} |