/* 
* @Author: zty
* @Date:   2015-10-13 15:48:16
* @Last Modified time: 2016-02-15 17:32:48
*/
/*f1 s*/
.linebox{
    height: 310px;
    margin-top: 375px;
}
.zh{
    width: 7.7083%;
    right: -110%;
}
.en{
    width: 16.35417%;
    right: 130%;
}
.coffee{
    width: 11.35%;
    left: 20.9791%;
    bottom: -5px;
    display: none;
}
.line{
    height: 1px;
    background: #fff;
    right: 0;
}
.line_up{
    width: 0;
    top: 0;
}
.line_down{
    width: 0;
    bottom: 0;
}

.zh img,.en img,.coffee img{width:100%;}
/*f1 o*/
/*f2 s*/
.introduce{

    float:right;

    color: #fff;
    transform:scale(0,0);
    overflow:hidden;
}
.introduce .con{width:100%; overflow:hidden;}
.introduce a{ color:#657863; margin-top:6px; display:block; width:266px; height:33px; line-height:33px; text-align:center; margin:0 auto;padding:5px; border:1px solid #657863;  -moz-border-radius: 10px;      /* Gecko browsers */
    -webkit-border-radius: 10px;   /* Webkit browsers */
    border-radius:10px;             /* W3C syntax */}

.introduce p{
    opacity: 0;
}
.introduce p:first-child{
    margin-top: -30px;
}
.img_list{
    width: 604px;
    height: 170px;
    left: 20%;
    bottom: 50px;
}
.big{
    animation:change 0.4s ease-in;
    -moz-animation:change 0.4s ease-in;
    -webkit-animation:change 0.4s ease-in;
    transform:scale(1,1);
    -moz-transform:scale(1,1);
    -webkit-transform:scale(1,1);
}
@keyframes change{
    from {transform:scale(0.1,0.1);}
    to {transform:scale(1,1);}
}
/*fire fox*/
@-moz-keyframes change{
    from {transform:scale(0.1,0.1);}
    to {transform:scale(1,1);}
}
/*webkit*/
@-webkit-keyframes change{
    from {transform:scale(0.1,0.1);}
    to {transform:scale(1,1);}
}
.sec_text{
    animation:move 0.4s ease-in;
    -moz-transform:scale(1,1);
}
@keyframes move{
transform:translate(0,-10px);
}
@-moz-keyframes move{
transform:translate(0,-10px);
}
@-webkit-keyframes move{
transform:translate(0,-10px);
}
.black_line{
    height: 1px;
    width: 100%;
    background: #000;
    left: 0;
    top: 5px;
}
.itemslist{
    margin-left: 70px;
}
.itemslist li{
    width: 10px;
    height: 10px;
    background: #000;
    border-radius: 5px;
    margin-right: 140px;
    float: left;
}
.img_box li:last-child{
    margin-right: 0;
}
.img_box .color{
    display: none;
}
.itemslist li:last-child{
    margin-right: 0;
}
.img_box li{
    width: 142px;
    height: 86px;
    border: 1px solid #333;
    position: relative;
    float: left;
    margin-right: 9px;
    margin-top: 42px;
    filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
}
.img_box li img{
    position: absolute;
    left: 0;
    top: 0;
    display: block;
}
.img_box p{
    color: #b9b8b8;
    font-size: 16px;
    text-align: center;
    margin-top: 90px;
    display: none;
}
.img_box li:nth-child(1){
    background: url(../images/img_01.jpg);
}
.img_box li:nth-child(2){
    background: url(../images/img_03.jpg);
}
.img_box li:nth-child(3){
    background: url(../images/img_09.jpg);
}
.img_box li:nth-child(4){
    background: url(../images/img_11.jpg);
}
.img_box li:hover{
    transition:filter 2s;
    -moz-transition:filter 2s;
    -webkit-transition:filter 2s;
    filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
}
/*f2 o*/
/*f3 s*/
.date_list{
    float: left;
    width: 620px;
}


.newright{
    float: right;
    overflow: hidden;
    padding-left: 10px;

}


.date_list li{
    height: 111px;

    margin-bottom: 66px;
}
.date_box{
    display: none;
    width: 160px;
    height: 150px;
    background: url(../images/newimg.png) no-repeat center center;background-size:100% 100%;
    margin: 2px;    padding-top: 10px;
}

.date_box img{	width: 105px;
    height: 105px;border: solid 5px #FFF;display:block;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;
    margin-left: 14px;

}



