/* -------------------------------- Primary style-------------------------------- */ html *{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale} *,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} body,html{height:100%} body{font-size:100%;font-family:,"Microsoft YaHei""Titillium Web",sans-serif;color:#4e6361;background-color:#fef7e4} a{color:#6cac70;text-decoration:none} .bg { background:url(../images/bg.jpg) no-repeat;background-size:cover; width:100%; height:100%;} /* ---------------------------------------------------------------- */ .cd-img-replace{display:inline-block;overflow:hidden;text-indent:100%;white-space:nowrap}/* replace text with a background-image */ .overflow-hidden{overflow:hidden} /* ---------------------------------------------------------------- */ header{position:fixed;top:0;left:0; width:100%; height:inherit; background:#ffeab5; height:100px; z-index:3;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:.4s;-moz-transition-duration:.4s;transition-duration:.4s} header.lateral-menu-is-open{-webkit-transform:translateX(-260px);-moz-transform:translateX(-260px);-ms-transform:translateX(-260px);-o-transform:translateX(-260px);transform:translateX(-260px)} header.is-fixed{position:fixed} #cd-logo{display:block;float:left;margin:12px 0 0 20px} #cd-logo img{display:block} #cd-top-nav{position:absolute;top:0;right:120px;height:100%;display:none} #cd-top-nav ul{height:100%;padding-top:18px} #cd-top-nav li{display:inline-block;margin-right:1em} #cd-top-nav a{display:inline-block;padding:.5em;color:#FFF;text-transform:uppercase;font-weight:600} #cd-top-nav a.current{background-color:#242e30} .no-touch #cd-top-nav a:hover{color:rgba(255,255,255,.7)} #cd-menu-trigger{position:absolute;right:0;top:200px;height:50px;width:50px;background-color:#fbe5bb} #cd-menu-trigger .cd-menu-text{height:25px;text-transform:uppercase;color:#FFF;font-weight:600; position:absolute;left:5px;top:25px;} #cd-menu-trigger .cd-menu-icon{display:inline-block;position:absolute;left:5px;top:5px;bottom:auto;right:auto;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);-o-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);width:18px;height:2px;background-color:#FFF} #cd-menu-trigger .cd-menu-icon::before,#cd-menu-trigger .cd-menu-icon:after{content:'';width:100%;height:100%;position:absolute;background-color:inherit;left:0;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden} #cd-menu-trigger .cd-menu-icon::before{bottom:5px} #cd-menu-trigger .cd-menu-icon::after{top:5px} #cd-menu-trigger.is-clicked .cd-menu-icon{background-color:rgba(255,255,255,0)} #cd-menu-trigger.is-clicked .cd-menu-icon::after,#cd-menu-trigger.is-clicked .cd-menu-icon::before{background-color:#fff} #cd-menu-trigger.is-clicked .cd-menu-icon::before{bottom:0;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)} #cd-menu-trigger.is-clicked .cd-menu-icon::after{top:0;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)} #cd-menu-home {position:absolute;right:0;top:166px;height:52px;width:40px;background:#dc1812 url(../images/home.png) no-repeat; background-size:100%; } #cd-menu-trigger {position:absolute;right:0;top:220px;height:52px;width:40px;background:#dc1812 url(../images/directory.png) no-repeat; background-size:100%; } #cd-menu-electronic{position:absolute;right:0;top:274px;height:52px;width:40px;background:#dc1812 url(../images/gz.png) no-repeat; background-size:100%; } #cd-menu-collection{position:absolute;right:0;top:328px;height:52px;width:40px;background:#dc1812 url(../images/favourite.png) no-repeat; background-size:100%; } /*二次导航*/ #cd-lateral-nav{position:fixed; display:none; height:100%;right:0;top:0;z-index:1;width:260px;background-color:#484141;overflow-y:auto;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:.4s;-moz-transition-duration:.4s;transition-duration:.4s;-webkit-transform:translateX(80px);-moz-transform:translateX(80px);-ms-transform:translateX(80px);-o-transform:translateX(80px);transform:translateX(80px)} #cd-lateral-nav .cd-navigation{margin:10px 0 16px} #cd-lateral-nav .sub-menu{padding:0 10px 20px 15px;display:none;} #cd-lateral-nav a{display:block;line-height:3em;padding:0 16px 0 16px;color:#fff; font-size:60%;} #cd-lateral-nav a.current{background-color:#3a4a4d;color:#FFF} .no-touch #cd-lateral-nav a:hover{color:#FFF} #cd-lateral-nav.lateral-menu-is-open{ display:block;-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0);-webkit-overflow-scrolling:touch} #cd-lateral-nav .item-has-children>a{position:relative;text-transform:uppercase;font-weight:600; font-size:80%} #cd-lateral-nav .item-has-children>a::after{content:'';display:block;height:11px;width:8px;position:absolute;top:50%;bottom:auto;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);right:1em;background:url(../images/cd-arrow.svg) no-repeat center center;background-size:8px 11px;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:.2s;-moz-transition-duration:.2s;transition-duration:.2s} #cd-lateral-nav .item-has-children>a.submenu-open::after{-webkit-transform:translateY(-50%) rotate(90deg);-moz-transform:translateY(-50%) rotate(90deg);-ms-transform:translateY(-50%) rotate(90deg);-o-transform:translateY(-50%) rotate(90deg);transform:translateY(-50%) rotate(90deg)} @media only screen and (min-width: 768px) { .cd-main-content{padding-top:70px} header{height:100px} #cd-logo{margin:22px 0 0 30px} #cd-top-nav{display:block} #cd-lateral-nav .cd-navigation{margin:20px 0} } /* -------------------------------- Main components -------------------------------- */ .cd-main-content{min-height:100%;position:relative; background:#ffeab5; z-index:2;padding-top:100px; padding-bottom:60px; -webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:.4s;-moz-transition-duration:.4s;transition-duration:.4s} .cd-main-content.lateral-menu-is-open{-webkit-transform:translateX(-260px);-moz-transform:translateX(-260px);-ms-transform:translateX(-260px);-o-transform:translateX(-260px);transform:translateX(-260px)} #column {width:80%; margin:0 auto; text-align:left; font-size:20px; line-height:30px; font-weight:bold; color:#dc1812; margin-top:5px;} #title { font-size:16px; color:#000; text-align:center; line-height:26px; font-weight:bold; width:80%; margin:0 auto; padding:10px;} .cd-main-content .txtcont { width:80%; margin:0 auto; color:#000;font-size:12px; line-height:30px;} .cd-main-content .txtcont p { font-size:12px; line-height:30px;} .cd-main-content .txtcont img {max-width: 100%;height: auto; width: auto\9; /* ie8 */ vertical-align:top; margin:10px 0 0 0; text-align:center;} footer {position:fixed; bottom:0; height:56px; text-align:center; line-height:56px; font-size:14px; color:#dc1812; background:#ffeab5; width:100%;z-index:3;-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform;-webkit-transition-duration:.4s;-moz-transition-duration:.4s;transition-duration:.4s} footer.lateral-menu-is-open{-webkit-transform:translateX(-260px);-moz-transform:translateX(-260px);-ms-transform:translateX(-260px);-o-transform:translateX(-260px);transform:translateX(-260px)} .pre {background:url(../images/left.png) no-repeat; width:30px; height:39px; float:left; margin-left:15px; margin-top:8px} .next {background:url(../images/right.png) no-repeat; width:30px; height:39px; float:right; margin-right:15px; margin-top:8px} /*弹框*/ #mask_shadow{display:none;opacity:0;position:fixed;z-index:5;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,.5)} #popup{display:none;opacity:0;position:absolute;z-index:999;top:50px;width:80%;height:auto;box-shadow:0 5px 15px rgba(0,0,0,.5)} #popup .title{position:relative;width:100%;height:55px;background-color:#dc1812;cursor:move} #popup .title p{padding-left:14px;line-height:55px;color:#fff} #popup .title span{position:absolute;top:12px;right:20px;width:30px;height:30px;color:#fff;font-size:21px;cursor:pointer;text-align:center;border:1px solid #fff;border-radius:50px;-moz-border-radius:50px;-webkit-border-radius:50px} #popup .title span:hover{opacity:.8} #popup .cont{width:100%;height:auto;background-color:#EDEDED;padding:20px} #popup .cont p{line-height:26px;font-size:12px;color:#000} #popup .cont img{width:50%;height:auto;text-align:center;vertical-align:middle} /* 收藏 */ .bg_img { background:#191919;opacity:0.8;display:none;position:fixed;width:100%; height:100%; z-index:9999 } .img { display:none;position:absolute;top:0;left:0;width:100%; height:100%;}