/* 封面按钮1 */
@-ms-keyframes cover-btn1{
	from{ }
	33.9%{ opacity:0; }
	35.7%{ opacity:1; }
	98.2%{ opacity:1; }
	to{  }
}
@-moz-keyframes cover-btn1{
	from{ }
	33.9%{ opacity:0; }
	35.7%{ opacity:1; }
	98.2%{ opacity:1; }
	to{  }
}
@-o-keyframes cover-btn1{
	from{ }
	33.9%{ opacity:0; }
	35.7%{ opacity:1; }
	98.2%{ opacity:1; }
	to{  }
}
@-webkit-keyframes cover-btn1{
	from{ }
	33.9%{ opacity:0; }
	35.7%{ opacity:1; }
	98.2%{ opacity:1; }
	to{  }
}
@keyframes cover-btn1{
	from{ }
	33.9%{ opacity:0; }
	35.7%{ opacity:1; }
	98.2%{ opacity:1; }
	to{  }
}

#cover.active .btn1{
	animation:'cover-btn1' 28s ease-in-out 0s forwards;
	-ms-animation:cover-btn1 28s ease-in-out 0s forwards;
	-moz-animation:cover-btn1 28s ease-in-out 0s forwards;
	-o-animation:'cover-btn1' 28s ease-in-out 0s forwards;
	-webkit-animation:'cover-btn1' 28s ease-in-out 0s forwards;
}

/* 封面按钮2 */
@-ms-keyframes cover-btn2{
	from{ }
	98.2%{ opacity:0; }
	to{ opacity:1; }
}
@-moz-keyframes cover-btn2{
	from{ }
	98.2%{ opacity:0; }
	to{ opacity:1; }
}
@-o-keyframes cover-btn2{
	from{ }
	98.2%{ opacity:0; }
	to{ opacity:1; }
}
@-webkit-keyframes cover-btn2{
	from{ }
	98.2%{ opacity:0; }
	to{ opacity:1; }
}
@keyframes cover-btn2{
	from{ }
	98.2%{ opacity:0; }
	to{ opacity:1; }
}

#cover.active .btn2{
	animation:'cover-btn2' 28s ease-in-out 0s forwards;
	-ms-animation:cover-btn2 28s ease-in-out 0s forwards;
	-moz-animation:cover-btn2 28s ease-in-out 0s forwards;
	-o-animation:'cover-btn2' 28s ease-in-out 0s forwards;
	-webkit-animation:'cover-btn2' 28s ease-in-out 0s forwards;
}

/* 封面关闭 */
@-ms-keyframes cover-off{
	from{ }
	to{ opacity:0; transform: scale(0,0); }
}
@-moz-keyframes cover-off{
	from{ }
	to{ opacity:0; transform: scale(0,0); }
}
@-o-keyframes cover-off{
	from{ }
	to{ opacity:0; transform: scale(0,0); }
}
@-webkit-keyframes cover-off{
	from{ }
	to{ opacity:0; transform: scale(0,0); }
}
@keyframes cover-off{
	from{ }
	to{ opacity:0; transform: scale(0,0); }
}

.cover-off{
	animation:'cover-off' 0.4s ease-in-out 0s forwards;
	-ms-animation:cover-off 0.4s ease-in-out 0s forwards;
	-moz-animation:cover-off 0.4s ease-in-out 0s forwards;
	-o-animation:'cover-off' 0.4s ease-in-out 0s forwards;
	-webkit-animation:'cover-off' 0.4s ease-in-out 0s forwards;
}

/* 卷轴展开左 */
@-ms-keyframes reel1{
	from{  }
	to{ right: 100%; }
}
@-moz-keyframes reel1{
	from{  }
	to{ right: 100%; }
}
@-o-keyframes reel1{
	from{  }
	to{ right: 100%; }
}
@-webkit-keyframes reel1{
	from{  }
	to{ right: 100%; }
}
@keyframes reel1{
	from{  }
	to{ right: 100%; }
}

.reel-left2.open{
	animation:'reel1' 1.0s linear 0.5s forwards;
	-ms-animation:reel1 1.0s linear 0.5s forwards;
	-moz-animation:reel1 1.0s linear 0.5s forwards;
	-o-animation:'reel1' 1.0s linear 0.5s forwards;
	-webkit-animation:'reel1' 1.0s linear 0.5s forwards;
}

