 .e_ContentMajorStyleBox-001{  width: 100%; height: auto; width-uint:%; }   .e_ContentMajorStyleBox-001 .stylebox_link{ color:#666666; font-size: 14px; height: inherit; display: table; padding:0 15px; border-width: 0px; float: right; vertical-align: middle; margin-right: 15px; } .e_ContentMajorStyleBox-001 .stylebox_top{ width: auto; height: 40px; background-color: rgba(101, 190, 186, 1); } .e_ContentMajorStyleBox-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_ContentMajorStyleBox-001 .title_icon::before{ content: ""; } .e_ContentMajorStyleBox-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_ContentMajorStyleBox-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_ContentMajorStyleBox-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; padding-right: 22px; vertical-align: top; } .e_ContentMajorStyleBox-001 .stylebox_link a{ color: inherit; display: table-cell; vertical-align: middle; } .e_ContentMajorStyleBox-001 .link_icon{ display: inline-block; margin-left: 5px; } .e_ContentMajorStyleBox-001 .link_icon::before{ content: '\e6af'; } .e_ContentMajorStyleBox-001 .stylebox_top_line{ height: 1px; background-color: rgba(240,240,240,1); } .e_ContentMajorStyleBox-001 .stylebox_content { border-style: solid; border-width: 1px; border-color:#f0f0f0; width: 100%; width-uint:%; } .e_ContentMajorStyleBox-001 .stylebox_bottom_line{ height: 1px; background-color: rgba(240,240,240,1); } .e_FlowCommonStyleBox-001{  width: 100%; height: auto; width-uint:%; }  .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); } .e_SideMajorStyleBox-001{  width: 100%; height: auto; width-uint:%; }  .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); }.aboutNavBox{ position:relative; width:100%; margin: 0; background: rgba(255,255,255,1); cursor: default; } .aboutNavBox .topTitleBox{ display: none; position:relative; margin: 0 0 2.5rem 0; } .aboutNavBox .topTitleBox h1{ font-size: 1.5rem; font-weight: normal; color: var(--hColor); letter-spacing: 1px; } .aboutNavBox .mNavIconBox{ display:none; } .aboutNavBox .mNavIconBox .iconfont:hover{ color: var(--bColor); transition: 0.35s ease-in-out; } .aboutNavBox .mNavIconBox .iconfont:acitve{ color: var(--bColor); transition: 0.35s ease-in-out; } .aboutNavBox .mNavClose{ display:none; } .aboutNavBox .mNavClose:hover{ background: var(--bColor); } .aboutNavBox .mNavClose:active{ background: var(--bColor); } .aboutNavBox .navListBox{ position: relative; padding: 0; border-bottom: 1px solid #efefef; } .aboutNavBox .navListBox .navLine{ display: none; position:absolute; top:0; left:0; width:1px; height:100%; background: var(--bColor); } .aboutNavBox .navListBox .navBox{ display: flex; justify-content: center; position:relative; width: 100%; margin: 0 auto; } .aboutNavBox .navListBox .navBox .nav{ position:relative; width: calc((100% - 0rem)/5); margin: 0; background: transparent; border: none; } .contactNavBox .navListBox .navBox .nav{ position:relative; width: calc((100% - 0rem)/3); margin: 0; background: transparent; border: none; } .aboutNavBox .navListBox .navBox .nav:nth-last-child(1) h2{ margin:0; } .aboutNavBox .navListBox .navBox .nav .icon-down1{ display:none; } .aboutNavBox .navListBox .navBox .nav h2{ text-align: center; margin: 0; font-size: 1rem; color: var(--hColor); line-height: 4rem; letter-spacing: 0; border-left: 1px solid #e3e3e3; transition: 0.35s ease-in-out; } .aboutNavBox .navListBox .navBox .nav:hover{ background:var(--bColor); transition:0.35s ease-in-out; } .aboutNavBox .navListBox .navBox .nav:hover h2{ color:#fff; transition:0.35s ease-in-out; } .aboutNavBox .navListBox .navBox .nav .chlidBox{ display: none; } .aboutNavBox .navListBox .navBox .nav:hover .chlidBox{ display: block; position: absolute; top: 0; left: 0; width: 20rem; margin: 0 0 0 50%; padding: 0 1rem; background: rgba(255,255,255,0.8); border-left: 1px solid #e3e3e3; border-radius: 0; box-shadow: 1px 2px 4px rgba(51,51,51,0.15); transition: 0.35s ease-in-out; z-index: 200; } .aboutNavBox .navListBox .navBox .nav .chlidBox .chlid h2{ margin:0; color:var(--hColor); line-height:2.5; border-bottom:1px solid #efefef; transition:0.35s ease-in-out; } .aboutNavBox .navListBox .navBox .nav .chlidBox .chlid:hover h2{ color:var(--bColor); 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){ .aboutNavBox{ margin: 2rem auto 1rem; } .aboutNavBox .topTitleBox{ display: block; margin: 0; padding: 0 0 1rem; border-bottom: 1px solid #efefef; } .aboutNavBox .topTitleBox h1{ font-size: 1.5rem; letter-spacing: 0; } .aboutNavBox .mNavIconBox{ display:block; position:absolute; top:0; right:0; } .aboutNavBox .mNavClose{ display:block; text-align:center; position:fixed; top: 80px; left:0; width: 12vw; height:100vh; transform: translateX(-100%); background: rgba(51,51,51,0.8); z-index: 40; } .aboutNavBox .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; } .aboutNavBox .navListBox{ display:block; position:fixed; top: 80px; right: 0; width: 88vw; height:100vh; padding: 0; background:rgba(51,51,51,1); transform: translateX(100%); transition:0.35s ease-in-out; z-index: 40; } .aboutNavBox .navListBox .navLine{ display:none; } .aboutNavBox .navListBox .navBox{ flex-wrap: wrap; width: 100%; } .aboutNavBox .navListBox .navBox .nav{ width: 100%; margin: 0; padding: 0; background: transparent; border: none; } .aboutNavBox .navListBox .navBox .nav:hover,.aboutNavBox .navListBox .navBox .nav:active{ background:var(--bColor); transition:0.35s ease-in-out; } .aboutNavBox .navListBox .navBox .nav:hover h2,.aboutNavBox .navListBox .navBox .nav:active h2{ color:var(--fColor); transition:0.35s ease-in-out; border-bottom: 1px solid var(--bColor); } .aboutNavBox .navListBox .navBox .nav h2{ text-align: left; margin:0; padding: 0 1rem; font-size:0.875rem; color:#fff; line-height:50px; border: none; border-bottom: 1px solid rgba(255,255,255,0.1); } } @media only screen and (min-width: 769px) and (max-width:1024px){ .aboutNavBox{ margin: 0rem 0; } .aboutNavBox .topTitleBox{ margin:0 0 1.5rem 0; } .aboutNavBox .topTitleBox h1{ font-size: 1.4rem; letter-spacing: 0; } .aboutNavBox .navListBox .navBox{ width: 100%; transition:0.35s ease-in-out; } .aboutNavBox .navListBox .navBox .nav h2{ font-size:0.875rem; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .aboutNavBox{ margin: 0; } .aboutNavBox .topTitleBox h1{ font-size: 1.4rem; letter-spacing: 0; } .aboutNavBox .navListBox .navBox .nav h2{ font-size:0.875rem; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .aboutNavBox{ margin: 0; } .aboutNavBox .topTitleBox h1{ font-size: 1.4rem; letter-spacing: 0; } } .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%} }.c_portalResIntro_category-01001002 .p_MatteIcon .iconfont:before{ content:'\e602'; } .c_portalResIntro_category-01001002 >div{ animation-fill-mode:both; } .c_portalResIntro_category-01001002 .moveBtn{ display:none; color:#fff; width:100px; height:35px; line-height:35px; text-align:center; background-color:#1890ff; border:1px solid #329cff; white-space:nowrap; border-radius:4px; margin:1.3em; } .c_portalResIntro_category-01001002 .contentBox{ width:100%; height:auto; overflow:visible; box-shadow:0px 5px 20px 0px rgba(192, 192, 192, 0.4); } .c_portalResIntro_category-01001002 .link{ position:relative; height:50px; line-height:50px; } .c_portalResIntro_category-01001002 .yjTitle{ border-bottom:1px solid #e8e8e8; padding-left:20px; } .c_portalResIntro_category-01001002 .yjLink{ position:relative; color:#7b8a96; font-size:18px; transition:all .5s ease; } .c_portalResIntro_category-01001002 .yjLink::before{ content:''; display:block; width:3px; height:50px; background-color:#04abf4; position:absolute; left:-20px; top:-16px; opacity:0; transition:all .5s ease; } .c_portalResIntro_category-01001002 .iconfont1{ position:absolute; right:45px; top:0px; bottom:0px; width:50px; color:#7b8a96; display:flex; align-items:center; justify-content:center; font-size:16px; } .c_portalResIntro_category-01001002 .ejLi{ position:relative; } .c_portalResIntro_category-01001002 .ejTitle{ position:relative; background-color:#fff; border-bottom:1px solid #e8e8e8; padding-left:50px; transition:all .5s ease; } .c_portalResIntro_category-01001002 .ejLink{ color:#86939e; font-size:16px; } .c_portalResIntro_category-01001002 .iconfont2{ position:absolute; right:20px; top:0px; bottom:0px; margin:auto; display:inline-block; width:18px; height:18px; line-height:18px; text-align:center; color:#86939e; font-size:16px; transition:all .5s ease; } .c_portalResIntro_category-01001002 .icf{ transform:rotate(180deg); } .c_portalResIntro_category-01001002 .sjTitle{ position:relative; background-color:#fff; border-bottom:1px solid #e8e8e8; } .c_portalResIntro_category-01001002 .sjLink{ color:#7b8a96; font-size:16px; } .c_portalResIntro_category-01001002 .ejBox{ display:none; } .c_portalResIntro_category-01001002 .rotate{ transform:rotate(-90deg); } .c_portalResIntro_category-01001002 .ejTitle:hover{ background-color:#f5f8fa; } .c_portalResIntro_category-01001002 .backBtn{ display:none; } .c_portalResIntro_category-01001002 .yjTitle:hover{ background-color:#f5f8fa; } .c_portalResIntro_category-01001002 .yjTitle:hover .yjLink::before{ opacity:1; } .c_portalResIntro_category-01001002 .sjBox{ display:none; } .c_portalResIntro_category-01001002 .line_right{ display:none; } @media only screen and (min-width:769px){ .c_portalResIntro_category-01001002 .sjBox { position: absolute; top: 0; left: 100%; box-shadow: 0px 5px 20px 0px rgba(192, 192, 192, 0.4); } .c_portalResIntro_category-01001002 .sjTitle { text-align: center; } .c_portalResIntro_category-01001002 .sjTitle::before { content: ''; position: absolute; display: block; width: 6px; height: 50px; background-color: #04abf4; } .c_portalResIntro_category-01001002 .sjBox li { width: 150px; } .c_portalResIntro_category-01001002 .sjTitle:hover .sjLink { color: #01a5ec; } .c_portalResIntro_category-01001002 .sjLi::before { content: ''; display: block; width: 0; height: 0; border-top: 6px solid #04abf4; border-right: 6px solid #fff; border-bottom: 6px solid #04abf4; position: absolute; left: 0; top: 22px; z-index: 1; } .c_portalResIntro_category-01001002 .ejLi:hover .sjLi::before { display: block; } } @media only screen and (max-width:768px){ .c_portalResIntro_category-01001002 .contentBox { position: fixed; top: 0; left: 100%; height: 100%; font-size: 0; z-index: 999; background: #fff; } .c_portalResIntro_category-01001002 .backBtn { position: relative; display: inline-block; width: 45px; height: 100%; vertical-align: top; background: #f5f8fa; } .c_portalResIntro_category-01001002 .content { display: inline-block; width: calc(100% - 45px); } .c_portalResIntro_category-01001002 .moveBtn { display: block; } .c_portalResIntro_category-01001002 .btn { position: absolute; top: 50%; transform: translateY(-50%); width: 100%; height: 40px; display: block; text-align: center; line-height: 40px; font-size: 1.2rem; color: #7b8a96; padding: 0; } .c_portalResIntro_category-01001002 .yjTitle { border-bottom: 1px solid #f8f8f8; } .c_portalResIntro_category-01001002 .sjTitle { padding-left: 80px; } .c_portalResIntro_category-01001002 .jsDeg { transform: rotate(-90deg); } .c_portalResIntro_category-01001002 .line_right { display: block; width: 8px; height: 50px; background-color: #04abf4; position: absolute; right: 0; top: 0; opacity: 0 } .c_portalResIntro_category-01001002 .line_show { opacity: 1; } .c_portalResIntro_category-01001002 .sjTitle::after { content: ''; display: block; width: 8px; height: 50px; background-color: #04abf4; position: absolute; right: 0; top: 0; } }.aboutDetailBox{ position:relative; margin: 3rem auto; } .aboutDetailBox .topTitle{ text-align: center; margin: 0 0 16px 0; padding: 0; border-bottom: 1px solid #d9d9d9; } .aboutDetailBox .topTitle h1{ padding: 0; font-size: 2rem; font-weight: normal; color: #1c1c1c; line-height: 3; letter-spacing: 1px; background: transparent; box-shadow: none; } .aboutDetailBox .aboutDetail{ position:relative; height:auto; } @media only screen and (max-width:768px){ .aboutDetailBox{ margin:1rem auto 2rem; } .aboutDetailBox .topTitle{ line-height:2; } .aboutDetailBox .topTitle h1{ text-align:center; margin:8px auto; line-height: 2; } .aboutDetailBox .aboutDetail{ position:relative; height:auto; } .aboutDetailBox .aboutDetail tr{ width:100%; } .aboutDetailBox .aboutDetail tr td{ width:100%; float: left; } } @media only screen and (min-width:769px) and (max-width:1024px){ .aboutDetailBox .topTitle h2{ text-align:center; margin:8px auto; } .aboutDetailBox .aboutDetail{ position:relative; height:auto; } }.c_portalResIntro_detail-01001001 .p_MatteIcon .iconfont:before{ content:'\e602'; } .c_portalResIntro_detail-01001001 >div{ animation-fill-mode:both; } #profileBox{ position: relative; width:100%; } #profileBox .profile{ position:relative; width:100%; margin:0 auto; } #profileBox .profile .proInfoBox{ display:flex; position:relative; width:100%; max-width: 1680px; margin:0 auto; flex-wrap: wrap; } #profileBox .profile .proInfoBox .leftBox{ position:relative; width: 22rem; float:left; } #profileBox .profile .proInfoBox .leftBox:before{ content:" "; position:absolute; top: 8rem; left:0; width: 0; height:1px; background: var(--borderColor); transition: 0.35s ease-in-out; z-index:2; } #profileBox .profile .proInfoBox:hover .leftBox:before{ width:100%; background: var(--borderColor); } #profileBox .profile .proInfoBox .leftBox h1{ margin:0 0 0.5rem; padding:0; font-size: 2.5rem; font-weight: 500; color: var(--hColor); line-height: 1; } #profileBox .profile .proInfoBox .leftBox span{ font-size: 1.5rem; color: var(--bColor); } #profileBox .profile .proInfoBox .rightBox{ position:relative; width: calc(100% - 22rem); padding: 0 0 0 4rem; } #profileBox .profile .proInfoBox .rightBox span:nth-child(1){ display:block; margin:0 0 1rem; font-size: 2rem; font-weight: 600; color:var(--bColor); line-height: 1.5; } #profileBox .profile .proInfoBox .rightBox span:nth-child(2){ display:block; margin:0 0 1rem; font-size: 1.125rem; font-weight:400; color:var(--hColor); line-height:2; } #profileBox .profile .proInfoBox .rightBox span:nth-child(3){ display:block; margin:0; font-size: 1.125rem; font-weight:400; color: var(--bColor); line-height: 3; } #profileBox .profile .proInfoBox .rightBox span:nth-child(n+4){ display:block; font-size:1rem; color: #333; line-height:2; } #profileBox .profile .proInfoBox .proImgBox{ position:relative; width: 100%; margin: 4rem auto; } #profileBox .profile .proInfoBox .proImgBox img{ width:100%; box-shadow:1px 2px 4px rgba(51,51,51,0.2); } #profileBox .profile .proServerBox{ position:relative; text-align:center; width: 100%; margin:0 auto; height: 24rem; background:#000; background-size:cover; } #profileBox .profile .proServerBox .content{ position:relative; top: calc((100% - 7rem)/2); } #profileBox .profile .proServerBox .content h1{ margin: 0; padding: 0; font-size:2rem; color:var(--fColor); text-transform: uppercase; } #profileBox .profile .proServerBox .content span{ margin: 0; padding: 0; font-size:1rem; color:var(--fColor); line-height:3; } #profileBox .profile .proServerBox .content span .iconfont{ display:inline-block; width:3rem; height:3rem; margin: 0.5rem 1rem; font-size: 1rem; line-height:3rem; background:transparent; border-radius:100%; transition:0.35s ease-in-out; } #profileBox .profile .proServerBox .content:hover span .iconfont{ font-size:1rem; color:var(--bColor); background:var(--fColor); transition:0.35s ease-in-out; } #profileBox .profile .proProductBox{ position:relative; height: 24rem; background: transparent; } #profileBox .profile .proProductBox a{ display:block; position:relative; width:100%; max-width:1440px; margin: 0 auto; z-index:2; } #profileBox .profile .proProductBox .leftBox{ display:inline-block; position:relative; top: calc((24rem - 15rem)/2); left: calc((100% - 1440px)/2); width: auto; float: left; z-index: 2; } #profileBox .profile .proProductBox .leftBox h1{ margin:0 0 0.5rem; padding:0; font-size:2rem; color:var(--hColor); transition:0.35s ease-in-out; } #profileBox .profile .proProductBox:hover .leftBox h1{ color:var(--fColor); transition:0.35s ease-in-out; } #profileBox .profile .proProductBox .leftBox span:nth-child(2){ display:block; margin:0 0 0.5rem; padding:0; font-size:1.5rem; color:var(--hColor); transition:0.35s ease-in-out; } #profileBox .profile .proProductBox .leftBox span:nth-child(3){ display:block; margin:0; padding:0; font-size:0.875rem; color:var(--fdColor); line-height:2; transition:0.35s ease-in-out; } #profileBox .profile .proProductBox:hover .leftBox span{ color:var(--fColor); transition:0.35s ease-in-out; } #profileBox .profile .proProductBox .more{ text-align:center; width:6rem; margin:2rem 0; font-size:0.875rem; color:var(--hColor); line-height:3; border:1px solid var(--hColor); border-radius:0.25rem; transition:0.35s ease-in-out; } #profileBox .profile .proProductBox:hover .more{ width:10rem; color:var(--fColor); background:var(--bColor); border:1px solid var(--bColor); transition:0.35s ease-in-out; } #profileBox .profile .proProductBox .coverPic{ position:absolute; top:0; left:0; z-index:1; transform: scale(0); transition: 0.7s ease-in-out; opacity:0; } #profileBox .profile .proProductBox:hover .coverPic{ transform: scale(1); transition: 0.7s ease-in-out; opacity:1; } @media only screen and (max-width:768px){ #profileBox .profile .proInfoBox .leftBox h1{ font-size:2rem; } #profileBox .profile .proInfoBox .rightBox{ width: 100%; margin:2rem auto; padding:0; } #profileBox .profile .proInfoBox .rightBox span:nth-child(1){ font-size:1.125rem; line-height:1.8; } #profileBox .profile .proInfoBox .rightBox span:nth-child(2){ font-size:1rem; line-height:1.8; } #profileBox .profile .proInfoBox .proImgBox{ margin: 0; } #profileBox .profile .proServerBox{ margin: -0.25rem 0; height: 14rem; } #profileBox .profile .proProductBox{ height: 24rem; overflow: hidden; } #profileBox .profile .proProductBox .leftBox{ left:0; } } @media only screen and (min-width:769px) and (max-width:1024px){ #profileBox .profile .proInfoBox .leftBox h1{ font-size:2rem; } #profileBox .profile .proInfoBox .rightBox{ width: 100%; margin:2rem auto; padding:0; } #profileBox .profile .proInfoBox .rightBox span:nth-child(1){ font-size:1.125rem; line-height:1.8; } #profileBox .profile .proInfoBox .rightBox span:nth-child(2){ font-size:1rem; line-height:1.8; } #profileBox .profile .proInfoBox .proImgBox{ margin: 0; } #profileBox .profile .proServerBox{ margin: -0.25rem 0; height: 14rem; } #profileBox .profile .proProductBox{ height: 24rem; overflow: hidden; } #profileBox .profile .proProductBox .leftBox{ left:0; } } @media only screen and (min-width:1025px) and (max-width:1280px){ #profileBox .profile .proInfoBox .leftBox h1{ font-size:2rem; } #profileBox .profile .proInfoBox .rightBox{ width: 100%; margin:2rem auto; padding:0; } #profileBox .profile .proInfoBox .rightBox span:nth-child(1){ font-size:1.125rem; line-height:1.8; } #profileBox .profile .proInfoBox .rightBox span:nth-child(2){ font-size:1rem; line-height:1.8; } #profileBox .profile .proInfoBox .proImgBox{ margin: 0; } #profileBox .profile .proServerBox{ margin: -0.25rem 0; height: 14rem; } #profileBox .profile .proProductBox{ height: 24rem; overflow: hidden; } #profileBox .profile .proProductBox .leftBox{ left:0; } }.breadcrumbListBox{ position:relative; width: 100%; max-width: 1680px; margin:0 auto; background: transparent; border-bottom: 1px solid #efefef; overflow:hidden; cursor: default; } .breadcrumbListBox .breadcrumbBg{ position:absolute; left: 0; width:100%; height: auto; background: transparent; transition:0.35s ease-in-out; } .breadcrumbListBox .ListBox{ display: flex; position:relative; width:100%; max-width: 100%; margin: 0 auto; padding: 0; z-index:2; flex-wrap: nowrap; } .breadcrumbListBox .ListBox .home{ display:inline-block; text-align: center; width: 4rem; padding: 0; border: 1px solid #e3e3e3; border-top: none; border-bottom: none; float:left; } .breadcrumbListBox .ListBox .iconfont{ padding: 0; font-size: 1.5rem; color: var(--fSmColor); line-height: 4rem; } .breadcrumbListBox .ListBox .home h2{ display: inline-block; width: auto; font-size: 0.875rem; color: var(--hColor); line-height: 4; } .breadcrumbListBox .ListBox .home:hover h2{ color: var(--bColor); transition:0.35s ease-in-out; } .breadcrumbListBox .ListBox .home:hover .iconfont{ color: var(--fDesColor); transition:0.35s ease-in-out; } .breadcrumbListBox .list{ display: flex; width: auto; padding: 0 1rem; border-right: 1px solid #e3e3e3; } .breadcrumbListBox .list:nth-child(4){ max-width: 58%; float:left; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .breadcrumbListBox .list h2{ width:100%; font-size: 1rem; line-height: 4rem; color: var(--bColor); white-space:nowrap; text-overflow:ellipsis; overflow:hidden; float:left; transition:0.35s ease-in-out; } .breadcrumbListBox .list h2:hover{ color: var(--bColor); transition:0.35s ease-in-out; } .breadcrumbListBox .list .icon-down1{ padding:0 0 0 1rem; font-size:0.875rem; color: var(--fDesColor); } .breadcrumbListBox .list h2 .i_separator{ display: none; padding: 0 4px; float: left; } .breadBg{ animation:breadBg 2s ease-in-out; } @media only screen and (max-width: 768px){ .breadcrumbListBox{ padding: 0; background: transparent; transition:0.35s ease-in-out; } .breadcrumbListBox .breadcrumbBg{ display:none; transition:0.35s ease-in-out; } .breadcrumbListBox .ListBox{ display: flex; justify-content: flex-start; width: auto; max-width:100%; padding: 0; flex-wrap: nowrap; } .breadcrumbListBox .ListBox .iconfont{ font-size: 1rem; line-height: 4rem; transition:0.35s ease-in-out; } .breadcrumbListBox .ListBox .home{ width: 4rem; height: 4rem; } .breadcrumbListBox .ListBox .home h2{ width: auto; font-size:0.875rem; transition:0.35s ease-in-out; } .breadcrumbListBox .list h2{ font-size:0.875rem; color: var(--fDesColor); line-height: 4rem; transition:0.35s ease-in-out; } .breadcrumbListBox .list:nth-child(2){ display: flex; width: auto; } .breadcrumbListBox .list:nth-child(3){ display: flex; width: auto; } .breadcrumbListBox .list:nth-child(4){ display:none; } } @keyframes breadBg{ 0% {transform: translateX(100%);} 100% {transform: translateX(0)} } @-webkit-keyframes breadBg{ 0% {transform: translateX(100%);} 100% {transform: translateX(0)} }.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; }  #w_grid-1630114846151:before{ height:7rem !important; } #w_grid-1630114846151{ position: fixed; top:0; left:0; width: 100% !important; z-index:100; } #w_grid-1630114846151:before{ content:" "; position:absolute; top:0; left:0; width: 100% !important; height: 7rem; background: var(--fColor); box-shadow: 1px 4px 8px rgba(51,51,51,0.2); }  #w_grid-1630130378868{ position: relative; z-index:2; } #w_grid-1630135166446{ position: relative; margin: -4.5rem auto 0rem !important; background: var(--fColor); border-radius: 2rem; z-index:3; }  #w_grid-1630121999064{ padding: 0 0 1rem; border-bottom:1px solid rgba(255,255,255,0.1); } @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; }  #w_grid-1630114846151:before{ height:5rem !important; } #w_grid-1630114850464{ height:5rem !important; overflow:hidden; } #w_fimg-1630115293625{ position: relative; margin: 1rem 0 !important; overflow:hidden !important; } #w_fimg-1630115293625 img{ width: auto !important; height: 3rem !important; }  #w_grid-1630134034142{ display:none !important; } #w_grid-1630134727174{ margin: 2rem auto 2rem !important; } #w_grid-1630135166446{ display:none !important; }  #w_grid-1630139975290{ margin:2rem auto 0 !important; }  #w_grid-1630140098399 .reset_style{ margin: 2rem 0; padding: 0 2rem !important; } #w_grid-1630140397339 .reset_style{ margin: 2rem 0; padding: 0 2rem !important; }  #w_grid-1630140059573{ margin:2rem auto 0 !important; } #w_grid-1630140936507{ margin:2rem auto 0 !important; }  #w_grid-1630291371167{ display:none; }  #content_box-1630114872572-1{ display:none; } #w_grid-1630121999064{ margin: 2rem auto 0 !important; } #w_grid-1630121999064 p{ text-align:center !important; } #w_common_text-1630122232566{ text-align:center; } #w_fimg-1630122163930{ display:none; } #w_common_text-1630122037087 p:nth-child(1){ display:none; } #w_grid-1630122391206{ margin: 1rem auto 2rem !important; } #w_grid-1630122391206 p{ text-align:center !important; } #w_grid-1630122391206 p span{ text-align:center !important; line-height: 1.5rem; } } @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; }  #w_grid-1630140129496:hover .p_gridbox{ opacity: 0.6; transition: 0.35s ease-in-out; } #w_grid-1630140380656:hover .p_gridbox{ opacity: 0.6; transition: 0.35s ease-in-out; } #w_grid-1630140387932:hover .p_gridbox{ opacity: 0.6; transition: 0.35s ease-in-out; } #w_grid-1630140397345:hover .p_gridbox{ opacity: 0.6; transition: 0.35s ease-in-out; } #w_grid-1630140397351:hover .p_gridbox{ opacity: 0.6; transition: 0.35s ease-in-out; } #w_grid-1630140397356:hover .p_gridbox{ opacity: 0.6; transition: 0.35s ease-in-out; } } @media only screen and (max-width: 1024px) and (min-width: 769px){  #w_grid-1630114846151:before{ height:5rem !important; } #w_grid-1630114850464{ height: 5rem !important; overflow:hidden; } #w_fimg-1630115293625{ position: relative; width: 10rem !important; margin: 1rem 0 !important; overflow:hidden !important; } #w_fimg-1630115293625 img{ width: auto !important; height: 3rem !important; }  #w_grid-1630130378868{ min-height: 500px !important; } #w_grid-1630134034142{ display:none; } #w_grid-1630134727174{ margin: 4rem auto 4rem !important; } #w_grid-1630135166446{ display: none !important; }  #w_grid-1630291371167{ display:none !important; }  #w_grid-1630303388997> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width:100% !important; } #w_grid-1630303388997> div > .p_gridbox > .p_gridCell:nth-child(2n+0){ width:100% !important; } #w_grid-1630306345771> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width:100% !important; } #w_grid-1630306345771> div > .p_gridbox > .p_gridCell:nth-child(2n){ width:100% !important; } #w_grid-1630306747750> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width:100% !important; } #w_grid-1630306747750> div > .p_gridbox > .p_gridCell:nth-child(2n){ width:100% !important; } #w_grid-1635394837161> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width:100% !important; } #w_grid-1635394837161> div > .p_gridbox > .p_gridCell:nth-child(2n+2){ width:100% !important; }  #w_grid-1630311323667> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width:100% !important; } #w_grid-1630311323667> div > .p_gridbox > .p_gridCell:nth-child(2n){ width:100% !important; } #w_grid-1630312490538> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width:100% !important; } #w_grid-1630312490538> div > .p_gridbox > .p_gridCell:nth-child(2n){ width:100% !important; }  #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width:100% !important; } #content_box-1630114872572-1{ display:none; } #w_grid-1630121999064{ margin: 2rem auto 0 !important; } #w_grid-1630121999064{ display:none; } #w_grid-1630121999064 p{ text-align:center !important; } #w_common_text-1630122232566{ text-align:center; } #w_fimg-1630122163930{ display:none; } #w_common_text-1630122037087 p:nth-child(1){ display:none; } #w_grid-1630122391206{ margin: 1rem auto 2rem !important; } #w_grid-1630122391206 p{ text-align:center !important; } #w_grid-1630122391206 p span{ text-align:center !important; line-height: 1.5rem; } } @media only screen and (max-width: 1280px) and (min-width: 1025px){  #w_grid-1630114850464{ height:7rem !important; } #w_grid-1630114850464> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ width: 20% !important; } #w_grid-1630114850464> div > .p_gridbox > .p_gridCell:nth-child(2n){ width: 80% !important; } #w_fimg-1630115293625{ position: relative; width: 13rem !important; margin: 1.5rem 0 !important; overflow:hidden !important; } #w_fimg-1630115293625 img{ width: auto !important; height: 4rem !important; }  #w_grid-1630130378868{ min-height:600px !important; } #w_grid-1630134727174{ margin:2rem auto 0 !important; } #w_grid-1630134034142{ display:none !important; }  #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+1){ width:100% !important; margin: 0 auto 2rem; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+2){ display: none; width: 30% !important; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+3){ display: none; width: 70% !important; margin: 0 auto 2rem; } } @media only screen and (max-width: 1366px) and (min-width: 1281px){  #w_grid-1630130378868{ min-height:540px !important; } #w_grid-1630134727174{ margin:2rem auto 0 !important; } #w_grid-1630134034142{ display:none !important; }  #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+1){ width:100% !important; margin: 0 auto 2rem; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+2){ display: none; width: 30% !important; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+3){ display: none; width: 70% !important; margin: 0 auto 2rem; } } @media only screen and (max-width: 1440px) and (min-width: 1367px){  #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+1){ width: 75% !important; margin: 0 auto 2rem; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+2){ display: none; width: 30% !important; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+3){ display: block; width: 25% !important; margin: 0 auto 2rem; } } @media only screen and (max-width: 1680px) and (min-width: 1441px){  #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+1){ width: 75% !important; margin: 0 auto 2rem; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+2){ display: none; width: 30% !important; } #w_grid-1630114872572> div > .p_gridbox > .p_gridCell:nth-child(3n+3){ display: block; width: 25% !important; margin: 0 auto 2rem; } } @media only screen and (max-width:1920px) and (min-width: 1681px){ }.singleBannerBox{ position:relative; margin: 0; overflow:hidden; cursor: default; } .singleBannerBox .bannerImgBox{ position:relative; width:100%; overflow:hidden; z-index:1; } .singleBannerBox .bannerImgBox .bannerPic{ display:block; width: 100%; height: 500px; } .singleBannerBox .bannerImgBox .bannerMo{ display:none; } .singleBannerBox .bannerFontBox{ position:absolute; top: calc((600px - 7rem)/2); left: calc((100vw - 1680px)/2); width: 100%; max-width: 1680px; z-index:2; } .singleBannerBox .bannerFontBox .tiTle{ text-align: center; font-size: 2.5rem; font-weight: bold; color: var(--bColor); line-height: 1.5; letter-spacing: 0; } .singleBannerBox .bannerFontBox .adVer{ text-align: center; font-size: 1.25rem; color: var(--hColor); line-height: 1.5; letter-spacing: 0; text-transform: Capitalize; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 0; overflow: hidden; } .singleBannerBox .productFont .tiTle{ color:var(--fColor); } .singleBannerBox .bannerFontBox .adVer span:nth-child(1){ font-weight:300; } .singleBannerBox .productFont .adVer span:nth-child(1){ color:var(--fColor); } .singleBannerBox .bannerFontBox .adVer span:nth-child(2){ display:block; font-size:1rem; } .singleBannerBox .productFont .adVer span:nth-child(2){ color:var(--fColor); } @media only screen and (max-width:768px){ .singleBannerBox{ margin:5rem auto 0; } .singleBannerBox .bannerImgBox .bannerPic{ display:none; } .singleBannerBox .bannerImgBox .bannerMo{ display:block; width: 100%; height: 200px; transition: 0.35s ease-in-out; } .singleBannerBox .bannerFontBox{ top: calc((300px - 10rem)/2); left: 0; max-width: 100%; padding: 0 2rem; transition: 0.35s ease-in-out; } .singleBannerBox .bannerFontBox .tiTle{ font-size: 2rem; } .singleBannerBox .bannerFontBox .adVer span:nth-child(1){ font-size: 2.8rem; line-height: 1; } .singleBannerBox .bannerFontBox .adVer span:nth-child(2){ font-size:0.875rem; } } @media only screen and (min-width:769px) and (max-width:1024px){ .singleBannerBox .bannerImgBox .bannerPic{ display:none; } .singleBannerBox .bannerImgBox .bannerMo{ display:block; width: 100%; height: 400px; transition: 0.35s ease-in-out; } .singleBannerBox .bannerFontBox{ top: calc((480px - 80px)/2); left: 0; max-width: 100%; padding: 0 2rem; transition: 0.35s ease-in-out; } } @media only screen and (min-width:1025px) and (max-width:1280px){ .singleBannerBox .bannerImgBox .bannerPic{ display:none; } .singleBannerBox .bannerImgBox .bannerMo{ display:block; width: 100%; height: 400px; transition: 0.35s ease-in-out; } .singleBannerBox .bannerFontBox{ top: calc((480px - 80px)/2); left: 0; max-width: 100%; padding: 0 2rem; transition: 0.35s ease-in-out; } } @media only screen and (min-width:1281px) and (max-width:1366px){ .singleBannerBox .bannerImgBox .bannerPic{ display:none; } .singleBannerBox .bannerImgBox .bannerMo{ display:block; width: 100%; height: 400px; transition: 0.35s ease-in-out; } .singleBannerBox .bannerFontBox{ top: calc((480px - 80px)/2); left: 0; max-width: 100%; padding: 0 2rem; transition: 0.35s ease-in-out; } } @media only screen and (min-width:1367px) and (max-width:1440px){ .singleBannerBox .bannerImgBox .bannerPic{ display:none; } .singleBannerBox .bannerImgBox .bannerMo{ display:block; width: 100%; height: 400px; transition: 0.35s ease-in-out; } .singleBannerBox .bannerFontBox{ top: calc((480px - 80px)/2); left: 0; max-width: 100%; padding: 0 2rem; transition: 0.35s ease-in-out; } }.c_portalResEbizads_banner-01001002 .p_MatteIcon .iconfont:before{ content:'\e602'; } .c_portalResEbizads_banner-01001002 >div{ animation-fill-mode:both; }@CHARSET "UTF-8"; *{ padding: 0; margin: 0; } .pagebox{ width: 100%; }.pagebox,#-remove--flag{}body,#-remove--flag{} #c_portalResBreadcrumb_nav-1630313118209{ 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; } #w_grid-1630313118184 .p_MatteIcon .iconfont:before{ content:'\e602'; } #w_grid-1630313118184 >div{ animation-fill-mode:both; } #w_grid-1630313118184 > div > .p_gridbox > .p_gridCell:nth-child(n+1){ margin-left:0px; clear:left; }  @media only screen and (min-width: 769px){ #w_grid-1630313118184> div > .p_gridbox > .p_gridCell{ margin-bottom:0rem; margin-top:0rem; margin-left:0; } #w_grid-1630313118184> div > .p_gridbox > .p_gridCell:nth-child(2n+0){ width:50%; margin-left:0; margin-right:0; clear:none; } #w_grid-1630313118184> div > .p_gridbox > .p_gridCell:nth-child(2n+1){ margin-left:0; clear:left; margin-right:0; width:50%; } #w_grid-1630313118184> div > .p_gridbox > .p_gridCell:nth-child(2n){ margin-right:0; } } @media only screen and (max-width: 1024px) and (min-width: 769px){ } #w_grid-1630313118194 > div > .p_gridbox > .p_gridCell:nth-child(n+1){ margin-left:0; clear:left; }   @media only screen and (max-width: 1024px) and (min-width: 769px){ } #w_grid-1630313118184{ width:100%; max-width:1744px; 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:32px; padding-right:32px; padding-bottom:0px; } #w_grid-1630313118194{ width:100%; max-width:1744px; 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:32px; padding-right:32px; padding-bottom:0px; } #c_portalResIntro_detail-1630313118219{ 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_portalResIntro_category-1630313118214 .p_MatteIcon .iconfont:before{ content:'\e602'; } #c_portalResIntro_category-1630313118214 >div{ animation-fill-mode:both; } #c_portalResIntro_category-1630313118214{ 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:auto; margin-top:0px; margin-bottom:0px; min-width:0px; height:auto; padding-right:0px; } #c_portalResEbizads_banner-1630313118204 .p_MatteIcon .iconfont:before{ content:'\e602'; } #c_portalResEbizads_banner-1630313118204 >div{ animation-fill-mode:both; } #c_portalResEbizads_banner-1630313118204{ 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:auto; margin-top:0px; margin-bottom:0px; min-width:0px; height:auto; padding-right:0px; }