.font-white{color:#fff;}
.font-black{color:#333;}
.font-center{text-align: center;}
.title-box h1{font-size: 48px; line-height: 72px; padding:200px 0 20px 0; font-weight: 600;}
.title-box p{line-height: 36px; font-size: 24px; padding:40px 0 0;}
.section{position: relative; width: 100%; height: 1200px;}
/*
.section .transi-up{opacity: 0; -webkit-transform: translate3d(0,30px,0); -moz-transform: translate3d(0,30px,0); transform: translate3d(0,30px,0);}
.section.is-visible .transi-up{opacity: 1; -webkit-transition: opacity .8s; -moz-transition: opacity .8s; transition: opacity .8s; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); transform: translateZ(0);}
*/


.product-banner{position: relative; height: 1000px; overflow: hidden; background: url('../images/curtain_switch_banner.jpg') 50% no-repeat #141414; background-size: cover;}
.product-banner .wrap{height: 100%; position: relative;}
.product-banner .title-box {width: 100%; height: 1000px; color:#fff; display: table-cell; vertical-align: middle; padding:0 0 0 30px;}
.product-banner .title-box h1{padding:0;}
.product-banner .title-box .curve{background: #00a0e9; padding:6px 10px; margin:0 0 0 10px; color: #fff; border-radius: 10px;}
.product-banner .title-box p{color:#fff;}
.product-banner .title-box .fun{ line-height: 28px; font-size: 14px; color:#b2b2b2;}
.product-main-content{position: relative; overflow: hidden; box-sizing: border-box;}


.section_control{height: 1080px; background: #fff;}
.section_control .fun-control{width: 1440px; height: 340px; margin:160px auto 0; position: relative; display: flex;}
.section_control .fun-control div{color:#fff; position: relative; font-size: 18px; flex:1; background-repeat: no-repeat; background-size: 100% auto; text-align: center; color:#383838; margin:0 10px;}
.section_control .fun-control div span{position: absolute; left:0; bottom: 0; width: 100%;}
.section_control .fun-control .ct-1{background-image: url('../images/ct_1.jpg');}
.section_control .fun-control .ct-2{background-image: url('../images/ct_2.jpg');}
.section_control .fun-control .ct-3{background-image: url('../images/ct_3.jpg');}
.section_control .fun-control .ct-4{background-image: url('../images/ct_4.jpg');}


.section_smartcontrol{height: 1440px; background: url('../images/index_smartcontrol_bg.jpg') no-repeat #dee6ed; background-position: center bottom; background-size: 2560px 1440px;}
.section_smartcontrol .set-control{background: url('../images/img_set_time_control.jpg') center no-repeat; width: 1440px; height: 630px; margin:160px auto 0; position: relative; display: flex;}
.section_smartcontrol .set-control div{flex:1; position: relative; width:100%; font-size: 18px; font-weight: 600; color:#fff;}
.section_smartcontrol .set-control div span{position: absolute; left:0; bottom: 0; width: 100%; height: 64px; line-height: 64px; text-align: center; background: rgba(0,0,0,.6);}

.section_timecontrol{height: 1200px; background: url('../images/index_timecontrol_bg.jpg') no-repeat #fff; background-position: center; background-size: 2560px 1200px;}


.section_autopull{height: 1200px; background: url('../images/index_autopull_bg.jpg') no-repeat #6e675f; background-position: center bottom; background-size: 2560px 1200px;}
.section_autopull .img-pull{background: url('../images/img_pull.png') center no-repeat rgba(255,255,255,.8); width: 100%; height: 600px; margin:160px auto 0; position: relative;}

.section_communication{height: 1440px; background: #fff;}
.section_communication .wifi-comm{background: url('../images/img_communication.jpg') center no-repeat; width: 1440px; height: 720px; margin:160px auto 0; position: relative;}