﻿@charset "utf-8";
html,body{margin:0px;width:100%;height:100%;}

.header a{display:block;width:42px;height:96px;}
.header a.fl{top:0;left:2%;background:url(../images/icon_01.png) left center no-repeat;}
.header a.fr{top:0;right:2%;width:67px;background:url(../images/icon_02.png) right center no-repeat;}
.header p{font-size:40px;color:#fff;overflow:hidden;}
.header p b{display:block;width:81px;height:96px;margin:0 auto;background:url(../images/icon_03.png) 0 center no-repeat;}
.footer{position:fixed;left:0;bottom:0;width:100%;height:70px;display:inline-block;background:#000;overflow:hidden;z-index:30;}
.footer ul{overflow:hidden;padding-top:22px;}
.footer ul li{width:25%;height:25px;line-height:25px;text-align:center;float:left;color:#fff;border-right:1px solid #fff;box-sizing:border-box;-webkit-box-sizing:border-box;}
.footer ul li a{color:#fff;}
.footer ul li b{font-weight:normal;width:100%;display:block;font-size:24px;}
.footer ul li.last{border-right:none;}

.head{text-align:center;width:100%;height:52px;line-height:52px;font-size:28px;letter-spacing:15px;border-top:2px solid #4b4b4b;}
.head a{top:6px;left:30px;display:block;width:26px;height:40px;background:url(../images/icon_04.png) no-repeat;}
.shopping{width:100%;height:88px;background:#e7d9b4;padding-top:12px;margin-top:20px;}
.shopping .main{text-align:center;width:96%;height:60px;line-height:60px;margin:0 auto;font-size:32px;font-weight:bold;letter-spacing:5px;border:2px solid #fff;cursor:pointer;}
.shopping2{width:100%;height:88px;background:#e7d9b4;padding-top:12px;margin-top:20px;}
.shopping2 .main{text-align:center;width:96%;height:60px;line-height:60px;margin:0 auto;font-size:32px;font-weight:bold;letter-spacing:5px;border:2px solid #fff;color:#929292;}
p.a{width:95%;line-height:30px;font-size:20px;padding:20px 0 20px 5%;border-bottom:2px solid #929292;}
.font{width:90%;padding:28px 0 15px;border-bottom:1px solid #929292;margin-left:5%;}
.font1{width:98%;padding:2px 0 2px;border-bottom:1px solid #929292;margin-left:2%;}
.font2{width:100%;padding:2px 0 2px;border-bottom:1px solid #000000;margin-left:0%;}

.font h1{font-size:28px;}
.font h1 span{margin-left:18px;color:#c2b077;}
 .font p{line-height:52px;font-size:24px;color:#747474;text-align:justify;text-justify:distribute-all-lines;}
 .fixb{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000;filter:alpha(opacity=50;);-moz-opacity:0.5;opacity:0.5;background:rgba(0,0,0,0.5);z-index:50;}
 .fixa{display:none;position:fixed;top:250px;left:50%;margin-left:-34%;padding-top:80px;text-align:center;width:68%;height:210px;background:#fff;border:2px solid #1e171c;z-index:100;}
 .fixa h1{font-size:28px;letter-spacing:10px;margin-bottom:60px;color:#222;}
 .fixa a{display:inline-block;width:35%;height:50px;line-height:50px;background:#e7d9b4;color:#21211a;letter-spacing:2px;}
.fixa a.a{margin-right:4%;background:#000;color:#fff;}
.fixa .close{top:15px;right:3.5%;width:30px;height:30px;background:url(../images/icon_05.png) no-repeat;cursor:pointer;}

                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     @charset "utf-8";
html,body{margin:0px;width:100%;}/*当需要百分百显示的时候，需要使用*/



.header{position:fixed;left:0;top:0;text-align:center;width:100%;height:115px;line-height:100px;background:#333333;color:#000;font-size:26px;font-weight:bold;overflow:hidden;z-index:10;box-sizing:border-box;}
.header .btn{position:absolute;top:30px;left:5%;width:80px;height:67px;background:url(../images/cd2.png) no-repeat;cursor:pointer;}
.header .logo{position:absolute;top:10px;left:43%;width:120px;height:100px;background:url(../images/logo3.jpg) no-repeat;}
.header .shop{position:absolute;top:22px;right:1.5%;display:block;width:33px;height:26px;}
.header .search{position:absolute;top:40px;right:5%;display:block;width:50px;height:48px;background:url(../images/car2.png) no-repeat;cursor:pointer;font-size:24px;color:#fff;display:table-cell;text-align:right;}
.header .search .car {position:absolute;top:-37px;right:7%;font-size:18px;color:#fff;font-weight:normal;font-family:'Microsoft YaHei'}

.zfhead a:link{color:white;}
.zfheader{position:fixed;left:0;top:0;text-align:center;width:100%;height:80px;line-height:80px;background:#333333;color:white;font-size:26px;overflow:hidden;z-index:10;box-sizing:border-box;}
.zfheader .btn{position:absolute;left:5%;width:100px;height:80px;cursor:pointer;font-size:25px;font-family:'Microsoft YaHei UI';}
.zfheader .logo{position:absolute;left:40%;width:150px;height:80px;font-size:30px;font-family:'Microsoft YaHei UI';}

.zf1{position:fixed;left:0;top:150px;text-align:center;width:100%;}
.zf1 logo{position:absolute;left:40%;width:500px;height:400px;font-size:30px;font-family:'Microsoft YaHei UI';}
.zf1 table{position:absolute;left:20%;width:500px;height:300px;}

.zf2 {
    position: fixed;
    left: 0;
    top: 80px;
    text-align: center;
    width: 100%;
}

 

    .zf2 table {
        position: absolute;
        left: 18%;
        width: 500px;
        height: 300px;
    }


.header-search{display:none;position:fixed;left:0;top:0;width:100%;height:70px;line-height:70px;background:#403442;color:#fff;font-size:26px;z-index:20;}
.header-search .close{position:absolute;top:0px;right:2.6%;width:22px;height:70px;background:url(../images/icon_06.png) center no-repeat;cursor:pointer;}
.header-search input{float:left;height:28px;line-height:28px;margin-top:21px;color:#aea4ac;background:#403442;font-size:20px;}
.header-search input[type="text"]{text-indent:3.6%;width:88%;}
.header-search input[type="submit"]{text-indent:3.6%;width:29px;background:url(../images/icon_03.png) center no-repeat;cursor:pointer;}

.section{max-width:640px;padding:70px 0px 0px 0px;margin:0 auto;overflow:hidden;}
.section2{max-width:640px;padding:20px 0px 0px 0px;margin:0 auto;overflow:hidden;}
.section .list{padding:30px 1.8% 0px;overflow:hidden;}
.section .list li{width:100%;margin-bottom:16px;}
.section .list li dt{width:100%;}
.section .list li dt img{width:100%;}
.section .list li dd{width:95%;height:100px;padding:0 2.5%;background:#e9e4ea;}
.section .list li dd .buy{float:right;display:block;text-align:center;width:105px;height:70px;line-height:70px;margin-top:15px;color:#3a353b;border:2px solid #3a353b;border-radius:5px;}
.section .list li dd .font{padding-top:12px;}
.section .list li dd .font p:nth-child(3){font-size:19px;line-height:20px;}
.section .list li dd .font p:nth-child(1){font-size:18px;line-height:20px;}
.section .list li dd .font p:nth-child(2){font-size:22px;line-height:30px;margin-bottom:4px;color:#131014;}
.section .list li dd .font p span{font-size:20px;margin-left:30px;}
.section .list li dd .font p i{font-size:25px;}

.section .bot{margin:30px 1.8% 50px;overflow:hidden;border:2px solid #847c85;border-bottom:none;}
.section .bot li{text-align:center;width:100%;height:60px;border-bottom:2px solid #847c85;line-height:60px;font-size:22;letter-spacing:30px;color:#544855;}

.footer2{text-align:center;width:100%;overflow:hidden;background-color:#000;color:#fff}
.nav{float:left;width:105px;line-height:35px;font-weight:bold;font-size:14px;text-align:center;}
.splitline{float:left;width:1px;line-height:35px;}

.bg{position:fixed;left:-1000px;top:0;width:40%;min-height:100%;background:#333333;opacity:0.9;z-index:10;}
.bg .bg-top{position:absolute;left:0;top:0;width:100%;height:70px;line-height:70px;padding:0 28px 0 30px;z-index:12;color:#fff;box-sizing:border-box;background:#333333;}
.bg .bg-top a{color:#fff;font-size:26px;}
.bg .bg-top span{float:right;font-size:50px;line-height:70px;cursor:pointer;}
.bg ul{position:relative;width:100%;padding-top:70px;overflow-y:scroll;z-index:8;}
.bg ul li{width:100%;height:70px;line-height:70px;z-index:12;padding:0 34px 0 30px;color:#fff;padding-right:20px;box-sizing:border-box;cursor:pointer;}
.bg ul li a{color:#fff;font-size:26px;}
.bg ul li span{float:right;display:block;width:19px;height:19px;margin-top:26px;font-size:50px;line-height:70px;background:url(../images/icon_04.png) no-repeat;}
.bg ul li.active a{color:#ff90b6;}
.bg ul li.active2 a{color:#f11212;}
.bg ul p{display:none;}
.bg ul p a{display:block;text-indent:90px;width:100%;height:70px;line-height:70px;color:#fff;font-size:26px;}
.bg ul li.on span{background:url(../images/icon_05.png) no-repeat;}

.input1{-webkit-appearance: none; border:1px solid #CCC;width:450px;height:80px;margin-top:20px;margin-left:10px;background:url(../images/yh.jpg) no-repeat 10px 10px;padding-left:100px;}
.input2{-webkit-appearance: none; border:1px solid #CCC;width:450px;height:80px;margin-top:50px;margin-left:10px;background:url(../images/pw.jpg) no-repeat 10px 10px;padding-left:100px;}
.input3{margin-top:50px;margin-left:10px;}
.input4{-webkit-appearance: none; border:1px solid #CCC;width:535px;height:80px;margin-top:30px;margin-left:10px;padding-left:10px;}
.input5{-webkit-appearance: none; border:1px solid #CCC;width:500px;height:80px;margin-top:20px;margin-left:10px;padding-left:10px;}
.input6{-webkit-appearance: none; border:1px solid #CCC;width:450px;height:80px;margin-top:20px;margin-left:10px;padding-left:20px;}
.sinput5{-webkit-appearance: none; border:1px solid #CCC;height:80px;margin-top:20px;margin-left:20px;padding-left:10px;font-family:Century;font-size:50px;}
.sinput6{-webkit-appearance: none; border:1px solid #CCC;height:80px;margin-top:20px;margin-left:20px;padding-left:10px;font-size:30px;}

.header3{position:fixed;left:0;top:0;text-align:center;width:100%;height:150px;line-height:150px;background:#000;color:#fff;font-size:40px;word-spacing:18px; letter-spacing: 5px; overflow:hidden;z-index:10;box-sizing:border-box;font-family:'Microsoft YaHei'}

 .logo3{position:absolute;top:220px;left:37%;width:222px;height:174px;background:url(../images/logo2.jpg) no-repeat;}
 .dvinput{position:fixed;left:0;top:460px;text-align:left;width:100%;height:250px;background:#fff;color:#000;}
 .logo4{position:absolute;top:1200px;left:33%;width:450px;height:50px;font-size:25px;}
  .dvbt{position:absolute;left:0;left:28%;top:800px;text-align:center;}
 .input7{-webkit-appearance: none;border:none;width:300px;height:100px;margin-left:5px;padding-left:20px;font-size:80px;font-family:'Microsoft YaHei UI';font-weight:bold;}

 .demo--label{margin:20px 20px 0 0;display:inline-block}
.demo--radio{display:none}
.demo--radioInput{-webkit-appearance: none;background-color:#fff;border:1px solid rgba(0,0,0,0.15);border-radius:100%;display:inline-block;height:16px;margin-right:10px;margin-top:-1px;vertical-align:middle;width:16px;line-height:1}
.demo--radio:checked + .demo--radioInput:after{-webkit-appearance: none;background-color:#57ad68;border-radius:100%;content:"";display:inline-block;height:16px;margin:2px;width:16px;}
.demo--checkbox.demo--radioInput,.demo--radio:checked + .demo--checkbox.demo--radioInput:after{border-radius:0}

/**
 * Checkbox Five
 */
.checkboxFive {
	width: 25px;
	margin: 20px 100px;
	position: relative;
}

/**
 * Create the box for the checkbox
 */
.checkboxFive label {
	cursor: pointer;
	position: absolute;
	width: 25px;
	height: 25px;
	top: 0;
  	left: 0;
	background: #eee;
	border:1px solid #ddd;
}
/**
 * Display the tick inside the checkbox
 */
.checkboxFive label:after {
	opacity: 0.2;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 6px;
	left: 7px;
	border: 3px solid #333;
	border-top: none;
	border-right: none;
 
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
/**
 * Create the hover event of the tick
 */
.checkboxFive label:hover::after {
	opacity: 0.5;
}
 
/**
 * Create the checkbox state for the tick
 */
.checkboxFive input[type=checkbox]:checked + label:after {
	opacity: 1;
}