/* 卷轴展开右 */
@-ms-keyframes reel2{
	from{  }
	to{ left: 100%; }
}
@-moz-keyframes reel2{
	from{  }
	to{ left: 100%; }
}
@-o-keyframes reel2{
	from{  }
	to{ left: 100%; }
}
@-webkit-keyframes reel2{
	from{  }
	to{ left: 100%; }
}
@keyframes reel2{
	from{  }
	to{ left: 100%; }
}

.reel-right2.open{
	animation:'reel2' 1.0s linear 0.5s forwards;
	-ms-animation:reel2 1.0s linear 0.5s forwards;
	-moz-animation:reel2 1.0s linear 0.5s forwards;
	-o-animation:'reel2' 1.0s linear 0.5s forwards;
	-webkit-animation:'reel2' 1.0s linear 0.5s forwards;
}

/* 卷轴关闭左 */
@-ms-keyframes reel3{
	from{ right: 100%; }
	to{ right: 50% }
}
@-moz-keyframes reel3{
	from{ right: 100%; }
	to{ right: 50% }
}
@-o-keyframes reel3{
	from{ right: 100%; }
	to{ right: 50% }
}
@-webkit-keyframes reel3{
	from{ right: 100%; }
	to{ right: 50% }
}
@keyframes reel3{
	from{ right: 100%; }
	to{ right: 50%; }
}

.reel-left2.close{
	animation:'reel3' 1.0s linear 0s forwards;
	-ms-animation:reel3 1.0s linear 0s forwards;
	-moz-animation:reel3 1.0s linear 0s forwards;
	-o-animation:'reel3' 1.0s linear 0s forwards;
	-webkit-animation:'reel3' 1.0s linear 0s forwards;
}

/* 卷轴关闭右 */
@-ms-keyframes reel4{
	from{ left: 100%; }
	to{ left: 50%; }
}
@-moz-keyframes reel4{
	from{ left: 100%; }
	to{ left: 50%; }
}
@-o-keyframes reel4{
	from{ left: 100%; }
	to{ left: 50%; }
}
@-webkit-keyframes reel4{
	from{ left: 100%; }
	to{ left: 50%; }
}
@keyframes reel4{
	from{ left: 100%; }
	to{ left: 50%; }
}

.reel-right2.close{
	animation:'reel4' 1.0s linear 0s forwards;
	-ms-animation:reel4 1.0s linear 0s forwards;
	-moz-animation:reel4 1.0s linear 0s forwards;
	-o-animation:'reel4' 1.0s linear 0s forwards;
	-webkit-animation:'reel4' 1.0s linear 0s forwards;
}

/* 头图大标题 */
@-ms-keyframes hd-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@-moz-keyframes hd-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@-o-keyframes hd-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@-webkit-keyframes hd-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@keyframes hd-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}

#header.active .xhwlogo{
	animation:'hd-topic' 0.6s ease-in-out 1s forwards;
	-ms-animation:hd-topic 0.6s ease-in-out 1s forwards;
	-moz-animation:hd-topic 0.6s ease-in-out 1s forwards;
	-o-animation:'hd-topic' 0.6s ease-in-out 1s forwards;
	-webkit-animation:'hd-topic' 0.6s ease-in-out 1s forwards;
}

#header.active .dcxylogo{
	animation:'hd-topic' 0.6s ease-in-out 1.5s forwards;
	-ms-animation:hd-topic 0.6s ease-in-out 1.5s forwards;
	-moz-animation:hd-topic 0.6s ease-in-out 1.5s forwards;
	-o-animation:'hd-topic' 0.6s ease-in-out 1.5s forwards;
	-webkit-animation:'hd-topic' 0.6s ease-in-out 1.5s forwards;
}

/* 头图文字 */
@-ms-keyframes hd-title{
	from{ margin-left: 2em;}
	to{ opacity:1; }
}
@-moz-keyframes hd-title{
	from{ margin-left: 2em;}
	to{ opacity:1; }
}
@-o-keyframes hd-title{
	from{ margin-left: 2em;}
	to{ opacity:1; }
}
@-webkit-keyframes hd-title{
	from{ margin-left: 2em;}
	to{ opacity:1; }
}
@keyframes hd-title{
	from{ margin-left: 2em;}
	to{ opacity:1; }
}

