@charset "utf-8";

#mnav { width: 1100px; margin: auto }
#mnav a { color: #FFF }
#mnavh { display: none; width: 30px; height: 40px; float: right; text-align: center; padding: 0 5px }
.open { display: none }
.navicon { display: block; position: relative; width: 30px; height: 5px; background-color: #000; margin-top: 20px }
.navicon:before, .navicon:after { content: ''; display: block; width: 30px; height: 5px; position: absolute; background: #000; -webkit-transition-property: margin, -webkit-transform; transition-property: margin, -webkit-transform; transition-property: margin, transform; transition-property: margin, transform, -webkit-transform; -webkit-transition-duration: 300ms; transition-duration: 300ms; }
.navicon:before { margin-top: -10px; }
.navicon:after { margin-top: 10px; }
.open .navicon { background: none }
.open .navicon:before { margin-top: 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.open .navicon:after { margin-top: 0; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.open .navicon:before, .open .navicon:after { content: ''; display: block; width: 30px; height: 5px; position: absolute; background: #000; }

@media only screen and (max-width: 769px) {
#mnav, article { width: 96% !important; overflow: hidden }
#mnavh { display: block; z-index: 99; position: fixed; right: 0; top: 16px; }
header,.banner,.template { width: 100% !important; }
nav { position: fixed !important; margin: 0; display: none; z-index: 9 !important; height: auto; top: 0; right: 0; width: 100%; padding: 30px 0; background: rgb(255, 255, 255, .9) !important }
.topnav a { margin: 5px 0 !important; padding: 0 !important; width: 100% !important; text-align: center !important; }
.topnav a:last-child { padding-bottom: 100% !important }
.box { width: 100% !important }
.avatar { display: none !important }
.bloglist { width: 100% !important; background: none !important }
.bloglist ul { width: 96% !important; margin:5px auto !important }
.bloglist figure,.bloglist figure div,.newblog figure div { width: 100% !important }
.bloglist figure img { width: 96% !important }
aside { width: 100% !important; margin-top: 30px !important }
.weather { display: none !important }
.weixin { background-postion: center !important }
footer,.newblog{ width: 100%  !important}
h1.t_nav span{ display:none}
.newblog{ background:none !important}
.nlist{ width:98% !important} 
.newblog figure{ width:100% !important}
.newblog figure img{ width:96% !important}
.ad{ display:none}
.rnav{ width:100% !important}
.rnav li{width: 48% !important;}
.about{ width:98% !important; background: none !important }
.about ul{ width:100% !important}
.caselist{ width:100% !important; background:none}
.index_about{ width:100%; background:none}
ul.infos{ margin:20px 0}
.box_c{ margin-right:0}
.nextinfo{ margin-top:20px}
ul.infos p img{ max-width:100% !important}
.banner{background-position:inherit !important;height:auto !important;}
.texts{margin:20px 0 0 20px !important}
}