@charset "utf-8";

/* frame */
a { transition:all 0.5s;}
body{min-width: 1400px;font-weight:400;background: #fff;}
.clear{clear: both;}
#content{zoom: 1;width: 100%;}
.row{width: 1400px; margin: auto; position: relative;}
.row:after { content:""; clear:both; display:block; overflow:hidden;}


#header { display: none;}
#headerChannel{ position:relative; width:100%; height: 600px; background:url(../img/bg-banner.jpg) repeat-x center top; background-size: cover; }
#headerChannel .logo{display:block;width:300px;height:50px;float: left;overflow:visible;margin: 41px 0 100px;}
#headerChannel .logo img { height:100%; width:auto;}
#headerChannel .links {height: 36px;position: absolute;top: 48px;right: 0;}
#headerChannel .links a { height:34px;background: none; border: 1px solid #fff; border-radius: 18px;line-height: 34px;text-align: center;color: #fff;font-size: 16px; float:left; padding:0 1.5em;margin-left:10px;}
#headerChannel .links a:hover {background: linear-gradient(180deg, #FFFFFF 0%, #EEFCFF 100%); color: #1067DB;}

#headerChannel .con { position: absolute; left: 0; right: 0; top: 234px; line-height: 1.3; color: #fff; text-align: center; }
#headerChannel .con h1 { font-size: 92px; font-weight: bold; }
#headerChannel .con h3 { margin-top: 20px; font-size: 18px; }

.rowIntro { margin-top: 40px; padding: 30px 40px; text-align: justify; font-size: 20px; color: #021FA4; text-indent: 2em; line-height: 38px; background: #fff; border-radius: 5px; font-weight: normal; box-shadow: 0px 0px 20px 0px rgba(16, 103, 219, 0.2); }



.featuresList { padding: 50px 0; }
.featuresList li { position: relative; background: #fff; display: flex; gap: 40px; align-items: center; padding: 40px 80px; }
.featuresList .pic { position: relative; order: 1; }
.featuresList .pic::before { display: block; content: ''; width: 400px; height: 303px; background: url(../img/pic-01.png) no-repeat center center; background-size: contain; }
.featuresList .con { position: relative; flex: 1 0 0%; }
.featuresList .title { font-size: 40px; font-weight: bold; line-height: 53px; text-align: left; color: #021FA4; }
.featuresList .intro { position: relative; margin-top: 26px; font-size: 16px; color: #666; line-height: 32px; text-align: justify; }
.featuresList .intro p { position: relative; padding-left: 35px; margin-bottom: 1.1em; }
.featuresList .intro p:last-of-type { margin-bottom: 0; }
.featuresList .intro p::before { position: absolute; left: 16px; top: 14px; content: ''; width: 5px; height: 5px; background: #1067DB; border-radius: 50%; }

.featuresList li:nth-last-child(odd) { background: #F5FAFF; }
.featuresList li:nth-last-child(odd) .pic { order: 0; }

.featuresList .li2 .pic::before { height: 311px; background-image: url(../img/pic-02.png); }
.featuresList .li3 .pic::before { width: 420px; background-image: url(../img/pic-03.png); }
.featuresList .li4 .pic::before { width: 415px; height: 342px; background-image: url(../img/pic-04.png); }
.featuresList .li5 .pic::before { height: 309px; background-image: url(../img/pic-05.png); }
.featuresList .li6 .pic::before { height: 272px; background-image: url(../img/pic-06.png); }

.featuresList .pic::before,
.featuresList .con,
.featuresList .intro { transition: all ease 0.5s; }

.featuresList li:hover { z-index: 1; }
.featuresList li:hover .pic::before { transform: translateX(15px); }
.featuresList li:hover .con { transform: translateX(-15px); }
.featuresList li:nth-last-child(odd):hover .pic::before { transform: translateX(-15px); }
.featuresList li:nth-last-child(odd):hover .con { transform: translateX(15px); }