#header.active .title{
	animation:'hd-title' 0.6s ease-in-out 2.0s forwards;
	-ms-animation:hd-title 0.6s ease-in-out 2.0s forwards;
	-moz-animation:hd-title 0.6s ease-in-out 2.0s forwards;
	-o-animation:'hd-title' 0.6s ease-in-out 2.0s forwards;
	-webkit-animation:'hd-title' 0.6s ease-in-out 2.0s forwards;
}

#header.active .title2{
	animation:'hd-title' 0.6s ease-in-out 2.5s forwards;
	-ms-animation:hd-title 0.6s ease-in-out 2.5s forwards;
	-moz-animation:hd-title 0.6s ease-in-out 2.5s forwards;
	-o-animation:'hd-title' 0.6s ease-in-out 2.5s forwards;
	-webkit-animation:'hd-title' 0.6s ease-in-out 2.5s forwards;
}


#header.active .text{
	animation:'hd-title' 0.6s ease-in-out 3s forwards;
	-ms-animation:hd-title 0.6s ease-in-out 3s forwards;
	-moz-animation:hd-title 0.6s ease-in-out 3s forwards;
	-o-animation:'hd-title' 0.6s ease-in-out 3s forwards;
	-webkit-animation:'hd-title' 0.6s ease-in-out 3s forwards;
}


/* 头图链接 */
@-ms-keyframes hd-link{
	from{ margin-top: 2em;}
	to{ opacity:1; }
}
@-moz-keyframes hd-link{
	from{ margin-top: 2em;}
	to{ opacity:1; }
}
@-o-keyframes hd-link{
	from{ margin-top: 2em;}
	to{ opacity:1; }
}
@-webkit-keyframes hd-link{
	from{ margin-top: 2em;}
	to{ opacity:1; }
}
@keyframes hd-link{
	from{ margin-top: 2em;}
	to{ opacity:1; }
}

#header.active .link{
	animation:'hd-link' 0.6s ease-in-out 3.0s forwards;
	-ms-animation:hd-link 0.6s ease-in-out 3.0s forwards;
	-moz-animation:hd-link 0.6s ease-in-out 3.0s forwards;
	-o-animation:'hd-link' 0.6s ease-in-out 3.0s forwards;
	-webkit-animation:'hd-link' 0.6s ease-in-out 3.0s forwards;
}

/* 头图向右提示 */
@-ms-keyframes hd-note{
	from{ margin-left: -2em;}
	to{ opacity:1; }
}
@-moz-keyframes hd-note{
	from{ margin-left: -2em;}
	to{ opacity:1; }
}
@-o-keyframes hd-note{
	from{ margin-left: -2em;}
	to{ opacity:1; }
}
@-webkit-keyframes hd-note{
	from{ margin-left: -2em;}
	to{ opacity:1; }
}
@keyframes hd-note{
	from{ margin-left: -2em;}
	to{ opacity:1; }
}

#header.active .note{
	animation:'hd-note' 0.6s ease-in-out 3.0s forwards;
	-ms-animation:hd-note 0.6s ease-in-out 3.0s forwards;
	-moz-animation:hd-note 0.6s ease-in-out 3.0s forwards;
	-o-animation:'hd-note' 0.6s ease-in-out 3.0s forwards;
	-webkit-animation:'hd-note' 0.6s ease-in-out 3.0s forwards;
}

/* 章节标题 */
@-ms-keyframes chapter{
	from{ margin-top: -2em;}
	to{ opacity:1; }
}
@-moz-keyframes chapter{
	from{ margin-top: -2em;}
	to{ opacity:1; }
}
@-o-keyframes chapter{
	from{ margin-top: -2em;}
	to{ opacity:1; }
}
@-webkit-keyframes chapter{
	from{ margin-top: -2em;}
	to{ opacity:1; }
}
@keyframes chapter{
	from{ margin-top: -2em;}
	to{ opacity:1; }
}

.chapter.active{
	animation:'chapter' 0.6s ease-in-out 0s forwards;
	-ms-animation:chapter 0.6s ease-in-out 0s forwards;
	-moz-animation:chapter 0.6s ease-in-out 0s forwards;
	-o-animation:'chapter' 0.6s ease-in-out 0s forwards;
	-webkit-animation:'chapter' 0.6s ease-in-out 0s forwards;
}

