body,html,.wrapmain{ height: 100%; width: 100%;  font-family: Arial,  "黑体", sans-serif;  -webkit-overflow-scrolling : touch;}
.wrapmain{ overflow: auto; }
.middleNavWrapper {
    background: #FFF;
    overflow: hidden;
    margin: 20px -15px;
}

.middleNav {
    margin: 0;
    padding: 0
}

.middleNavWrapper .middleNav .middleNav {
    float: left;
    color: #757575;
    font-size: 16px;
    font-family: Arial,  "黑体", sans-serif;
}

.middleNavWrapper .middleNav .middleNav_active {
    color: #0c0c0c;
}

#banner {
    position: relative;
    overflow: hidden;
    margin-bottom: 40px;
    width: 100%;
}
#banner img{
    width: 100%;
}
.part1,.part2,.part3,.part4,.part5{ width: 80%; margin: 0 auto; }





#cyln img,#fwzc img, #cpjs img,#xgpj img{ width: 100%; }
.nav_li li img{ width: 100%; }
.top_buy{ margin-bottom: 40px; }
.top_buy img{ width: 100%; }
.top_buy1,.top_buy2{ float: left; width: 100%; padding: 0 2%; position: relative; }
.top_buy_btn{ position: absolute; left: 69%; top: 59%; width: 11.5%; background: url(/common/new/img/hkitty/top_buy_bg.png) no-repeat; background-size: 100% 100%; }
.top_buy_btn img{ visibility: hidden; }
.top_buy_btn:hover{  background-image: url(/common/new/img/hkitty/top_buy_bg_n.png);}
.cyxz{ position: absolute; left: 52.5%;top: 48%; text-decoration: underline !important; }
.cyxz:hover{ text-decoration: underline !important; }

