*{ margin:0; padding:0;}
body{ overflow-x:hidden; font-family:"微软雅黑"; font-size:12px;}
ul,li,ol{ list-style:none;}
a{ text-decoration:none;}
.clear{ width:100%; height:1px; clear:both;}
img{ border:none;}
@font-face{ src:url(../font/FGH.TTF); font-family:FOP;}



/*section*/
.section{ width:100%; height:100%; overflow:hidden;} 
.section_bg_1{ background:url(../img/bg_1.jpg) left top no-repeat; background-size:cover;}
.section_bg_2{ background:url(../img/bg_2.jpg) left top no-repeat; background-size:cover;}
.section_bg_3{ background:url(../img/bg_3.jpg) left top no-repeat; background-size:cover;}
.section_bg_4{ background:url(../img/bg_4.jpg) left top no-repeat; background-size:cover;}



/*hover_bottom*/
.hover_bottom{ width:100%; height:56px; text-align:center; bottom:0px; position:fixed;}
.hover_bottom div{ width:100%; height:28px; line-height:28px; text-align:center; margin-top:18px; color:#FFF; font-size:14px;}
.hover_bottom img{ position:absolute; left:50%; margin-left:-8px; width:16px; height:18px;}

.hover_bottom img:nth-child(1){
	animation:mymove 1s infinite;
	animation-delay:0.25s;
	animation-timing-function:linear;
	/* Safari and Chrome */
	-webkit-animation:mymove 1s infinite;
	-webkit-animation-delay:0.25s;
	-webkit-animation-timing-function:linear;
}
@keyframes mymove{
from { opacity:0;}
to{ opacity:1;}
}
.hover_bottom img:nth-child(2){
	animation:mymove2 1s infinite;
	animation-delay:0.5s;
	animation-timing-function:linear;
	/* Safari and Chrome */
	-webkit-animation:mymove2 1s infinite;
	-webkit-animation-delay:0.5s;
	-webkit-animation-timing-function:linear;
}
@keyframes mymove2{
from { opacity:0;}
to{ opacity:1;}
}
.hover_bottom img:nth-child(3){
	animation:mymove3 1s infinite;
	animation-delay:0.75s;
	animation-timing-function:linear;
	/* Safari and Chrome */
	-webkit-animation:mymove3 1s infinite;
	-webkit-animation-delay:0.75s;
	-webkit-animation-timing-function:linear;
}
@keyframes mymove3{
from { opacity:0;}
to{ opacity:1;}
}



/*lanmu*/
.lanmu{ position:absolute; width:100%; height:68px; transition:all 0.5s; opacity:0; top:10px;}
.lanmu div{ width:100%; height:40px; text-align:center;}
.lanmu div img{ height:40px;}

.lanmu span{ width:100%; height:18px; text-align:center; display:inline-block; margin-top:10px;}
.lanmu span img{ height:18px;}

.active .lanmu{ opacity:1; transition-delay:1s; top:20px;}



/*section_1*/
.section_1{}
.section_1_top{ width:100%; margin-top:30px;}
.section_1_top div{ width:100%; text-align:center; margin-top:10px;}

.section_1_top div:nth-child(1) img{ width:120px;}
.section_1_top div:nth-child(2) img{ width:250px;}
.section_1_top div:nth-child(3) img{ width:210px;}

.section_1_bot{ position:absolute; bottom:80px; width:calc(100% - 30px); margin-left:15px; text-align:center;}
.section_1_bot img{ float:left; width:calc(100% / 3); margin-top:15px;}


/*section_2*/
.section_2{}
.section_2_top{ width:100%; margin-top:30px;}
.section_2_bot{ width:100%; height:calc(100% - 152px); margin-top:92px;}
.section_2_bot div{ float:left; width:100%; height:40px;}
.section_2_bot div img{ float:left; height:40px; transition:all 0.5s; opacity:0;}

.section_2_bot div:nth-child(1) img{ margin-left:calc(50% - 120px);}
.section_2_bot div:nth-child(2) img{ margin-left:calc(50% - 80px);}
.section_2_bot div:nth-child(3) img{ margin-left:calc(50% - 40px);}
.section_2_bot div:nth-child(4) img{ margin-left:calc(50% - 0px);}
.section_2_bot div:nth-child(5) img{ margin-left:calc(50% - 40px);}
.section_2_bot div:nth-child(6) img{ margin-left:calc(50% - 80px);}

.active .section_2_bot div:nth-child(1) img{ transition-delay:1.0s; opacity:1; margin-left:calc(50% - 120px);}
.active .section_2_bot div:nth-child(2) img{ transition-delay:1.2s; opacity:1; margin-left:calc(50% - 80px);}
.active .section_2_bot div:nth-child(3) img{ transition-delay:1.4s; opacity:1; margin-left:calc(50% - 40px);}
.active .section_2_bot div:nth-child(4) img{ transition-delay:1.6s; opacity:1; margin-left:calc(50% - 0px);}
.active .section_2_bot div:nth-child(5) img{ transition-delay:1.8s; opacity:1; margin-left:calc(50% - 40px);}
.active .section_2_bot div:nth-child(6) img{ transition-delay:2.0s; opacity:1; margin-left:calc(50% - 80px);}



/*section_3*/
.section_3{}
.section_3_bot{ width:100%; height:calc(100% - 144px); margin-top:88px;}

.section_3_bot_fl{ float:left; width:calc(100% / 3 * 1.2);}
.section_3_bot_fl div{ float:left; width:100%; height:50px;}
.section_3_bot_fl div img{ float:left; width:50px; height:50px; margin-left:calc(100% - 70px); transition:all 0.5s; opacity:0; display:block;}

.active .section_3_bot_fl div:nth-child(1) img{ transition-delay:1.0s; opacity:1; margin-left:calc(100% - 50px);}
.active .section_3_bot_fl div:nth-child(2) img{ transition-delay:1.3s; opacity:1; margin-left:calc(100% - 50px);}
.active .section_3_bot_fl div:nth-child(3) img{ transition-delay:1.6s; opacity:1; margin-left:calc(100% - 50px);}
.active .section_3_bot_fl div:nth-child(4) img{ transition-delay:1.9s; opacity:1; margin-left:calc(100% - 50px);}
.active .section_3_bot_fl div:nth-child(5) img{ transition-delay:2.2s; opacity:1; margin-left:calc(100% - 50px);}

.section_3_bot_fr{ float:left; width:calc(100% / 3 * 1.8);}
.section_3_bot_fr div{ float:left; width:100%; height:50px;}
.section_3_bot_fr div img{ float:left; margin-left:50px; height:50px; transition:all 0.5s; opacity:0; display:block;}

.active .section_3_bot_fr div:nth-child(1) img{ transition-delay:1.0s; opacity:1; margin-left:20px;}
.active .section_3_bot_fr div:nth-child(2) img{ transition-delay:1.3s; opacity:1; margin-left:20px;}
.active .section_3_bot_fr div:nth-child(3) img{ transition-delay:1.6s; opacity:1; margin-left:20px;}
.active .section_3_bot_fr div:nth-child(4) img{ transition-delay:1.9s; opacity:1; margin-left:20px;}
.active .section_3_bot_fr div:nth-child(5) img{ transition-delay:2.2s; opacity:1; margin-left:20px;}



/*section_4*/
.section_4{}

.section_4_tel{ height:25px; text-align:center; margin-top:110px;}
.section_4_tel img{ height:25px; position:relative;}
.section_4_tel img:nth-child(1){  animation:Move 4.0s infinite; animation-delay:0.2s;}
.section_4_tel img:nth-child(2){  animation:Move 4.0s infinite; animation-delay:0.4s;}
.section_4_tel img:nth-child(3){  animation:Move 4.0s infinite; animation-delay:0.6s;}
.section_4_tel img:nth-child(4){  animation:Move 4.0s infinite; animation-delay:0.8s;}
.section_4_tel img:nth-child(5){  animation:Move 4.0s infinite; animation-delay:1.0s;}
.section_4_tel img:nth-child(6){  animation:Move 4.0s infinite; animation-delay:1.2s;}
.section_4_tel img:nth-child(7){  animation:Move 4.0s infinite; animation-delay:1.4s;}
.section_4_tel img:nth-child(8){  animation:Move 4.0s infinite; animation-delay:1.6s;}
.section_4_tel img:nth-child(9){  animation:Move 4.0s infinite; animation-delay:1.8s;}
.section_4_tel img:nth-child(10){ animation:Move 4.0s infinite; animation-delay:2.0s;}
.section_4_tel img:nth-child(11){ animation:Move 4.0s infinite; animation-delay:2.2s;}
.section_4_tel img:nth-child(12){ animation:Move 4.0s infinite; animation-delay:2.4s;}
@keyframes Move{
	0%  { top:0px;}
	10% { top:-15px;}
	20% { top:0px;}
	30% { top:0px;}
	40% { top:0px;}
	50% { top:0px;}
	60% { top:0px;}
	70% { top:0px;}
	80% { top:0px;}
	90% { top:0px;}
	100%{ top:0px;}
}

.section_4_zi{ width:calc(100% - 25px); margin-left:25px; line-height:22px; font-size:13px; color:#FFF; margin-top:10px;}
.section_4_erma{ position:absolute; bottom:60px; width:100%; text-align:center; line-height:20px; font-size:13px; color:#FFF;}
.section_4_erma img{ width:25%; margin-top:10px;}


@media screen and (min-width: 359px) and (max-width: 500px){
	
.section_4_zi{ width:calc(100% - 25px); margin-left:25px; line-height:30px; font-size:14.5px; color:#FFF; margin-top:10px;}
.section_4_erma{ width:100%; text-align:center; line-height:20px; font-size:15px; color:#FFF;}
.section_4_erma img{ width:32%; margin-top:10px;}

}