|
|
@@ -8,12 +8,11 @@
|
|
|
cursor: default;
|
|
|
position: relative;
|
|
|
}
|
|
|
-
|
|
|
-/* .NavLinkContent1:hover {
|
|
|
+.NavLinkContent1:hover {
|
|
|
background-image: url("../images/navOneHover.png");
|
|
|
}
|
|
|
|
|
|
-.NavLinkContent1:hover .ShowContent .LeftPart {
|
|
|
+/* .NavLinkContent1:hover .ShowContent .LeftPart {
|
|
|
background-image: url("../images/navSevenIconHover.png");
|
|
|
}
|
|
|
|
|
|
@@ -43,6 +42,15 @@
|
|
|
margin-right: 28px;
|
|
|
}
|
|
|
|
|
|
+.NavLinkContent1:hover .ShowContent .LeftPart {
|
|
|
+ width: 88px;
|
|
|
+ height: 88px;
|
|
|
+ background-image: url("../images/icon-map-hover.png");
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ margin-right: 28px;
|
|
|
+}
|
|
|
+
|
|
|
.NavLinkContent1 .ShowContent .LeftPart.custom-img {
|
|
|
/* width: 100px;
|
|
|
height: 100px; */
|
|
|
@@ -120,7 +128,7 @@
|
|
|
font-size: 36px;
|
|
|
font-family: PangMenZhengDao-3, PangMenZhengDao;
|
|
|
font-weight: normal;
|
|
|
- color: #ffffff;
|
|
|
+ color: #2bb5eb;
|
|
|
line-height: 41px;
|
|
|
margin-bottom: 16px;
|
|
|
text-align: start;
|
|
|
@@ -144,6 +152,7 @@
|
|
|
background-image: url("../images/navThree.png");
|
|
|
background-repeat: no-repeat;
|
|
|
background-size: contain;
|
|
|
+ background-position: 4px center;
|
|
|
cursor: pointer;
|
|
|
position: relative;
|
|
|
}
|
|
|
@@ -166,7 +175,7 @@
|
|
|
align-items: center;
|
|
|
height: 185px;
|
|
|
position: absolute;
|
|
|
- left: 166px;
|
|
|
+ left: 88px;
|
|
|
}
|
|
|
|
|
|
.NavLinkContent3 .ShowContent .LeftPart {
|
|
|
@@ -179,14 +188,14 @@
|
|
|
}
|
|
|
|
|
|
.NavLinkContent3 .ShowContent .RightPart .RightPart_TopPart {
|
|
|
- width: 180px;
|
|
|
+ width: 250px;
|
|
|
height: 36px;
|
|
|
font-size: 36px;
|
|
|
font-family: PangMenZhengDao-3, PangMenZhengDao;
|
|
|
font-weight: normal;
|
|
|
- color: #ffffff;
|
|
|
+ color: #2bb5eb;
|
|
|
line-height: 41px;
|
|
|
- margin-bottom: 16px;
|
|
|
+ /* margin-bottom: 16px; */
|
|
|
text-align: start;
|
|
|
}
|
|
|
|
|
|
@@ -252,7 +261,7 @@
|
|
|
font-size: 36px;
|
|
|
font-family: PangMenZhengDao-3, PangMenZhengDao;
|
|
|
font-weight: normal;
|
|
|
- color: #ffffff;
|
|
|
+ color: #2bb5eb;
|
|
|
line-height: 41px;
|
|
|
margin-bottom: 16px;
|
|
|
text-align: start;
|
|
|
@@ -280,11 +289,11 @@
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
-/* .NavLinkContent5:hover {
|
|
|
+.NavLinkContent5:hover {
|
|
|
background-image: url("../images/navFiveHover.png");
|
|
|
}
|
|
|
|
|
|
-.NavLinkContent5:hover .ShowContent .LeftPart {
|
|
|
+/* .NavLinkContent5:hover .ShowContent .LeftPart {
|
|
|
background-image: url("../images/navTwoIconHover.png");
|
|
|
}
|
|
|
|
|
|
@@ -314,13 +323,22 @@
|
|
|
margin-right: 28px;
|
|
|
}
|
|
|
|
|
|
+.NavLinkContent5:hover .ShowContent .LeftPart {
|
|
|
+ width: 88px;
|
|
|
+ height: 88px;
|
|
|
+ background-image: url("../images/icon-users-hover.png");
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ margin-right: 28px;
|
|
|
+}
|
|
|
+
|
|
|
.NavLinkContent5 .ShowContent .LeftPart.custom-img {
|
|
|
/* width: 100px;
|
|
|
height: 100px; */
|
|
|
}
|
|
|
|
|
|
.NavLinkContent5 .ShowContent .RightPart .RightPart_TopPart {
|
|
|
- width: 210px;
|
|
|
+ width: 265px;
|
|
|
/* height: 36px; */
|
|
|
font-size: 36px;
|
|
|
font-family: PangMenZhengDao-3, PangMenZhengDao;
|
|
|
@@ -452,14 +470,14 @@
|
|
|
}
|
|
|
|
|
|
.NavLinkContent7 .ShowContent .RightPart .RightPart_TopPart {
|
|
|
- width: 180px;
|
|
|
+ width: 230px;
|
|
|
height: 36px;
|
|
|
font-size: 36px;
|
|
|
font-family: PangMenZhengDao-3, PangMenZhengDao;
|
|
|
font-weight: normal;
|
|
|
color: #ffffff;
|
|
|
line-height: 41px;
|
|
|
- margin-bottom: 16px;
|
|
|
+ /* margin-bottom: 16px; */
|
|
|
text-align: start;
|
|
|
}
|
|
|
|
|
|
@@ -536,4 +554,145 @@
|
|
|
color: #ff9c27;
|
|
|
line-height: 17px;
|
|
|
text-align: start;
|
|
|
+}
|
|
|
+[class*="NavLinkContent"] .ShowContent .RightPart .RightPart_TopPart{
|
|
|
+ color: #2bb5eb;
|
|
|
+}
|
|
|
+
|
|
|
+[class*="NavLinkContent"]:hover .ShowContent .RightPart .RightPart_TopPart{
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+.sub-nav{
|
|
|
+ display: none;
|
|
|
+ height: auto;
|
|
|
+ width: 470px;
|
|
|
+ position: absolute;
|
|
|
+ top: 100%;
|
|
|
+ right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+[class*="NavLinkContent"]:hover > .sub-nav{
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+
|
|
|
+.sub-nav-item{
|
|
|
+ height: 42px;
|
|
|
+ color: #2bb5eb;
|
|
|
+ line-height: 40px;
|
|
|
+ padding: 1px 10px;
|
|
|
+ font-size: 36px;
|
|
|
+ margin-top: 10px;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-image: url("../images/sub-nav-bg.png");
|
|
|
+ background-position: center;
|
|
|
+ text-align: center;
|
|
|
+ cursor: pointer;
|
|
|
+ position: relative;
|
|
|
+ font-family: PangMenZhengDao-3, PangMenZhengDao;
|
|
|
+}
|
|
|
+.sub-nav-item + .sub-nav-item{
|
|
|
+ margin-top: 15px;
|
|
|
+}
|
|
|
+.sub-nav-item:hover{
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+.sub-nav-item.is-disabled{
|
|
|
+ color: #2bb5eb;
|
|
|
+}
|
|
|
+
|
|
|
+.NavLinkContent1 .sub-nav, .NavLinkContent3 .sub-nav{
|
|
|
+ left: 99px;
|
|
|
+ right: auto;
|
|
|
+}
|
|
|
+
|
|
|
+.NavLinkContent3 .sub-nav{
|
|
|
+ left: 107px;
|
|
|
+}
|
|
|
+.NavLinkContent1 .sub-nav .sub-nav-item{
|
|
|
+ background-position: right center;
|
|
|
+
|
|
|
+}
|
|
|
+.NavLinkContent1:hover .sub-nav-item, .NavLinkContent3:hover .sub-nav-item{
|
|
|
+ animation: slide-left 1.5s 0s ease-in-out;
|
|
|
+}
|
|
|
+.NavLinkContent1 .sub-nav .sub-nav-item:nth-child(1){
|
|
|
+ width: 446px;
|
|
|
+ background-image: url("../images/sub-nav-01.png");
|
|
|
+}
|
|
|
+.NavLinkContent1 .sub-nav .sub-nav-item:nth-child(2){
|
|
|
+ width: 421px;
|
|
|
+ background-image: url("../images/sub-nav-02.png");
|
|
|
+}
|
|
|
+.NavLinkContent1 .sub-nav .sub-nav-item:nth-child(3){
|
|
|
+ width: 408px;
|
|
|
+ background-image: url("../images/sub-nav-03.png");
|
|
|
+}
|
|
|
+
|
|
|
+.NavLinkContent3 .sub-nav .sub-nav-item:nth-child(1){
|
|
|
+ width: 480px;
|
|
|
+ background-image: url("../images/sub-nav-04.png");
|
|
|
+}
|
|
|
+.NavLinkContent3 .sub-nav .sub-nav-item:nth-child(2){
|
|
|
+ width: 536px;
|
|
|
+ background-image: url("../images/sub-nav-05.png");
|
|
|
+}
|
|
|
+.NavLinkContent3 .sub-nav .sub-nav-item:nth-child(3){
|
|
|
+ width: 631px;
|
|
|
+ background-image: url("../images/sub-nav-06.png");
|
|
|
+}
|
|
|
+.NavLinkContent5 .sub-nav{
|
|
|
+ right: 102px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+.NavLinkContent5 .sub-nav .sub-nav-item, .NavLinkContent7 .sub-nav .sub-nav-item{
|
|
|
+ background-position: left center;
|
|
|
+ float: right;
|
|
|
+ animation: slide-right 1.5s 0s ease-in-out;
|
|
|
+}
|
|
|
+.NavLinkContent5 .sub-nav .sub-nav-item:nth-child(1){
|
|
|
+ width: 442px;
|
|
|
+ background-image: url("../images/sub-nav-07.png");
|
|
|
+}
|
|
|
+.NavLinkContent5 .sub-nav .sub-nav-item:nth-child(2){
|
|
|
+ width: 417px;
|
|
|
+ background-image: url("../images/sub-nav-08.png");
|
|
|
+}
|
|
|
+.NavLinkContent5 .sub-nav .sub-nav-item:nth-child(3){
|
|
|
+ width: 403px;
|
|
|
+ background-image: url("../images/sub-nav-09.png");
|
|
|
+}
|
|
|
+
|
|
|
+.NavLinkContent7 .sub-nav{
|
|
|
+ right: 102px;
|
|
|
+ overflow: visible;
|
|
|
+}
|
|
|
+.NavLinkContent7 .sub-nav .sub-nav-item:nth-child(1){
|
|
|
+ width: 480px;
|
|
|
+ background-image: url("../images/sub-nav-10.png");
|
|
|
+}
|
|
|
+.NavLinkContent7 .sub-nav .sub-nav-item:nth-child(2){
|
|
|
+ width: 536px;
|
|
|
+ background-image: url("../images/sub-nav-11.png");
|
|
|
+}
|
|
|
+.NavLinkContent7 .sub-nav .sub-nav-item:nth-child(3){
|
|
|
+ width: 631px;
|
|
|
+ background-image: url("../images/sub-nav-12.png");
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes slide-left{
|
|
|
+ 0%{
|
|
|
+ transform: translateX(-100%) rotateX(90deg);
|
|
|
+ }
|
|
|
+ 100%{
|
|
|
+ transform: translateX(0%) rotateX(0deg);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@keyframes slide-right{
|
|
|
+ 0%{
|
|
|
+ transform: translateX(100%) rotateX(90deg);
|
|
|
+ }
|
|
|
+ 100%{
|
|
|
+ transform: translateX(0%) rotateX(0deg);
|
|
|
+ }
|
|
|
}
|
罗浩军