/* 内容渐出 */
@-ms-keyframes layout{
	from{ transform: scale(0.92,0.92); }
	to{ opacity:1; }
}
@-moz-keyframes layout{
	from{ transform: scale(0.92,0.92); }
	to{ opacity:1; }
}
@-o-keyframes layout{
	from{ transform: scale(0.92,0.92); }
	to{ opacity:1; }
}
@-webkit-keyframes layout{
	from{ transform: scale(0.92,0.92); }
	to{ opacity:1; }
}
@keyframes layout{
	from{ transform: scale(0.92,0.92); }
	to{ opacity:1; }
}

.layout.active{
	animation:'layout' 0.9s ease-in-out 0s forwards;
	-ms-animation:layout 0.9s ease-in-out 0s forwards;
	-moz-animation:layout 0.9s ease-in-out 0s forwards;
	-o-animation:'layout' 0.9s ease-in-out 0s forwards;
	-webkit-animation:'layout' 0.9s ease-in-out 0s forwards;
}

/* 内容标题 */
@-ms-keyframes ly-topic{
	from{ margin-top: -1em; }
	to{ opacity:1; }
}
@-moz-keyframes ly-topic{
	from{ margin-top: -1em; }
	to{ opacity:1; }
}
@-o-keyframes ly-topic{
	from{ margin-top: -1em; }
	to{ opacity:1; }
}
@-webkit-keyframes ly-topic{
	from{ margin-top: -1em; }
	to{ opacity:1; }
}
@keyframes ly-topic{
	from{ margin-top: -1em; }
	to{ opacity:1; }
}

.layout.active .topic{
	animation:'ly-topic' 0.6s ease-in-out 1.0s forwards;
	-ms-animation:ly-topic 0.6s ease-in-out 1.0s forwards;
	-moz-animation:ly-topic 0.6s ease-in-out 1.0s forwards;
	-o-animation:'ly-topic' 0.6s ease-in-out 1.0s forwards;
	-webkit-animation:'ly-topic' 0.6s ease-in-out 1.0s forwards;
}

