@charset "utf-8";
/*重置属性*/
body,div,p,ul,ol,dl,dt,dd,li,form,input,table,th,td,img,h1,h2,h3,h4,h5,h6 {margin: 0; padding: 0;}

body {font-style: normal; font-family:'Microsoft Yahei','微软雅黑','Simsun','宋体','Arial', sans-serif;}
li { list-style:none;}
img { border:none;}
a { text-decoration:none; -webkit-tap-highlight-color:transparent;}
table { border-spacing:0; border-collapse:collapse;}
*{-webkit-appearance:none;}


/*通用*/
.hide {display: none;}
.flt {float:left;}
.frt {float:right;}
.clear { clear: both;}
.clearfix { *zoom: 1;} 
.clearfix:before, .clearfix:after { display: table; line-height: 0; content: "";}
.clearfix:after { clear: both;}


/* 基本布局 */


body{
    background-color:#f5f5f5;
    overflow-x:hidden;
}
.coffee-main{
    height:80px;
    width:1200px;
    margin:0 auto;
}
.coffee-main a{
    margin-top:16px;
    margin-left:40px;
}
.coffee-main a:first-child{
    margin-left:0;
}
.coffee-main img{
    display:block;
}

.coffee-banner{
    position:relative;
    left:0;
    top:0;
    height:0;
    padding-bottom:30.6%;
}

.coffee-banner .banner-img{
    display:block;
    width:100%;
}

.banner-box{
    position: absolute;
    left: 18%;
    bottom: 2%;
    width: 12%;
}

.banner-box a{
    display:block;
}

.banner-box a img{
    display:block;
    width:100%;
}

.coffee-background{
    padding-top:74px;
}
.coffee-title{
    display:block;
    margin:0 auto 50px;
}

.coffee-live{
    width:1200px;
    height:328px;
    margin:0 auto;
    background-image: url(../../../Images/activity/mouser_live_week/06.png);
}

.coffee-live-text{
    width:863px;
    color:#555555;
    text-align:justify;
    word-wrap: break-word;
    line-height:25px;
    padding-left:33px;
    padding-top:40px;
}

.coffee-live-text div{
    margin-top:10px;
}
.coffee-live-text div:first-child{
    margin-top:0;
}

.coffee-content{
    padding-top:74px;
}


.content-title{
    display:block;
    margin:0 auto 40px;
}

.content-wrap{
    width:1200px;
    height:484px;
    margin:0 auto;
    background-image: url(../../../Images/activity/mouser_live_week/08.png);
    background-position:top right;
    background-repeat: no-repeat;
    background-size:auto 100%;
}


.content-box{
    position:relative;
    left:0;
    top:0;
    margin-top:28px;
    margin-left:27px;
    width:416px;
    height:430px;
    background-color:#FFFFFF;
    padding:0 46px 0px 22px;
}
.content-box:first-child{
    margin-left:0;
}

.live-title{
    text-align:center;
    color:#333333;
    font-size:22px;
    font-weight:bold;
    padding-top:20px;
}

.live-num{
    color:#1B8BCE;
    font-weight:bold;
    font-size:22px;
    font-style:oblique;
}

.live-desc{
    margin-left:46px;
    color:#333333;
    line-height:25px;
    text-align:justify;
}

.live-desc-wrap{
    margin-top:15px;
}

.live-desc-wrap:first-child{
    margin-top:20px;
}


.live-line{
    width:6px;
    height:6px;
    background-color:#1B8BCE;
    border-radius:6px;
    margin-top:9px;
}

.live-font{
    font-size:14px;
    color:#555555;
    margin-left:13px;
    text-align:justify;
    word-break:break-all;
}

.live-desc-box{
    margin-top:10px;
}

.live-a{
    position:absolute;
    right:0;
    bottom:0;
    width:72px;
    height:53px;
}
.live-a img{
    display:block;
}

.coffee-teacher{
    padding-top:74px;
}

.teacher-content{
    position: relative;
    left:0;
    top:0;
    width:1198px;
    margin:0 auto;
    
}

.teacher-list li{
    float:left;
    width:304px;
    height:414px;
    padding-left:37px;
    padding-right:37px;
    background-image:url(../../../Images/activity/mouser_live_week/14.png);
    margin-left:32px;
    
}
.teacher-list li:first-child{
    margin-left:0;
}


.teacher-l{
    position:absolute;
    right:1198px;
    top: 50%;
    width:100%;
    height:360px;
    background-image:url(../../../Images/activity/mouser_live_week/36.png);
    background-position: right top;
    margin-top: -180px;
}
.teacher-r{
    position:absolute;
    left:1198px;
    top: 50%;
    width:100%;
    height:360px;
    background-image:url(../../../Images/activity/mouser_live_week/35.png);
    background-position: left top;
    margin-top: -180px;
}
.teacher-img{
   display:block;
   margin:38px auto 0;
}