.box_border{
    /*border: 1px solid #000;*/
    width: 73px;
    height: 109px;
    float: right;
}
.f3_item{
    width:73%;
    padding-bottom: 10px;
/*    background:url(../images/bg11.jpg) repeat-x left 110px;*/
}
.day{
    text-align: center;
    line-height: 64px;
    color: #fff;
    font-size: 36px;
/*    border-bottom: 1px solid #fff;*/
}
.year{
    line-height: 40px;
    text-align: center;
}
.b_line{
    height: 1px;
    width: 100%;
    background: rgba(0,0,0,0.4);
    display:block;
}
.f3_title{
    font-size: 18px;
    color: #fff;
    line-height: 40px;
    text-align: left;
}
.f3_title a{  font-size: 18px;
    color: #333333;}
.f3_text{

    line-height: 2;
    height:73px;
    overflow:hidden;
    text-align: left;
}
.f3_text a{    font-size: 16px;
    color: #666666;}
.f3_textbox{
    width:491px;
    display: none;
    border-bottom: 1px solid #7d7d7d;
}
.tar{
    text-align: right;
}
.left_box{
    margin-right: 20px;
}
.right_box{
    margin-left: 20px;
}
.b_line{
    width: 0px;
}
.date_box p{
    display: none;
}
/*f3 o*/
/*f4 s*/
.f4_img_list li{
    border: 1px solid #434343;
    float: left;
    filter: grayscale(0%);
    background:#000 url(../images/giff.gif) no-repeat  center  center;
}
.f4_img_list li:nth-child(1){
    background:#000 url(../images/giff.gif) no-repeat  center  center;
}
.f4_img_list li:nth-child(2){
    background:#000 url(../images/giff.gif) no-repeat  center  center;
}
.f4_img_list li:nth-child(3){
    background:#000 url(../images/giff.gif) no-repeat  center  center;
    border-right: none;
}
.f4_img_list li:nth-child(4){
    background:#000 url(../images/giff.gif) no-repeat  center  center;
}
.f4_img_list li:nth-child(5){
    background:#000 url(../images/giff.gif) no-repeat  center  center;
}
.f4_img_list li:nth-child(6){
    background:#000 url(../images/giff.gif) no-repeat  center  center;
    border-right: none;
}




.bg_mask_border{
    width: 246px;
    height: 140px;
    background: rgba(0,0,0,0.3);
    margin: 0 auto;
    border-radius: 2px;
    padding: 2px;
    box-shadow: 6px 6px 6px #333;
    display: none;
}
.bg_mask{
    width: 246px;
    height: 140px;
    background: rgba(0,0,0,0.5);
    /*position:relative;
    z-index:100;*/
}
.coffee_name{
    width: 144px;
    height: 59px;
    padding-top: 10px;
    border: 2px solid #fff;
    border-left: none;
    border-right: none;
    margin: 18px auto;
}
.coffee_name p{ height:25px; overflow:hidden; line-height:25px;}
.coffee_more img{
    display: block;
    margin: 0 auto;
}
.f4_img_list li:hover{
    transition:filter 2s;
    filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
}
.f4_img_list li:nth-child(n+4){
    border-bottom: none;
}
.f4_img_list li:nth-last-child(n+4){
    border-top: none;
}
/*#bg_list li{ position:relative; background:none!important; overflow:hidden;}
.bg_imgs{ left:0;top:0; z-index:0; width:100%; height:100%; transition: transform 1s;}
.bg_imgs:hover{ transform: scale(1.1,1.1);}*/
/*f4 o*/
/*f5 s*/


.online_messagebox{
    border: 14px solid transparent;
    border-image: url(../images/border_03.png) 14 14 round;
    -webkit-border-image: url(../images/border_03.png) 14 14 round;
}



.inline_message{

    background: rgba(0,0,0,0.6);
}

.f5_title{
    font-size: 26px;
    color: #ccc;
    line-height: 50px;
}
.input_list li{
    width: 380px;
    padding-left: 10px;
    border: 1px solid #272321;
    margin: 21px auto 0;
    background: rgba(0,0,0,0.2);
}

.input_list li:last-child{
    padding: 10px;
    width: 370px;
}
.input_list li:last-child textarea{
    background: none;
    width: 370px;
    border: none;
    color: #fff;
}






.input_list input{
    background: none;
    border: none;
    color: #fff;
    width: 350px;
    font-size: 14px;
}
.recruit_box{
    border: 14px solid transparent;
    border-image: url(../images/border_03.png) 14 14 round;
    -webkit-border-image: url(../images/border_03.png) 14 14 round;
}
.recruit{
    padding: 15px 26px;
    background: rgba(0,0,0,0.6);
}
.recruit_box .recruit_box_text{ display:block; height:auto; overflow:hidden;}

.recruit_box11 .recruit_box_text1{  float: right; display:block;position:relative;color:#000;background-image:url(../images/videokuang.png); background-size:100% 100%; }

.online_messagebox1{position:absolute; bottom: 0px; }
.recruit_box11{ margin-top: 100px;}
.recruit_box caption{
    color: #fff;
    text-align: left;
}
.recruit td{
    color: #999;
    font-size: 12px;
    line-height: 30px;
}
.loadmore{
    width: 121px;
    height: 33px;
    background: rgba(0,0,0,0.7);
    border: 1px solid #333;
    display: block;
    margin: 10px auto;
    line-height: 33px;
}
.contact_box{
    font-size:16px;
    color:#cccccc;
    text-align:right;
    margin-right: 43px;
    margin-top: 10px;
}
.contact_box span{height:33px; line-height:33px; display:block; float:left; margin-right:10px;}
.contact_box .contact_box_text{display:block; height:220px; overflow:hidden;}
.contact{
    width: 443px;
    height: 274px;
    padding: 15px 26px;
    background: rgba(0,0,0,0.6);
}
.contact td{
    line-height: 40px;
}
.online_messagebox,.recruit_box,.contact_box{
    transform:scale(0,0);
}

.online_messagebox1,.recruit_box11,.contact_box1{
    transform:scale(0,0);
}


.fd{
    animation:change 1.2s ease-out;
    -webkit-animation:change 1.2s ease-out;
    -moz-animation:change 1.2s ease-out;
    transform:scale(1,1);
}
@-moz-keyframes change{
    from {transform:scale(0,0);}
    to {transform:scale(1,1);}
}
@-webkit-keyframes change{
    from {transform:scale(0,0);}
    to {transform:scale(1,1);}
}
@-o-keyframes change{
    from {transform:scale(0,0);}
    to {transform:scale(1,1);}
}
/*f5 o*/



.erm2 img{ display: none;}

@media only screen and (min-width: 1000px) and (max-width: 1700px){
    /*head*/
    .zh{bottom: 230px;}
    .en{bottom: 160px;}
    /*head*/
    /*contact*/
    .recruit_box{height:440px;width:470px;margin-top:70px; float:right;}
    .recruit{height: 420px;width: 420px;}
    .recruit_box .recruit_box_text img{ display:block; width:400px; height:250px;}
    /*contact*/
    /*gbook*/
    .online_messagebox{height:440px;margin-top:70px;width: 430px;}
    .inline_message{height: 440px;	width: 390px;
        padding: 5px 20px;}

    .input_list li:last-child{height:100px;width:370px;}
    .input_list li:last-child textarea{width: 370px;height: 100px;}
    .input_list li{ height:30px;}
    .input_list input{line-height: 30px;height: 30px;}
    .loadmore{margin-top:-18px;}
    /*gbook*/
    /*about*/
    .introduce{height: 300px;margin-top: 140px;line-height: 30px;font-size: 14px;	width: 60%;	margin-right:140px;}
    .introduce .con{height: 180px;width:100%; margin-bottom:10px;  }

    /*about*/

    .date_list{ margin-top: 100px; }
    .newright img{ width: 280px}
    .online_messagebox1{ left:120px;}
    .online_messagebox1 img{ width: 430px;}

    .recruit_box11 .recruit_box_text1{   padding: 20px; width:450px; height: 350px; }
    .recruit_box11 .recruit_box_text1 iframe{ width: 100%; height:100%;}
}

@media only screen and (min-width:1700px){
    /*head*/
    .zh{bottom: 200px;}
    .en{bottom: 100px;}
    /*head*/
    /*contact*/
    .recruit_box{height:630px;width:530px;margin-top:130px; margin-bottom:20px;}
    .recruit{height: 600px;width: 475px;}
    /*contact*/
    /*gbook*/
    .online_messagebox{	height:630px;margin-top:130px; margin-bottom:20px;width: 495px;}
    .input_list li:last-child{height:200px;width:370px;}
    .input_list li:last-child textarea{width: 370px;height: 200px;}
    .inline_message{height: 600px;width: 443px;
        padding: 15px 26px;}

    .input_list li{ height:47px;}
    .input_list input{line-height: 47px;height: 47px;}
    .loadmore{margin-top:-18px;}
    /*gbook*/
    .introduce{height: 300px;margin-top: 200px;line-height: 37px;font-size: 16px;	width: 70%;	margin-right:50px;}
    .introduce .con{height: 230px;width:100%; margin-bottom:10px; }
    /*gbook*/


    .date_list{  margin-top: 200px;   }

    .newright img{ width: 310px; height: 655px;}
    .online_messagebox1{ left:230px;}
    .recruit_box11 .recruit_box_text1{   padding: 25px; width:564px; height:468px; margin-top: 100px;}
    .recruit_box11 .recruit_box_text1 iframe{ width: 100%; height:100%;}

}