.generic{ width:100%; min-width:930px; float:left; overflow:hidden; position:relative}
.generic .box{ width:1920px; overflow:hidden; float:left; position:absolute; left:50%; margin-left:-960px; font-family:HanHei SC; font-weight:200}
.generic .tit_box{ width:720px; float:left; position:absolute; opacity:1; z-index:10}
.generic .t_1{ width:100%; float:left; font-size:28px; line-height:32px; padding-bottom:8px}
.generic .t_2{ width:100%; float:left; font-size:50px; line-height:60px; padding-bottom:28px}
.generic .t_3{ width:100%; float:left; font-size:22px; line-height:36px}
.generic .img_box{ width:1920px; float:left; position:absolute; top:0; left:0}
.generic .img_box img{ width:1920px; float:left; position:absolute; top:0; left:0}

.main_1{ height:984px; background-color:#F1F1F1}
.main_1 .box{ height:984px}
.main_1 .tit_box{ height:300px; top:122px; left:600px; text-align:center; opacity:0}
.main_1 .t_1{ font-size:66px; line-height:70px; padding-bottom:1px}
.main_1 .t_2{ font-size:26px; line-height:52px; color:rgba(50,50,50,0.7)}
.main_1 .img_box{ height:984px; opacity:0}

@keyframes img_1{ 0%{ opacity:0; transform:translate3d(0,-80px,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate3d(0,0,0) rotate(0.0001deg)}}
@-webkit-keyframes img_1{ 0%{ opacity:0; -webkit-transform:translate3d(0,-80px,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)}}

.main_2{ height:980px}
.main_2 .box{ height:980px}
.main_2 .tit_box{ width:920px; text-align:center; color:#fff; top:136px; left:500px; opacity:0}
.main_2 .tit_box .t_3{ color:rgba(255,255,255,0.7)}
.main_2 .img_box{ height:980px}
.main_2 .img_box img{ height:980px}

.main_3{ height:1188px}
.main_3 .box{ height:1188px}
.main_3 .tit_box{ width:920px; text-align:center; top:126px; left:500px; opacity:0}
.main_3 .tit_box .t_3{ color:rgba(50,50,50,0.7)}
.main_3 .img_box{ height:1188px}
.main_3 .img_box img{ height:1188px}
.main_3 ul{ width:320px; float:left; margin:52px 0 0 300px}
.main_3 li{ width:160px; float:left; padding-top:90px; font-size:18px; color:rgba(34,34,34,0.8); text-align:center; line-height:24px; background:url(https://images.iyunmai.com/home/static/images/accessories/yogamat-cork/img_3.png) no-repeat center 0; opacity:0}
.main_3 .ic_2{ background-position:center -200px}

.main_4{ height:692px}
.main_4 .box{ height:692px}
.main_4 .tit_box{ color:#fff; top:185px; left:1112px}
.main_4 .tit_box .t_2{ opacity:0}
.main_4 .tit_box .t_3{ color:rgba(255,255,255,0.7); opacity:0}
.main_4 .img_box{ height:692px}
.main_4 .img_box img{ height:692px}

.main_5{ height:1367px}
.main_5 .box{ height:1367px}
.main_5 .tit_box{ width:1020px; text-align:center; top:122px; left:450px; opacity:0}
.main_5 .tit_box .t_3{ color:rgba(50,50,50,0.7)}
.main_5 .img_box{ height:1367px}
.main_5 .img_box img{ height:1367px}
.main_5 .tit_box_2{ width:480px; float:left; position:absolute; top:531px; left:442px; z-index:30; opacity:1}
.main_5 .tit_box_2 .t_4{ width:100%; height:32px; line-height:32px; float:left; overflow:hidden; font-size:24px; color:#323232; padding-bottom:11px}
.main_5 .tit_box_2 .t_5{ width:400px; height:42px; float:left; color:rgba(50,50,50,0.7); font-size:16px; line-height:26px; border-left:1px solid #323232; padding-left:37px; margin:0 0 0 9px}
.main_5 .tit_box_2 .mt__5{ margin-top:-5px}
.main_5 .tit_box_2 .w_46{ width:46px}
.main_5 .tit_box_3{ top:997px; left:1085px}

.main_6{ height:1118px}
.main_6 .box{ height:1118px}
.main_6 .tit_box{ width:920px; color:#fff; text-align:center; top:126px; left:500px; opacity:0}
.main_6 .tit_box .t_3{ color:rgba(255,255,255,0.7)}
.main_6 .img_box{ height:1118px}
.main_6 .img_box img{ height:1118px}
.main_6 ul{ width:480px; float:left; margin:46px 0 0 220px}
.main_6 li{ width:160px; float:left; padding-top:88px; font-size:18px; color:rgba(255,255,255,0.7); text-align:center; line-height:24px; background:url(https://images.iyunmai.com/home/static/images/accessories/yogamat-cork/img_6.png) no-repeat center 0; opacity:0}
.main_6 .ic_2{ background-position:center -200px}
.main_6 .ic_3{ background-position:center -400px}

.main_7{ height:792px}
.main_7 .box{ height:792px}
.main_7 .tit_box{ top:230px; left:380px}
.main_7 .tit_box .t_2{ opacity:0}
.main_7 .tit_box .t_3{ color:rgba(0,0,0,0.7); opacity:0}
.main_7 .img_box{ height:792px}
.main_7 .img_box img{ height:792px}

.main_8{ height:1144px}
.main_8 .box{ height:1144px}
.main_8 .tit_box{ width:920px; text-align:center; top:120px; left:500px; opacity:0}
.main_8 .tit_box .t_3{ color:rgba(0,0,0,0.7)}
.main_8 .img_box{ height:1144px}
.main_8 .img_box img{ height:1144px}
.main_8 .tit_box_2{ width:200px; float:left; position:absolute; top:360px; left:378px; z-index:30}
.main_8 .tit_box_2 .t_4{ width:100%; line-height:30px; float:left; font-size:26px; color:#8b5e47; padding-bottom:10px}
.main_8 .tit_box_2 .t_5{ width:100%; float:left; font-size:18px; line-height:28px; color:rgba(139,94,71,0.8)}
.main_8 .tit_box_3{ text-align:right; left:1340px}
.main_8 .tit_box_4{ top:965px}
.main_8 .tit_box_5{ top:965px; text-align:center; left:854px}
.main_8 .tit_box_6{ top:965px; text-align:right; left:1340px}

.main_9{ height:1085px}
.main_9 .box{ height:1085px}
.main_9 .tit_box{ width:920px; text-align:center; top:126px; left:500px; opacity:0}
.main_9 .tit_box .t_3{ color:rgba(0,0,0,0.7)}
.main_9 .img_box{ height:1085px}
.main_9 .img_box img{ height:1085px}
.main_9 ul{ width:1392px; float:left; position:absolute; top:602px; left:256px; z-index:10}
.main_9 li{ width:348px; float:left; text-align:center; color:rgba(50,50,50,0.7); font-size:20px; line-height:24px; padding-bottom:352px}

.main_10{ height:1082px}
.main_10 .box{ height:1082px}
.main_10 .tit_box{ width:100%; text-align:center; top:98px; left:0}
.main_10 .imgBox{ width:calc(100% - 6px); height:852px; float:left; position:absolute; top:230px; left:6px}
.main_10 .imgBox .img_1{ width:calc(33.33% - 6px); height:846px; float:left; overflow:hidden; position:relative; margin-right:6px}
.main_10 .imgBox .img_1 img{ width:1200px; height:1604px; float:left; position:absolute; top:50%; left:50%; margin:-802px 0 0 -600px; transform:scale(0.55); transition:transform 0.3s ease; -webkit-transform:scale(0.55); -webkit-transition:transform 0.3s ease}
.main_10 ul{ width:66.66%; height:852px; float:left}
.main_10 li{ width:calc(50% - 6px); height:420px; float:left; margin:0 6px 6px 0; overflow:hidden; position:relative}
.main_10 li img{ width:1200px; height:780px; float:left; position:absolute; top:50%; left:50%; margin:-390px 0 0 -600px; transform:scale(0.55); transition:transform 0.3s ease; -webkit-transform:scale(0.55); -webkit-transition:transform 0.3s ease}

@media only screen and (max-width : 1920px){
	.main_10 .box{ width:100%; left:0; margin-left:0}
}

@keyframes opac_1{ 0%{ opacity:0} 100%{ opacity:1}}
@-webkit-keyframes opac_1{ 0%{ opacity:0} 100%{ opacity:1}}

@keyframes scale_1{ 0%{ transform:translate3d(0,0,0) scale(1.12) rotate(0.0001deg)} 99.99%{ transform:translate3d(0,0,0) scale(1) rotate(0.0001deg)} 100%{ transform:translate3d(0,0,0) scale(1) rotate(0)}}
@-webkit-keyframes scale_1{ 0%{ -webkit-transform:translate3d(0,0,0) scale(1.12) rotate(0.0001deg)} 99.99%{ -webkit-transform:translate3d(0,0,0) scale(1) rotate(0.0001deg)} 100%{ -webkit-transform:translate3d(0,0,0) scale(1) rotate(0)}}

@keyframes x_15{ 0%{ opacity:0; transform:translate3d(15px,0,0) rotate(0.0001deg)} 99.99%{ opacity:1; transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; transform:translate3d(0,0,0) rotate(0)}}
@-webkit-keyframes x_15{ 0%{ opacity:0; -webkit-transform:translate3d(15px,0,0) rotate(0.0001deg)} 99.99%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0.0001deg)} 100%{ opacity:1; -webkit-transform:translate3d(0,0,0) rotate(0)}}