@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, input  {margin: 0;padding: 0;border: none;outline: 0; font: inherit;vertical-align: baseline;}
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {-webkit-text-size-adjust: none;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body { font-size:14px;}
ol, ul, li {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}

body { background:#fff; font-family: "Microsoft YaHei"; }

a{color:#444;text-decoration:none;}

a,
button,
input {
    -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
}
textarea,button { outline: none; }
*{margin: 0;padding: 0;}
.st {
    font-family: "simsun";
}
.fl {
    display: block;
    float: left;
}

.fr {
    display: block;
    float: right;
}
.clear:after {
    content: '';
    display: block;
    clear: both;
}
.title {
    position: absolute;
    display: table;
    padding: 1.33vw 6.667vw;
    top: 5.33vw;
    left: 50%;
    font-size: 16px;
    line-height: 1.28em;
    text-align: center;
    color: #d3d3d4;
    border-radius: 4px;
    background: #6b6d70;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

/* 底部导航 */

.nav {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
.nav-box {
    padding: 3.33vw 0 2px;
    background: #404244;
}
.nav-warp {
    display: table;
    margin: 0 auto;
}
.nav-item {
    float: left;
    margin: 0 4.2vw;
}
.navi-btn {
    display: block;
    width: 8.8vw;
}
.navi-btn span {
    display: block;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
}
.navib-text {
    margin-top: 2px;
    font-size: 12px;
    line-height: 2em;
    text-align: center;
    color: #fff;
}
.navib-icon {
    width: 8.8vw;
    height: 8.8vw;
}
.navi-btn1 .navib-icon {
    background: url(../images/nav-icon1.png) no-repeat;
    background-size: 100% 100%;
}
.nav-item.on .navi-btn1 .navib-icon {
    background: url(../images/nav-icon1-on.png) no-repeat;
    background-size: 100% 100%;
}
.navi-btn2 .navib-icon {
    background: url(../images/nav-icon2.png) no-repeat;
    background-size: 100% 100%;
}
.nav-item.on .navi-btn2 .navib-icon {
    background: url(../images/nav-icon2-on.png) no-repeat;
    background-size: 100% 100%;
}
.navi-btn3 .navib-icon {
    background: url(../images/nav-icon3.png) no-repeat;
    background-size: 100% 100%;
}
.nav-item.on .navi-btn3 .navib-icon {
    background: url(../images/nav-icon3-on.png) no-repeat;
    background-size: 100% 100%;
}
.navi-btn4 .navib-icon {
    background: url(../images/nav-icon4.png) no-repeat;
    background-size: 100% 100%;
}
.nav-item.on .navi-btn4 .navib-icon {
    background: url(../images/nav-icon4-on.png) no-repeat;
    background-size: 100% 100%;
}
.navi-btn5 .navib-icon {
    background: url(../images/nav-icon5.png) no-repeat;
    background-size: 100% 100%;
}
.nav-item.on .navi-btn5 .navib-icon {
    background: url(../images/nav-icon5-on.png) no-repeat;
    background-size: 100% 100%;
}

.navi-btn6 .navib-icon {
    background: url(../images/nav-icon6.png) no-repeat;
    background-size: 100% 100%;
}
.nav-item.on .navi-btn6 .navib-icon {
    background: url(../images/nav-icon6-on.png) no-repeat;
    background-size: 100% 100%;
}


.navi-hide {
    display: none;
    position: absolute;
    left: 9vw;
    bottom: 100%;
}
.nih-item {
    float: left;
    width: 14.13vw;
}
.nih-btn {
    display: block;
    width: 14.13vw;
}
.nih-btn span {
    display: block;
}
.nih-btn-icon {
    width: 8vw;
    height: 8vw;
    margin: 0 auto;
}
.nih-btn1 .nih-btn-icon {
    background: url(../images/nih-btn1.png) no-repeat;
    background-size: 100% 100%;
}
.nih-btn2 .nih-btn-icon {
    background: url(../images/nih-btn2.png) no-repeat;
    background-size: 100% 100%;
}
.nih-btn3 .nih-btn-icon {
    background: url(../images/nih-btn3.png) no-repeat;
    background-size: 100% 100%;
}
.nih-btn4 .nih-btn-icon {
    background: url(../images/nih-btn4.png) no-repeat;
    background-size: 100% 100%;
}
.nih-btn5 .nih-btn-icon {
    background: url(../images/nih-btn5.png) no-repeat;
    background-size: 100% 100%;
}
.nih-btn-text {
    font-size: 12px;
    line-height: 2em;
    text-align: center;
    color: #181818;
}

/* 720页面 */

.side-nav {
    position: absolute;
    right: 2.4vw;
    top: 21.86vw;
}
.snw-item {
    margin-bottom: 1.73vw;
}
.snwi-bg {
    position: relative;
    display: block;
    width: 16.52vw;
    height: 16.52vw;
    padding: 1px;
    overflow: hidden;
}
.snwi-bg span {
    display: block;
}
.snwi-pic img {
    width: 100%;
    vertical-align: top;
}
.snw-item.on .snwi-bg {
    background: url(../images/snwi-bg.jpg) no-repeat;
    background-size: 100% 100%;
}
.snwi-text {
    position: relative;
    width: 100%;
}
.snwi-text span {
    display: block;
    width: 100%;
    position: absolute;
    font-size: 12px;
    text-align: center;
    line-height: 1.625em;
    color: #fff;
    background: rgba(0, 0, 0, .61);
    left: 0;
    bottom: 0;
    box-sizing: border-box;
}
/* 详情 */
.dti-box {
    position: absolute;
    width: 84vw;
    height: 73vh;
    background: #fff;
    left: 50%;
    top: 50%;
    padding: 10.53vw 3.46vw 6.13vw 4.26vw;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    box-sizing: border-box;
}
.close {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 5.6vw;
    height: 5.6vw;
}
.close img {
    width: 100%;
    vertical-align: top;
}
.dti-video {
    display: block;
    position: relative;
    width: 73.33vw;
    margin: 0 auto;
}
.dtiv-pic {
    display: block;
    width: 100%;
}
.dtiv-pic img {
    width: 100%;
    vertical-align: top;
}
.dtiv-icon {
    display: block;
    position: absolute;
    width: 16.4vw;
    height: 16.4vw;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
}
.dtiv-icon img {
    width: 100%;
    vertical-align: top;
}
.dti-art {
    padding-top: 5.2vw;
    font-size: 14px;
    line-height: 1.25em;
    color: #3e3e3e;
}
.dtia-pic {
    width: 47.33vw;
    margin: 6.46vw auto 0;
}
.dtia-pic img {
    width: 100%;
    vertical-align: top;
}

/* 询价 */
.price-box {
    position: absolute;
    width: 84vw;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    background: #fff;
    box-sizing: border-box;
}
.pib {
    padding: 14.4vw 8.26vw;
}
.f-input {
    width: 100%;
    margin-bottom: 1.86vw;
}
.f-input input {
    width: 100%;
    border: 1px solid #c3c3c3;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 2.25em;
    color: #7f7e7e;
    padding: 0 0.75em;
}

/* 下拉选择框 */
.select-block {
    width: 100%;
}
.select {
    position: relative;
    /* display: block; */
    margin: 0 auto;
    width: 33.6vw;
    font-size: 14px;
    color: #cccccc;
    vertical-align: middle;
    text-align: left;
    user-select: none;
    -webkit-touch-callout: none;
}
.select .placeholder:after {
    position: absolute;
    content: '';
    right: 1em;
    top: 50%;
    z-index: 10;
    width: 9px;
    height: 4px;
    background: url(../images/arrow.png) no-repeat;
    background-size: 100% auto;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
}
.select.is-open ul {
    display: block;
}
.select .placeholder {
    background: #fff;
    color: #7f7e7e;
    position: relative;
    display: block;
    z-index: 1;
    padding: 0 0.75em;
    line-height: 2.25em;
    border-radius: 2px;
    cursor: pointer;
    border: 1px solid #c3c3c3;
}
.select ul {
    display: none;
    position: absolute;
    overflow: hidden;
    width: 100%;
    background: #fff;
    border-radius: 2px;
    top: 100%;
    left: 0;
    list-style: none;
    margin: 5px 0 0 0;
    padding: 0;
    z-index: 100;
    height: 9em;
    border: 1px solid #c3c3c3;
    overflow: scroll;
}
.select ul li {
    display: block;
    text-align: left;
    padding: 0 0.75em;
    line-height: 2.25em;
    color: #7c7c7c;
    cursor: pointer;
}
.f-textarea {
    display: block;
    margin-top: 1.86vw;
}
.f-textarea textarea {
    width: 100%;
    padding: 0 0.75em;
    font-family: "Microsoft YaHei";
    font-size: 12px;
    line-height: 2em;
    color: #7f7e7e;
    border: 1px solid #c3c3c3;
    box-sizing: border-box;
}
.sub-btn {
    display: block;
    width: 100%;
    padding: 0;
    margin-top: 8vw;
    font-size: 16px;
    line-height: 1.857em;
    text-align: center;
    color: #fff;
    background: url(../images/btn-bg.jpg) repeat-x;
    background-size: auto 100%;
    border: 0 none;
}





.navi-btn {
    display: table;
    width: auto;
}
body {
    width: 100vw;
    height: 100vh;
    background: url('../images/body-bg.jpg') no-repeat;
    background-size: 100% 100%;
}
@media screen and (min-width: 768px) {
  body {
      background: url('../images/body-bg-big.jpg') no-repeat;
      background-size: 100% 100%;
  }
  .nav-box {
      max-height: 84px;
      margin: 0 auto;
      padding: 10px 0;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
  }
  .nav-warp {
    position: relative;
  }
  .nav-item {
    margin: 0 23px;
  }
  .navib-icon {
    max-width: 42px;
    max-height: 42px;
  }
  .nih-item,
  .nih-btn {
    max-width: 54px;
  }
  .nih-btn-icon {
    width: 36px;
    height: 36px;
  }
  .navi-hide {
    left: 18px;
    bottom: 84px;
  }
  .title {
    font-size: 18px;
  }
}






.threesixty_images li{position: relative;}
.showPcontent{width:80%;position: relative;}
.showPcontent .close{position:absolute;top:-20px ;right:-20px;background:url(../images/close.png) no-repeat;width:40px;height:40px;background-size:100%;z-index:10}



.mask{
	position: absolute;
	z-index:9;
    width: 100%;
    height: 100%;
	background:#000;
	top:0;
	opacity: 0.6;
}

/* 分享 */
.share-arrow {
    position: absolute;
	z-index:100;
    width: 100%;
    height: 100%;
	background:#000;
	top:0;
	opacity: 0.6;
}
.share-arrow img {
    position: absolute;
	display:block;
    width: 68.13vw;
    top: 15.06vw;
    right: 4.8vw;
}
.share-mode {
    position: absolute;
	background: #fff;
	z-index:99;
    width: 100%;
    bottom: 0;
    box-shadow: 0 0 10px #eee;
}
.samd-item {
    float: left;
    width: 25%;
}
.samd-item a {
    display: block;
    padding: 5.33vw 0;
}
.samd-icon {
    display: block;
    width: 12vw;
    height: 12vw;
    margin: 0 auto;
}
.samd-icon img {
    width: 100%;
    vertical-align: top;
}
.samd-text {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    line-height: 2em;
    text-align: center;
}
.cancel {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 3.75em;
    text-align: center;
    border-top: 1px solid #d8d8d8;
}




.navib-icon {
	margin: 0 auto;
}
.sub-btn {
	line-height: 2.55em;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-ms-border-radius: 2px;
	-o-border-radius: 2px;
}
.pib {
	padding: 0 8.3vw 7.2vw;
}
.f-input input {
	line-height: 2.45em;
	border-color: #dcdcdc;
}
.f-textarea textarea {
	font-size: 14px;
	height: 6em;
	border-color: #dcdcdc;
}
.f-input input:focus::-webkit-input-placeholder,
.f-textarea textarea:focus::-webkit-input-placeholder {
	color: #0b0a09;
}

.f-input input:focus::-moz-placeholder,
.f-textarea textarea:focus::-moz-placeholder {
	color: #0b0a09;
}

.f-input input:focus:-moz-placeholder,
.f-textarea textarea:focus::-moz-placeholder {
	color: #0b0a09;
}

.f-input input:focus::-ms-input-placeholder,
.f-textarea textarea:focus::-moz-placeholder {
	color: #0b0a09;
}
.f-input input:focus,
.f-textarea textarea:focus {
	color: #0b0a09;
	border-color: #adadad;
}