.teacher-name{
    text-align:center;
    color:#333333;
    font-weight:bold;
    font-size:18px;
    padding-top:20px;
}

.teacher-desc{
    text-align:center;
    color:#444444;
    padding-top:10px;
    text-align:center;
    word-break:break-all;
}

.teacher-introduction{
    text-align:justify;
    word-break:break-all;
    font-size:14px;
    line-height:22px;
    color:#444444;
    padding-top:15px;
}

.teacher-title{
    display:block;
    margin:0 auto 36px;
}

.coffee-product{
    padding-top:74px;
}
.product-title{
    display:block;
    margin:0 auto 36px;
}

.product-list{
    width:1208px;
    margin:0 auto;
}

.product-list li{
    float:left;
    width:286px;
    height:346px;
    margin:0 8px;
}

.product-list li .product-top{
    position: relative;
    left:0;
    top:0;
    height:180px;
    background-color:#d7e5ed;
}
.product-top img{
    position:absolute;
    left:50%;
    top:50%;
}
.product-top img.product1{
    margin-left:-56px;
    margin-top:-56.5px;
}

.product-middle{
    background-color:#ffffff;
    padding-top:1px;
    height:123px;
}

.product-middle .logo{
    display:block;
    margin:20px auto 0;
}

.product-desc{
    text-align:center;
    padding:0 10px;
    color:#333333;
    padding-top:15px;
    font-weight:bold;
}

.product-bottom{
    display:block;
    height:42px;
    line-height:42px;
    text-align:center;
    color:#F9F8F8;
    background-color:#549dce;
}

.product-top img.product2{
    margin-left:-78.5px;
    margin-top:-58.5px;
}
.product-top img.product3{
    margin-left:-75px;
    margin-top:-54.5px;
}
.product-top img.product4{
    margin-left:-96px;
    margin-top:-75.5px;
}

.coffee-sponsor{
    padding-top:74px;
}

.sponsor-title{
    display: block;
    margin: 0 auto 40px;
}

.sponsor-wrap{
    padding:60px 0;
    background-image:url(../../../Images/activity/mouser_live_week/24.png);
    background-size:auto 100%;
}

.sponsor-box{
    width:1200px;
    margin:30px auto 0;
    background-color:#FFFFFF;
    padding-top:36px;
}

.sponsor-box:first-child{
    margin-top:0;
}

.sponsor-box .img1{
    display:block;
    margin:0 auto 0;
}

.sponsor-desc{
    padding:20px 48px 35px;
    line-height:38px;
    text-align:justify;
    color:#333333;
}
.sponsor-desc a{
    color:#005AD7
}

.coffee-gift{
    padding-top:74px;
}

.gift-title{
    display: block;
    margin: 0 auto 30px;
}

.gift-box{
    text-align:center;
    color:#333333;
    padding-bottom:40px;
}

.gift-list{
    width:1200px;
    margin:0 auto;
    padding-bottom:85px;
}

.gift-list li{
    position: relative;
    left:0;
    top:0;
    float:left;
    width:240px;
    height:282px;
   
}


.gift-list li:nth-child(odd){
    background: linear-gradient(-90deg, #157CC1, #559ECE);
    box-shadow: 0px 25px 49px 0px rgba(16, 84, 221, 0.31);
    color:#FFFFFF;
}

/* .gift-list li:nth-child(even){
    background: #FFFFFF;
    box-shadow: -38px 2px 57px 2px rgba(211, 211, 211, 0.45);
    color:#333333;
} */

.gift-list li:nth-child(even){
    background: #FFFFFF;
    box-shadow: 0px 25px 49px 0px rgba(16, 84, 221, 0.31);
    color:#333333;
}

.gift-list li div{
    position:absolute;
    left:0;
    bottom:30px;
    width:100%;
    text-align:center;
}

.gift-list li img{
    display:block;
    
}

.gift-list li img.gift1{
    margin:65px auto 0;
}
.gift-list li img.gift2{
    margin:36px auto 0;
}
.gift-list li img.gift3{
    margin:40px auto 0;
}
.gift-list li img.gift4{
    margin:47px auto 0;
}
.gift-list li img.gift5{
    margin:19px 0 0 27px;
}
.coffee-footer{
    background-color:#0170B2;
    text-align:center;
    color:#FFFFFF;
    font-size:12px;
    line-height:23px;
    padding-top:25px;
    padding-bottom:5px;
}