@charset "utf-8";

/* CSS Document */
@font-face{font-family:"Open Sans";src:url('../font/opensans-regular.eot');src:url('../font/opensans-regular.eot?#iefix') format('embedded-opentype'),url('../font/opensans-regular.woff') format('woff'),url('../font/opensans-regular.ttf') format('truetype'),url('../font/opensans-regular.svg#open_sansregular') format('svg');font-weight:normal;font-style:normal;}
@font-face{font-family:'open_sansbold';src:url('../font/OpenSans-Bold-webfont.eot');src:url('../font/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),url('../font/OpenSans-Bold-webfont.woff') format('woff'),url('../font/OpenSans-Bold-webfont.ttf') format('truetype'),url('../font/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');font-weight:normal;font-style:normal;}
@font-face{font-family:"Open Sans Semibold";src:url("../font/OpenSans-Semibold.eot?") format("eot"),url("../font/OpenSans-Semibold.woff") format("woff"),url("../font/OpenSans-Semibold.ttf") format("truetype"),url("../font/OpenSans-Semibold.svg#OpenSans-Semibold") format("svg");font-weight:normal;font-style:normal;}
@font-face{font-family:'Avenir Next Regular';font-style:normal;font-weight:normal;src:local('../font/Avenir Next LT Pro Regular'),url('../font/AvenirNextLTPro-Regular.woff') format('woff');}
@font-face{font-family:'Avenir Next';font-style:normal;font-weight:normal;src:local('../font/Avenir Next LT Pro Demi'),url('../font/AvenirNextLTPro-Demi.woff') format('woff');}
@font-face{font-family:"Noteworthy Light";src:url("../font/noteworthy-light.eot"); /* IE9*/src:url("../font/noteworthy-light.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("../font/noteworthy-light.woff2") format("woff2"), /* chrome、firefox */
    url("../font/noteworthy-light.woff") format("woff"), /* chrome、firefox */
    url("../font/noteworthy-light.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
url("../font/noteworthy-light.svg#Noteworthy Light") format("svg"); /* iOS 4.1- */}
html body{margin:0;padding:0;line-height:normal;background:#000;}
a{text-decoration:none!important;-webkit-transition:0.5s;-moz-transition:0.5s;-o-transition:0.5s;-ms-transition:0.5s;transition:0.5s;color:#fff;}
a:hover{text-decoration:none!important;}
p{margin:0 0 20px 0;}
img{border:0;}
.margin10{margin-top:10px;}
.margin20{margin-top:20px;}
.margin30{margin-top:30px;}
.margin40{margin-top:40px;}

.top-bg{text-align:center;background:#000;}
.top-bg img{max-width:100%;}
.tagline h1{font-size:47px;font-family:"Noteworthy Light";color:#fff;text-align:center;}
.block-wrp{width:380px;padding:0 10px;float:left;}
.block-wrp.center{padding-left:48px;}
.radio-box{background:url("../images/block1-bg.png") center center no-repeat;background-size:100% auto;min-height:355px;padding:100px 15px 0 50px;}
.radio-box h2{font-size:37px;font-family:"Noteworthy Light";color:#fff;text-align:center;line-height:48px;}
.radio-box h2 span{color:#fcee21;}
.perct{color:#f77a1e;float:left;font-size:38px;font-family:"Avenir Next";left:14px;position:relative;top:36px;}
.perct span{position:relative;right:70px;top:10px;}
.perct span img{width:80px;}
.coupon{color:#fff;font-size:17px;font-family:"Avenir Next Regular";width:100%;text-align:center; margin-top: 10px;}
.coupon span{color:#ffff00}
.order-btn{text-align:center;width:100%;}
.order-btn img{width:100px;}
.video-box{background:url("../images/block2-bg.png") center center no-repeat;max-width:320px;background-size:100% auto;min-height:355px;padding:100px 15px 0 15px;}
.video-box h2{font-size:37px;font-family:"Noteworthy Light";color:#fff;text-align:center;line-height:48px;}
.video-box h2 span{color:#fcee21;}
.video-box .perct{color:#f77a1e;float:left;font-size:38px;font-family:"Avenir Next";left:-6px;position:relative;top:28px;}
.video-box .perct span{position:relative;right:70px;top:10px;}
.video-box .perct span img{width:80px;}
.app-box{background:url("../images/block1-bg.png") center center no-repeat;background-size:100% auto;min-height:355px;padding:70px 15px 0 50px;}
.app-box h2{font-size:37px;font-family:"Noteworthy Light";color:#fff;text-align:center;line-height:48px;}
.app-box h2 span{color:#fcee21;}
.app-box .perct{color:#f77a1e;float:left;font-size:23px;font-family:"Noteworthy Light";left:33px;line-height:18px;position:relative;top:15px;}
.perct span{position:relative;right:70px;top:10px;}
.perct span img{width:80px;}
.footer{padding:30px 0;margin-top:20px;}
.footer .dis_date{font-family:"Avenir Next Regular";font-size:16px;text-transform:uppercase;color:#fff;text-align:center;width:100%;}
@media screen and (max-width:1200px){
    .block-wrp{width:320px;}
    .perct{color:#f77a1e;float:left;font-family:"Avenir Next";font-size:27px;left:14px;position:relative;top:21px;}
    .video-box .perct{color:#f77a1e;float:left;font-family:"Avenir Next";font-size:28px;left:-6px;position:relative;top:15px;}
    .app-box h2{font-size:30px;line-height:42px;}
    .app-box{padding-top:80px;}
    .app-box .perct{left:20px;line-height:10px;top:6px;}
}
@media screen and (max-width:991px){
    .block-wrp{width:380px; float: none; margin:0 auto 50px auto; display: table;}
    .perct{color:#f77a1e;float:left;font-size:38px;font-family:"Avenir Next";left:14px;position:relative;top:36px;}
    .video-box .perct{color:#f77a1e;float:left;font-size:38px;font-family:"Avenir Next";left:-6px;position:relative;top:28px;}
    .app-box h2{font-size:37px;font-family:"Noteworthy Light";color:#fff;text-align:center;line-height:48px;}
    .app-box{min-height:355px;padding:70px 15px 0 50px;}
    .app-box .perct{left:33px;line-height:18px;position:relative;top:15px;}
    .tagline{margin-bottom: 30px;}
}

@media screen and (max-width:480px){
    .block-wrp{width:320px; float: none; margin:0 auto 50px auto; display: table;}
    .perct{color:#f77a1e;float:left;font-family:"Avenir Next";font-size:27px;left:14px;position:relative;top:21px;}
    .video-box .perct{color:#f77a1e;float:left;font-family:"Avenir Next";font-size:28px;left:-6px;position:relative;top:15px;}
    .app-box h2{font-size:30px;line-height:42px;}
    .app-box{padding-top:80px;}
    .app-box .perct{left:20px;line-height:10px;top:6px;}
    .tagline h1{font-size: 28px;}
    .coupon{ margin-top: -15px;}
}