.esc-container .pc-header { display: flex; } .esc-container header { width: 100%; height: 60px; background: #000; display: flex; justify-content: center; align-items: center; /* padding: 0 8% 0 8%; */ box-sizing: border-box; align-items: center; position: relative; z-index: 99; } .esc-container header.pc-header .logo img { width: 169px; position: absolute; left: 10%; top: 14px; height: 35px; } .esc-container header.pc-header .slogin { display: flex; position: absolute; right: 10%; font-size: 16px; font-weight: normal; font-stretch: normal; color: #fcfcfc; justify-content: center; align-items: center; height: 100%; } .esc-container header .nav { display: flex; align-items: center; width: 37%; min-width: 500px; justify-content: space-between; /* margin-left: 19%; */ } .esc-container header .nav .first-nav { flex: 1; display: flex; align-items: center; text-align: center; justify-content: space-between; flex-direction: column; height: 60px; padding-top: 12px; box-sizing: border-box; /* margin-right: 83px; */ } /* .esc-container header .nav .first-nav i { width: 35px; height: 4px; display: block; background-color: #000; } */ /* .esc-container header .nav li:hover i { background-color: #ef7c1c; } */ .esc-container header .nav .first-nav.active a:after { /* background-color: #ef7c1c; */ opacity: 1; } .esc-container header .nav a.top1:after { /* position: absolute; width: 100%; bottom: 0; */ transition: all 0.3s ease; content: ''; display: inline-block; position: absolute; bottom: -8px; z-index: 1200; width: 100%; left: 0; height: 4px; background-color: #ef7c1c; opacity: 0; } .esc-container header .nav a.top1 { font-family: SourceHanSansCN-Regular; font-size: 16px; font-weight: normal; font-stretch: normal; line-height: 40px; letter-spacing: 0px; color: #fcfcfc; position: relative; } .esc-container header .sec-nav { position: absolute; width: 100%; background: #fff; top: 60px; left: 0; min-height: 580px; box-shadow: 2px 2px 10px rgb(0 0 0 / 10%); z-index: 999; padding: 25px 0 45px 0; box-sizing: border-box; } .esc-container header .sec-nav .top-nav { display: flex; width: 960px; margin: 0 auto; justify-content: space-between; align-items: center; } .esc-container header .sec-nav .top-nav .left { width: 40%; } .esc-container header .sec-nav .top-nav .right { width: 78%; display: flex; justify-content: space-between; } .esc-container header .sec-nav .top-nav .right ul { display: flex; justify-content: space-between; width: 64%; } .esc-container header .sec-nav .top-nav .right ul li { font-family: SourceHanSansCN-Normal; font-size: 16px; font-weight: normal; font-stretch: normal; /* position: relative; */ line-height: 40px; letter-spacing: 0px; cursor: pointer; color: #666666; } .esc-container header .sec-nav .top-nav .right ul li.active p { color: #000; font-weight: 600; } .esc-container header .sec-nav .top-nav .right .more { display: block; font-family: SourceHanSansCN-Normal; font-size: 14px; font-weight: normal; font-stretch: normal; line-height: 40px; letter-spacing: 0px; color: #666666; width: 10%; margin: 0; } .esc-container header .sec-nav .top-nav .right ul li .car-change { display: flex; justify-content: space-between; width: 960px; left: 50%; margin-left: -480px; /* margin: 0 auto; */ /* background: red; */ position: absolute; top: 70px; } .esc-container header .sec-nav .top-nav .right ul li .car-change .left { width: 34%; } .esc-container header .sec-nav .top-nav .right ul li .car-change .left ul { display: flex; flex-direction: column; width: 100%; } .esc-container header .sec-nav .top-nav .right ul li .car-change .left ul li.active { background: #f6f6f6; } .esc-container header .sec-nav .top-nav .right ul li .car-change .left ul li { /* border-bottom: solid 2px #f6f6f6; */ display: flex; cursor: pointer; flex-direction: row; height: 50px; justify-content: space-between; padding: 10px 33px 10px 23px; box-sizing: border-box; align-items: center; } .esc-container header .sec-nav .top-nav .right ul li .car-change .left ul li p { margin: 0; font-family: SourceHanSansCN-Medium; font-size: 16px; font-weight: normal; font-stretch: normal; /* line-height: 40px; */ letter-spacing: 0px; color: #1f1f1f; } .esc-container header .sec-nav .top-nav .right ul li .car-change .left ul li img { width: 72px; height: 29px; } .esc-container header .sec-nav .top-nav .right ul li .car-change .right { width: 66%; } .esc-container header .sec-nav .top-nav .right ul li .car-change .right img { width: 100%; /* height: 280px; */ } .esc-container header .sec-nav .top-nav .right ul li .car-change .right a { font-family: SourceHanSansCN-Bold; font-size: 34px; font-weight: 500; font-stretch: normal; line-height: 40px; letter-spacing: 0px; color: #000000; margin-top: 36px; display: block; } .esc-container header .sec-nav .top-nav .right ul li .car-change .right span { font-family: SourceHanSansCN-Bold; font-size: 16px; font-weight: 500; font-stretch: normal; line-height: 40px; letter-spacing: 0px; display: block; color: #000; text-align: left; } .esc-container header .sec-nav .top-nav .right ul li .car-change .right p { font-family: SourceHanSansCN-Light; font-size: 14px; font-weight: normal; font-stretch: normal; line-height: 24px; text-align: left; letter-spacing: 0px; color: #666666; margin-top: 10px; } /* 璧涜溅 */ .esc-container header .first-nav .sec-nav .saiche-nav { background-color: #f6f6f6; width: 100%; padding: 0; } .esc-container header .saiche .sec-nav { padding: 0; /* box-shadow: 0 2px 4px rgb(0 0 0 / 4%); */ box-shadow: 2px 2px 10px rgb(0 0 0 / 10%); } .esc-container header .first-nav .sec-nav .saiche-nav ul { display: flex; justify-content: center; align-items: center; width: 100%; background-color: #f6f6f6; height: 64px; padding-top: 24px; } .esc-container header .first-nav .sec-nav .saiche-nav ul li { width: 10%; text-align: center; } .esc-container header .first-nav .sec-nav .saiche-nav ul li .saiche-tab { /* margin-right: 74px; */ cursor: pointer; } .esc-container header .first-nav .sec-nav .saiche-nav ul li:last-child .saiche-tab { /* margin-right: 0; */ } .esc-container header .first-nav .saiche-nav ul li .saiche-tab p { font-family: SourceHanSansCN-Medium; font-size: 16px; font-weight: normal; font-stretch: normal; letter-spacing: 0px; color: #000000; margin: 0; } .esc-container header .first-nav .saiche-nav ul li .saiche-tab .line { display: block; width: 64px; height: 4px; background-color: #f6f6f6; margin: 14px auto 0 auto; } .esc-container header .first-nav .saiche-nav ul li.active .saiche-tab .line { background-color: #ef7c1c; } .esc-container header .first-nav .saiche-nav ul li.active .saiche-tab p { color: #000; } .esc-container header .saiche .sec-nav { min-height: 630px; } .esc-container header .first-nav .saiche-img-box { position: absolute; top: 100px; width: 960px; left: 50%; margin-left: -480px; } .esc-container header .first-nav .saiche-img { display: flex; flex-wrap: wrap; } .esc-container header .first-nav .saiche-img .saiche-item { width: 22.6%; margin: 0 30px 30px 0; } .esc-container header .first-nav .saiche-img .saiche-item:nth-child(n + 3) { margin-bottom: 10px; } .esc-container header .first-nav .saiche-img .saiche-item:nth-child(4n) { margin-right: 0; } .esc-container header .first-nav .saiche-img .saiche-item img { width: 100%; /* height: auto; */ } .esc-container header .first-nav .saiche-img .saiche-item p { font-family: SourceHanSansCN-Regular; font-size: 14px; font-weight: normal; font-stretch: normal; line-height: 22px; margin: 0; text-align: left; letter-spacing: 0px; color: #333333; margin-top: 17px; } .esc-container header .first-nav .saiche-img-box .more { margin-top: 0; font-family: SourceHanSansCN-Normal; font-size: 14px; font-weight: normal; font-stretch: normal; line-height: 40px; letter-spacing: 0px; color: #666666; } .esc-container header .first-nav .star .saiche-img-box .saiche-item { width: 31%; margin-right: 33px; } .esc-container header .first-nav .star .saiche-img-box .saiche-item:nth-child(3n) { margin-right: 0; } .esc-container header .nav .first-nav:last-child { position: relative; } .esc-container header .nav .first-nav .about { width: 100%; height: 208px; min-height: 208px; background-color: #ffffff; position: absolute; top: 60px; left: 0; z-index: 999; display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 20px 0; box-sizing: border-box; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1); } .esc-container header .nav .first-nav .about a { font-family: SourceHanSansCN-Regular; font-size: 18px; display: block; text-align: center; width: 100%; font-weight: normal; font-stretch: normal; line-height: 40px; letter-spacing: 0px; color: #000000; } .object-img { height: 150px; } .object-img img { height: 100%; width: 100%; object-fit: cover; }