#advan {

}
#advan:before {
content:"";
display:block;
width:calc(20.33% + 600px);
height:200vh;
background:#636268;
position:absolute;
top:0;
right:calc(79.67% - 600px);
z-index:10;
}
#advan.start:before {
width:0;
-webkit-transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
-moz-transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
}
#advan .cont-in {
padding-left:20.33%;
}
#advan .tit {
padding-top:237px;
padding-bottom:10px;
position:absolute;
}
#advan .tit .icon {
padding:10px 0;
}
#advan .tit .icon svg {
width:68px;
height:14px;
}
#advan .tit .icon svg polyline {
stroke-width:5px;
stroke:#1a1a1d;
fill:none;
stroke-dashoffset:100;
stroke-dasharray:100;
-webkit-transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 500ms;
-moz-transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 500ms;
transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 500ms;
}
#advan.enter-animate.start .tit .icon svg polyline {
stroke-dashoffset:0;
}
#advan .tit p {
width:100%;
line-height:148px;
overflow:hidden;
}
#advan .tit p span {
display:inline-block;
color:#1a1a1d;
font-size:122.83px;
line-height:148px;
font-family:"Conv_Montserrat-Black";
text-transform:uppercase;
-webkit-transform:translateX(-100%);
-moz-transform:translateX(-100%);
transform:translateX(-100%);
-webkit-transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 500ms;
-moz-transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 500ms;
transition:all 1000ms cubic-bezier(0.7, 0, 0.3, 1) 500ms;
}
#advan.enter-animate.start .tit p span {
-webkit-transform:translateX(0);
-moz-transform:translateX(0);
transform:translateX(0);
}
#advan .cont {
height:100vh;
}
#advan .cont .infor {
display:-webkit-flex;
display:flex;
justify-content:space-between;
flex-wrap:wrap;
align-items:center;
}
#advan .cont .infor .infor-left {
display:inline-block;
*display:inline;
*zoom:1;
vertical-align:middle;
width:510px;
position:relative;
z-index:1;
}
#advan .cont .infor .infor-left:after {
content:"";
width:100%;
text-align:center;
color:rgba(26,26,29,0.1);
font-size:150px;
line-height:normal;
font-family:"Conv_Montserrat-Black";
position:absolute;
bottom:0;
z-index:-1;
}
#advan .cont1 .infor .infor-left:after {
content:"01";
}
#advan .cont2 .infor .infor-left:after {
content:"02";
}
#advan .cont .infor .infor-left .infor-tit {
color:#1a1a1d;
font-size:23.15px;
line-height:62px;
font-family:"Microsoft Yahei";
}
#advan .cont .infor .infor-left .infor-txt p {
color:#1a1a1d;
font-size:14px;
line-height:30px;
font-family:"Microsoft Yahei";
margin-bottom:30px;
text-align:justify;
}
#advan .cont .infor .infor-right {
display:inline-block;
*display:inline;
*zoom:1;
vertical-align:middle;
width:calc(100% - 600px);
height:100vh;
}
#advan .cont1 .infor .infor-left {
padding-top:403px;
}
#advan .cont1 .infor .infor-left .infor-txt {
height:150px;
overflow:auto;
padding-right:24px;
}
/*凹槽宽度*/
#advan .cont1 .infor .infor-left .infor-txt::-webkit-scrollbar {
width:7px;
display:none;
}
#advan .cont1 .infor .infor-left .infor-txt:hover::-webkit-scrollbar {
display:block;
}
/*拖动条*/
#advan .cont1 .infor .infor-left .infor-txt::-webkit-scrollbar-thumb {
background-color:#ffbc1b;
}
/*背景槽*/
#advan .cont1 .infor .infor-left .infor-txt::-webkit-scrollbar-track {
background-color:#dbdbdb;
}
#advan .cont1 .infor .infor-right {
background:url(http://img.en.jihui88.com/upload/w/w2/winki/picture/2017/08/18/66ad60f7-2466-4916-8aeb-91582abd5c5f.jpg) top center no-repeat;
background-size:cover;
}
#advan .cont2 .infor .infor-left {

}
#advan .cont2 .infor .infor-right {
background:#f04c44;
}
#advan .cont2 .infor .infor-right .cont-pic img {
display:block;
width:100%;
}
#advan .cont2 .infor .infor-right .cont-infor {
padding:0 58px 84px 46px;
background:#f04c44;
position:relative;
}
#advan .cont2 .infor .infor-right .cont-infor ul {
border-top:1px solid rgba(166,166,128,0.2);
display:-webkit-flex;
display:flex;
justify-content:space-between;
position:relative;
}
#advan .cont2 .infor .infor-right .cont-infor ul li {

}
#advan .cont2 .infor .infor-right .cont-infor ul li .mask-pic {
max-height:60px;
padding:30px 8px;
}
#advan .cont2 .infor .infor-right .cont-infor ul li .mask-pic img {
display:block;
width:100%;
-webkit-filter:brightness(0.35);
-webkit-transition:all 400ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
-moz-transition:all 400ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
transition:all 400ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
}
#advan .cont2 .infor .infor-right .cont-infor ul li.active .mask-pic img {
-webkit-filter:brightness(1);
}
#advan .cont2 .infor .infor-right .cont-infor ul li .mask-txt {
color:#58575d;
font-size:14px;
line-height:46px;
position:absolute;
left:0;
width:100%;
text-align:center;
opacity:0;
-webkit-transition:all 400ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
-moz-transition:all 400ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
transition:all 400ms cubic-bezier(0.7, 0, 0.3, 1) 0ms;
}
#advan .cont2 .infor .infor-right .cont-infor ul li.active .mask-txt {
opacity:1;
}
#advan .cont2 .infor .infor-right .cont-infor .cont-line {
position:absolute;
width:calc(100% - 104px);
height:3px;
bottom:84px;
}
#advan .cont2 .infor .infor-right .cont-infor .cont-line:before {
content:"";
width:100%;
height:1px;
background:rgba(166,166,128,0.2);
position:absolute;
bottom:1px;
}
#advan .cont2 .infor .infor-right .cont-infor .cont-line .active-line {
display:block;
width:10%;
height:3px;
background:#58575d;
position:absolute;
}