shengtang-lee/css/style.css

1536 lines
27 KiB
CSS
Raw Normal View History

2022-02-15 08:20:41 +00:00
.main{
width: 100%;
height: 100vh;
position: relative;
background-color: #000;
box-sizing: border-box;
}
.h100{
height: 100%;
}
.main .ber{
width: 100%;
position: absolute;
opacity: 0.8;
left: 0px;
top: 0px;
height: 100%;
}
.main .con{
width: 100%;
height: 100vh;
position: relative;
overflow: hidden;
z-index: 1;
box-shadow: 0px -19px 69px #000 inset;
}
.nav{
width: 250px;
margin: auto;
background-color: rgba(0,0,0,0.7);
height: 100%;
padding-top: 60px;
box-sizing: border-box;
2022-02-16 01:25:35 +00:00
position: fixed;
2022-02-15 08:20:41 +00:00
top: 0;
left: 50%;
transform: translateX(-50%);
text-align: center;
2022-02-16 01:25:35 +00:00
z-index: 999;
2022-02-15 08:20:41 +00:00
}
.navTop{
width: 150px;
margin: auto;
height: 150px;
transform: rotate(45deg);
text-align: center;
margin-bottom: 51px;
display: flex;
justify-content: center;
background-color: #0D0D0D;
}
.navTop img{
2022-02-16 01:25:35 +00:00
width: 116px;
2022-02-15 08:20:41 +00:00
transform: rotate(-45deg);
}
.navLsit>a{
font-size: 22px;
display: block;
text-align: center;
position: relative;
padding: 15px 0px;
}
.navLsit>a:hover,
.navLsit>a.on{
background-color: rgba(0,0,0,0.5);
color: #fff;
}
.navLsit>a>.make{
background-color: rgba(0,0,0,0.5);
position: absolute;
width: 100%;
display: none;
right: -100%;
top: 0px;
}
.navLsit>a:hover .make{
display: block;
}
.navLsit>a>.make>a{
font-size: 22px;
display: block;
text-align: center;
padding: 15px 0px;
}
.navLsit>a>.make>a:hover{
background-color: #0f0f0f;
color: #fff;
}
.navHref{
display: flex;
justify-content: center;
margin-top: 65px;
}
.navHref>a{
display: inline-block;
width: 34px;
display: flex;
margin: 3px;
align-items: center;
justify-content: center;
height: 34px;
border: 1px solid rgb(95, 95, 95);
}
.footer{
background-color: #000;
width: 100%;
height: 74px;
position: fixed;
bottom: 0px;
text-align: center;
line-height: 74px;
z-index: 5;
left: 0px;
}
.footer a{
color: #262626;
}
.returnIndex{
position: fixed;
right: 26px;
bottom: 160px;
z-index: 15;
}
.returnIndex:hover{
color: #fff;
}
.conNav{
2022-02-16 01:25:35 +00:00
transform: translateX(-720px);
2022-02-15 08:20:41 +00:00
}
.mainCon{
width: 1440px;
margin: auto;
}
.navLsit .on{
color: #fff;
}
.text{
width: 954px;
height: 806px;
animation: myfirstTe 2s;
text-align: center;
padding: 60px 30px 60px 80px;
box-shadow: 0px 0px 130px #000 inset;
overflow: hidden;
background-color: rgba(0,0,0,0.5);
}
.mainCon{
display: flex;
align-items: center;
padding-bottom: 74px;
justify-content: flex-end;
position: relative;
}
.contentPage{
overflow-y:auto ;
height: 530px;
padding-right: 58px;
}
.contentPageC .title{
font-size: 44px;
margin-bottom: 59px;
font-style:italic;
line-height: 44px;
color: #fefefe;
}
.contentPageC img{
max-width: 100%;
}
.contentPage .subtitle{
font-size: 28px;
color: #fefefe;
line-height: 28px;
margin-bottom: 30px;
}
.contentPage .p{
font-size: 16px;
line-height: 30px;
color: #fefefe;
margin-bottom: 38px;
}
.contentPage::-webkit-scrollbar {/*滚动条整体样式*/
width: 2px; /*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
.contentPage::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
border-radius: 10px;
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: #A3A3A3;
}
.contentPage::-webkit-scrollbar-track {/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 10px;
background: #201E1B;
}
.aboutUs{
display: flex;
text-align: left;
}
.aboutUs>img{
position: relative;
left: -100px;
}
.aboutUsPbottom{
padding-bottom: 0px;
overflow: visible;
}
.aboutUsPbottom .contentPage{
height: auto;
overflow: visible;
}
.aboutUsTitle{
font-size: 28px;
animation: myfirst 4s;
color: #e8e8e8;
margin-bottom: 30px;
padding-top: 60px;
}
.aboutUsSubtitle{
font-size: 18px;
animation: myfirst 4s;
color: #e8e8e8;
line-height: 36px;
}
.aboutUsP{
font-size: 16px;
line-height: 32px;
margin-top: 65px;
animation: myfirsta 4s;
color: #e8e8e8;
}
.honoraryCertificate .title{
font-size: 44px;
margin-bottom: 43px;
font-style:italic;
padding-top: 30px;
text-align: center;
color: #e8e8e8;
animation: myfirste 2s;
}
.honoraryCertificateCon>.list{
width: 950px;
height: 154px;
padding: 12px;
display: flex;
align-items: center;
background-color: rgba(0,0,0,0.6);
box-sizing: border-box;
margin-bottom: 12px;
transition: all 1s;
}
.honoraryCertificateCon>.list:hover{
transition: all 1s;
transform: scale(1.1);
}
.honoraryCertificateCon>.list .listImg{
height: 130px;
width: 180px;
}
.honoraryCertificateCon>.list .listImg img{
width:100%;
object-fit: contain;
}
.honoraryCertificateCon>.list .listTitle{
font-size: 28px;
color: #e8e8e8;
margin-left: 58px;
}
.honoraryCertificateCon>.list .listText{
font-size: 24px;
color: #e8e8e8;
margin-left: 62px;
}
.InterviewSwiper{
padding-right: 30px;
position: relative;
}
.lisiImg .img{
width: 100%;
object-fit: contain;
}
.Interview .swiper{
width: 550px;
}
.Interview{
flex: 1;
margin-right: -300px;
2022-02-15 10:05:22 +00:00
padding-left: 250px;
2022-02-15 08:20:41 +00:00
}
.InterviewCon{
2022-02-15 10:05:22 +00:00
overflow: hidden;
padding-left: 30px;
2022-02-15 08:20:41 +00:00
}
.suspended{
width: 100%;
height: 100%;
position: absolute;
display: flex;
left: 0px;
top: 0px;
align-items: center;
justify-content: center;
}
.suspended>div{
width: 63px;
height: 63px;
padding-left: 5px;
box-sizing: border-box;
border-radius: 50%;
border: 1px solid rgba(0,0,0,0.6);
background-color: rgba(0,0,0,0.5);
display: flex;
align-items: center;
justify-content: center;
}
.InterviewSwiper .lisiImg{
width: 100%;
height: 310px;
position: relative;
}
.InterviewSwiper .listDate{
width: 66px;
position: absolute;
left: -10px;
bottom: -24px;
text-align: center;
background-color: #0e0e0e;
height: 66px;
padding-top: 14px;
color: #E8E8E8;
border-radius: 50%;
}
.InterviewSwiper .listText{
margin-top: 42px;
}
.InterviewSwiper .listText>:nth-child(1){
color: #e8e8e8;
font-size: 18px;
text-align: center;
}
.InterviewSwiper .listText>:nth-child(2){
color: #e8e8e8;
font-size: 18px;
margin-top: 24px;
display: block;
text-align: center;text-decoration:underline;
}
.Interview .title{
font-size: 44px;
color: #fefefe;
font-style:italic;
animation: myfirstTe 2s;
text-align: center;
}
.Interview .select{
width: 100px;
height: 46px;
font-size: 20px;
background-color: rgba(0,0,0,0);
color: #bfbfbf;
padding: 0 15px;box-sizing: border-box;
border: 1px solid #bfbfbf;
display: flex;
align-items: center;
margin: auto;margin-top: 20px;
}
.Interview .select select{
font-size: 20px;
background-color: rgba(0,0,0,0);
color: #bfbfbf;
border: none;
width: 100%;
height: 100%;
}
.InterviewTitle{
margin-left: -200px;
margin-bottom: 100px;
}
.InterviewDetails{
text-align: left;
}
.InterviewDetails .title{
font-size: 24px;
text-align: center;
}
.InterviewDetailsImg{
width: 100%;
margin-bottom: 20px;
position: relative;
}
.suspended img{
width: auto;
}
.projectIntroductionList>div>p{
font-size: 16px;
margin-bottom: 16px;
line-height: 24px;
color: #e8e8e8;
2022-02-15 10:05:22 +00:00
cursor: pointer;
2022-02-15 08:20:41 +00:00
}
.projectIntroductionList>div>.on{
text-decoration: underline;
}
.projectIntroduction{
display: flex;
justify-content: space-between;
margin-top: 46px;
}
.projectIntroductionCon{
padding-left: 0px;
width: 950px;
animation: myfirstTe 2s;
}
.projectIntroductionCon .title{
font-size: 44px;
color: #fefefe;
font-style:italic;
text-align: center;
}
option{
font-size: 20px;
background-color: rgba(0,0,0,0);
}
.projectIntroductionCon .select{
width: 100px;
height: 46px;
font-size: 20px;
background-color: rgba(0,0,0,0);
color: #bfbfbf;
2022-02-15 10:05:22 +00:00
box-sizing: border-box;
2022-02-15 08:20:41 +00:00
border: 1px solid #bfbfbf;
display: flex;
align-items: center;
2022-02-15 10:05:22 +00:00
margin: auto;
margin-top: 20px;
cursor: pointer;
appearance:none; /*去掉下拉箭头*/
background-image: url(../imgs/arrow.png);
background-repeat: no-repeat;
background-size: 11px 7px;
background-position: 74px center;
2022-02-15 08:20:41 +00:00
}
.projectIntroductionCon .select select{
2022-02-15 10:05:22 +00:00
padding: 0 15px;
2022-02-15 08:20:41 +00:00
font-size: 20px;
background-color: rgba(0,0,0,0);
color: #bfbfbf;
border: none;
width: 100%;
height: 100%;
2022-02-15 10:05:22 +00:00
cursor: pointer;
appearance:none; /*去掉下拉箭头*/
2022-02-15 08:20:41 +00:00
}
.projectIntroductionJt>a{
margin-right: 14px;
}
.projectIntroductionConMain{
margin-left: 44px;
padding-right: 30px;
}
.projectIntroductionConMain{
height: 596px;
overflow-x: auto;
}
.projectIntroductionConMain img{
max-width: 100%;
}
.projectIntroductionConMain::-webkit-scrollbar {/*滚动条整体样式*/
width: 2px; /*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
.projectIntroductionConMain::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
border-radius: 10px;
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: #EDEDED;
}
.projectIntroductionConMain::-webkit-scrollbar-track {/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 10px;
background: #535353;
}
.projectIntroductionDetails .title{
font-size: 36px;
text-align: left;
margin-bottom: 23px;
}
.projectIntroductionDetails .p{
font-size: 16px;
color: #E8E8E8;
line-height: 30px;
}.projectIntroductionDetails{
width: 677px;
}
.projectIntroductionDetails{
margin-bottom: 40px;
}
.projectIntroductionDetailsNav{
padding-top: 150px;
}
.projectIntroductionDetails+.projectIntroductionConMain{
height: 511px;
}
.brand .select{
width: 100px;
height: 46px;
font-size: 20px;
background-color: rgba(0,0,0,0);
color: #bfbfbf;
2022-02-15 10:05:22 +00:00
box-sizing: border-box;
2022-02-15 08:20:41 +00:00
border: 1px solid #bfbfbf;
display: flex;
align-items: center;
margin: auto;
margin-bottom: 43px;
2022-02-15 10:05:22 +00:00
background-image: url(../imgs/arrow.png);
background-repeat: no-repeat;
background-size: 11px 7px;
background-position: 74px center;
2022-02-15 08:20:41 +00:00
}
.brand .select select{
2022-02-15 10:05:22 +00:00
padding: 0 15px;
2022-02-15 08:20:41 +00:00
font-size: 20px;
background-color: rgba(0,0,0,0);
color: #bfbfbf;
border: none;
width: 100%;
height: 100%;
2022-02-15 10:05:22 +00:00
appearance:none; /*去掉下拉箭头*/
2022-02-15 08:20:41 +00:00
}
.brand .title{
margin-bottom: 22px;
font-style:italic
}
.brand .p{
text-align: left;
}
.serviceConcept .list{
width: 300px;
margin-bottom: 28px;
padding-top: 36px;
box-sizing: border-box;
text-align: center;
padding-right: 20px;
padding-left: 20px;
height: 278px;
background-color: rgba(0,0,0,0.7);
}
.serviceConcept{
display: flex;
flex-wrap: wrap;
width: 954px;
justify-content: space-between;
}
.serviceConcept .list .listImg{
display: flex;
justify-content: center;
margin-bottom: 32px;
}
.serviceConcept .list .listImg>:nth-child(2){
display: none;
}
.serviceConcept .list>:nth-child(2){
font-size: 22px;
color: #e8e8e8;
line-height: 22px;
margin-bottom: 12px;
}
.serviceConcept .list:hover>:nth-child(2){
font-weight: bold;
}
.serviceConcept .list>:nth-child(3){
font-size: 12px;
color: #ffffff;
margin-bottom: 28px;
}
.serviceConcept .list>.p{
font-size: 14px;
text-align: center;
color: #ffffff;
}
.serviceConcept .list:hover .listImg>:nth-child(1){
display: none;
}
.serviceConcept .list:hover .listImg>:nth-child(2){
display: block;
}
.serviceConcept .list:hover{
background-color: rgba(196,196,196,0.9);
}
.serviceConcept .list:hover>:nth-child(2){
color: #1b1b1b;
}
.serviceConcept .list:hover>.p{
font-size: 14px;
text-align: center;
color: #1b1b1b;
}
.wellKnownProductsNav a{
font-size: 16px;
color: #e8e8e8;
text-align: left;
margin-bottom: 20px;
line-height: 16px;
display: block;
}
.wellKnownProductsNav .on{
border-bottom: 1px solid #e8e8e8;
}
.wellKnownProducts{
display: flex;
justify-content: space-between;
}
.wellKnownProductsNavP{
padding-right: 60px;
}
.wellKnownProducts .p{
font-size: 18px;
color: #e8e8e8;
text-align: center;
margin-top: 25px;
}
.wellKnownProductsJt{
display: flex;
justify-content: center;
margin-top: 30px;
align-items: center;
}
.wellKnownProductsJt p{
font-size: 14px;
color: #e8e8e8;
margin: 0 18px;
}
.contactUsTelText{
display: flex;
text-align: left;
align-items: center;
margin-bottom: 40px;
}
.contactUsTelText>div{
margin-left: 28px;
}
.contactUsTelText>div>p{
font-size: 15px;
line-height: 15px;
color: #fff;
}
.contactUsTelText>div>:nth-child(1){
margin-bottom: 13px;
}
.wx{
display: flex;
}
.wx>div{
margin-left: 35px;
}
.wx p{
font-size: 15px;
color: #e8e8e8;
text-align: center;
margin-top: 18px;
line-height: 15px;
}
.contactUsTel{
display: flex;
justify-content: space-between;
align-items: center;
}
.inta{
display: flex;
justify-content: space-between;
}
.inta input{
padding:17px 0px;
background-color: rgba(0,0,0,0);
border: none;
color: #e8e8e8;
border-bottom: 1px solid rgb(45, 45, 45);
width: 48%;
}
.inta input::placeholder{
font-size: 18px;
color: #e8e8e8;
}
.contactUsInpur{
margin-top: 40px;
}
.intB{
text-align: left;
margin-top: 46px;
}
.intB p{
font-size: 18px;
color: #e8e8e8;
margin-bottom: 35px;
}
.intB input{
border: none;
color: #e8e8e8;
height: 31px;
border-bottom: 1px solid rgb(45, 45, 45);
width: 100%;
background-color: rgba(0,0,0,0);
}
.contactUsButton{
width: 142px;
height: 55px;
background-color: #000;
border: none;
margin: auto;
color: #fff;
margin-top: 29px;
}
.indexBrandCon{
display: flex;
margin-top: 62px;
}
.indexBrandCon .indexBrandNav{
width: 237px;
margin-right: 32px;
}
.indexBrandCon .contentPage{
width: 580px;
text-align: left;
}
.indexBrandNav{
text-align: left;
}
.indexBrandNav .list p{
font-size: 16px;
line-height: 16px;
margin-bottom: 5px;
color: #e8e8e8;
display: inline-block;
padding: 5px;
2022-02-15 10:05:22 +00:00
cursor: pointer;
2022-02-15 08:20:41 +00:00
}
.indexBrandNav .list .on{
background-color: #3b3a39;
}
.indexBrandCon .contentPage .subtitle{
margin-top: 30px;
}
.indexBrandNav .tit{
font-size: 18px;
line-height: 18px;
color: #e8e8e8;
margin-bottom: 15px;
padding-bottom: 12px;
border-bottom: 1px solid #2c2b28;
}
.engineeringConText{
width: 673px;
height: 471px;
padding-right: 31px;
box-sizing: border-box;
background-color: rgba(0,0,0,0.5)
}
.engineeringCon .tit{
font-size: 28px;
height: 63px;
line-height: 57px;
color: #e8e8e8;
padding-left: 9px;
margin-left: 30px;
margin-bottom: 60px;
border-left: 1px solid #E8E8E8;
}
.engineeringConText .listImg{
width: 517px;
height: 305px;
margin-left: 30px;
position: relative;
top: -60px;
}
.engineeringConText .listImg img{
width: 100%;
object-fit: contain;
}
.engineeringConText .p{
font-size: 16px;
line-height: 30px;
margin-left: 30px;
margin-top: -50px;
color: #e8e8e8;
}
.engineeringNavList .list{
background-color: rgba(0,0,0,0.5);
width: 270px;
height: 121px;
}
.engineering{
display: flex;
margin-top: 45px;
}
.engineeringNav{
margin-left: 10px;
}
.engineering .list{
display: flex;
align-items: center;
justify-content: space-between;
padding-left: 22px;
margin-bottom: 10px;
padding-right: 18px;
}
.engineering .list p{
font-size: 18px;
width: 72px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis; /* 加省略号 */
color: #c7c7c7;
}
.engineering .list div{
width: 144px;
height: 84px;
}
.engineering .list div img{
max-width: 100%;
}
.engineeringNavButton{
width: 271px;
height: 70px;
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(0,0,0,0.5);
}
.engineeringNavButton a{
display: inline-block;
margin: 0 10px;
}
.engineeringNavList .on{
background-color: rgba(0,0,0,0);
box-sizing: border-box;
border: 1px solid #E8E8E8;
}
.siteImage{
background-color: rgba(0,0,0,0.5);
width: 954px;
height: 530px;
}
.siteImageW .select{
width: 135px;
margin-bottom: 106px;
}
.siteImage{
position: relative;
}
.siteImage .listImg{
width: 696px;
margin: auto;
height: 410px;
overflow: hidden;
position: relative;
top: -60px;
}
.siteImage .listImg img{
width: 100%;
}
.siteImageButton{
display: flex;
padding: 0 44px;
align-items: center;
}
.swiperImg{
width: 150px;
height: 150px;
border-radius: 50%;
overflow: hidden;
}
.siteImageButton{
margin-top: -47px;
}
.swiperImg img{
display: block;
/* object-fit: contain; */
height: 100%;
}
/* .siteImageSwiper{
padding: 0 40px;
box-sizing: border-box;
} */
.siteImageSwiper{
width: 81.5%;
}
.makeV{
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;
display: flex;
align-items: center;
align-content:center;
justify-content: center;
flex-direction: column;
z-index: 6;
display: none;
background-color: rgba(0,0,0,0.6);
}
.makeV video{
width: 80%;
position: relative;
z-index: 6;
}
.makeV button{
background-color: #000;
color: #fff;
width: 100px;
height: 50px;
margin-top: 30px;
}
.reduction{
transform: rotateZ(180deg);
}
.projectIntroductionNav{
position: relative;
}
.projectIntroductionNavButton{
display: none;
}
.swiper-a{
transform: rotate(180deg);
}
select{
outline:none
}
.aboutUsText{
margin-left: -55px;
}
@media screen and (min-width:767px) and (max-width:991px) {
}
@media screen and (max-width:1560px){
.projectIntroductionDetails{
width: 560px;
}
.siteImage .listImg{
height: auto;
}
2022-02-15 10:05:22 +00:00
.nav{
width: 230px;
}
2022-02-16 01:25:35 +00:00
.conNav{
left: 60px;
transform: translateX(0);
}
2022-02-15 08:20:41 +00:00
.siteImage{
width: 100%;
height: auto;
}
.engineeringNavList .list{
width: 200px;
}
.engineeringNavButton{
width: 200px;
}
.engineeringConText{
2022-02-15 10:05:22 +00:00
width: 100%;
2022-02-15 08:20:41 +00:00
}
.engineeringConText .listImg{
width: 80%;
height: auto;
}
.wellKnownProductsText{
width: 80%;
}
.serviceConcept .list{
width: 31%;
}
.serviceConcept{
width: 700px;
}
.serviceConcept .list{
padding-top: 10px;
}
.projectIntroductionNav{
height: 553px;
overflow-x: auto;
}
.serviceConcept .list>:nth-child(2){
font-size: 16px;
}
.serviceConcept .list>:nth-child(3){
margin-bottom: 10px;
}
.projectIntroductionCon{
2022-02-15 10:05:22 +00:00
width: calc(100% - 250px);
max-width: 950px;
2022-02-15 08:20:41 +00:00
margin-left: 30px;
}
.mainCon{
width: 100%;
padding: 0 60px;
}
.conNav{
left: 60px;
}
.text{
width: calc(100% - 250px);
max-width: 954px;
margin-left: 250px;
}
.aboutUs>img{
object-fit:contain;
width: 45%;
z-index: 6;
}
.aboutUsText{
width: 70%;
margin: 0px;
}
2022-02-15 10:05:22 +00:00
.honoraryCertificate{
width: calc(100% - 250px);
margin-left: 250px;
max-width: 954px;
}
2022-02-15 08:20:41 +00:00
.honoraryCertificateCon{
2022-02-15 10:05:22 +00:00
2022-02-15 08:20:41 +00:00
}
.honoraryCertificateCon>.list{
2022-02-15 10:05:22 +00:00
width: 100%;
2022-02-15 08:20:41 +00:00
}
}
@media screen and (max-width:1320px){
.projectIntroductionDetails {
width: 400px;
}
}
@media screen and (max-width:1020px){
2022-02-15 10:05:22 +00:00
.nav{
width: 250px;
}
2022-02-15 08:20:41 +00:00
.wellKnownProductsNav{
display: flex;
justify-content: space-between;
}
.make{
display: block;
}
.navLsit>a>.make{
display: block;
position:static ;
background-color: rgba(0,0,0,0);
}
.navLsit>a>.make>:nth-child(1){
display: none;
}
.nav{
overflow-x: auto;
padding-bottom: 120px;
}
.navLsit>a>.make>a{
background-color: rgba(0,0,0,0);
margin-top: 15px;
}
.navIpd{
left: auto;
right: -250px;
background-color: rgba(0,0,0,1);
}
.projectIntroductionCon{
padding-top: 20px;
}
.projectIntroductionJt{
display: flex;
justify-content: center;
}
.projectIntroductionJt>a{
margin-left: 14px;
}
.projectIntroductionNav{
height: 70px;
text-align: center;
}
.projectIntroductionList>div>:nth-child(1){
margin-bottom: 60px;
}
.projectIntroductionNavButton{
display: block;
width: 30px;
margin: auto;
}
2022-02-15 10:05:22 +00:00
.honoraryCertificate{
margin: 0;
}
2022-02-15 08:20:41 +00:00
.projectIntroductionNavButton{
position: absolute;
bottom: 0px;
left: 50%;
margin-left: -15px;
}
.projectIntroductionNavButton img{
width: 100%;
}
.projectIntroductionDetails{
margin-top: 30px;
}
.projectIntroductionDetails+.projectIntroductionConMain{
height: auto;
}
.projectIntroductionDetails {
width: 100%;
margin-left: 0px;
}
.navCon{
position: fixed;
right: 20px;
top: 20px;
z-index: 20;
}
.navCon p{
width: 30px;
height: 3px;
margin-bottom: 6px;
background-color: #000;
}
.navIpd{
position: fixed;
right: -250px;
z-index: 30;
transition: all 1s;
top: 0px;
}
.swiperImg{
width: 60px;
height:60px;
}
.siteImage .listImg{
width: 90%;
}
.projectIntroductionCon .title{
font-size: 24px;
}
.engineeringNavList{
display: flex;
justify-content: space-between;
}
.engineering .list{
display: block;
text-align: center;
height: auto;
padding: 10px;
}
.engineering .list p{
font-size: 14px;
}
.engineering .list p{
width: auto;
padding: 20px 0px;
}
.engineering .list div{
width: 100%;
text-align: center;
overflow: hidden;
}
.engineeringNavList .list{
width: 23%;
}
.engineering .list div img{
display: block;
margin: auto;
}
.engineeringNavButton{
width: 100%;
}
.engineeringCon{
margin-top: 20px;
}
.engineeringConText{
width: 100%;
}
.honoraryCertificate .title{
font-size: 24px;
}
.engineering{
flex-direction: column-reverse;
}
.serviceConcept{
width: 100%;
}
.projectIntroductionCon{
margin-left: 0px;
}
.projectIntroductionCon{
width: 100%;
}
.InterviewTitle{
margin-left: 0px;
}
.Interview{
padding-left: 0px;
margin-right: 0px;
}
.h100{
min-height: 100vh;
}
.main{
height: auto;
padding-bottom: 80px;
}
.honoraryCertificate{
width: 100%;
}
.honoraryCertificateCon{
margin: 0px;
width: 100%;
}
.honoraryCertificateCon>.list{
width: 100%;
}
.text{
margin-left: 0px;
}
.indexBrandCon .contentPage{
width: 100%;
height: auto;
}
.indexBrandCon .indexBrandNav{
display: block;
width: auto;
}
.main .con{
height: auto;
}
.main{
min-height: 100vh;
}
.returnIndex {
position: fixed;
right: 16px;
bottom: 130px;
z-index: 15;
}
.contentPage{
height: auto;
}
.text{
width: 100%;
}
.contentPageC .title{
font-size: 24px;
margin-bottom: 20px;
}
.Interview .title{
font-size: 24px;
}
.contentPage .subtitle{
font-size: 18px;
}
.contentPage .p{
font-size: 14px;
}
.mainCon{
width: 100%;
padding: 0 15px;
padding-top: 60px;
}
.projectIntroduction{
display: block;
}
2022-02-15 10:05:22 +00:00
.contentPage{
padding-right: 0;
}
.text{
padding: 50px;
height: auto;
}
.text img{
max-width: 100%;
margin: 10px auto;
}
.engineeringConText{
height: auto;
text-align: justify;
}
.contentPage .p{
text-align: justify;
}
.aboutUsText{
width: 100%;
text-align: justify;
}
.projectIntroductionConMain img{
width: 100%;
margin: 0 auto;
}
2022-02-15 08:20:41 +00:00
}
@media screen and (max-width:768px){
.contactUsTel{
display: block;
}
.wx {
width: 100%;
justify-content: space-between;
}
.wx>div{
margin-left: 0px;
}
.swiperImg{
width: 60px;
height:60px;
}
.siteImageButton{
padding: 20px ;
}
.wellKnownProducts{
display: block;
}
.serviceConcept .list{
width: 49%;
}
.projectIntroduction{
display: block;
}
.wellKnownProductsText{
width: 100%;
}
.projectIntroductionConMain {
margin-left: 0px;
margin-top: 20px;
height: auto;
}
.aboutUs>img{
left: 0px;
margin-right: 20px;
}
.text {
height: auto;
padding: 20px 20px 80px 20px;
}
.contentPage{
padding-right: 0px;
}
.indexBrandCon{
display: block;
}
}
@media screen and (max-width:568px){
.wx>div{
width: 49%;
}
.wx>div img{
width: 100%;
}
.swiperImg{
width: 40px;
height: 40px;
}
.engineering .list div{
height: 50px;
}
.serviceConcept .list{
width: 100%;
}
.InterviewSwiper .lisiImg{
height: auto;
}
.Interview .swiper{
width: 280px;
}
.aboutUs{
display: block;
}
.aboutUs>img{
width: 100%;
margin: 0px;
}
.honoraryCertificateCon>.list .listTitle{
margin: 0px;
margin-top: 20px;
}
.honoraryCertificateCon>.list img {
display: block;
margin: auto;
}
.honoraryCertificateCon>.list{
display: block;
text-align: center;
height: auto;
}
.honoraryCertificateCon>.list .listText{
margin: 0px;
margin-top: 20px;
}
}
@keyframes myfirst
{
0% {
margin-left: 100px;
opacity: 0;
}
50%{
margin-left: 100px;
opacity: 0;
}
100% {
margin-left: 0px;
opacity: 1;
}
}
@keyframes myfirsta
{
from {
margin-top: 200px;
opacity: 0;
}
to {
margin-top: 65px;
opacity: 1;
}
}
@keyframes myfirstTe
{
from {
margin-top: 100vh;
opacity: 0;
}
to {
margin-top: 0px;
opacity: 1;
}
}
@keyframes myfirste
{
from {
padding-top: 100vh;
opacity: 0;
}
to {
padding-top: 30px;
opacity: 1;
}
}
@keyframes projectConMainmyfirs
{
from {
padding-top: 100%;
opacity: 0;
}
to {
padding-top: 0px;
opacity: 1;
}
}