.zhezhaostc table{ width: 100%; margin: 20px 0 0}
.zhezhaostc table td{ border: 1px solid #d3d3d3; color: #595757; padding-left: 15px; line-height: 30px; vertical-align: middle;}
.zhezhaostc table .top_tb{ background: #595757; color: #fff; border-color: #595757; }
.zhezhaostc table tr:first-child{ background: #595757; color: #fff; border-color: #595757; }



.xiala_buy{ position: absolute; width: 8em; display: none; z-index: 2; min-width: 100%; }
.xiala_buy ul{padding: 0; margin: 0; text-align: center; }
.xiala_buy li{  background: #f5f5f5; border-bottom: 1px solid #666; }
.xiala_buy li a{ font-size: 12px;color: #000;line-height: 2em; }

.footer-ba img{ width: auto }
.nav_li ul{ padding: 0; margin: 0; }
.nav_li ul li{ padding: 0; float: left; width: 22%; margin: 0 1.5%; text-align: center; background: url(/common/new/img/hkitty/li.png) no-repeat center center; background-size: auto 100%;}
.nav_li ul li a { width: 100%; display: block; color: #333333; font-size: 20px; font-weight: bold; letter-spacing: 5px}
.nav_li ul li:hover{ background-image: url(/common/new/img/hkitty/li_now.png);}
.kt_title span{ color: #e60012; display: inline-block; margin-right: 10px; }
.kt_title {text-align: center;z-index: 9; position: relative; background-size: 100% auto; }
.kt_title p{ font-size: inherit; text-align: center; line-height: 1.2em; display: inline-block; position: relative; margin: 0;  margin-top: 8px; font-weight: bold; letter-spacing: 2px;}
.kt_title p:after{ position: absolute; width: 50px; height: 49px; content: " "; background-size: 100% 100%;right: -48px; top: -30px; }
.kt_title.pt_title{ background: none }
.pt_title em{ position: absolute; top: 0; bottom: 0; }
.pt_title .pt_title_l{ left: -6em; }
.pt_title .pt_title_r{ right: -6.5em; }


#cpjs .kt_title p:after{ right: 116px; }
#cpjs .kt_title{ background-image: url(/common/new/img/hkitty/part2_title_bg.jpg); }
.part_title{text-align: center;z-index: 9; position: relative; margin-top: 0;margin-bottom: 30px;}
.part_title span{ color: #e60012; display: inline-block; }
.part_title p{text-align: center; line-height: 1.2em; display: inline-block; position: relative; margin: 0;  margin-top: 8px; font-size: 20px; font-weight: bold; padding-bottom: 20px; }
.line{ position: absolute; left: 0; bottom: 0px; height: 8px; width: 100%; background: url(/common/new/img/hkitty/dotted.jpg) repeat-x; background-size: auto 100%; }

.intro{ position: absolute; }
.intro p,.part_right p,.part_left p,.part_right_info p,p{ font-size: 16px; }
#cyln{ margin-top: 30px; }
#cyln .part1{margin: 0 auto; margin-top: 30px;position: relative; }
#cyln .part1 .intro{ width: 37%; top: 22%; left: 60%; font-size: 16px; line-height: 1.6em; }
.intro p{ margin-bottom: 10px;font-family:  "黑体" }
#cyln .part1 .intro2{ width:41.2%; position: absolute; top: 65.4%; left: 29%; font-size: 16px; line-height: 1.7em; }
#cyln .part1 .intro2 p img{ width: 40%;  }
#cyln .part1 .intro2 p{ font-family:  "黑体" }
.intro2_img{ text-align: center; margin-bottom: 30px; }
.lm_intro{ width: 80.8%; margin: 20px auto 20px; position: relative; }
.lm_more{ position: absolute; width: 10.7%; left: 54%; top: 59%;  }
.lm_intro img{ width: 100%; }
#cyln .part2{  width: 80%; margin: 40px auto 0; position: relative; }
#cyln .part2 .intro{ width: 39.5%; position: absolute; top: 11%; left: 58%; font-size: 16px; line-height: 1.6em; }

#cpjs .part1{padding: 50px 15px 35px; margin: 0 auto;  position: relative; }
#cpjs .part1 .mt_pro{ width: calc(50% - 10px); float: left; margin-bottom: 10px; margin-right: 10px; position: relative; }
#cpjs .part1 .mt_pro .mt_pro_zz{ width: 100%; left:0; top: 0; position: absolute; z-index: 9; display: none }
#cpjs .part1 .mt_pro:hover .mt_pro_zz{ display: block; }
.mt_pro_gif{ position: absolute; width: 46%; left: 27.4%; top: 32%; z-index: 8}
.index4 .mt_pro_gif{ width: 34.5%; left: 34%; top: 28%; }
#cpjs .part1 .part1_right{ position: relative; padding-left: 15px; }
#cpjs .part1 .part1_left{ position: relative; padding-right: 26px;}
#cpjs .part1 .part1_left.index0{ padding-right: 15px;}
#cpjs .part1 .part1_left img{ position: relative; z-index: 9; margin-bottom: 9px;}
#cpjs .part1 .part1_left.index0 img{ margin-bottom: 0;}
.part_left,.part_right{ display: table-cell; width: 50%; padding: 0 15px; vertical-align: middle; }
#cpjs .part4 .part_left{ padding-left: 40px; }



#cpjs .part1 .part1_right .font_title{ margin-bottom: 30px; border-bottom: 2px #000 dashed;font-size: 24px;font-weight: bold;padding-bottom: 20px;margin-top: 10px; }
.title_mao{ position: absolute; width: 16%; right: 30px; top: -10px; max-width: 160px;}
.ffhh{ position: relative;bottom: 20%; width: calc(100% - 15px); text-align: right; display: none; float: left; margin-top: 16px; margin-bottom: 0;}
.ffhh a{ color: #000}
#cpjs .part1 .part1_right .font_title.kong{ border-bottom: 2px #fff dashed; }
.part_right_info{ height: 200px; }
#cpjs .part3{ margin-top: 30px; position: relative; margin-bottom: 30px; }
#cpjs .part3 .intro{  left: 15%; top: 24%; width: 27%;}
#cpjs .part3 .part_title{  margin-bottom: 15px;}
#cpjs .part3 .part_gif{ position: absolute;left: 52.5%; top: 39%; width: 44.6%; }



.pro_nav{ position: relative; bottom: 20%; width: calc(100% - 15px); }
.pro_nav ul{  padding: 0; margin: 0 -15px;}
.pro_nav li{ padding-right: 2px; margin-bottom: 2px; float: left; width: 50%; padding: 0 15px; margin-bottom: 20px;}
.pro_nav li a{ display: block; font-weight: bold; font-size: 16px; width: 100%; background: url(/common/new/img/hkitty/kt_pro_nav.png) center center; background-size: 100% 100%; border-radius: 5px; text-align: center; color: #333;}
.pro_nav li a:hover{  background-image: url(/common/new/img/hkitty/kt_pro_nav_n.png); color: #ffffff; }
.pro_nav li.active a{ background-image: url(/common/new/img/hkitty/kt_pro_nav_n.png); color: #ffffff; text-decoration: none; }
.index1,.index2,.index3,.index4{ display: none }
.part1 .part1_left,.part1 .part1_right{ width: 50%; float: left; }
.part1 .part1_bottom{ width: 100%; float: left; margin-top: 20px; position: relative;}
#cpjs .part2{ margin: 20px auto 20px; position: relative;  }
.bz{ font-size: 14px !important; color: #666 }
#cpjs .part2 .bz{ margin: 10px 0; }
#cpjs .part2 .intro{ top: 26%; left: 1%; width: 38%; }
#xgpj { margin-top: 50px; }
#xgpj .part1{ margin: 40px auto 40px; position: relative; }
#xgpj .part1 .part_left{ padding: 0 5% 0 8%; position: relative; z-index: 2; }
#xgpj .part1 .part_right .row{ margin: 0 -10px; margin-top: 30px;}
#xgpj .part1 .part_right { vertical-align: top; padding-top: 10%; }
.part_img{ width: 50%; float: left; padding: 0 10px; }
#xgpj .part1 .part_bottom{ bottom: 0; z-index: 1; left: 5%; right: 15px; position: absolute;}
#xgpj .part2{ margin: 0px auto 20px; position: relative; }
#xgpj .part2 .part_title p{ padding: 0 15px 20px 15px;  }
#xgpj .part3 .part_title p{ padding: 0 15px 20px 15px;  }
.part_center{ text-align: center; }
#xgpj .part2 .part_center img{ width: 95%; margin: 20px auto; }
#xgpj .part3{margin: 0px auto 20px; position: relative; }
#xgpj .part3 .part_center img{  margin: 20px auto; }

#xgpj .part_table{ margin: 20px auto }
#fwzc .part1{margin: 40px auto 40px; position: relative;}
#fwzc .fwzc_info{ position: absolute; left: 36%; top: 50%; margin-top: -12px; right: 15%; border-right: 2px solid #000; }
#fwzc .fwzc_info a{ font-size: 16px; color: #000; display: inline-block; font-weight: bold; }
#fwzc .fwzc_info a span{ margin-bottom: 0; position: relative;display: inline-block;  }
/*#fwzc .fwzc_info a:hover{  color: #e60012; }
#fwzc .fwzc_info a:hover span:before,#fwzc .fwzc_info a:hover span:after{ content: ""; width: 1em; height: 1em; position: absolute; background: url(/common/new/img/hkitty/btn_l.jpg); background-size: 100% 100%; top: -0.2em; }
#fwzc .fwzc_info a:hover span:before{background-image: url(/common/new/img/hkitty/btn_l.jpg); left: -1.5em; }
#fwzc .fwzc_info a:hover span:after{background-image: url(/common/new/img/hkitty/btn_r.jpg); right: -1.5em; }
*/#fwzc .fwzc_info .fwzc_btn{ float: left; line-height: 24px; border-left: 2px solid #000; width: 50%; text-align: center; }
.index1,.index2,.index3{ display: none }
.font_b{ font-weight: bold; }
.footban{ margin: 40px auto 20px;}
.footban img{ width: 100%; }


.zhezhaostc{
    display: none;
    position: fixed;
    width: 70%;
    left: 15%;
    right: 15%;
    top: 10%;
    bottom: 10%;
    height: 80%;
    background: #fff;
    z-index: 99;
    padding: 15px;
    box-shadow: 0 0 10px #888888;
}
.zhezhaostc .kuang{
    width: 100%;
    height: 100%;
    border: 1px solid #d1d1d1;
    padding: 20px 30px;
    overflow-y: auto;
    overflow-x: hidden;
}
.zhezhaostc .kuang p{
    color: #333;
    font-family:  "黑体", Arial, sans-serif;
    margin:0;
    line-height: 1.5em;
}
.zhezhaostc .kuang h2{
    margin: 0;
    margin-bottom: 20px;
    color: #000;
    font-weight: bold;
    font-size: 16px;
}
.zhezhaostc .closezz{
    position: absolute;
    right: 30px;
    top: 30px;
    cursor: pointer;
}
.zhezhaostc_bg{ width: 100%; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 98; display: none }
.mm{ display: none; }
.pp{ display: block }

#xgpj .part3 .tb_title{ background: #979899; font-size: 16px; font-weight: bold; color: #fff; border: none; }
#xgpj .part3 li{ line-height: 40px; border-bottom: 1px solid #cccccc; padding-left: 14px; font-size: 14px; }
#xgpj .part3 ul{ padding: 0; margin: 0;  }
#xgpj .part3 .jbgg,#xgpj .part3 .fw{ float: left; width: 60%; }
#xgpj .part3 .dc,#xgpj .part3 .bd{ float: left; width: 40%; }
#xgpj .part3 li span{ width: 4em; text-align: left; display: inline-block; color: #000; font-weight: bold;}
#xgpj .part3 .jbgg li span{ width: 6em;}



.copyright{ margin-bottom: 25px; }
.copyright p{ margin-bottom: 0; line-height: 1.5em; color: #b1b1b1; }

.float_left,.float_right{ padding: 0 15px; float: left; display: inline-block; margin-bottom: 15px; }
div.bz{ display: none }
.float_left p{ font-size: 14px; }
.float_right p{ font-size: 12px; }


@media(max-width: 1699px){
    .part_right_info{ height: 100px; }
}

@media(max-width: 1199px){
    .part1,.part2,.part3,.part4,.part5{ width: 90%; margin: 0 auto; }
    #cyln .part1 .intro,.intro_right p,#cyln .part1 .intro2,#cyln .part2 .intro,.cpfh,.intro p,.part_right p,.part_left p,.part_right_info p,p{ font-size: 15px; }
    .intro2_img{ margin-bottom: 20px; }
    .part_right_info{ height: 80px; }
}

@media(max-width: 992px){
    /*.part1,.part2,.part3,.part4,.part5{ width: 80%; margin: 0 auto; }*/

    #cyln .part1,#cyln .part2,#cpjs .part1,#cpjs .part2,#xgpj .part1,#xgpj .part3,#xgpj .part2,#fwzc .part1{  margin-left: auto; margin-right: auto; }
    #xgpj .part1 .intro .pt_title{ margin-top: 15px; }
    #cyln .part1 .intro,.intro_right p,#cyln .part1 .intro2,#cyln .part2 .intro,.cpfh,.intro p,.part_right p,.part_left p,.part_right_info p,p{ font-size: 13px; }
    .middleNavWrapper {
        margin: 20px 0px;
    }
    #banner{ padding: 0 }
    .part1,.part2,.part3,.part4,.part5{ width: 95%; margin: 0 auto; }
    
/*    .nav_li ul li:hover{ background-image: url(/common/new/img/hkitty/li.jpg);}
    .fwzc_btn:hover{ background-image: url(/common/new/img/hkitty/fwzc_btn.png);}
*/}
@media(max-width: 700px){
    .cyxz{ left: 34.5%; top: 46%;}
    .top_buy_btn{ width: 22.5%; left: 63%; }
    .part1,.part2,.part3,.part4,.part5{ width: 100%; margin: 0 auto; }
    #banner .container{ padding: 5px; }
    .mm{ display: block; }
    .pp{ display: none }
    .top_buy1,.top_buy2{ width: 100%; margin-bottom: 20px; }
    .top_buy{ margin-bottom: 0; }  
    .pt_title { border: 0; padding: 0; margin-bottom: 10px; line-height: 1em } 
    .pt_title:before { content: "" } 
    .pt_title:after { content: "" } 
    .pt_title.pp{ display: none; }
    .zhezhaostc{
        width: 90%;
        left: 5%;
        right: 5%;
        top: 10%;
        bottom: 10%;
        height: 80%;
    }
    .zhezhaostc .kuang{
        padding: 20px;
    }
    #cyln .part1 .intro,.intro_right p,#cyln .part1 .intro2,#xgpj .part2,#cyln .part2 .intro,.cpfh,.intro p,.part_right p,.part_left p,.part_right_info p,p{ font-size: 14px; line-height: 1.5em; margin-bottom: 8px; }
    .middleNavWrapper{
        display: none;
    }
    #banner{ margin-bottom: 20px; }
    .nav_li ul li{ width: 50%; margin: 5px 0; padding: 0 10px;  }
    .kt_title span{ display: block; font-size: 20px; line-height: 1.5em;}
    .kt_title{ font-size: 16px; }
    .kt_title p:after{ width: 35px; height: 34px; right: -25px; top: -10px; }
    #cpjs .kt_title p:after{ right: -10px; }
    #cpjs .part1{ padding: 0px;margin-top: 20px; margin-bottom: 0; }
    #cpjs .part1 .part1_left{ width: 100%; padding: 0; }
    .pro_left,.pro_right{ display: table-cell; vertical-align: top; width: 50%; padding: 0 10px; }
    #cpjs .part1 .pro_title{ font-size: 16px; font-weight: bold;  margin: 0; color: #e60012; padding-bottom: 12px; border-bottom: 1px dashed #000; margin-bottom: 12px;}
    #cpjs .part1 .pro_m{ margin: 30px 0;  }
    .part_title p{ font-size: 16px; padding-bottom: 15px; }
    #cpjs .part3 .part_gif{ position: static; width: 85%; margin: 0 auto; }
    #cpjs .part3 .part_gif img{  margin-top: -20px; }
    #cpjs .part3 .intro{ left: 17%;top: 18%;width: 65%; }
    #cpjs .part4 .part_left{ padding: 0; display: block; width: 100%; }
    #cpjs .part4 .part_right{ padding: 0; display: block; width: 100%; margin-top: 15px; }
    .part_title{ margin-bottom: 20px; }
    #xgpj .kt_title{ top: -17px; }
    #xgpj{ margin-top: 30px }
    #xgpj .part1 .part_left{ padding: 0; display: block; width: 100%; }
    #xgpj .part1 .part_right{ padding: 0; display: block; width: 100%; margin-top: 15px; padding: 0; margin-bottom: 30px; }
    #xgpj .part1 .part_right .row{ margin-top: 15px; }
    #xgpj .part2 .part_title p{ padding: 0 5px 15px 5px; }
    #xgpj .part3 .part_title p{ padding: 0 5px 15px 5px; }
    #xgpj .part_title{ margin-bottom: 15px; }
    #xgpj .part2 .part_center img{ width: 100%; }
    #xgpj .part2 { margin-bottom: 0; }
    #cyln{ margin-top: 15px; }
    #cyln .part1 .intro{ position: relative; width: 100%; top: 0; left: 0 }
    #cyln .part1 .intro2{ left: 16%; top:70.5%; width: 72%;  }
    #cyln .part1 .intro2 p img{ width: 60% }
    #cyln .part1 .intro2 p{ line-height: 1.6em }
    .lm_more{ width: 24%; left: 15%; top: 45%; }
    #cyln .part2{ margin: 15px auto; }
    #cyln .part2 .intro{ position: static; width: 100% }
    #cpjs{ margin: 0 auto }
    .intro_left{ width: 100%;}
    .intro_left_pro{ background: none !important }
    .intro_left_pro p{ line-height: 2em; text-align: center; color: #757575; margin: 0; }
    #cpjs .part1 .info{float: left; width: 100%;}
    .intro_left_pro:hover{ background: none }
    .intro_left .intro_left_pro1{ margin-bottom: 5px; }
    .l-gif3 .l-gif{ width: 30%; left: 34.5%; top: 26%; }
    .flower_m{ width: 30%; margin-bottom: 20px; }
    #cpjs .part1 .info .qh_title{ font-size: 18px; padding-bottom: 15px; margin-top: 15px; font-weight: bold;text-align: center; background: url(/common/new/img/hkitty/qh_line.jpg) no-repeat center bottom; background-size: 35% auto}
    #cpjs .part1 .info p{ margin-bottom: 5px; }
    #cpjs .part1 .info{ margin-bottom: 30px; }
    #cpjs .part2{ margin-top: 0px; }
    #cpjs .part2 .intro{ position: static; width: 100%; margin-top: 15px; }
    #cpjs .part2 .l-gif{ width: 88%; left: 3.7%; top: 6.15%; }
    #xgpj .part1 .intro{ position: static;width: 100%; margin-top: 15px; margin-bottom: -8px;  }
    #xgpj .part1{ margin: 0 auto; }
    #fwzc{ margin-bottom: 20px;  }
    #fwzc .part1{ margin-top: 30px; margin-bottom: 0px; }
    .fwzc_btn{ position: static; float: left; width: 46.67%; margin-bottom: 15px;}
    .fwzc_btn.cjwt{ margin-left: 27%;  }
    .fwzc_btn.fwzc{ margin-right: 6%; }
    .footban{ margin: 20px auto; }

    #xgpj .part3 li{ line-height: 30px; font-size: 12px; }
    #xgpj .part3 .jbgg,#xgpj .part3 .fw,#xgpj .part3 .dc,#xgpj .part3 .bd{ float: left; width: 100%; }
    #xgpj .part3 li span{ width: 3em;  color: #000; font-weight: bold;}
    #xgpj .part3 .jbgg li span{ width: 5em;}
    #xgpj .part3 .tb_title{ background: #e3ebed; color: #4d4d4d; border: none; font-size: 14px;}
    .line{ height: 6px; }
/*    #fwzc .fwzc_info .fwzc_btn{ width: 100%; border-left: 0; }*/
/*    .fwzc_btn.cjwt{ padding: 0; margin-left: 0; }*/
/*    #fwzc .fwzc_info{ border: 0; left: 56%; top: 0; right: 20%; margin: 0; padding-top: 5px; }*/
/*    #fwzc .fwzc_info a{ padding: 0px 0; display: inline-block; border-bottom: 1px solid #000; }*/
    #fwzc .fwzc_info{position: absolute;left: 15%;top: 50%;margin-top: -12px;right: 15%;border-right: 2px solid #000;}
    #fwzc .fwzc_info a span{ font-size: 14px;
    line-height: 1.5em; }
    #fwzc .fwzc_info .fwzc_btn{ margin: 3px 0; }



}
@media(max-width: 400px){
    .nav_li ul li a{ letter-spacing: 2px }
    #xgpj .part3 li span{ margin-bottom: 1px; float: left; }
    .kt_title span{  font-size: 18px;}
    .kt_title{ font-size: 14px; }
    #cyln .part1 .intro,.intro_right p,#cyln .part1 .intro2,#xgpj .part2,#cyln .part2 .intro,.cpfh,.intro p,.part_right p,.part_left p,.part_right_info p,p{ font-size: 12px; line-height: 1.5em; margin-bottom: 5px; }
    #cpjs .part1 .pro_title{ font-size: 14px; padding-bottom: 10px; margin-bottom: 10px; }
    #cpjs .part1 .pro_m{ margin: 20px 0;  }
    .part_title p{ font-size: 14px; }
    .part_title{ margin: 0 -5px 20px; }
     #xgpj .part2 { margin-bottom: 0; }

}