.w_grid-000{ margin-left: auto; margin-right: auto; min-height: 12rem; width: 100%; } .w_grid-000 > .w_grid{ width: 100%; position: relative; } .w_grid-000 > div > .p_gridbox{ width: 100%; overflow: hidden; position: static; } .w_grid-000 > div > div > .p_gridCell{ float: left; position: static; } .w_grid-000 > div > div > .p_gridCell:not(:empty):before{ content:''; height: 0.1px; display: block; } .w_grid-000 > .w_grid.signal{ min-height: inherit; } .w_grid-000 > .w_grid.signal > .p_gridbox{ min-height: inherit; } .w_grid-000 > .w_grid.signal > .p_gridbox > .p_gridCell{ min-height: inherit; } .w_grid-000 > div > .p_gridbox > .p_gridCell:first-child{ margin-left: 0; clear: left; } #w_grid-000 > div > .p_gridbox > .p_gridCell:nth-child(n+1){ margin-left: 0; clear: left; } @media only screen and (max-width: 768px){ .w_grid-000 > div > .p_gridbox > .p_gridCell{ width: 100%; margin-left: 0; margin-top: 0rem; margin-bottom: 0rem; } } @media only screen and (min-width: 769px){ .w_grid-000 > div > .p_gridbox > .p_gridCell:first-child{ width: 100%; margin-left:0; margin-top: 0rem; margin-bottom: 0rem; } } @media only screen and (max-width: 1024px) and (min-width: 769px){ }.indexBannerBox{ position:relative; width:100%; overflow:hidden; } .indexBannerBox .swiper-container{ position:relative; } .indexBannerBox .swiper-container .swiper-wrapper{ position:relative; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide{ position:relative; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list{ position:relative; width:100%; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox{ position: relative; width:100%; overflow: hidden; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox img{ width:100%; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox .bannerPic{ display:block; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox .bannerMo{ display:none; } .indexBannerBox .bannerBtn .swiper-button-prev{ position:absolute; top: calc((100% - 1.5rem)/2); left: calc((100% - 1720px)/2); z-index:20; cursor: default; } .indexBannerBox .bannerBtn .swiper-button-prev .iconfont{ font-size: 1.5rem; color:#1c1c1c; transition:0.35s ease-in-out; } .indexBannerBox .bannerBtn .swiper-button-prev:hover .iconfont{ font-size: 1.5rem; color:#1b76b7; transition:0.35s ease-in-out; } .indexBannerBox .bannerBtn .swiper-button-prev:active .iconfont{ font-size: 1.5rem; color:#1b76b7; transition:0.35s ease-in-out; } .indexBannerBox .bannerBtn .swiper-button-next{ position:absolute; top: calc((100% - 1.5rem)/2); right: calc((100% - 1720px)/2); z-index:20; cursor: default; } .indexBannerBox .bannerBtn .swiper-button-next .iconfont{ font-size: 1.5rem; color:#1c1c1c; transition:0.35s ease-in-out; } .indexBannerBox .bannerBtn .swiper-button-next:hover .iconfont{ font-size: 1.5rem; color:#1b76b7; transition:0.35s ease-in-out; } .indexBannerBox .bannerBtn .swiper-button-next:active .iconfont{ font-size: 1.5rem; color:#1b76b7; transition:0.35s ease-in-out; } @media only screen and (max-width: 768px){ .indexBannerBox{ margin:80px auto 0; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox .bannerPic{ display:none; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox .bannerMo{ display:block; } .indexBannerBox .bannerBtn .swiper-button-prev{ left: 15px; } .indexBannerBox .bannerBtn .swiper-button-next{ right: 15px; } } @media only screen and (min-width: 769px) and (max-width: 1024px){ .indexBannerBox{ margin:80px auto 0; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox .bannerPic{ display:block; } .indexBannerBox .swiper-container .swiper-wrapper .swiper-slide .list .imgBox .bannerMo{ display:none; } .indexBannerBox .bannerBtn .swiper-button-prev{ left: 15px; } .indexBannerBox .bannerBtn .swiper-button-next{ right: 15px; } } @media only screen and (min-width: 1025px) and (max-width:1720px){ .indexBannerBox .bannerBtn .swiper-button-prev{ left: 15px; } .indexBannerBox .bannerBtn .swiper-button-next{ right: 15px; } }.productNavBox{ position:relative; width:100%; margin: 5rem 0; overflow:hidden; } .productNavBox .topTitleBox{ position:relative; margin: 0 0 2.5rem 0; } .productNavBox .topTitleBox h1{ font-size:2rem; font-weight:bold; color:#1b76b7; letter-spacing: 1px; } .productNavBox .mNavIconBox{ display:none; } .productNavBox .mNavIconBox .iconfont:hover{ color: #1b76b7; transition: 0.35s ease-in-out; } .productNavBox .mNavIconBox .iconfont:acitve{ color: #1b76b7; transition: 0.35s ease-in-out; } .productNavBox .mNavClose{ display:none; } .productNavBox .mNavClose:hover{ background: rgba(27,118,183,0.8); } .productNavBox .mNavClose:active{ background: rgba(27,118,183,0.8); } .productNavBox .navListBox{ position: relative; padding:0 0 0 10%; border-left: 1px solid transparent; } .productNavBox .navListBox .navLine{ position:absolute; top:0; left:0; width:1px; height:100%; background:#1b76b7; } .productNavBox .navListBox .navBox{ position:relative; } .productNavBox .navListBox .navBox .nav{ position:relative; width:100%; } .productNavBox .navListBox .navBox .nav:nth-last-child(1) h2{ margin:0; } .productNavBox .navListBox .navBox .nav h2{ width: 90%; margin: 0 0 1.5rem 0; font-size:1rem; color:#666666; letter-spacing: 0; transition: 0.35s ease-in-out; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .productNavBox .navListBox .navBox .nav:hover h2{ color:#1b76b7; transition:0.35s ease-in-out; } .pnavOpen{ transform: translateX(0%) !important; transition:0.35s ease-in-out; } .pnavClose{ transform: translateX(100%) !important; transition:0.35s ease-in-out; } .pClose{ transform: translateX(-100%) !important; transition:0.35s ease-in-out; } @media only screen and (max-width: 768px){ .productNavBox{ margin: 2rem auto 1rem; } .productNavBox .topTitleBox{ margin: 0; } .productNavBox .topTitleBox h1{ font-size: 1.5rem; letter-spacing: 0; } .productNavBox .mNavIconBox{ display:block; position:absolute; top:0; right:0; } .productNavBox .mNavClose{ display:block; text-align:center; position:fixed; top:80px; left:0; width: 10vw; height:100vh; transform: translateX(-100%); background: rgba(51,51,51,0.8); z-index: 40; } .productNavBox .mNavClose .icon-close{ display: inline-block; position:absolute; top: 1.15rem; left: calc((100% - 1rem)/2); width: 1rem; height: 1rem; font-size: 1rem; color:#fff; } .productNavBox .navListBox{ display:block; position:fixed; top:80px; right: 0; width: 90vw; height:100vh; padding: 0 15px; background:rgba(51,51,51,1); transform: translateX(100%); transition:0.35s ease-in-out; z-index: 40; } .productNavBox .navListBox .navLine{ display:none; } .productNavBox .navListBox .navBox .nav h2{ width: 100%; margin:0; font-size:0.875rem; color:#fff; line-height:50px; border-bottom: 1px solid rgba(255,255,255,0.1); } } @media only screen and (min-width: 769px) and (max-width:1024px){ .productNavBox{ margin:2rem 0; } .productNavBox .topTitleBox{ margin:0 0 1.5rem 0; } .productNavBox .topTitleBox h1{ font-size: 1.4rem; letter-spacing: 0; } .productNavBox .navListBox .navBox .nav h2{ font-size:0.875rem; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .productNavBox{ margin:2rem 0; } .productNavBox .topTitleBox h1{ font-size: 1.4rem; letter-spacing: 0; } .productNavBox .navListBox .navBox .nav h2{ font-size:0.875rem; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .productNavBox{ margin:2rem 0; } .productNavBox .topTitleBox h1{ font-size: 1.4rem; letter-spacing: 0; } } /* animation */ .pNavLine{ animation:pNavLine 4s ease-in-out; } @keyframes pNavLine{ 0% {height:0;opacity:0;background:#000;} 100% {height:100%} } @-webkit-keyframes pNavLine{ 0% {height:0;opacity:1;background:#1b76b7;} 100% {height:100%} } .productList_box{ width: 100%; margin: 5rem 0 3.5rem; overflow: hidden; cursor: default; } .productList_box .topTitleBox{ position:relative; width:100%; margin:0 0 4.5rem 0; } .productList_box .topTitleBox .listLine{ position:absolute; top:6px; left:0; width: 88%; height:1px; background:#b4babe; } .productList_box .topTitleBox:after{ display: none; position:absolute; top:6px; right:0; width:4%; height:1px; background:#b4babe; content:" "; } .productList_box .topTitleBox span{ margin: 0; font-size: 2rem; font-weight: bold; color: #1b76b7; letter-spacing: 1px; float:right; } .productList_box .topTitleBox .more{ display:block; position: absolute; top: 1.2rem; margin: 0; font-size:1rem; letter-spacing: 0; color:#bfbfbf; transition:0.35s ease-in-out; } .productList_box .topTitleBox .more:hover{ color:#1b76b7; transition:0.35s ease-in-out; } .productList_box .topTitleBox .more:active{ color:#1b76b7; transition:0.35s ease-in-out; } .productList_box .productList{ width: 100%; } .productList_box .productList .listBox{ display: block; position: relative; width: 102%; } .productList_box .productList .listBox .list{ width: calc(92%/4); margin:0 2% 2% 0; border: 1px solid transparent; box-shadow: 0 0 20px rgb(51 51 51 / 20%); float:left; } .productList_box .productList .listBox .list:hover{ border:1px solid #2b5ae0; } .productList_box .productList .listBox .list:hover h2{ color:#1b76b7!important; } .productList_box .productList .listBox .list:hover .imgbox img{ transform: scale(1.1); transition:0.35s ease-in-out; } .productList_box .productList .listBox .list .imgbox{ width:100%; height:auto; border:1px solid rgba(51,51,51,0.2); overflow:hidden; } .productList_box .productList .listBox .list .imgbox img{ width:100%; transform: scale(1); transition:0.35s ease-in-out; } .productList_box .productList .listBox .list .title{ height:auto; } .productList_box .productList .listBox .list .title h2{ text-align:center; width: 100%; padding: 0 10px; font-size:16px; color:#333; line-height:48px; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .productList_box .pageNum_box{ height:auto; } .productList_box .pageNum{ margin:0 4px; } .productList_box .pageNum:hover{ background:#2b5ae0; border:1px solid #2b5ae0; } .productList_box .pageNum.active{ background:#2b5ae0; border:1px solid #2b5ae0; } .productList_box .pageNum_box .pre,.productList_box .pageNum_box .next{ color:#1c1c1c; border: none; } .productList_box .pageNum_box .pre:hover,.productList_box .pageNum_box .next:hover{ color:#2b5ae0; background:none; border: none; } .productList_box .pageNum_box .pre:hover .iconfont,.productList_box .pageNum_box .next:hover .iconfont{ color:#2b5ae0; } @media only screen and (max-width:768px){ .productList_box{ margin: 0; } .productList_box .topTitleBox{ display:none; transition:0.35s ease-in-out; } .productList_box .productList .listBox{ width:103%; transition:0.35s ease-in-out; } .productList_box .productList .listBox .list{ width: calc(94%/2); margin: 0 3% 3% 0; } .productList_box .productList .listBox .list .title h2{ font-size:0.875rem; line-height: 2.2; } .productList_box .pageNum_box .pre .font, .productList_box .pageNum_box .next .font{ font-size:14px; } .productList_box .pageNum_box .NumBox{ height:36px; border-radius:6px; } .productList_box .pageNum_box .NumBox .num{ font-size:16px; } .productList_box .ItemBox{ bottom: 34px; } .productList_box .pageNum_box .jump .jumpInput{ font-size:14px; height: 36px; line-height: 36px; } .productList_box .pageNum_box .jump .jumpInput::-webkit-input-placeholder{ font-size:14px; } } @media only screen and (min-width:769px) and (max-width:1024px){ .productList_box{ margin:2rem auto; padding: 0 0 0 0; } .productList_box .topTitleBox .listLine{ display:none; } .productList_box .topTitleBox span{ margin: 0; font-size: 1.4rem; transition:0.35s ease-in-out; } .productList_box .topTitleBox .more{ top:0; transition:0.35s ease-in-out; } .productList_box .topTitleBox:after{ display:none; } .productList_box .productList .listBox .list .title h2{ font-size: 0.875rem; line-height:2.2; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .productList_box{ margin:2rem auto; padding:0 0 0 4%; } .productList_box .topTitleBox span{ margin: 0; font-size: 1.4rem; transition:0.35s ease-in-out; } .productList_box .topTitleBox:after{ display:none; } .productList_box .productList .listBox .list .title h2{ font-size: 1rem; line-height:2.2; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .productList_box{ margin:2rem auto; padding:0 0 0 4%; } .productList_box .topTitleBox span{ margin: 0; font-size: 1.4rem; transition:0.35s ease-in-out; } .productList_box .topTitleBox:after{ display:none; } } @media only screen and (min-width:1367px) and (max-width:1440px){ .productList_box .topTitleBox .listLine{ top:6px; } .productList_box .topTitleBox span{ margin: 0; font-size: 2rem; transition:0.35s ease-in-out; } } @media only screen and (min-width:1441px) and (max-width:1680px){ .productList_box .topTitleBox .listLine{ top:6px; } .productList_box .topTitleBox span{ margin: 0; font-size: 2rem; transition:0.35s ease-in-out; } } .pNavListLine{ animation:pNavListLine 8s ease-in-out; } @keyframes pNavListLine{ 0% {width:0;opacity:0;background:#000;} 100% {width:88%} } @-webkit-keyframes pNavListLine{ 0% {width:0;opacity:1;background:#1b76b7;} 100% {widht:88%} }.newsList_box{ position: relative; margin: 0 0 1rem 0; padding: 0 15px; overflow: hidden; } .newsList_box .topTitleBpx{ position:relative; text-align:center; margin:0 0 3.75rem 0; } .newsList_box .topTitleBpx .leftLine{ position:absolute; top:6px; left:0; width:44%; height:1px; background: #b4babe; } .newsList_box .topTitleBpx span{ font-size: 2rem; font-weight: bold; color: #1b76b7; letter-spacing: 1px; } .newsList_box .topTitleBpx .rightLine{ position:absolute; top:6px; right:0; width:44%; height:1px; background: #b4babe; } .newsList_box .newsList{ width: 102%; } .newsList_box .newsList .list{ width:calc(92%/4); margin: 0 2% 2% 0; float:left; } .newsList_box .newsList .list:hover .imgbox img{ transform: scale(1.05); transition: 0.35s ease-in-out; } .newsList_box .newsList .list:hover .titlebox h2{ color:#1b76b7; transition: 0.35s ease-in-out; } .newsList_box .newsList .list .assistbox{ margin: 1rem 0 0 0; } .newsList_box .newsList .list .assistbox .time h6{ font-size:14px; color: #bfbfbf; } .newsList_box .newsList .list .imgbox{ width:100%; height:auto; max-height: 514px; border: 1px solid #bfbfbf; box-shadow: 1px 2px 4px rgba(51,51,51,0.2); overflow:hidden; } .newsList_box .newsList .list .imgbox img{ width:100%; transform: scale(1); transition: 0.35s ease-in-out; } .newsList_box .newsList .list .titlebox{ margin:12px 0 0 0; } .newsList_box .newsList .list .titlebox h2{ width: 100%; margin:12px 0 0 0; font-size: 1.125rem; font-weight:400; color: #1c1c1c; transition: 0.35s ease-in-out; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .newsList_box .newsList .list .summarybox{ margin:12px 0 0 0; } .newsList_box .newsList .list .summarybox .p_summary{ font-size:14px; color: #666; line-height:24px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .newsList_box .pageNum_box{ height:auto; } .newsList_box .pageNum{ margin:0 4px; } .newsList_box .pageNum:hover{ background:#1b76b7; border:1px solid #1b76b7; } .newsList_box .pageNum.active{ background:#1b76b7; border:1px solid #1b76b7; } .newsList_box .pageNum_box .pre,.newsList_box .pageNum_box .next{ color:#1c1c1c; border: none; } .newsList_box .pageNum_box .pre:hover,.newsList_box .pageNum_box .next:hover{ color:#1b76b7; background:none; border: none; } .newsList_box .pageNum_box .pre:hover .iconfont,.newsList_box .pageNum_box .next:hover .iconfont{ color:#1b76b7; } @media only screen and (max-width:768px){ .newsList_box{ margin: 1rem 0 0.5rem; padding: 0 15px; } .newsList_box .topTitleBpx{ text-align:left; margin: 0 0 2rem 0; } .newsList_box .topTitleBpx span{ font-size:1.5rem; } .newsList_box .topTitleBpx .leftLine{ display:none; transition:0.35s ease-in-out; } .newsList_box .topTitleBpx .rightLine{ display:none; transition:0.35s ease-in-out; } .newsList_box .newsList{ width: 103%; } .newsList_box .newsList .list{ width: calc(94%/2); margin: 0 3% 4% 0; } .newsList_box .newsList .list .assistbox{ margin: 0.5rem 0 0 0; } .newsList_box .p_pagebox .pre, .newsList_box .p_pagebox .next{ background:transparent; } .newsList_box .p_pagebox .pre .font, .newsList_box .p_pagebox .next .font{ font-size:14px; color:#999; } .newsList_box .p_pagebox .pre .font:hover, .newsList_box .p_pagebox .next .font:hover{ color:#1b76b7; } .newsList_box .p_pagebox .pre .font:active, .newsList_box .p_pagebox .next .font:acitve{ color:#1b76b7; } .newsList_box .p_pagebox .pre .font .iconfont, .newsList_box .p_pagebox .next .font .iconfont{ color:#999; } .newsList_box .p_pagebox .pre .font .iconfont:hover, .newsList_box .p_pagebox .next .font .iconfont:hover{ color:#1b76b7; } .newsList_box .p_pagebox .pre .font .iconfont:active, .newsList_box .p_pagebox .next .font .iconfont:active{ color:#1b76b7; } .newsList_box .p_pagebox .NumBox{ height:36px; border-radius:6px; } .newsList_box .p_pagebox .NumBox .num{ font-size:16px; } .newsList_box .ItemBox{ bottom: 34px; } .newsList_box .p_pagebox .jump .jumpInput{ font-size:14px; height: 36px; line-height: 36px; } .newsList_box .p_pagebox .jump .jumpInput::-webkit-input-placeholder{ font-size:14px; } } @media only screen and (min-width:769px) and (max-width:1024px){ .newsList_box{ padding:0 15px; } .newsList_box .topTitleBpx{ margin:0 0 1.5rem 0; } .newsList_box .topTitleBpx .leftLine{ display:none; } .newsList_box .topTitleBpx .rightLine{ display:none; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .newsList_box{ padding:0 15px; } .newsList_box .topTitleBpx{ margin:0 0 1.5rem 0; } .newsList_box .topTitleBpx .leftLine{ display:none; } .newsList_box .topTitleBpx .rightLine{ display:none; } } /* animation */ .nTLeftLine{ animation:nTLeftLine 4s ease-in-out; } @keyframes nTLeftLine{ 0% {width:0;opacity:0;left:0;} 100% {width:44%;opacity:1;left:0;} } @-webkit-keyframes nTLeftLine{ 0% {width:0;opacity:0;left:0;} 100% {width:44%;opacity:1;left:0;} } .nTRightLine{ animation:nTRightLine 4s ease-in-out; } @keyframes nTRightLine{ 0% {width:0;opacity:0;right:0;} 100% {width:44%;opacity:1;right:0;} } @-webkit-keyframes nTRightLine{ 0% {width:0;opacity:0;right:0;} 100% {width:44%;opacity:1;right:0;} }.searchBox{ display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(35,118,176,0.9); cursor:default; z-index: 9999; } .searchBox .icon-close{ position:absolute; top: 50px; right: calc((100% - 1685px)/2); height: 30px; font-size:16px; color:#fff; } .searchBox .icon-close:before{ padding:0 6px 0 0; } .searchBox .serchBorder{ position: absolute; top: 32%; left: 20%; width: 60%; margin: 0 auto; padding:10px; height: 58px; background:#fff; border-radius:6px; } .searchBox .serchBorder .lefTitle{ display: block; text-align: center; width: 10%; font-size: 22px; line-height: 38px; color: #1c1c1c; float:left; border-right: 1px solid #d9d9d9; } .searchBox .serchBorder .InputText{ width: 85%; height: 38px; border:none; padding:0 10px; font-size:14px; } .searchBox .serchBorder .InputText::placeholder{ font-size:16px; } .searchBox .serchBorder .p_searchBtn{ position:relative; text-align: center; width: 4%; margin: 5px 0; height: 28px; float:right; } .searchBox .serchBorder .p_searchBtn .icon-search{ margin: 5px auto; font-size: 26px; color: #333; ransition:0.35s ease-in-out; } .searchBox .serchBorder .p_searchBtn:hover .icon-search{ color: #017cc2; transition:0.35s ease-in-out; } .searchBox .serchBorder .p_searchBtn:active .icon-search{ color: #017cc2; transition:0.35s ease-in-out; } @media only screen and (max-width:768px){ .searchBox .icon-close{ top: 32px; right: 15px; } .searchBox .serchBorder{ left: 10%; width: 80%; } .p_searchBtn{ position: absolute !important; top: 10px; right: 10px; } } @media only screen and (min-width:769px) and (max-width:1024px){ .searchBox .icon-close{ top: 32px; right: 15px; } .searchBox .serchBorder{ left: 10%; width: 80%; } .p_searchBtn{ position: absolute !important; top: 10px; right: 10px; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .searchBox .icon-close{ right: 15px; } .searchBox .serchBorder{ left: 10%; width: 80%; } .p_searchBtn{ position: absolute !important; top: 10px; right: 10px; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .searchBox .icon-close{ right: 15px; } .p_searchBtn{ position: absolute !important; top: 10px; right: 10px; } } @media only screen and (min-width:1367px) and (max-width:1440px){ .searchBox .icon-close{ right: 15px; } .p_searchBtn{ position: absolute !important; top: 10px; right: 10px; } } @media only screen and (min-width:1441px) and (max-width:1680px){ .searchBox .icon-close{ right: 15px; } .p_searchBtn{ position: absolute !important; top: 10px; right: 10px; } } @media only screen and (min-width:1681px) and (max-width:1720px){ .searchBox .icon-close{ right: 15px; } .p_searchBtn{ position: absolute !important; top: 10px; right: 10px; } }/*e_SideMajorStyleBox-001*/ .e_SideMajorStyleBox-001{ /* position: absolute;*/ width: 100%; height: auto; width-uint:%; } /*stylebox_link*/ .e_SideMajorStyleBox-001 .stylebox_link{ color: #666666; font-size: 14px; display: table; height: inherit; border-width: 0; float: right; vertical-align: middle; margin-right: 15px; } .e_SideMajorStyleBox-001 .stylebox_top{ width: auto; height: 40px; background-color: rgba(101, 190, 186, 1); } .e_SideMajorStyleBox-001 .title_icon{ display: inline-block; vertical-align: middle; line-height: 40px; color: rgba(255,255,255,1); margin-right: 10px; font-size: medium; } .e_SideMajorStyleBox-001 .title_icon::before{ content: ""; } .e_SideMajorStyleBox-001 .title_main{ display: inline-block; vertical-align: middle; line-height: 40px; color: rgba(255,255,255,1); font-weight: normal; font-size: 16px; max-width: 600px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .e_SideMajorStyleBox-001 .title_sub{ display: inline-block; vertical-align: middle; line-height: 40px; color: rgba(255,255,255,1); font-size: 14px; font-weight: normal; margin-left: 10px; } .e_SideMajorStyleBox-001 .stylebox_title{ display: inline-block; width: auto; height: inherit; background-color: rgba(101, 190, 186, 1); padding-left: 15px; padding-right: 15px; font-size: 0; vertical-align: bottom; white-space: nowrap; } .e_SideMajorStyleBox-001 .stylebox_link a{ color: inherit; display: table-cell; vertical-align: middle; } .e_SideMajorStyleBox-001 .link_icon{ display: inline-block; margin-left: 5px; } .e_SideMajorStyleBox-001 .link_icon::before{ content: '\e6af'; } .e_SideMajorStyleBox-001 .stylebox_top_line{ height: 1px; background-color: rgba(240,240,240,1); } .e_SideMajorStyleBox-001 .stylebox_content { border-style: solid; border-width: 1px; border-color: #f0f0f0; width: 100%; width-uint:%; } .e_SideMajorStyleBox-001 .stylebox_bottom_line{ height: 1px; background-color: rgba(240,240,240,1); }.onLineBox{ display: block; text-align: right; position: fixed; top: calc((100vh - 130px) /2); right: 0; width: 40px; height: 140px; overflow:hidden; z-index: 200; cursor: default; } .onLineBox .iconBox{ display: inline-block; position: relative; right: 0; width:40px; height:auto; box-shadow:0 0 10px rgba(51,51,51,0.2); float: right; z-index: 20; } .onLineBox .iconBox .topTitle{ display:block; position: relative; text-align:center; font-size:0.9rem; color:#fff; line-height:1.6; background: #1b76b7; z-index: 20; } .onLineBox .iconBox .iconfont{ display: block !important; position: relative; text-align: center; width: 40px !important; height: 40px !important; margin:0.2rem auto 0; background:#e1e1e1; z-index: 20; } .onLineBox .iconBox .iconfont:before{ display:inline-block; text-align:center; line-height: 40px; } .onLineBox .iconBox .icon-down{ display:none !important; } .onLineBox .fixCotnetBox{ display: block; position: absolute; top: -48px; right: 50px; text-align: center; width: 240px; height: auto; margin: 0 6px 0 0; padding: 10px; background: rgba(255,255,255,0.9); border: 1px solid transparent; transform: translateX(200%); opacity: 1; transition: 0.35s ease-in-out; float: right; z-index: 10; } .onLineBox .fixCotnetBox .title{ display: block; text-align: center; width:100%; margin: 0 0 0.5rem 0; font-size: 1rem; color: #fff; line-height: 2.2; background: rgba(61, 151, 204, 1); } .onLineBox .fixCotnetBox .qqBox{ position: relative; border-bottom: 1px solid #efefef; } .onLineBox .fixCotnetBox .qqBox .name{ margin: 0 0.5rem 0 0; font-size: 0.9rem; color:#1c1c1c; line-height: 2; } .onLineBox .fixCotnetBox .qqBox a{ padding:6px; color:#fff; background: #1b76b7; border-radius:6px; } .onLineBox .fixCotnetBox .qqBox a:hover{ background:#333; transition:0.35s ease-in-out; } .onLineBox .fixCotnetBox .qqBox a:active{ background:#333; transition:0.35s ease-in-out; } .onLineBox .fixCotnetBox .qqBox .iconfont{ display: inline-block !important; width: auto !important; font-size: 0.9rem; color: #fff; transition:0.35s ease-in-out; background: transparent; } .onLineBox .fixCotnetBox .qqBox .iconfont:hover{ color: #fff; transition:0.35s ease-in-out; } .onLineBox .fixCotnetBox .qqBox .iconfont:active{ color: #fff; transition:0.35s ease-in-out; } .onLineBox .fixCotnetBox .qqBox .iconfont:before{ margin: 0 0.25rem 0 0; line-height: 2; } .onLineBox .fixCotnetBox .wechatCodeBox{ position:relative; width:100%; padding: 0 10px 10px; border-bottom: 1px #efefef solid; } .onLineBox .fixCotnetBox .wechatCodeBox img{ width:100%; } .onLineBox .fixCotnetBox .wechatCodeBox span{ font-size: 0.9rem; color:#1c1c1c; } .onLineBox .fixCotnetBox .emailBox{ position:relative; border-bottom: 1px #efefef solid; } .onLineBox .fixCotnetBox .emailBox span{ font-size: 0.9rem; color:#1c1c1c; line-height: 3; } .onLineBox .fixCotnetBox .emailBox a{ font-size: 0.9rem; color:#1c1c1c; line-height: 3; } .onLineBox .fixCotnetBox .emailBox a:hover{ color: rgba(61, 151, 204, 1); transition:0.35s ease-in-out; } .onLineBox .fixCotnetBox .emailBox a:active{ color: rgba(61, 151, 204, 1); transition:0.35s ease-in-out; } .onLineBox .fixCotnetBox .workTimeBox{ position:relative; } .onLineBox .fixCotnetBox .workTimeBox span{ font-size:0.9rem; color: #666; line-height:2; } .onLineBox .fixCotnetBox .workTimeBox span:nth-child(3){ display:block; } @media only screen and (max-width: 768px){ .onLineBox{ display:none; } } @media only screen and (min-width: 769px) and (max-width:1024px){ .onLineBox{ display:none; } }.indexSupportBox{ position: relative; margin: 4.5rem auto; padding: 0; overflow: hidden; cursor: default; } .indexSupportBox .topTitle{ position:relative; margin:0 0 3.4rem 0; } .indexSupportBox .topTitle span{ font-size:2rem; font-weight:bold; color:#1b76b7; letter-spacing: 1px; } .indexSupportBox .downloadPic{ display: block; position:relative; width:100%; margin:0 0 2rem 0; } .indexSupportBox .downloadPic img{ width:100%; } .indexSupportBox .indexSupportListBox{ position:relative; } .indexSupportBox .indexSupportListBox li{ position:relative; } .indexSupportBox .indexSupportListBox li h2{ width: 100%; margin: 0 0 1rem 0; font-size:1rem; color:#333; line-height: 1.2; transition: 0.35s ease-in-out; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .indexSupportBox .indexSupportListBox li h2 .iconfont{ display:none; font-size:0.875rem; color:#bfbfbf; transition:0.35s ease-in-out; } .indexSupportBox .indexSupportListBox li:hover h2 .iconfont{ display:inline-block; transition:0.35s ease-in-out; } .indexSupportBox .indexSupportListBox li h2 .iconfont:before{ margin:0 0.5rem 0 0; color:#2e7fb9; transition:0.35s ease-in-out; } .indexSupportBox .indexSupportListBox li:hover h2{ color:#2e7fb9; transition:0.35s ease-in-out; } @media only screen and (max-width:768px){ .indexSupportBox{ margin:2rem auto 1rem; } .indexSupportBox .topTitle{ margin:0 0 1rem 0; } .indexSupportBox .topTitle span{ font-size: 1.5rem; } .indexSupportBox .downloadPic{ margin:0 0 1rem 0; } .indexSupportBox .indexSupportListBox li h2{ margin: 0 0 1rem 0; padding: 0 0 1rem 0; font-size: 1rem; border-bottom: 1px solid #e3e3e3; } } @media only screen and (min-width:769px) and (max-width:1024px){ .indexSupportBox{ margin:2rem auto 0rem; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .indexSupportBox{ margin:2rem auto 0rem; } } .indexSolutionBox{ position: relative; margin: 4.5rem auto; overflow: hidden; cursor: default; } .indexSolutionBox .solutionNavLine{ position:absolute; top: calc(100% - 13rem); left: 6%; bottom:0; width: 1px; background: #b4babe; z-index:2; } .indexSolutionBox .topTitle{ position:relative; width:100%; text-align:right; font-size: 2rem; font-weight: bold; color: #1b76b7; letter-spacing: 1px; z-index:1; } .indexSolutionBox .topTitle .listLine{ position:absolute; top:6px; left:0; width:88%; height:1px; background:#b4babe; content:" "; z-index:2; } .indexSolutionBox .topTitle .more{ display:block; position: absolute; top: 1.2rem; margin: 0; font-size:1rem; font-weight: normal; letter-spacing: 0; color:#bfbfbf; transition:0.35s ease-in-out; } .indexSolutionBox .topTitle .more:hover{ color:#1b76b7; transition:0.35s ease-in-out; } .indexSolutionBox .topTitle .more:active{ color:#1b76b7; transition:0.35s ease-in-out; } .indexSolutionBox .indexSolutionListBox{ position: relative; width: 100%; height: 100%; margin: 3.4rem 0 0 0; padding: 0 0 0 6%; float:left; } .indexSolutionBox .indexSolutionListBox li{ position:relative; width:100%; } .indexSolutionBox .indexSolutionListBox li .navList{ width:20%; float:left; } .indexSolutionBox .indexSolutionListBox li .navList h2{ width: 90%; margin: 0 0 1.5rem 0; font-size: 1rem; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .indexSolutionBox .indexSolutionListBox li .navList h2 .iconfont{ display:none; transition:0.35s ease-in-out; } .indexSolutionBox .indexSolutionListBox li:hover .navList h2 .iconfont{ display:inline-block; transition:0.35s ease-in-out; } .indexSolutionBox .indexSolutionListBox li:hover .navList h2 .iconfont:before{ margin:0 0.25rem 0 0; color:#1b76b7; transition:0.35s ease-in-out; } .indexSolutionBox .indexSolutionListBox li .navList .src{ display:none; } .indexSolutionBox .indexSolutionListBox li .navList .summary{ display:none; } .indexSolutionBox .indexSolutionListBox li .contentBox{ position:relative; width:80%; float:right; z-index:1; } .indexSolutionBox .indexSolutionListBox li:nth-child(n+2) .contentBox{ display:none; } .indexSolutionBox .indexSolutionListBox li .contentBox .title{ text-align:right; margin: 0 0 1rem 0; } .indexSolutionBox .indexSolutionListBox li .contentBox .title h2{ font-size:1.5rem; color:#1c1c1c; } .indexSolutionBox .indexSolutionListBox li .contentBox .imgBox{ width: 100%; } .indexSolutionBox .indexSolutionListBox li .contentBox .imgBox img{ width:100%; min-height: 410px; border: 1px solid #e3e3e3; } .indexSolutionBox .indexSolutionListBox li .contentBox .content{ position:absolute; top: 6rem; left: 2rem; width: calc(100% - 4rem); height: calc(100% - 8rem); padding: 4rem 2rem; background: rgba(255,255,255,0.9); z-index:3; } .indexSolutionBox .indexSolutionListBox li .contentBox .content p{ font-size:1rem; color:#1c1c1c; line-height:2; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; overflow: hidden; } @media only screen and (max-width:768px){ .indexSolutionBox{ margin: 0 auto; padding: 0; } .indexSolutionBox .solutionNavLine{ display:none; } .indexSolutionBox .topTitle{ text-align:left; } .indexSolutionBox .topTitle span{ font-size:1.5rem; } .indexSolutionBox .topTitle .listLine{ display:none; } .indexSolutionBox .topTitle .more{ display:none; } .indexSolutionBox .indexSolutionListBox li .contentBox{ display:none; } .indexSolutionBox .indexSolutionListBox{ margin: 1.5rem 0 0 0; padding: 0; } .indexSolutionBox .indexSolutionListBox li .navList{ width:100%; } .indexSolutionBox .indexSolutionListBox li .navList h2{ padding:0 0 1rem 0; font-size:1rem; color:#1c1c1c; line-height:1.2; border-bottom:1px solid #e3e3e3; } } @media only screen and (min-width:769px) and (max-width:1024px){ .indexSolutionBox{ margin:2rem auto 2rem; } .indexSolutionBox .topTitle .listLine{ display:none; } .indexSolutionBox .topTitle .more{ top:0; left:6%; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .indexSolutionBox{ margin:2rem auto 2rem; } .indexSolutionBox .topTitle .listLine{ display:none; } .indexSolutionBox .topTitle .more{ top:0; left:6%; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .indexSolutionBox .topTitle .listLine{ display:none; } .indexSolutionBox .topTitle .more{ top:0; left:6%; } } .ntitleListLine{ animation:ntitleListLine 8s ease-in-out; } @keyframes ntitleListLine{ 0% {width:0;opacity:0;background:#000;} 100% {width:88%} } @-webkit-keyframes ntitleListLine{ 0% {width:0;opacity:1;background:#1b76b7;} 100% {widht:88%} } .nNavListLine{ animation:nNavListLine 8s ease-in-out; } @keyframes nNavListLine{ 0% {top:0;} 100% {top: calc(100% - 13rem);} } @-webkit-keyframes nNavListLine{ 0% {top:0;} 100% {top: calc(100% - 13rem);} }/*e_FlowCommonStyleBox-001*/ .e_FlowCommonStyleBox-001{ /* position: absolute;*/ width: 100%; height: auto; width-uint:%; } /*stylebox_link*/ .e_FlowCommonStyleBox-001 .stylebox_link{ color: #666666; font-size: 14px; display: table; height: inherit; border-width: 0; float: right; vertical-align: middle; margin-right: 15px; } .e_FlowCommonStyleBox-001 .stylebox_link:hover{ color: rgba(101,190,186,1); } .e_FlowCommonStyleBox-001 .stylebox_link:active{ color: rgba(101,190,186,1); } .e_FlowCommonStyleBox-001 .stylebox_top{ width: auto; height: 40px; background-color: #1890FF; } .e_FlowCommonStyleBox-001 .title_icon{ display: inline-block; vertical-align: middle; line-height: 40px; color: rgba(255,255,255,1); margin-right: 10px; font-size: medium; } .e_FlowCommonStyleBox-001 .title_icon::before{ content: ""; } .e_FlowCommonStyleBox-001 .title_main{ display: inline-block; vertical-align: middle; line-height: 40px; color: rgba(255,255,255,1); font-weight: normal; font-size: 16px; max-width: 600px; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; } .e_FlowCommonStyleBox-001 .title_sub{ display: inline-block; vertical-align: middle; line-height: 40px; color: rgba(255,255,255,1); font-size: 14px; font-weight: normal; margin-left: 10px; } .e_FlowCommonStyleBox-001 .stylebox_title{ display: inline-block; width: auto; height: inherit; background-color: #1890FF; padding-left: 15px; padding-right: 15px; font-size: 0; vertical-align: bottom; white-space: nowrap; } .e_FlowCommonStyleBox-001 .stylebox_link a{ color: inherit; display: table-cell; vertical-align: middle; } .e_FlowCommonStyleBox-001 .link_icon{ display: inline-block; margin-left: 5px; } .e_FlowCommonStyleBox-001 .link_icon::before{ content: '\e6af'; } .e_FlowCommonStyleBox-001 .stylebox_top_line{ height: 1px; background-color: rgba(240,240,240,1); } .e_FlowCommonStyleBox-001 .stylebox_content { border-style: solid; border-width: 1px; border-color: #f0f0f0; width: 100%; width-uint:%; } .e_FlowCommonStyleBox-001 .stylebox_bottom_line{ height: 1px; background-color: rgba(240,240,240,1); }.footerBox{ position: relative; width:100%; background: url(/repository/image/559d3db0-c95b-47ec-adca-45b138fefcbd.jpg?t=1615432661119); background-size: cover; overflow:hidden; cursor:default; } .footerBox .footer{ position: relative; width:1720px; margin:0 auto; padding: 32px 15px; } .footerBox .footer .leftLogoBox{ width:26%; float:left; } .footerBox .footer .leftLogoBox .logo{ width: 340px; height: 50px; margin: 0 0 32px 0; } .footerBox .footer .leftLogoBox .logo img{ width:100%; } .footerBox .footer .leftLogoBox .infoBox{ position:relative; margin: 0 0 1.5rem 0; } .footerBox .footer .leftLogoBox .infoBox span{ display:block; font-size:0.875rem; color:#fff; line-height:2; } .footerBox .footer .leftLogoBox .infoBox span a{ color:#fff; } .footerBox .footer .rightNavBox{ text-align:right; width:74%; float:right; } .footerBox .footer .rightNavBox .navBox{ list-style:none; } .footerBox .footer .rightNavBox .navBox .nav{ width:calc(100%/5); float:left; } .footerBox .footer .rightNavBox .navBox .nav:nth-child(1){ display:none; } .footerBox .footer .rightNavBox .navBox .nav:nth-last-child(2){ display:none; } .footerBox .footer .rightNavBox .navBox .nav:nth-last-child(3){ display:none; } .footerBox .footer .rightNavBox .navBox .nav h2{ font-size:1rem; color:#fff; line-height:2.2; } .footerBox .footer .rightNavBox .navBox .nav .childBox{ position:relative; list-style:none; margin:0; padding:0; } .footerBox .footer .rightNavBox .navBox .nav:nth-child(3) .childBox li:nth-child(n+5){ display:none; } .footerBox .footer .rightNavBox .navBox .nav:nth-child(3) .childBox li:nth-last-child(1){ display:block; } .footerBox .footer .rightNavBox .navBox .nav .childBox li h2{ width: 100%; padding: 0 0 0 1rem; font-size:0.875rem; color:#fff; transition:0.35s ease-in-out; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .footerBox .footer .rightNavBox .navBox .nav .childBox li h2:hover{ color:#fff; transition:0.35s ease-in-out; } .footerBox .copyRightBox{ position:relative; width:100%; background: rgba(30,27,27,0.3); cursor:default; float:left; } .footerBox .copyRight{ width:1720px; margin:0 auto; padding:0 15px; } .footerBox .copyRight .left{ text-align:left; line-height:50px; float:left; } .footerBox .copyRight .left span{ font-size: 12px; color: #fff; } .footerBox .copyRight .right{ text-align:right; line-height:50px; float:right; } .footerBox .copyRight .right span{ font-size: 12px; color: #fff; } .footerBox .copyRight .right span a{ color: #fff; transition:0.35s ease-in-out; } .footerBox .copyRight .right span a:hover{ color:#fff; transition:0.35s ease-in-out; } @media only screen and (max-width: 768px){ .footerBox .footer{ display:none; transition:0.35s ease-in-out; } .footerBox .copyRight{ width:100%; transition:0.35s ease-in-out; } .footerBox .copyRight .left{ text-align:center; width:100%; line-height: 2rem; transition:0.35s ease-in-out; } .footerBox .copyRight .right{ text-align:center; width:100%; line-height: 2rem; transition:0.35s ease-in-out; } .footerBox .copyRight span{ display:block; font-size: 0.7rem !important; color: #808080; } footerBox .copyRight span a{ color:#808080; } } @media only screen and (min-width: 769px) and (max-width: 1024px){ .footerBox .footer{ display:none; transition:0.35s ease-in-out; } .footerBox .copyRight{ width:100%; transition:0.35s ease-in-out; } .footerBox .copyRight .left{ text-align:left; width:50%; line-height: 2rem; transition:0.35s ease-in-out; } .footerBox .copyRight .right{ text-align:right; width:50%; line-height: 2rem; transition:0.35s ease-in-out; } .footerBox .copyRight span{ display:block; font-size: 0.7rem !important; color: #808080; } footerBox .copyRight span a{ color:#808080; } } @media only screen and (min-width:1025px) and (max-width: 1280px){ .footerBox .footer{ display:none; transition:0.35s ease-in-out; } .footerBox .copyRight{ width:100%; transition:0.35s ease-in-out; } .footerBox .copyRight .left{ text-align:left; width:50%; line-height: 2rem; transition:0.35s ease-in-out; } .footerBox .copyRight .right{ text-align:right; width:50%; line-height: 2rem; transition:0.35s ease-in-out; } .footerBox .copyRight span{ display:block; font-size: 0.7rem !important; color: #808080; } .footerBox .copyRight span a{ color:#808080; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .footerBox .footer{ width:100%; transition:0.35s ease-in-out; } .footerBox .copyRight{ width:100%; transition:0.35s ease-in-out; } } @media only screen and (min-width:1367px) and (max-width:1440px){ .footerBox .footer{ width:100%; transition:0.35s ease-in-out; } } @media only screen and (min-width:1441px) and (max-width:1680px){ .footerBox .footer{ width:100%; transition:0.35s ease-in-out; } } @media only screen and (min-width:1681px) and (max-width:1720px){ .footerBox .footer{ width:100%; transition:0.35s ease-in-out; } }.headerBox{ position:fixed; top: 0; width:100%; height: auto; cursor: default; z-index:100; } .header{ position:relative; width:100%; max-width:1720px; margin:0 auto; padding:0 15px; z-index: 200; } .headerBox:after{ position:absolute; top:0; left:0; content:" "; width:100%; height:120px; background: rgba(255,255,255,0.7); border-bottom: 1px solid #e3e3e3; transition: 0.35s ease-in-out; z-index: 100; } .headerBox .leftLogoBox{ width:346px; height:58px; margin: 31px 0; float:left; transition: 0.35s ease-in-out; overflow:hidden; } .headerBox .rightConnet{ width: 60%; float:right; } .headerBox .rightConnet .mobileIcon{ display:none; } .headerBox .rightConnet .rightNavBox{ width: 90%; float:left; } .headerBox .rightConnet .rightNavBox ul{ list-style:none; margin:0; padding:0; } .headerBox .rightConnet .rightNavBox ul .navBox{ position:relative; width: calc(100%/7); margin: 0 auto; float:left; z-index:1; } .headerBox .rightConnet .rightNavBox ul .navBox:after{ position:absolute; left:0; top: 80px; width:0; height:1px; background:#1b76b7; content:" "; transition:0.35s ease-in-out; z-index:101; } .headerBox .rightConnet .rightNavBox ul .navBox:hover:after{ width:60%; margin:0 20%; animation: fadeInDown 0.35s ease-in-out; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox .Title h2{ text-align:center; font-size: 1rem; color:#1c1c1c; line-height: 120px; transition: 0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox:hover .Title h2{ color:#1b76b7; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox .icon-123-01{ display:none; } .headerBox .rightConnet .rightNavBox ul .navBox .icon-down{ display:none; } .headerBox .rightConnet .rightNavBox ul .navBox .childNavBox{ display: none; margin: 0 auto; background: #333; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox:nth-child(3) .childNavBox{ width:200px; } .headerBox .rightConnet .rightNavBox ul .navBox:hover .childNavBox{ display:block; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox .childNavBox .child{ width:100%; border-bottom:1px solid rgba(255,255,255,0.1); transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox .childNavBox .child:hover{ background:#1b76b7; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox .childNavBox .child h2{ text-align:center; width: 100%; padding: 0 16px; font-size:0.875rem; color:#fff; line-height:48px; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .headerBox .rightConnet .rightIconBox{ display: block; text-align:right; width: 10%; margin: 50px auto; float:right; } .headerBox .rightConnet .rightIconBox .iconfont{ display:inline-block; margin:0px 10px; font-size:1rem; color:#1c1c1c; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightIconBox .iconfont:hover{ color:#1b76b7; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightIconBox .iconfont:before{ padding: 0 6px 0 0; } .headerNavOpen{ transform: translateX(0%) !important; transition:0.35s ease-in-out; } .headerNavClose{ transform: translateX(100%) !important; transition:0.35s ease-in-out; } @media only screen and (max-width: 768px){ .headerBox{ height:80px; } .headerBox:after{ top: 0px; height: 80px; } .headerBox .leftLogoBox{ width: 90px; margin: 14px auto 0; transition: 0.35s ease-in-out; } .headerBox .rightConnet .mobileNavBox{ display: block; position: absolute; top: 0; right: 0; transition:0.35s ease-in-out; z-index: 100; transform: scale(0.85); } .headerBox .rightConnet .mobileNavBox .mobileIcon{ display: block; position: relative; top: 46px; right: 15px; transition:0.35s ease-in-out; z-index: 100; transform: scale(0.85); } .headerBox .rightConnet .mobileNavBox .mobileIcon span{ display: block; position: relative; width: 24px; height:2px; background: #333; animation: navMiddle 0.75s ease-in-out; transition:0.35s ease-in-out; z-index: 2; } .headerBox .rightConnet .mobileNavBox .mobileIcon span:before{ position: absolute; content:" "; top: 6px; right: 0; width:30px; height:2px; background: #333; animation: navBefore 0.75s ease-in-out; transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .mobileNavBox .mobileIcon span:after{ position: absolute; content:" "; bottom: 6px; right: 0; width:30px; height: 2px; background: #333; animation: navAfter 0.75s ease-in-out; transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .mobileNavBox .activeIcon{ display: block; position: absolute; top: 50px; right: 15px; transition:0.35s ease-in-out; z-index: 100; } .headerBox .rightConnet .mobileNavBox .activeIcon span{ display: block; position: relative; width: 24px; height:2px; background: transparent; transition:0.35s ease-in-out; z-index: 2; } .headerBox .rightConnet .mobileNavBox .activeIcon span:before{ position: absolute; content:" "; top: -6px; right: 0; width:30px; height:2px; background: #333; transform:rotate(45deg); transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .mobileNavBox .activeIcon span:after{ position: absolute; content:" "; bottom: 6px; right: 0; width:30px; height: 2px; background: #333; transform:rotate(-45deg); transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .rightNavBox{ display: block; top: 80px; left: 0; position: fixed; width: 100vw; height: 100vh; padding: 0 15px; transform: translateX(100%); background: rgba(51,51,51,0.98); } .headerBox .rightConnet .rightNavBox ul .navBox{ display: block; width:100%; margin: 0; border-bottom:1px solid rgba(255,255,255,0.1); } .headerBox .rightConnet .rightNavBox ul .navBox:after{ top:50px; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox:hover:after{ width:100%; margin:0; } .headerBox .rightConnet .rightNavBox ul .navBox .Title h2{ display: inline-block; text-align: left; width: 90%; padding: 0; font-size: 0.875rem; color:#fff; line-height: 50px; transition: 0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox .icon-123-01{ display: block; position: absolute; text-align: right; width: 10%; top: 1.25rem; right: 0; color:#fff; opacity:0.25; } .headerBox .rightConnet .rightNavBox ul .navBox .icon-down{ display: inline-block; text-align: right; position: absolute; top: 1.25rem; right: 0; width: 10%; font-size:0.6rem; color:#fff; opacity:0.25; } .headerBox .rightConnet .rightNavBox ul .navBox .childNavBox{ position:relative; width: 100% !important; } .headerBox .rightConnet .rightNavBox ul .navBox .childNavBox .child h2{ text-align:left; padding: 0 1rem; transition: 0.35s ease-in-out; } .headerBox .rightConnet .rightIconBox{ display: none !important; transition:0.35s ease-in-out; } } @media only screen and (min-width: 769px) and (max-width: 1024px){ .headerBox{ height:80px; } .headerBox:after{ top: 0; height: 80px; } .headerBox .leftLogoBox{ width: 340px; margin: 14px auto 0; transition: 0.35s ease-in-out; } .headerBox .rightConnet .mobileNavBox{ display: block; position: absolute; top: 0; right: 0; transition:0.35s ease-in-out; z-index: 100; transform: scale(0.85); } .headerBox .rightConnet .mobileNavBox .mobileIcon{ display: block; position: relative; top: 46px; right: 15px; transition:0.35s ease-in-out; z-index: 100; transform: scale(0.85); } .headerBox .rightConnet .mobileNavBox .mobileIcon span{ display: block; position: relative; width: 24px; height:2px; background: #333; animation: navMiddle 0.75s ease-in-out; transition:0.35s ease-in-out; z-index: 2; } .headerBox .rightConnet .mobileNavBox .mobileIcon span:before{ position: absolute; content:" "; top: 6px; right: 0; width:30px; height:2px; background: #333; animation: navBefore 0.75s ease-in-out; transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .mobileNavBox .mobileIcon span:after{ position: absolute; content:" "; bottom: 6px; right: 0; width:30px; height: 2px; background: #333; animation: navAfter 0.75s ease-in-out; transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .mobileNavBox .activeIcon{ display: block; position: absolute; top: 50px; right: 15px; transition:0.35s ease-in-out; z-index: 100; } .headerBox .rightConnet .mobileNavBox .activeIcon span{ display: block; position: relative; width: 24px; height:2px; background: transparent; transition:0.35s ease-in-out; z-index: 2; } .headerBox .rightConnet .mobileNavBox .activeIcon span:before{ position: absolute; content:" "; top: -6px; right: 0; width:30px; height:2px; background: #333; transform:rotate(45deg); transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .mobileNavBox .activeIcon span:after{ position: absolute; content:" "; bottom: 6px; right: 0; width:30px; height: 2px; background: #333; transform:rotate(-45deg); transition:0.35s ease-in-out; z-index:2; } .headerBox .rightConnet .rightNavBox{ display: block; top: 80px; left: 0; position: fixed; width: 100vw; height: 100vh; padding: 0 15px; transform: translateX(100%); background: rgba(51,51,51,0.98); } .headerBox .rightConnet .rightNavBox ul .navBox{ display: block; width:100%; margin: 0; border-bottom:1px solid rgba(255,255,255,0.1); } .headerBox .rightConnet .rightNavBox ul .navBox .childNavBox{ width:100% !important; } .headerBox .rightConnet .rightNavBox ul .navBox .Title h2{ display: inline-block; text-align: left; width: 95%; padding: 0; font-size: 0.875rem; color:#fff; line-height: 50px; transition: 0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox ul .navBox:hover:after{ top: 50px; width:100%; margin:0; } .headerBox .rightConnet .rightNavBox ul .navBox .icon-123-01{ display: none; position: absolute; width: 5%; top: 1.25rem; right: 0; color:#fff; opacity:0.25; } .headerBox .rightConnet .rightNavBox ul .navBox .icon-down{ display: inline-block; position: absolute; top: 1.25rem; right: 0; font-size:0.6rem; color:#fff; opacity:0.25; } .headerBox .rightConnet .rightIconBox{ display: none !important; transition:0.35s ease-in-out; } } @media only screen and (min-width: 1025px) and (max-width: 1280px){ .headerBox .rightConnet .rightNavBox{ width:100%; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightIconBox{ display: none !important; transition:0.35s ease-in-out; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .headerBox .rightConnet{ width:70%; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox{ width:85%; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightIconBox{ width:15%; transition:0.35s ease-in-out; } } @media only screen and (min-width:1367px) and (max-width:1440px){ .headerBox .rightConnet{ width:70%; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox{ width:88%; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightIconBox{ width: 12%; transition:0.35s ease-in-out; } } @media only screen and (min-width:1441px) and (max-width:1680px){ .headerBox .rightConnet{ width:70%; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightNavBox{ width:90%; transition:0.35s ease-in-out; } .headerBox .rightConnet .rightIconBox{ width:10%; transition:0.35s ease-in-out; } } /* anmiaton */ @keyframes navAfter{ 0% {bottom:0px;} 100% {bottom:6} } @-webkit-keyframes navAfter{ 0% {bottom:0px;} 100% {bottom:6} } @keyframes navBefore{ 0% {top:0px;} 100% {top:6} } @-webkit-keyframes navBefore{ 0% {top:0px;} 100% {top:6} } @keyframes navMiddle{ 0% {width:0px;} 100% {width:24px} } @-webkit-keyframes navMiddle{ 0% {width:0px;} 100% {width:24px} }@media only screen and (max-width: 768px){/*小屏*/ .c_portalResPublic_codeContainer-01001{ min-height:500px; width:100%; } } @media only screen and (min-width: 769px){/*大屏*/ .c_portalResPublic_codeContainer-01001{ min-height:500px; width:100%; } } @media only screen and (max-width: 1024px) and (min-width: 769px){/*中屏*/ }@CHARSET "UTF-8"; *{ padding: 0; margin: 0; } .pagebox{ width: 100%; }/*page property_start*/.pagebox,#-remove--flag{width:100%;margin:0px auto 0px 0px;}/*page property_end*//*page property_start*/body,#-remove--flag{}/*page property_end*/ @media only screen and (max-width: 1024px) and (min-width: 769px){ } #c_portalResEbizads_banner-16149094986710896{ width:auto; max-width:none; min-width:0px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:0px; margin-right:0px; margin-bottom:0px; padding-top:0px; padding-left:0px; padding-right:0px; padding-bottom:0px; } #c_portalResProduct_category-16149291045754177{ width:auto; max-width:none; min-width:0px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:0px; margin-right:0px; margin-bottom:0px; padding-top:0px; padding-left:0px; padding-right:0px; padding-bottom:0px; } #c_portalResPublic_codeContainer-16149336127249581{ width:100%; max-width:none; min-width:0px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:0px; margin-right:0px; margin-bottom:0px; padding-top:0px; padding-left:0px; padding-right:0px; padding-bottom:0px; } #c_portalResNews_list-16152496166784479{ width:100%; max-width:none; min-width:320px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:0px; margin-right:0px; margin-bottom:0px; padding-top:0px; padding-left:0px; padding-right:0px; padding-bottom:0px; } #c_portalResNews_list-16152538718982697{ width:100%; max-width:none; min-width:0px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:0px; margin-right:0px; margin-bottom:0px; padding-top:0px; padding-left:0px; padding-right:0px; padding-bottom:0px; } #c_portalResNews_list-16152964963556871{ width:auto; max-width:1720px; min-width:0px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:auto; margin-right:auto; margin-bottom:0px; padding-top:0px; padding-left:0px; padding-right:0px; padding-bottom:0px; } #w_grid-1614909499435 > div > .p_gridbox > .p_gridCell:nth-child(n+1){ margin-left:0; clear:left; } /*w_grid-1614909499435*/ /*w_grid-1614909499435*/ /*w_grid-1614909499435*/@media only screen and (max-width: 1024px) and (min-width: 769px){ } #w_grid-1614911890425 .p_MatteIcon .iconfont:before{ content:'\e602'; } #w_grid-1614911890425 >div{ animation-fill-mode:both; } #w_grid-1614911890425 > div > .p_gridbox > .p_gridCell:nth-child(n+1){ margin-left:0px; clear:left; } /*w_grid-1614911890425*/ /*w_grid-1614911890425*/@media only screen and (min-width: 769px){ #w_grid-1614911890425> div > .p_gridbox > .p_gridCell{ margin-bottom:0rem; margin-top:0rem; margin-left:0; } #w_grid-1614911890425> div > .p_gridbox > .p_gridCell:nth-child(2n+0){ width:80.10000000000001%; margin-left:0; margin-right:0; clear:none; } #w_grid-1614911890425> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ margin-left:0; clear:left; margin-right:0; width:19.900000000000002%; } #w_grid-1614911890425> div > .p_gridbox > .p_gridCell:nth-child(2n){ margin-right:0; } } /*w_grid-1614911890425*/@media only screen and (max-width: 1024px) and (min-width: 769px){ } #w_grid-1615249467242 .p_MatteIcon .iconfont:before{ content:'\e602'; } #w_grid-1615249467242 >div{ animation-fill-mode:both; } #w_grid-1615249467242 > div > .p_gridbox > .p_gridCell:nth-child(n+1){ margin-left:0px; clear:left; } /*w_grid-1615249467242*/ /*w_grid-1615249467242*/@media only screen and (min-width: 769px){ #w_grid-1615249467242> div > .p_gridbox > .p_gridCell{ margin-bottom:0rem; margin-top:0rem; margin-left:0; } #w_grid-1615249467242> div > .p_gridbox > .p_gridCell:nth-child(2n+0){ width:80.97%; margin-left:0; margin-right:0; clear:none; } #w_grid-1615249467242> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ margin-left:0; clear:left; margin-right:0; width:19.03%; } #w_grid-1615249467242> div > .p_gridbox > .p_gridCell:nth-child(2n){ margin-right:0; } } /*w_grid-1615249467242*/@media only screen and (max-width: 1024px) and (min-width: 769px){ } #w_grid-1614909499435{ width:100%; max-width:none; min-width:0px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:auto; margin-right:auto; margin-bottom:0px; padding-top:0px; padding-left:0px; padding-right:0px; padding-bottom:0px; } #w_grid-1614911890425{ width:100%; max-width:1720px; min-width:0px; height:auto; max-height:none; min-height:0px; margin-top:0px; margin-left:auto; margin-right:auto; margin-bottom:0px; padding-top:0px; padding-left:15px; padding-right:15px; padding-bottom:0px; } #w_grid-1615249467242{ width:100%; max-width:1720px; min-width:0px; height:auto; max-height:none; min-height:192px; margin-top:0px; margin-left:auto; margin-right:auto; margin-bottom:0px; padding-top:0px; padding-left:15px; padding-right:15px; padding-bottom:0px; } #c_portalResProduct_category-16154306205686345 .p_MatteIcon .iconfont:before{ content:'\e602'; } #c_portalResProduct_category-16154306205686345 >div{ animation-fill-mode:both; } #c_portalResProduct_category-16154306205686345{ max-height:none; padding-top:0px; padding-left:0px; padding-bottom:0px; min-height:0px; margin-right:0px; margin-left:0px; max-width:none; width:100%; margin-top:0px; margin-bottom:0px; min-width:0px; height:auto; padding-right:0px; }