@charset "UTF-8";
html, body, div, span, strong, small, em, img, address, object, iframe, var, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, hr, fieldset, form, input, button, select, textarea, label, legend, blockquote, p, pre, table, caption, tbody, thead, tfoot, tr, td, th, sup, sub, del, ins, cite, article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary, audio, canvas, progress, video {
margin: 0;
padding: 0;
word-wrap: break-word;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
display: block;
}
audio, canvas, progress, video {
display: inline-block;
vertical-align: baseline;
}
html, body {
font: 12px/22px Avenir,Arial,"Hiragino Sans GB","\5FAE\8F6F\96C5\9ED1","\5b8b\4f53",sans-serif;
background-color: #FFF;
background-image: url(about:blank);
background-attachment: fixed;
color: #222;
}
li {
list-style: none;
}
a {
background: transparent;
text-decoration: none;
color: inherit;
}
a:active, a:hover {
text-decoration: none;
outline: 0;
}
a:focus {
text-decoration: none;
outline: 0;
hide-focus: expression(this.hideFocus=true);
}
a:visited {
text-decoration: none;
outline: 0;
}
h1, h2, h3, h4, h5, h6 {
font: inherit;
}
b, strong {
font-weight: 700;
}
img, fieldset, legend {
border: 0;
}
img:-moz-broken {
-moz-force-broken-image-icon: 1;
}
dfn {
font-style: italic;
}
sub, sup {
position: relative;
font-size: 75%;
line-height: 0;
vertical-align: baseline;
}
sup {
top: -.5em;
}
sub {
bottom: -.25em;
}
small {
font-size: 80%;
}
em, small, var, i, cite {
font-style: normal;
}
code, kbd, pre, samp {
font-family: monospace,monospace;
font-size: 1em;
}
button, input, optgroup, select, textarea {
color: inherit;
font: inherit;
outline: 0;
}
button, input, optgroup, select {
vertical-align: middle;
}
button, select {
text-transform: none;
}
input {
line-height: normal;
}
button {
overflow: visible;
}
textarea {
resize: none;
}
input, textarea {
border-radius: 0;
-webkit-appearance: none;
}
button, html input[type=button], input[type=reset], input[type=submit] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled], html input[disabled] {
cursor: default;
}
button::-moz-focus-inner, input::-moz-focus-inner {
border: 0;
padding: 0;
}
input[type=checkbox], input[type=radio] {
box-sizing: border-box;
padding: 0;
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
height: auto;
}
input[type=search] {
-webkit-appearance: textfield;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
color: #C7C7C7;
}
input::-moz-placeholder, textarea::-moz-placeholder {
color: #C7C7C7;
opacity: 1;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
color: #C7C7C7;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td, th {
padding: 0;
}
img {
vertical-align: top;
}
/* 清浮动 */
.clear {
zoom: 1;
}
.clear:after {
clear: both;
content: '.';
display: block;
width: 0;
height: 0;
visibility: hidden;
}
.lf {
float: left;
}
.rt {
float: right;
}
/*1920容器*/
.section-outer {
max-width: 1920px;
min-width: 1310px;
margin: 0 auto;
}
/*1210容器*/
.container {
width: 1210px;
margin: 0 auto;
}
/* header*/
.con-nav, .header {
width: 1210px;
margin: 0 auto;
padding: 16px 0;
height: 70px;
overflow: hidden;
}
.con-nav-logo, .con-nav-logo img, .header-logo, .header-logo img {
float: left;
}
.nav-right, .header .nav {
float: right;
margin-top: 20px;
}
.nav-right li, .header .nav li {
float: left;
width: 86px;
height: 30px;
margin-left: 30px;
line-height: 30px;
text-align: center;
font-size: 16px;
}
.nav-right li a, .header .nav li a {
color: #074385;
display: block;
width: 100%;
height: 100%;
text-decoration: none;
}
.header .nav li a.current,
.header .nav li a:hover {
background-color: #074385;
display: block;
color: #fff;
}
/*banner*/
.banner {
height: 261px;
margin-bottom: 60px;
background: no-repeat center 0;
}
/*footer*/
.footer-outer {
background-color: #074385;
}
.footer {
width: 1210px;
margin: 0 auto;
}
.footer:after {
display: block;
content: '';
clear: both;
}
.footer .footer-side {
float: left;
margin: 46px 136px 0 0;
font-size: 14px;
line-height: 30px;
color: #fff;
}
.footer .footer-side li:hover {
color: #a6d0ff;
}
.footer .footer-side .title {
font-size: 18px;
margin-bottom: 26px;
line-height: 1;
}
.footer .footer-main {
float: right;
margin-top: 21px;
color: #fff;
}
.footer .footer-main .tel-txt {
font-size: 18px;
line-height: 1;
margin-top: 20px;
}
.footer .footer-main .tel {
font-size: 20px;
line-height: 1;
margin-top: 10px;
}
.footer .footer-main .email {
font-size: 16px;
line-height: 1;
margin-top: 15px;
}
.footer .footer-main .time {
font-size: 14px;
line-height: 1;
margin-top: 15px;
}
.footer .footer-main .btn {
display: inline-block;
margin: 20px 0;
padding: 12px 25px;
background-color: #c69a3b;
font-size: 18px;
border-radius: 5px;
}
.footer .footer-main .btn:hover {
background-color: #ad7d16;
}
.footer .footer-main .btn .icon {
display: inline-block;
width: 34px;
height: 23px;
vertical-align: top;
background: url(http://statics.melitabuy.com/images/obb_new/icons.png) no-repeat 0 -32px;
}
.footer-link-outer {
background-color: #03366e;
}
.footer-link {
width: 1210px;
margin: 0 auto;
padding: 30px 0;
color: #e6e6e6;
}
.footer-link span {
padding: 0 5px;
}
.footer-link .icp {
display: inline-block;
margin-left: 75px;
}
/*通用标题*/
.section-title {
width: 1210px;
margin: 0 auto;
text-align: center;
line-height: 1;
}
.section-title .small-logo {
margin-bottom: 17px;
}
.section-title .mainTitle {
font-size: 30px;
color: #333;
}
.section-title .subTitle {
margin-top: 20px;
font-size: 16px;
color: #6290b7;
font-style: oblique;
}
/*图片列表*/
.pic-list-wrap {
width: 1210px;
margin: 0 auto;
overflow: hidden;
text-align: center;
letter-spacing: 1px;
}
.pic-list-wrap .title {
font-size: 24px;
line-height: 1;
}
.pic-list-wrap .subTitle {
font-size: 18px;
}
.pic-list-wrap .pic-list {
width: auto;
}
.pic-list-wrap .pic-list:after {
content: '';
display: block;
clear: both;
}
.pic-list .list {
float: left;
margin-right: 0;
}
.pic-list-wrap .list img + img {
display: block;
}
.pic-list-wrap .desc {
font-size: 14px;
}
/*固定功能按钮*/
.fix-side {
position: fixed;
top: 40%;
right: 0;
z-index: 20;
height: 126px;
text-align: right;
}
.fix-side .txt {
display: inline-block;
width: 68px;
height: 16px;
padding: 12px 10px;
font-size: 16px;
line-height: 16px;
background-color: #0554aa;
vertical-align: top;
color: #fff;
display: none;
}
.fix-side .chat:hover .txt, .fix-side .message:hover .txt {
display: inline-block;
}
.fix-side .chat:hover .icon, .fix-side .message:hover .icon {
background-color: #0554aa;
}
.fix-side .chat {
height: 40px;
cursor: pointer;
}
.fix-side .chat .icon {
display: inline-block;
width: 40px;
height: 40px;
background: #cdcbce url(http://statics.melitabuy.com/images/obb_new/icons.png) no-repeat 8px -23px;
}
.fix-side .message {
height: 40px;
margin: 3px 0;
cursor: pointer;
}
.fix-side .message .icon {
display: inline-block;
width: 40px;
height: 40px;
background: #cdcbce url(http://statics.melitabuy.com/images/obb_new/icons.png) no-repeat 8px -67px;
}
.fix-side .toTop {
display: inline-block;
width: 40px;
height: 40px;
background: #0554aa url(http://statics.melitabuy.com/images/obb_new/icons.png) no-repeat -53px -18px;
}
.fix-side .toTop:hover {
background-color: #034493;
}
/*title+pic+text*/
.picShow {
width: 1210px;
margin: 0 auto;
}
.picShow .title {
padding-top: 40px;
text-align: center;
font-size: 24px;
line-height: 1;
}
.picShow .pic {
display: block;
margin: 31px 0 0;
}
.picShow .text {
margin-bottom: 38px;
padding-top: 27px;
font-size: 16px;
line-height: 30px;
text-align: center;
color: #333;
}
/*模态框*/
.modal {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 100;
opacity: .5;
background-color: #000;
display: none;
}
/*留言*/
.message-box {
position: absolute;
top: 30%;
left: 50%;
z-index: 101;
width: 240px;
margin-left: -120px;
display: none;
}
.message-box .message-title {
width: 100%;
height: 36px;
line-height: 36px;
color: #fff;
padding: 0 12px;
background-color: #015ccc;
box-sizing: border-box;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
}
.message-box .close {
float: right;
cursor: pointer;
font-size: 16px;
}
.message-box form {
width: 222px;
padding: 0 9px;
background-color: #ededed;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
}
.message-box .icon {
display: inline-block;
width: 14px;
height: 14px;
margin: 0 12px 0 8px;
vertical-align: middle;
}
.message-box i.name {
background: url(http://statics.melitabuy.com/images/obb_new/icons.png) no-repeat -32px 0;
}
.message-box i.phone {
background: url(http://statics.melitabuy.com/images/obb_new/icons.png) no-repeat -61px 0;
}
.message-box i.email {
background: url(http://statics.melitabuy.com/images/obb_new/icons.png) no-repeat -86px 3px;
}
.message-box .line {
width: 220px;
height: 30px;
border: 1px solid #d5d5d5;
margin-top: 7px;
background-color: #fff;
}
.message-box .line:hover {
border-color: #b9b9b9;
}
.message-box .err {
display: block;
width: 130px;
color: #ff5400;
}
.message-box input {
width: 165px;
height: 30px;
border: none;
background-color: #fff;
}
.message-box textarea {
width: 217px;
height: 106px;
padding-left: 5px;
margin-top: 12px;
border: 1px solid #d5d5d5;
}
.message-box textarea:hover {
border-color: #b9b9b9;
}
.message-box .submit {
width: 90px;
background-color: #015ccc;
border-radius: 4px;
border: none;
color: #fff;
text-align: center;
margin: 12px 0 19px;
cursor: pointer;
}
.message-box .submit:hover {
background-color: #034493;
}