.mycontainer{ width: 1200px; margin: 0 auto; position: relative; }

header{ background: #00707e; overflow: hidden;}
header p{ color: #fff; font-size: 16px; line-height: 96px; font-family: "微软雅黑", "宋体", Arial, Helvetica, sans-serif; padding-left: 48px; background-image: url("../img/pic1.png"); background-position: left; background-repeat: no-repeat; float: right;}
header p span{ font-size: 34px; font-family: "时尚中黑简体";}
.mycontainer #logo{ width: 200px; height: 150px; background: #fff; position: absolute; top: -100px; left: 0; z-index: 1;}
.mycontainer #logo img{ margin: 0 auto; margin-top: 26px;}

nav{ position: absolute; top: -550px;}
nav ul{ background: rgba(0,112,126,.8); width: 200px; padding: 39px 0;}
nav ul li a{ font-size: 14px; color: #fff; line-height: 59px; text-align: center;-webkit-transition-property: background; transition-property: background;-webkit-transition-duration: .2s; transition-duration: .2s; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-transition-delay: 0s;transition-delay: 0s;}
nav ul li a:hover, nav ul li .current{ background: #00707e;}

.entrance{ overflow: hidden; width: 100%; margin-top: 30px;}
.entrance li{ width: 50%; float: left;}
.entrance li a{ width: 100%; height: 236px; background-position: center; color: #fff; text-align: center;}
.entrance li:first-child a{ background-image: url("../img/pic4.png");}
.entrance li:nth-child(2) a{ background-image: url("../img/pic5.png");}
.entrance li:nth-child(3) a{ background-image: url("../img/pic6.png");}
.entrance li:nth-child(4) a{ background-image: url("../img/pic7.png");}
.entrance li a{-webkit-transition-property: background-image; transition-property: background-image;-webkit-transition-duration: .5s; transition-duration: .5s; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-transition-delay: 0s;transition-delay: 0s;}
.entrance li:first-child a:hover{background-image: url("../img/pic8.png");}
.entrance li:nth-child(2) a:hover{background-image: url("../img/pic9.png");}
.entrance li:nth-child(3) a:hover{background-image: url("../img/pic10.png");}
.entrance li:nth-child(4) a:hover{background-image: url("../img/pic11.png");}
.entrance li a h2{ font-size: 20px; font-weight: normal; padding-top: 76px;}
.entrance li a h2 span{ font-size: 16px; font-weight: normal; font-family: Arial;}
.entrance li a img{ margin: 20px auto 0 auto;}
.entrance li a h2, .entrance li a img{-webkit-transition-property: opacity; transition-property: opacity;-webkit-transition-duration: .2s; transition-duration: .2s; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-transition-delay: 0s;transition-delay: 0s;}
.entrance li a:hover h2, .entrance li a:hover img{opacity: 0;}

.discount{ float: left; margin-top: 30px;}
.discount .title{ width: 585px; border-bottom: solid #e1e1e1 1px; position: relative;}
.discount .title h2{ font-family: "Microsoft YaHei UI"; font-size: 17px; font-weight: normal; padding-bottom: 10px; border-bottom: #00707e solid 1px; display: inline-block; position: relative; bottom: -1px; color: #323232;}

.news{ float: right; margin-top: 30px;}
.news .title{ width: 585px; border-bottom: solid #e1e1e1 1px; position: relative;}
.news .title h2{ font-family: "Microsoft YaHei UI"; font-size: 17px; font-weight: normal; padding-bottom: 10px; border-bottom: #00707e solid 1px; display: inline-block; position: relative; bottom: -1px;}
.news ul{ margin-top: 20px;}
.news ul li{-webkit-transition-property: background; transition-property: background;-webkit-transition-duration: .2s; transition-duration: .2s; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-transition-delay: 0s;transition-delay: 0s;}
.news ul li:hover{ background: #fafafa;}
.news ul li a{ width: 485px; height: 81px; padding: 18px 0 0 100px; background-repeat: no-repeat; background-position: 20px center; border-bottom: #e1e1e1 solid 1px;}
.news ul li:first-child a{ background-image: url("../img/pic12.png");}
.news ul li:nth-child(2) a{ background-image: url("../img/pic13.png");}
.news ul li:nth-child(3) a{ background-image: url("../img/pic14.png");}
.news ul li:nth-child(4) a{ background-image: url("../img/pic15.png");}
.news ul li a h3{ font-family: "Microsoft YaHei UI"; color: #323232;font-weight: normal; font-size: 16px;}
.news ul li a p{ font-family: "Microsoft YaHei UI"; color: #646464;font-weight: normal; font-size: 12px; margin-top: 5px;}
.news ul li a span{ font-family: "Microsoft YaHei UI"; color: #909090;font-weight: normal;
font-size: 12px; margin-top: 5px; display: block;}
.news ul li:first-child:hover a{ background-image: url("../img/pic16.png");}
.news ul li:nth-child(2):hover a{ background-image: url("../img/pic17.png");}
.news ul li:nth-child(3):hover a{ background-image: url("../img/pic18.png");}
.news ul li:nth-child(4):hover a{ background-image: url("../img/pic19.png");}
.news ul li a:hover h3, .news ul li a:hover p, .news ul li a:hover span{ color: #00707e;}

.introduce{ margin-top: 30px; float: left;}
.introduce .first{ float: left; width: 250px; height: 340px; padding: 0 25px; background: #00707e;}
.introduce .first h2{ font-size: 16px; color: #fff; margin-top: 80px;}
.introduce .first p{ font-size: 12px; color: #fff; margin-top: 10px;}
.introduce .first a{ font-size: 14px; color: #fff; margin-top: 40px; padding: 5px 20px; border: #fff solid 1px; display: inline-block;-webkit-transition-property: background,color,margin-left; transition-property: background, color,margin-left;-webkit-transition-duration: .2s; transition-duration: .2s; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-transition-delay: 0s;transition-delay: 0s;}
.introduce .first a:hover{ background: #fff; color: #00707e; margin-left: 4px;}
.introduce > img{ float: left; width: 600px; height: 340px;}
.introduce .third{ width: 220px; height: 340px; background-image: url("../img/pic21.png"); background-repeat: no-repeat;float: left; padding: 0 40px;}
.introduce .third h2{ font-size: 20px; color: #00707e; margin-top: 87px;}
.introduce .third p{ font-size: 30px; color: #00707e; margin-top: 10px;}
.introduce .third a{ font-size: 14px; color: #00707e; margin-top: 40px; padding: 5px 20px; border: #00707e solid 1px; display: inline-block;-webkit-transition-property: background,color,margin-left; transition-property: background, color,margin-left;-webkit-transition-duration: .2s; transition-duration: .2s; -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; -webkit-transition-delay: 0s;transition-delay: 0s;}
.introduce .third a:hover{ background: #00707e; color: #fff; margin-left: 4px;}

footer .top{ margin-top: 30px; background: #00707e; padding: 50px 0;}
footer .first{ float: left;}
footer .first p{ color: #fff; line-height: 2;}
footer .mycontainer > img{ float: left; margin-left: 268px; display: block;}
footer .third{ float: right; margin-top: 17px;}
footer .third p{ font-size: 14px; color: #fff; border-bottom: #007d8d 1px solid; padding-bottom: 10px;}
footer .third ul{ margin-top: 10px;}
footer .third ul li{ float: left; margin: 0 6px;}
footer .third ul li:first-child{ margin-left: 0;}
footer .third ul li:last-child{ margin-right: 0;}
footer .bottom{ background: #007585; padding: 10px 0;}
footer .bottom ul, footer .bottom p{ text-align: center;}
footer .bottom ul li{ display: inline-block; margin: 0 1px; font-size: 12px; color: #b2f6ff;}
footer .bottom ul li a, footer .bottom p{ font-size: 12px; color: #b2f6ff; line-height: 2;}
footer .bottom ul li a:hover{ color: #fff;}