|
@@ -33,7 +33,7 @@
|
|
|
background-size: 100% 100%;
|
|
background-size: 100% 100%;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
align-items: center;
|
|
align-items: center;
|
|
|
- padding-bottom: 20px;
|
|
|
|
|
|
|
+ padding-bottom: 6px;
|
|
|
justify-content: center;
|
|
justify-content: center;
|
|
|
|
|
|
|
|
.logo {
|
|
.logo {
|
|
@@ -244,103 +244,103 @@
|
|
|
cursor: pointer;
|
|
cursor: pointer;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
- .section {
|
|
|
|
|
- position: fixed;
|
|
|
|
|
- top: 50%;
|
|
|
|
|
- left: 50%;
|
|
|
|
|
- transform: translate(-50%, -50%);
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- height: 100%;
|
|
|
|
|
- background-color: rgba(0, 0, 0, 0.5);
|
|
|
|
|
- display: flex;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- justify-content: center;
|
|
|
|
|
- z-index: 30000;
|
|
|
|
|
- .arrL {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- left: 2%;
|
|
|
|
|
- cursor: pointer;
|
|
|
|
|
- }
|
|
|
|
|
- .arrR {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- right: 2%;
|
|
|
|
|
- cursor: pointer;
|
|
|
|
|
- }
|
|
|
|
|
- .sectionBox {
|
|
|
|
|
- padding: 0 20px;
|
|
|
|
|
- width: fit-content;
|
|
|
|
|
- overflow: auto;
|
|
|
|
|
- height: 89%;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- display: flex;
|
|
|
|
|
- flex-wrap: nowrap;
|
|
|
|
|
- scroll-behavior: smooth;
|
|
|
|
|
- justify-content: center;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
- gap: 20px;
|
|
|
|
|
- ::-webkit-scrollbar {
|
|
|
|
|
- display: none; /* Chrome, Safari, Edge */
|
|
|
|
|
- }
|
|
|
|
|
- -ms-overflow-style: none; /* IE and Edge */
|
|
|
|
|
- scrollbar-width: none; /* Firefox */
|
|
|
|
|
|
|
+ // .section {
|
|
|
|
|
+ // position: fixed;
|
|
|
|
|
+ // top: 50%;
|
|
|
|
|
+ // left: 50%;
|
|
|
|
|
+ // transform: translate(-50%, -50%);
|
|
|
|
|
+ // width: 100%;
|
|
|
|
|
+ // height: 100%;
|
|
|
|
|
+ // background-color: rgba(0, 0, 0, 0.5);
|
|
|
|
|
+ // display: flex;
|
|
|
|
|
+ // align-items: center;
|
|
|
|
|
+ // justify-content: center;
|
|
|
|
|
+ // z-index: 30000;
|
|
|
|
|
+ // .arrL {
|
|
|
|
|
+ // position: absolute;
|
|
|
|
|
+ // left: 2%;
|
|
|
|
|
+ // cursor: pointer;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .arrR {
|
|
|
|
|
+ // position: absolute;
|
|
|
|
|
+ // right: 2%;
|
|
|
|
|
+ // cursor: pointer;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .sectionBox {
|
|
|
|
|
+ // padding: 0 20px;
|
|
|
|
|
+ // width: fit-content;
|
|
|
|
|
+ // overflow: auto;
|
|
|
|
|
+ // height: 89%;
|
|
|
|
|
+ // width: 100%;
|
|
|
|
|
+ // display: flex;
|
|
|
|
|
+ // flex-wrap: nowrap;
|
|
|
|
|
+ // scroll-behavior: smooth;
|
|
|
|
|
+ // justify-content: center;
|
|
|
|
|
+ // align-items: center;
|
|
|
|
|
+ // gap: 20px;
|
|
|
|
|
+ // ::-webkit-scrollbar {
|
|
|
|
|
+ // display: none; /* Chrome, Safari, Edge */
|
|
|
|
|
+ // }
|
|
|
|
|
+ // -ms-overflow-style: none; /* IE and Edge */
|
|
|
|
|
+ // scrollbar-width: none; /* Firefox */
|
|
|
|
|
|
|
|
- & > div {
|
|
|
|
|
- flex: 0 0 auto;
|
|
|
|
|
- width: 19%;
|
|
|
|
|
- height: 91%;
|
|
|
|
|
- background-size: contain;
|
|
|
|
|
- cursor: pointer;
|
|
|
|
|
- p {
|
|
|
|
|
- margin-top: 250px;
|
|
|
|
|
- padding: 38px;
|
|
|
|
|
- font-size: 13px;
|
|
|
|
|
- line-height: 21px;
|
|
|
|
|
- text-indent: 2em;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .section1 {
|
|
|
|
|
- background: url(../../assets/img/section1.png) no-repeat;
|
|
|
|
|
- background-size: 100% 100%;
|
|
|
|
|
- p {
|
|
|
|
|
- color: #000000;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .section2 {
|
|
|
|
|
- background: url(../../assets/img/section2.png) no-repeat;
|
|
|
|
|
- background-size: 100% 100%;
|
|
|
|
|
- p {
|
|
|
|
|
- color: #fff;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .section3 {
|
|
|
|
|
- background: url(../../assets/img/section3.png) no-repeat;
|
|
|
|
|
- background-size: 100% 100%;
|
|
|
|
|
- p {
|
|
|
|
|
- color: #fff;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .section4 {
|
|
|
|
|
- background: url(../../assets/img/section4.png) no-repeat;
|
|
|
|
|
- background-size: 100% 100%;
|
|
|
|
|
- p {
|
|
|
|
|
- color: #000;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .section5 {
|
|
|
|
|
- background: url(../../assets/img/section5.png) no-repeat;
|
|
|
|
|
- background-size: 100% 100%;
|
|
|
|
|
- p {
|
|
|
|
|
- color: #000;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- .sectionClose {
|
|
|
|
|
- position: fixed;
|
|
|
|
|
- top: 20px;
|
|
|
|
|
- right: 20px;
|
|
|
|
|
- cursor: pointer;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ // & > div {
|
|
|
|
|
+ // flex: 0 0 auto;
|
|
|
|
|
+ // width: 19%;
|
|
|
|
|
+ // height: 91%;
|
|
|
|
|
+ // background-size: contain;
|
|
|
|
|
+ // cursor: pointer;
|
|
|
|
|
+ // p {
|
|
|
|
|
+ // margin-top: 250px;
|
|
|
|
|
+ // padding: 38px;
|
|
|
|
|
+ // font-size: 13px;
|
|
|
|
|
+ // line-height: 21px;
|
|
|
|
|
+ // text-indent: 2em;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .section1 {
|
|
|
|
|
+ // background: url(../../assets/img/section1.png) no-repeat;
|
|
|
|
|
+ // background-size: 100% 100%;
|
|
|
|
|
+ // p {
|
|
|
|
|
+ // color: #000000;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .section2 {
|
|
|
|
|
+ // background: url(../../assets/img/section2.png) no-repeat;
|
|
|
|
|
+ // background-size: 100% 100%;
|
|
|
|
|
+ // p {
|
|
|
|
|
+ // color: #fff;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .section3 {
|
|
|
|
|
+ // background: url(../../assets/img/section3.png) no-repeat;
|
|
|
|
|
+ // background-size: 100% 100%;
|
|
|
|
|
+ // p {
|
|
|
|
|
+ // color: #fff;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .section4 {
|
|
|
|
|
+ // background: url(../../assets/img/section4.png) no-repeat;
|
|
|
|
|
+ // background-size: 100% 100%;
|
|
|
|
|
+ // p {
|
|
|
|
|
+ // color: #000;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .section5 {
|
|
|
|
|
+ // background: url(../../assets/img/section5.png) no-repeat;
|
|
|
|
|
+ // background-size: 100% 100%;
|
|
|
|
|
+ // p {
|
|
|
|
|
+ // color: #000;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
+ // .sectionClose {
|
|
|
|
|
+ // position: fixed;
|
|
|
|
|
+ // top: 20px;
|
|
|
|
|
+ // right: 20px;
|
|
|
|
|
+ // cursor: pointer;
|
|
|
|
|
+ // }
|
|
|
|
|
+ // }
|
|
|
|
|
|
|
|
// 移动端
|
|
// 移动端
|
|
|
|
|
|