/* 内容更多 */
@-ms-keyframes ly-full{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@-moz-keyframes ly-full{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@-o-keyframes ly-full{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@-webkit-keyframes ly-full{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@keyframes ly-full{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}

.layout.active .full{
	animation:'ly-full' 0.6s ease-in-out 1.5s forwards;
	-ms-animation:ly-full 0.6s ease-in-out 1.5s forwards;
	-moz-animation:ly-full 0.6s ease-in-out 1.5s forwards;
	-o-animation:'ly-full' 0.6s ease-in-out 1.5s forwards;
	-webkit-animation:'ly-full' 0.6s ease-in-out 1.5s forwards;
}

/* 内容其他 */
@-ms-keyframes ly-other{
	from{ transform: scale(1.2,1.2); }
	to{ opacity:1; }
}
@-moz-keyframes ly-other{
	from{ transform: scale(1.2,1.2); }
	to{ opacity:1; }
}
@-o-keyframes ly-other{
	from{ transform: scale(1.2,1.2); }
	to{ opacity:1; }
}
@-webkit-keyframes ly-other{
	from{ transform: scale(1.2,1.2); }
	to{ opacity:1; }
}
@keyframes ly-other{
	from{ transform: scale(1.2,1.2); }
	to{ opacity:1; }
}

.layout.active h3,
.layout.active .h3-line,
.layout.active .video,
.layout.active .video-line,
.layout.active .pic,
.layout.active .more{
	animation:'ly-other' 0.6s ease-in-out 2.0s forwards;
	-ms-animation:ly-other 0.6s ease-in-out 2.0s forwards;
	-moz-animation:ly-other 0.6s ease-in-out 2.0s forwards;
	-o-animation:'ly-other' 0.6s ease-in-out 2.0s forwards;
	-webkit-animation:'ly-other' 0.6s ease-in-out 2.0s forwards;
}

/* 封底渐入 */
@-ms-keyframes end-on{
	from{  }
	0.1%{ opacity: 0; transform: scale(1,1); }
	to{ opacity: 1; transform: scale(1,1); }
}
@-moz-keyframes end-on{
	from{  }
	0.1%{ opacity: 0; transform: scale(1,1); }
	to{ opacity: 1; transform: scale(1,1); }
}
@-o-keyframes end-on{
	from{  }
	0.1%{ opacity: 0; transform: scale(1,1); }
	to{ opacity: 1; transform: scale(1,1); }
}
@-webkit-keyframes end-on{
	from{  }
	0.1%{ opacity: 0; transform: scale(1,1); }
	to{ opacity: 1; transform: scale(1,1); }
}
@keyframes end-on{
	from{  }
	0.1%{ opacity: 0; transform: scale(1,1); }
	to{ opacity: 1; transform: scale(1,1); }
}

#end.active{
	animation:'end-on' 0.6s ease-in-out 0s forwards;
	-ms-animation:end-on 0.6s ease-in-out 0s forwards;
	-moz-animation:end-on 0.6s ease-in-out 0s forwards;
	-o-animation:'end-on' 0.6s ease-in-out 0s forwards;
	-webkit-animation:'end-on' 0.6s ease-in-out 0s forwards;
}

/* 封底蓝背景 */
@-ms-keyframes end-bg{
	from{  }
	to{ opacity: 1; }
}
@-moz-keyframes end-bg{
	from{  }
	to{ opacity: 1; }
}
@-o-keyframes end-bg{
	from{  }
	to{ opacity: 1; }
}
@-webkit-keyframes end-bg{
	from{  }
	to{ opacity: 1; }
}
@keyframes end-bg{
	from{  }
	to{ opacity: 1; }
}

#end.active .bg{
	animation:'end-bg' 0.8s linear 3.2s forwards;
	-ms-animation:end-bg 0.8s linear 3.2s forwards;
	-moz-animation:end-bg 0.8s linear 3.2s forwards;
	-o-animation:'end-bg' 0.8s linear 3.2s forwards;
	-webkit-animation:'end-bg' 0.8s linear 3.2s forwards;
}

/* 封底标题 */
@-ms-keyframes end-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@-moz-keyframes end-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@-o-keyframes end-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@-webkit-keyframes end-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}
@keyframes end-topic{
	from{ transform: scale(1.4,1.4); }
	to{ opacity:1; }
}

#end.active .topic{
	animation:'end-topic' 0.6s ease-in-out 3.9s forwards;
	-ms-animation:end-topic 0.6s ease-in-out 3.9s forwards;
	-moz-animation:end-topic 0.6s ease-in-out 3.9s forwards;
	-o-animation:'end-topic' 0.6s ease-in-out 3.9s forwards;
	-webkit-animation:'end-topic' 0.6s ease-in-out 3.9s forwards;
}

/* 封底文字 */
@-ms-keyframes end-text{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@-moz-keyframes end-text{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@-o-keyframes end-text{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@-webkit-keyframes end-text{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}
@keyframes end-text{
	from{ margin-top: 1em; }
	to{ opacity:1; }
}

#end.active .text{
	animation:'end-text' 0.6s ease-in-out 4.4s forwards;
	-ms-animation:end-text 0.6s ease-in-out 4.4s forwards;
	-moz-animation:end-text 0.6s ease-in-out 4.4s forwards;
	-o-animation:'end-text' 0.6s ease-in-out 4.4s forwards;
	-webkit-animation:'end-text' 0.6s ease-in-out 4.4s forwards;
}

/* 封底线 */
@-ms-keyframes end-line{
	from{  }
	to{ opacity:1; }
}
@-moz-keyframes end-line{
	from{  }
	to{ opacity:1; }
}
@-o-keyframes end-line{
	from{  }
	to{ opacity:1; }
}
@-webkit-keyframes end-line{
	from{  }
	to{ opacity:1; }
}
@keyframes end-line{
	from{  }
	to{ opacity:1; }
}

#end.active .line,#end.active .editor,#end.active .logo,#end.active .back{
	animation:'end-line' 0.6s ease-in-out 4.9s forwards;
	-ms-animation:end-line 0.6s ease-in-out 4.9s forwards;
	-moz-animation:end-line 0.6s ease-in-out 4.9s forwards;
	-o-animation:'end-line' 0.6s ease-in-out 4.9s forwards;
	-webkit-animation:'end-line' 0.6s ease-in-out 4.9s forwards;
}


