@CHARSET "UTF-8";
body{overflow-x: hidden;}
main.t2 div.container{margin-top: 0; }

main.t2 .ke-content section{display: flex; margin-top: 136px; position: relative;}
main.t2 .ke-content section>*{width: calc(50% - 32px); position: relative; z-index: 2;}
main.t2 .ke-content section>*:last-child{margin-left: 64px;}

main.t2 .ke-content section>img{position: absolute; z-index:0; width:calc(50% - 32px); height:193px; object-fit:contain; opacity: 0.5; top: -20px; transform: translateY(0);}
main.t2 .ke-content section:nth-child(2n)>img{left: 0; object-position: left bottom;}
main.t2 .ke-content section:nth-child(2n+1)>img{right: 0;object-position: right bottom;}
main.t2 .ke-content section:nth-child(1)>img{margin-top: 60px;}
main.t2 .ke-content section:before{content:"";position: absolute; top: -20px; left: 0; right: 0; height: 193px; z-index: 1; background:#fff;}
main.t2 .ke-content section:nth-child(1):before{margin-top: 60px;}
main.t2 .ke-content section.show:before{top: 193px; height: 0; transition: all 0.8s linear; transition-delay: 0.8s;}

main.t2 .ke-content section>span{display: flex; flex-direction: column; align-items: center; position: relative;}
main.t2 .ke-content section>span img{ z-index: 1;min-height: 320px; object-fit: cover;}
main.t2 .ke-content section>span:after{content:""; border-left: 1px solid #FFAB91; position:absolute; left:50%; top: 320px; bottom: -272px; width: 1px;}
main.t2 .ke-content section>div{margin-top: 176px; }

main.t2 .ke-content section>div.overlay{padding:32px 40px; margin-top: 0; align-self: center; background:#E64A19; margin-left:-94px; width: calc(50% - 2px);}
main.t2 .ke-content section>div.overlay:first-child{margin-right: -32px; margin-left: 0;}
main.t2 .ke-content section>div.overlay p{color: #FFFFFF;}
main.t2 .ke-content section>div.overlay p.title{color: #ffffff;}

main.t2 .ke-content section:first-child{margin-top: 0;}
main.t2 .ke-content section:first-child>span{margin-top: 80px;}
main.t2 .ke-content section:first-child>div{display: flex; flex-direction: column; margin-top: 0;}
main.t2 .ke-content section:first-child>div:before{content:""; height: 170px; border-left: 1px solid #FFAB91; margin-bottom:40px; align-self:center;}
main.t2 .ke-content section:first-child>div.overlay:before{display: none;}
main.t2 .ke-content section:last-child>span:after{display: none;}
main.t2 .ke-content section.last>span:after{display: none;}
main.t2 .ke-content section.last>div:before{display: none;}
main.t2 .ke-content section div>h1{color: #E64A19;border:none;padding: 0;}
main.t2 .ke-content section div.overlay>h1{color: #FFFFFF;}
main.t2 .ke-content section div>p{margin-bottom: 8px;}
main.t2 .ke-content section div>a{margin-left: 0;}
main.t2 .ke-content section div>div.sub-nav{margin-top: 24px;}

main.t2 .ke-content section>span:before{content: '';width: 16px;height: 16px;background: #FF5722;display: block;position: absolute;z-index: 2;}
main.t2 .ke-content section:nth-child(2n+1)>span:before{left:32px;top: -8px;}
main.t2 .ke-content section:nth-child(2n)>span:before{left: -8px;top: 176px;}

div.sub-nav{background: #F0F5FF; padding: 16px 40px 26px 40px;}
div.sub-nav h3{color:#1D39C4;font-size: 14px;line-height: 28px;font-weight: bold;margin: 0;margin-bottom: 8px;}
div.sub-nav h3:after{display: inline-flex; content:'';background-image: url(../img/arrow.svg);width: 30px;height: 13px;margin-left: 8px;}
div.sub-nav ul{padding: 0;}
div.sub-nav ul>li{min-width: 136px; margin-right:16px; list-style: none;}
div.sub-nav ul a{color:#2F54EB;padding: 8px;display: inline-flex;align-items: center; border-radius: 8px;}
div.sub-nav ul a font{line-height: 24px;font-size: 16px;font-weight: bold;}
div.sub-nav ul a img{width: 20px;height: 20px;margin-right: 8px;}
div.sub-nav ul a img:last-of-type{display: none;}


div.sub-nav ul a:hover{background: #2F54EB;color: #FFFFFF;}
div.sub-nav ul a:hover img:first-child{display: none;}
div.sub-nav ul a:hover img:last-of-type{display: block;}
div.sub-nav ul a:last-child{margin-right: 0;}


/**动画相关样式**/
main.t2 .ke-content {}
main.t2 .ke-content *{transition: all 0.5s ease-out;}
main.t2 .ke-content div.sub-nav ul a,
main.t2 .ke-content div.sub-nav ul a font{transition: all 0.0s ease-out;}
main.t2 .ke-content section>*{transform: translateY(60%); opacity: 0; transition: all 1s ease-out;}
main.t2 .ke-content section>div.overlay:last-child{transform: translateY(0) translateX(60%);}
main.t2 .ke-content section>div.overlay:first-child{transform: translateY(0) translateX(-60%);}
main.t2 .ke-content section>span:after,
main.t2 .ke-content .streamer:after{transform:  translateY(-50%) scaleY(0); transition: all 1s ease-out;}
main.t2 .ke-content section:first-child>div:not(.overlay){transform: translateY(0); opacity: 1;}
main.t2 .ke-content section:first-child>div:not(.overlay)>*{transform: translateY(60%); opacity: 0;}
main.t2 .ke-content section:first-child>div:before{transform:  translateY(-50%) scaleY(0);}
main.t2 .ke-content>h2, 
main.t2 .ke-content>div.col, 
main.t2 .ke-content>div.sub-nav,
main.t2 .ke-content>newslist,
main.t2 .ke-content>table{transform: translateY(60%); opacity: 0;}

main.t2 .ke-content section.show>span,
main.t2 .ke-content .streamer.show{transform: translateY(0); opacity: 1; transition: all 1s ease-out; transition-delay: 0.6s;}
main.t2 .ke-content section.show>div{transform: translateY(0); opacity: 1; transition: all 1.2s ease-out; transition-delay: 1s;}
main.t2 .ke-content section.show>div.overlay{transform: translateX(0);}
main.t2 .ke-content section.show-line>span:after,
main.t2 .ke-content .streamer.show-line:after{transform:  translateY(0) scaleY(1); transition:all 1.5s ease-out;}

main.t2 .ke-content section:first-child.show>div:before{transform:  translateY(0) scaleY(1); transition:all 0.8s ease-out;}
main.t2 .ke-content section:first-child.show>span{transition-delay: 0.4s;}
main.t2 .ke-content section:first-child.show>div.overlay{transition-delay: 1.2s; }
main.t2 .ke-content section:first-child.show>div:not(.overlay)>*{transform: translateY(0); opacity: 1; transition:all 1s ease-out; transition-delay: 1.2s; }

main.t2 .ke-content>h2.show{transform: translateY(0); opacity: 1; transition: all 0.4s ease-out;}
main.t2 .ke-content>div.col.show{transform: translateY(0); opacity: 1; transition: all 1s ease-out;}
main.t2 .ke-content>div.sub-nav.show{transform: translateY(0); opacity: 1; transition: all 0.6s ease-out;}
main.t2 .ke-content>newslist.show,
main.t2 .ke-content>table.show{transform: translateY(0); opacity: 1; transition: all 1s ease-out;}