@charset "utf-8";

/** Reset CSS **/
body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
fieldset,
legend,
button,
input,
textarea,
th,
td,
form,
div,
code {
	margin: 0;
	padding: 0;
}

body,
button,
input,
select,
textarea {
	font: 12px/1.5 Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif;
}

h1 {
	font-size: 18px;
}

h2 {
	font-size: 16px;
}

h3 {
	font-size: 14px;
}

h4,
h5,
h6 {
	font-size: 100%;
}

address,
cite,
dfn,
em,
var {
	font-style: normal;
}

code,
kbd,
pre,
samp,
tt {
	font-family: "Courier New", Courier, monospace;
}

small {
	font-size: 12px;
}

ul,
ol {
	list-style: none;
}

a {
	text-decoration: none;
	color: #929292
}

a:hover {
	text-decoration: underline;
}

abbr[title],
acronym[title] {
	border-bottom: 1px dotted;
	cursor: help;
}

q:before,
q:after {
	content: '';
}

legend {
	color: #000;
}

fieldset,
img {
	border: none;
}

button,
input,
select,
textarea {
	font-size: 100%;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

hr {
	border: none;
	height: 1px;
}

html {
	overflow-y: scroll;
	overflow-x: hidden;
}

html,
body {
	_height: 100%
}

/** Global CSS **/
body {
	color: #fff;
}

button,
input,
select,
textarea {
	vertical-align: middle;
}

strong {
	font-weight: bold;
}

.hide,
em {
	display: none
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

html[xmlns].clearfix {
	display: block;
}

* html .clearfix,
* html {
	height: 1%;
}

.clear {
	border-top: 1px solid transparent !important;
	border-top: 0;
	clear: both;
	line-height: 0;
	font-size: 0;
	height: 0;
	height: 1%;
}

.relative {
	position: relative;
}

/* input{user-select:none;-webkit-user-select:none;} */


/** HTML CSS **/
html,
body {
	background-color: #000;
}

img {
	max-width: 100%;
	/* 设置图片最大宽度为100%以自适应 */
	height: auto;
	width: auto\9;
	/* ie8 */
	_width: 100%;
	/* ie6 */
}

.clearfloat {
	clear: both;
}

.w100 {
	width: 100%;
}

.bg-black {
	background-color: #000;
}

.wrap-screen {
	height: 100vh;
	overflow: hidden;
}

.screen {
	width: 100%;
	height: 100%;
}

.wrap {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	position: relative;
	background-color: #000;
}

header {
	width: 100%;
	height: 60px;
	line-height: 60px;
	overflow: hidden;
	position: fixed;
	z-index: 999;
	top: 0;
	background-color: #000;

}

header .logo {
	width: 140px;
	height: 60px;
	position: absolute;
	margin-left: 25px;
	background: url(../images/trinx_logo_header.png) no-repeat center;
	background-size: 100%;
	z-index: 2;
}

header .logo a {
	width: 140px;
	height: 60px;
	display: block;
	cursor: pointer;
}

header nav.top {
	width: 50%;
	position: absolute;
	right: 25px;
	text-align: right;
	z-index: 1;
}

header nav.top a {
	color: #FFF;
	font-size: 14px;
	font-family: "微软雅黑";
	padding: 0 10px;
	cursor: pointer;
}

header nav.top a.head_btn_logout {
	display: none;
}

header nav.top a.head_btn_welcome {
	display: none;
}

.banner {
	width: 100%;
	position: relative;
	background-color: rgba(0, 0, 0);
}

.banner .banner-content {
	margin: 0 auto;
	display: block;
	position: relative;
	width: 1920px;
	height: 800px;
	top: 50%;
	transform: translateY(-50%);
}

.banner img {
	margin: 0 auto;
	width: 100%;
	max-width: unset;
}

.banner .t1 {
	width: 396px;
	height: 156px;
	background-color: rgba(0, 0, 0, 0.8);
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -35px;
	margin-left: -198px;
	display: none;
}

.banner .t1 .f1 {
	font-size: 78px;
	color: #FFF;
	font-family: Arial;
	position: absolute;
	width: 100%;
	height: 90px;
	line-height: 90px;
	text-align: center;
	top: 10px;
	display: none;
}

.banner .t1 .f2 {
	font-size: 24px;
	color: #FFF;
	font-family: "微软雅黑";
	position: absolute;
	width: 100%;
	height: 36px;
	line-height: 36px;
	text-align: center;
	top: 100px;
	display: none;
	letter-spacing: 3px;
}

.banner .btn_make {
	width: 160px;
	height: 42px;
	background: url(../images/coming_start.png) no-repeat center;
	background-size: contain;
	position: absolute;
	z-index: 10;
	bottom: 180px;
	right: 200px;
	cursor: pointer;
}

.banner .btn_make img {
	width: 100%;
	height: auto;
}

.banner .btn_make:hover {
	opacity: 0.8;
}

.Xfile {
	width: 100%;
	background-color: rgba(0, 0, 0);
}

.Xfile .Xfile-content {
	width: 1920px;
	height: 1000px;
	margin: 0 auto;
}

.Xfile .Xfile-content img {
	height: 1000px;
	margin: 0 auto;
	width: 100%;
	max-width: unset;
}

.process {
	width: 100%;
	height: 800px;
	background-color: #FFF;
	overflow: hidden;
	position: relative;
}

.process .t1 {
	font-size: 36px;
	color: #323232;
	text-align: center;
	font-family: "微软雅黑";
	position: absolute;
	top: 90px;
	width: 100%;
}

.process .t2 font {
	font-size: 22px;
	color: #323232;
	font-family: Tahoma;
	text-align: center;
	-webkit-transform: scale(1, 1);
	transform: scale(1, 1);
	position: absolute;
	top: 140px;
	width: 100%;
}

.process .list {
	width: 1255px;
	height: 560px;
	position: relative;
	top: 250px;
	margin: 0 auto;
	overflow: hidden;
}

.process .list .item {
	width: 2000em;
}

.process .list ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 280px;
	height: 560px;
	margin-right: 45px;
	float: left;
}

.process .list li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.process .list li.img {
	width: 280px;
	height: 339px;
	margin-bottom: 20px;
}

.process .list li.img img {
	width: 280px;
	height: 339px;
}

.process .list li.title {
	font-size: 30px;
	font-family: "微软雅黑";
	color: #232323;
	height: 56px;
	line-height: 56px;
}

.process .list li.dec {
	font-size: 18px;
	font-family: "微软雅黑";
	color: #505050;
	height: 66px;
	line-height: 22px;
	padding: 7px 0;
	display: none;
}

.process .list li.btn {
	font-size: 18px;
	font-family: "微软雅黑";
	color: #505050;
	line-height: 30px;
	padding: 10px 0;
	background: url(../images/icon6.png) no-repeat;
	background-position: 80px center;
	font-weight: bold;
}


.process .t3 span {
	width: 180px;
	height: 180px;
	border: #000 1px solid;
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.process .t3 span i {
	background-position: center;
	background-repeat: no-repeat;
	width: 100%;
	height: 100%;
	position: absolute;
	font-size: 20px;
	text-align: center;
	color: #333;
	font-family: "微软雅黑";
	font-style: normal;
	line-height: 270px;
}

.process .t3 span.icon1 {
	left: 50%;
	margin-left: -630px;
}

.process .t3 span.icon2 {
	left: 50%;
	margin-left: -360px;
}

.process .t3 span.icon3 {
	left: 50%;
	margin-left: -90px;
}

.process .t3 span.icon4 {
	left: 50%;
	margin-left: 180px;
}

.process .t3 span.icon5 {
	left: 50%;
	margin-left: 450px;
}

/*.process .t3 span.icon1 i{ background-image:url(../images/icon_1.gif);}
.process .t3 span.icon2 i{ background-image:url(../images/icon_2.gif);}
.process .t3 span.icon3 i{ background-image:url(../images/icon_3.gif);}
.process .t3 span.icon4 i{ background-image:url(../images/icon_4.gif);}
.process .t3 span.icon5 i{ background-image:url(../images/icon_5.gif);}*/

.process .t3 span i {
	-webkit-transform: scale(1, 1) rotate(-45deg);
	transform: scale(1, 1) rotate(-45deg);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

.process .t3 span i:hover {
	-webkit-transform: scale(1.2, 1.2) rotate(-45deg);
	transform: scale(1.2, 1.2) rotate(-45deg);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}


.wrap_diy {
	background: #efefef;
	width: 100%;
	height: 100%;
	position: relative;
	display: none;
}

.diysession {
	background: #efefef;
	width: 100%;
	height: 100%;
	position: relative;
	top: 0;
	left: 0;
	z-index: 99;
}

.diysession .session {
	width: 100%;
	height: 100%;
	display: none;
}

.diysession .leftArea {
	display: none;
	width: 350px;
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: 40px;
	z-index: 3;
}

.diysession .modelname {
	width: 330px;
	font-size: 54px;
	color: #121212;
	height: 60px;
	line-height: 60px;
	font-family: "微软雅黑";
	position: absolute;
	left: 45px;
	top: 50%;
	margin-top: -350px;
	background-repeat: no-repeat;
	cursor: pointer;
}

.diysession .leftArea .price {
	font-size: 24px;
	color: #ed0000;
	font-family: "微软雅黑";
	position: absolute;
	left: 45px;
	top: 50%;
	margin-top: -280px;
	padding-left: 0;
}

.diysession .leftArea .price font {
	font-size: 14px;
	position: absolute;
	left: 0;
	top: 5px;
}

.diysession .leftArea .price span.help {
	font-size: 14px;
	color: #121212;
	font-family: "微软雅黑";
	background: none;
}

.diysession .leftArea .price i {
	width: 15px;
	height: 15px;
	line-height: 15px;
	text-align: center;
	background: #c7c7c7;
	border-radius: 50%;
	color: #FFF;
	font-size: 12px;
	display: inline-block;
	font-style: normal;
	margin-left: 5px;
	cursor: pointer;
}

.diysession .leftArea .price i .helpContent {
	width: 200px;
	line-height: 22px;
	background: #212121;
	color: #ffffff;
	position: absolute;
	border-radius: 5px;
	padding: 10px;
	top: 0;
	left: 300px;
	text-align: left;
}

.diysession .leftArea .price i .helpContent a {
	width: 14px;
	height: 14px;
	background: #212121;
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 15px;
	left: -6px;
}

.diysession .leftArea .price span.txt {
	background-color: #ffff00;
	font-size: 12px;
	padding: 2px 5px;
	border-radius: 5px;
	color: #ed0000;
}

.diysession .leftArea .price span.total {
	position: relative;
	padding-left: 12px;
}

.diysession .leftArea .price i .helpContent {
	opacity: 0;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

.diysession .leftArea .price i:hover .helpContent {
	opacity: 1;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}






.diysession .tips {
	font-size: 24px;
	color: #121212;
	font-family: "微软雅黑";
	position: absolute;
	left: 45px;
	top: 50%;
	margin-top: -230px;
}

.diysession .btn_submit {
	width: 255px;
	height: 75px;
	line-height: 75px;
	position: absolute;
	left: 45px;
	top: 50%;
	margin-top: 200px;
	background: #e00011 url(../images/icon7.png) no-repeat 24px center;
	font-size: 18px;
	color: #FFF;
	font-family: "微软雅黑";
	border-radius: 10px;
	text-indent: 70px;
	cursor: pointer;
}

.diysession .btn_submit span {
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.2);
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	-webkit-transform: scale(1, 0.1);
	transform: scale(1, 0.1);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

.diysession .btn_submit:hover {
	background-color: #e60c1c;
}

.diysession .btn_submit:hover span {
	/*opacity:1;
-webkit-transform: scale(1,1); transform: scale(1,1); 
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s;*/
}

.diysession .preview_config {
	width: 205px;
	height: 36px;
	line-height: 36px;
	position: absolute;
	left: 45px;
	top: 50%;
	margin-top: 300px;
	cursor: pointer;
}

.diysession .preview_config i {
	background-image: url(../images/icon.png);
	background-repeat: no-repeat;
	background-position: 0 -288px;
	width: 38px;
	height: 36px;
	position: absolute;
	left: 16px;
	z-index: 3;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

.diysession .reset_config {
	width: 175px;
	height: 36px;
	line-height: 36px;
	position: absolute;
	left: 45px;
	top: 50%;
	margin-top: 350px;
	cursor: pointer;
}

.diysession .reset_config i {
	background-image: url(../images/icon.png);
	background-repeat: no-repeat;
	background-position: 0 -334px;
	width: 38px;
	height: 36px;
	position: absolute;
	left: 16px;
	z-index: 3;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}


.diysession .preview_config:hover i,
.diysession .reset_config:hover i {
	background-position-x: right;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

.diysession .preview_config font,
.diysession .reset_config font {
	height: 36px;
	line-height: 36px;
	font-size: 18px;
	font-family: "微软雅黑";
	color: #242424;
	text-indent: 65px;
	z-index: 2;
	position: absolute;
}

.diysession .preview_config:hover font,
.diysession .reset_config:hover font {
	color: #fff;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

.diysession .preview_config span,
.diysession .reset_config span {
	display: block;
	width: 100%;
	height: 100%;
	background-color: #121212;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 5px;
	z-index: 1;
	opacity: 0;
	-webkit-transform: scale(0.1, 1);
	transform: scale(0.1, 1);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

.diysession .preview_config:hover span,
.diysession .reset_config:hover span {
	opacity: 1;
	-webkit-transform: scale(1, 1);
	transform: scale(1, 1);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

/*
.diysession .reset_config span{display:block; width:100%; height:100%; background:rgba(0,0,0,0.1); position:absolute; top:0; left:0;border-radius:5px;
opacity:0;
-webkit-transform: scale(0.1,1); transform: scale(0.1,1); 
-webkit-transition:opacity 0.35s, -webkit-transform 0.35s; transition:opacity 0.35s, transform 0.35s;
}
.diysession .reset_config:hover span{
opacity:1;
-webkit-transform: scale(1,1); transform: scale(1,1); 
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s;
}
.diysession .reset_config{ width:175px; height:36px; line-height:36px; position:absolute; left:45px; top:50%; margin-top:220px; background:url(../images/icon9.png) no-repeat 24px center; font-size:18px; color:#121212; font-family:"微软雅黑"; text-indent:70px; cursor:pointer;}
*/

/*nav-left*/
nav.left {
	position: absolute;
	left: 45px;
	top: 50%;
	margin-top: -170px;
	z-index: 2;
}

nav.left a {
	display: block;
	width: 140px;
	height: 36px;
	cursor: pointer;
	text-decoration: none;
	border-radius: 5px;
	margin-bottom: 10px;
	position: relative;
	overflow: hidden;
}

nav.left a i {
	background-image: url(../images/icon.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	width: 45px;
	height: 36px;
	position: absolute;
	left: 16px;
	z-index: 3;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

nav.left a i.i1 {
	background-position: 0 0;
}

nav.left a i.i2 {
	background-position: 0 -50px;
}

nav.left a i.i3 {
	background-position: 0 -98px;
}

nav.left a i.i4 {
	background-position: 0 -148px;
}

nav.left a i.i5 {
	background-position: 0 -195px;
}

nav.left a i.i6 {
	background-position: 0 -241px;
}

nav.left a i.i7 {
	background-position: 0 -375px;
}

nav.left a i.i8 {
	background-position: 0 -418px;
}

nav.left a i.i9 {
	background-position: 0 -462px;
}

nav.left a.active {
	padding: 0;
}

nav.left a:hover i {
	background-position-x: right;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

nav.left a.active i {
	background-position-x: right;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

nav.left a font {
	height: 36px;
	line-height: 36px;
	font-size: 18px;
	font-family: "微软雅黑";
	color: #242424;
	text-indent: 65px;
	z-index: 2;
	position: absolute;
}

nav.left a:hover font {
	color: #fff;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

nav.left a.active font {
	color: #fff;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

nav.left a span {
	display: block;
	width: 100%;
	height: 100%;
	background-color: #121212;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 5px;
	z-index: 1;
	opacity: 0;
	-webkit-transform: scale(0.1, 1);
	transform: scale(0.1, 1);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

nav.left a:hover span {
	opacity: 1;
	-webkit-transform: scale(1, 1);
	transform: scale(1, 1);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

nav.left a.active span {
	opacity: 1;
	-webkit-transform: scale(1, 1);
	transform: scale(1, 1);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
}

/*nav-left*/

/*choosemodel*/
.choosemodel {
	width: 100%;
	height: 100%;
	background-color: #000;
	position: relative;
}

.choosemodel .tips {
	width: 340px;
	height: 60px;
	position: absolute;
	left: 50%;
	top: 50%;
	color: #333;
	z-index: 2;
	zoom: 0.6;
	transform: translate(-50%, -540px);
	display: none;
}

.choosemodel .tips .t1 {
	font-family: "微软雅黑";
	font-size: 36px;
	text-align: center;
	display: block;
	color: #fff;
}

.choosemodel .tips .t2 {
	height: 35px;
	line-height: 35px;
	font-family: Tahoma;
	font-size: 20px;
	text-align: center;
	display: block;
}

.choosemodel .slider {
	width: 100%;
	height: 100%;
	z-index: 2;
}

.choosemodel .slider .slide {
	width: 100%;
	cursor: pointer;
	user-select: none;
}

.choosemodel .slider .slide .bycle {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	/* margin-left: -350px;
	margin-top: -215px; */
	z-index: 2;
	zoom: 1.2;
}

.choosemodel .slider .slide .name {
	width: 330px;
	height: 60px;
	left: 50%;
	top: 50%;
	position: absolute;
	transform: translate(-50%, 270px);
}

.choosemodel .slider .bx-controls {
	position: absolute;
	top: 50%;
	right: 20px;
}

.choosemodel .background-txt {
	width: 100vw;
	height: 100vh;
	position: absolute;
	z-index: 1;
	overflow: hidden;
	background: url(../images/background-X.png) no-repeat center;
	background-size: contain;
}

.choosemodel .bx-wrapper {
	z-index: 3;
}

/* .choosemodel .slider .slide {
	height: 1300px;
} */

/*choosemodel*/

/*carframe*/
.carframe {
	background-color: #dfdfdf;
	overflow: hidden;
	display: none;
}

.carframe .bike {
	width: 100%;
	position: absolute;
	left: 0;
	top: 60px;
	/*overflow:hidden;*/
	z-index: 1;
}

.carframe .bike .loading-icon {
	width: 200px;
	height: 200px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -100px;
	margin-top: -100px;
	background-image: url(../images/loading2.png);
	background-repeat: no-repeat;
	background-position: center;
	-webkit-animation: loadbikeIcon 1.5s linear both infinite;
	animation: loadbikeIcon 1.5s linear both infinite;

	-webkit-transform-origin: center center;
	transform-origin: center center;
}


.carframe .bike .scaleTips {
	width: 167px;
	height: auto;
	position: absolute;
	text-align: center;
	left: 50%;
	margin-left: -70px;
	bottom: 20px;
	z-index: 2;
	background: #242424;
	border-radius: 15px;
	padding: 3px;
}

.carframe .bike .scaleTips font {
	width: 10px;
	height: 15px;
	line-height: 15px;
	border: none;
	background: none;
	color: #eeeeee;
	font-size: 16px;
	text-align: center;
	float: left;
	margin: 0;
	z-index: 2;
	cursor: pointer;
	border-radius: 10px;
	padding: 0 5px;
}

.carframe .bike .scaleTips span {
	width: 12px;
	height: 18px;
	line-height: 9px;
	border: none;
	float: left;
	margin-right: 0;
	z-index: 20;
	position: relative;
}

.carframe .bike .scaleTips span.active {
	width: 18px;
	height: 18px;
	background: #dddddd;
	border-radius: 50%;
}

.carframe .bike .scaleTips span.line {
	width: 126px;
	height: 4px;
	background: #767676;
	border-radius: 10px;
	position: absolute;
	z-index: 1;
	top: 50%;
	margin-top: -2px;
	left: 50%;
	margin-left: -63px;
}


.carframe .bike .object {
	width: 1800px;
	height: 1001px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -900px;
	margin-top: -500px;
	cursor: all-scroll;
	z-index: 1;

}

.carframe .bike .object .model {
	width: 100%;
	height: 100%;
}

.carframe .bike .object .model>img {
	width: 100%;
	height: auto;
	position: absolute;
}

.carframe .bike .object .model .cushionLayer {
	z-index: 11;
}

.carframe .bike .object .model .seatlockLayer {
	z-index: 19;
}

.carframe .bike .object .model .chaindiscLayer {
	z-index: 18;
}

.carframe .bike .object .model .effectLayer {
	z-index: 17;
}

.carframe .bike .object .model .custom {
	z-index: 16;
}

.carframe .bike .object .model .patternLayer {
	z-index: 15;
}

.carframe .bike .object .model .patternLayer img {
	position: absolute;
}

.carframe .bike .object .model .colorLayer {
	z-index: 14;
}

.carframe .bike .object .model .handlebarLayer {
	z-index: 12;
}

.carframe .bike .object .model .frontLayer {
	z-index: 13;
}

.carframe .bike .object .model .wheelLayer {
	z-index: 10;
}

.carframe .bike .object .model .shadowLayer {
	z-index: 9;
}

.carframe .bike .object .trigger-area {
	width: 1800px;
	height: 1001px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 25;
	display: none;
}

.carframe .bike .object .trigger-area span {
	cursor: text;
	position: absolute;
	-webkit-transform-origin: left;
	transform-origin: left;
	font-weight: bold;
	text-align: center;
	color: #ffffff;
}

.carframe .bike .object .trigger-area #custom1 {
	width: 160px;
	height: 32px;
	line-height: 32px;
	left: 660px;
	top: 285px;
	-webkit-transform: rotate(73deg);
	transform: rotate(73deg);
	font-size: 36px;
}

.carframe .bike .object .trigger-area #custom2 {
	width: 180px;
	height: 18px;
	line-height: 18px;
	position: absolute;
	/*background:#096;*/
	left: 760px;
	top: 285px;
	-webkit-transform: rotate(-22deg);
	transform: rotate(-22deg);
	-webkit-transform-origin: left;
	transform-origin: left;
	/*opacity:0.8;*/
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	color: #ffffff;
}

.carframe .bike .object .trigger-area font {
	width: 50px;
	height: 50px;
	line-height: 50px;
	border: 3px solid #FFF;
	border-radius: 50%;
	box-shadow: 0 0 5px rgba(0, 0, 0, 1);
	background: #F00;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	background-image: url(../images/icon2.png);
	background-position: center;
	background-repeat: no-repeat;
}

.carframe .bike .object .trigger-area i {
	width: 50px;
	height: 50px;
	border: 2px solid #FFF;
	border-radius: 50%;
	background: #FFF;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -25px;
	margin-top: -25px;
	z-index: 1;
	-webkit-animation: xs 1.0s ease-out both infinite;
	animation: xs 1.0s ease-out both infinite;
}

/* 车把俯视角度圆形文字样式 */
.carframe .bike .object .custom #custom_cycle .wrap-cycle {
	position: relative;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) rotate(-90deg);
}

.carframe .bike .object .custom #custom_cycle .wrap-cycle>span {
	position: absolute;
	display: block;
	/* .text1.width/2, 140/2 */
	transform-origin: 0 70px;
	left: 50%;
	width: 20px;
	height: 20px;
	font-size: 18px;
	opacity: 0.8;
	text-align: center;
	line-height: 20px;
}


.carframe .bike .object .custom {
	width: 1800px;
	height: 1001px;
	position: absolute;
	left: 0;
	top: 0;
	display: none;
}

.carframe .bike .object .custom span {
	position: absolute;
	-webkit-transform-origin: left;
	transform-origin: left;
	font-weight: bold;
	text-align: center;
	/* color: #ffffff; */
	white-space: nowrap;
	overflow: hidden;
}

.carframe .bike .object .custom #custom1 {
	width: 160px;
	height: 32px;
	line-height: 32px;
	/*background:#096;*/
	left: 660px;
	top: 285px;
	-webkit-transform: rotate(73deg);
	transform: rotate(73deg);
	font-size: 36px;
}

.carframe .bike .object .custom #custom2 {
	width: 180px;
	height: 18px;
	line-height: 18px;
	position: absolute;
	/*background:#096;*/
	left: 760px;
	top: 285px;
	-webkit-transform: rotate(-22deg);
	transform: rotate(-22deg);
	-webkit-transform-origin: left;
	transform-origin: left;
	font-size: 28px;
	font-weight: bold;
	text-align: center;
	color: #ffffff;
	white-space: nowrap;
	overflow: hidden;
}

.carframe .bike .object .model .patternLayer {
	width: 1800px;
	height: 1001px;
	position: absolute;
	left: 0;
	top: 0;
}

/*carframe*/


.ctrl-pannel {
	width: 80%;
	height: 250px;
	background-color: #121212;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 3;
	-webkit-transform: translate3d(100%, 0, 0);
	transform: translate3d(100%, 0, 0);
	border-radius: 10px 0 0 0;
	-webkit-transform-origin: right bottom;
	transform-origin: right bottom;

}

.ctrl-pannel .btn {
	width: 24px;
	height: 60px;
	border-radius: 5px;
	background-color: #121212;
	color: #FFF;
	cursor: pointer;
	text-align: center;
	line-height: 60px;
	position: absolute;
	left: -20px;
	top: 30px;
	font-family: "宋体";
	font-weight: bold;
	z-index: 1;
}

.ctrl-pannel .typetag {
	position: absolute;
	top: 10px;
	left: 20px;
	width: 70px;
}

.ctrl-pannel .typetag a {
	display: block;
	font-size: 14px;
	font-family: "微软雅黑";
	background: #FFF;
	border-radius: 5px;
	height: 30px;
	line-height: 30px;
	color: #333;
	text-align: center;
	margin-bottom: 5px;
	cursor: pointer;
	text-decoration: none;
}

.ctrl-pannel .typetag a.active {
	background: #F00;
	color: #FFF;
}

.ctrl-pannel .list {
	width: 1060px;
	height: auto;
	padding: 10px 25px 0 25px;
	overflow: hidden;
	position: relative;
	z-index: 2;
}

/*.ctrl-pannel .list .item{ width:1060px; height:100%; overflow:hidden; }*/
.ctrl-pannel .list ul {
	width: 160px;
	height: 190px;
	margin: 0;
	padding: 0;
	margin-right: 20px;
	list-style: none;
	float: left;
	background-color: #dfdfdf;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, .5);
	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, .5);
	cursor: pointer;
	border-radius: 10px;
	overflow: hidden;
	opacity: 0.6;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

.ctrl-pannel .list ul:hover {
	opacity: 1.0;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

.ctrl-pannel .list ul.active {
	background-color: #F00;
	opacity: 1.0;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

.ctrl-pannel .list li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ctrl-pannel .list li.img {
	width: 160px;
	height: 155px;
	margin: 0 auto;
	overflow: hidden;
}

.ctrl-pannel .list li.img img {
	width: 100%;
	height: auto;
}

.ctrl-pannel .list li.title {
	width: 120px;
	height: 35px;
	line-height: 35px;
	margin: 0 auto;
	color: #232323;
	font-size: 14px;
	font-family: "微软雅黑";
}

.ctrl-pannel .list ul.active .img {
	width: 160px;
	height: 155px;
}

.ctrl-pannel .list ul.active .title {
	color: #FFF;
}

.ctrl-right .price {
	font-size: 14px;
	line-height: 30px;
	display: block;
	color: #ffff00;
	position: static;
	left: 0;
	top: 0;
	margin-left: 0;
	margin-top: 0;
}

.ctrl-right {
	width: 306px;
	height: 250px;
	position: absolute;
	top: 50%;
	margin-top: -260px;
	right: 5px;
	z-index: 4;
	-webkit-transform: translate3d(350px, 0, 0);
	transform: translate3d(350px, 0, 0);
	-webkit-transform-origin: right center;
	transform-origin: right center;
}

.ctrl-right .areatag {
	position: absolute;
	top: 0;
	right: 0;
	width: 86px;
}

.ctrl-right .areatag a {
	display: block;
	font-size: 14px;
	font-family: "微软雅黑";
	width: 80px;
	height: 45px;
	margin-bottom: 3px;
	cursor: pointer;
	border-radius: 10px;
	margin-left: -15px;
	background: #121212;
	text-decoration: none;
	box-shadow: 2px 0px 5px rgba(0, 0, 0, .3);
	-webkit-transform: translateX(-10px);
	transform: translateX(-10px);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

.ctrl-right .areatag a.active {
	-webkit-transform: translateX(0);
	transform: translateX(0);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

.ctrl-right .areatag a i {
	height: 45px;
	line-height: 45px;
	display: block;
	color: #ffffff;
	font-family: "微软雅黑";
	font-style: normal;
	text-align: center;
	padding-left: 15px;
	opacity: 0.5;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

.ctrl-right .areatag a:hover i {
	opacity: 1;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

.ctrl-right .areatag a.active i {
	opacity: 1;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}


.ctrl-right .title {
	height: 50px;
	line-height: 50px;
	color: #FFF;
	font-size: 16px;
	font-family: "微软雅黑";
	padding: 0 15px;
	position: absolute;
	z-index: 3;
}

.ctrl-right .list {
	width: 220px;
	height: 180px;
	padding-top: 50px;
	padding-bottom: 10px;
	overflow: hidden;
	position: relative;
	z-index: 2;
	background: #121212;
	border-radius: 10px;
	box-shadow: 2px 0px 5px rgba(0, 0, 0, .3);
}

.ctrl-right .list .item {
	height: 180px;
	overflow: hidden;
	padding: 0;
	padding-top: 50px;
}

.ctrl-right .list ul {
	width: 50px;
	height: 50px;
	margin: 0;
	padding: 0;
	margin-right: 9px;
	margin-bottom: 9px;
	list-style: none;
	float: left;
	background-color: #373737;
	-webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, .5);
	cursor: pointer;
	border-radius: 10px;
	overflow: hidden;
	-webkit-transform: scale(1, 1);
	transform: scale(1, 1);
	-webkit-transition: -webkit-transform 0.15s;
	transition: transform 0.15s;
}

.ctrl-right .list ul:hover {
	-webkit-transform: scale(1.1, 1.1);
	transform: scale(1.1, 1.1);
	-webkit-transition: -webkit-transform 0.15s;
	transition: transform 0.15s;
}

.ctrl-right .list ul.active {
	background-color: #ffffff;
	-webkit-transform: scale(1, 1);
	transform: scale(1, 1);
	-webkit-transition: -webkit-transform 0.15s;
	transition: transform 0.15s;
}

.ctrl-right .list li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ctrl-right .list li.img {
	width: 46px;
	height: 46px;
	border-radius: 10px;
	margin: 2px;
	overflow: hidden;
}

.ctrl-right .list li.img img {
	width: 100%;
	height: auto;
}

footer {
	background: #000;
	width: 1920px;
	height: 200px;
}

footer .logo {
	color: #6b6b6b;
	padding: 30px 0 0 20px;
	display: inline-block;
	font-size: 20px;
	font-family: "微软雅黑";
}

footer .cr {
	padding: 30px 20px 0 0;
	display: inline-block;
	float: right;
}

footer .cr nav.bottom {
	display: block;
	color: #6b6b6b;
	font-size: 14px;
	font-family: "微软雅黑";
	height: 30px;
}

footer .cr nav.bottom a {
	text-decoration: none;
	cursor: pointer;
	color: #6b6b6b;
}

footer .cr nav.bottom a:hover {
	text-decoration: underline;
}

footer .cr i {
	font-family: "微软雅黑";
	padding-left: 110px;
	height: 30px;
	line-height: 30px;
	display: block;
	background: url(../images/logo_trinx.png) no-repeat;
	font-size: 14px;
	color: #6b6b6b;
	font-style: normal;
	display: inline-block;
	float: right;
}



.share {
	width: 500px;
	height: 670px;
	background-color: #efefef;
	box-shadow: #333333 2px 2px 2px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -335px;
	margin-left: -250px;
	overflow: hidden;
	border-radius: 10px;
}

.share .shareimg {
	width: 450px;
	height: 450px;
	position: relative;
	margin: 0 auto;
	margin-top: 20px;
	display: block;
	overflow: hidden;
}

.share .shareimg .bg {
	width: 450px;
	height: 450px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	transition: background-color 0.5s;
	-webkit-transition: background-color 0.5s;
}

.share .shareimg .img {
	width: 450px;
	height: 450px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position-y: 100px;
}

.share .shareTitle {
	width: 450px;
	height: 30px;
	position: relative;
	display: block;
	margin: 0 auto;
	margin-top: 10px;
	overflow: hidden;
}

.share .shareTitle input {
	width: 100%;
	height: 30px;
	line-height: 30px;
	text-align: center;
	border: 0;
	background: #dfdfdf;
	font-size: 14px;
	border-radius: 10px;
	font-family: "微软雅黑";
}

.share .shareDec {
	width: 450px;
	height: 60px;
	position: relative;
	display: block;
	margin: 0 auto;
	margin-top: 10px;
	overflow: hidden;
}

.share .shareDec textarea {
	width: 100%;
	height: 60px;
	line-height: 30px;
	text-align: left;
	border: 0;
	background: #dfdfdf;
	font-size: 14px;
	border-radius: 10px;
	font-family: "微软雅黑";
	padding: 0 10px;
	box-sizing: border-box;
	resize: none;
}

.share .btns {
	width: 450px;
	height: 35px;
	position: relative;
	display: block;
	margin: 0 auto;
	margin-top: 10px;
	overflow: hidden;
}

.share .btns .color {
	height: 30px;
	position: relative;
	float: left;
	z-index: 3;
	overflow: hidden;
}

.share .btns .color a {
	width: 25px;
	height: 25px;
	float: left;
	border-radius: 5px;
	margin-right: 5px;
	border: 1px solid #cccccc;
	cursor: pointer;
}

.share .btns .color a.c_black {
	background-color: #000000;
}

.share .btns .color a.c_white {
	background-color: #FFFFFF;
}

.share .btns .color a.c_gray {
	background-color: #dfdfdf;
}

.share .btns .btn_confirm {
	width: 100px;
	height: 35px;
	line-height: 35px;
	color: #ffffff;
	font-size: 14px;
	font-family: "微软雅黑";
	text-align: center;
	background: #F00;
	cursor: pointer;
	border-radius: 10px;
	float: right;
	margin-left: 10px;
	z-index: 4;
}

.share .btns .btn_confirm:hover {
	background: #C00;
}

.share .btns .btn_cancel {
	width: 100px;
	height: 35px;
	line-height: 35px;
	color: #666666;
	font-size: 14px;
	font-family: "微软雅黑";
	text-align: center;
	background: #dfdfdf;
	cursor: pointer;
	border-radius: 10px;
	float: right;
	margin-left: 10px;
	z-index: 5;
}

.share .btns .btn_cancel:hover {
	background: #cccccc;
}

.share .btns .btn_isshare {
	width: 50px;
	height: 35px;
	line-height: 50px;
	color: #666666;
	font-size: 12px;
	font-family: "微软雅黑";
	text-align: center;
	cursor: pointer;
	border-radius: 10px;
	float: right;
	margin-left: 10px;
	z-index: 4;
}

.share .errorTips {
	width: 100px;
	height: 30px;
	line-height: 30px;
	color: #CC0000;
	text-align: left;
	position: absolute;
	top: 50%;
	left: 30px;
	margin-top: 280px;
	z-index: 6;
	overflow: hidden;
}

.shareIcons {
	width: 450px;
	height: 32px;
	display: block;
	margin: 0 auto;
	margin-top: 5px;
	overflow: hidden;
	display: none;
}

.shareIcons a {
	width: 32px;
	height: 32px;
	background-image: url(../images/css-bg.png);
	background-repeat: no-repeat;
	cursor: pointer;
	float: right;
	margin-left: 5px;
}

.shareIcons .button_weixin {
	background-position: -13px -7px;
}

.shareIcons .button_sina {
	background-position: -57px -7px;
}

.shareIcons .button_qqweibo {
	background-position: -101px -7px;
}

.shareIcons .button_qzone {
	background-position: -146px -7px;
}



.config {
	width: 440px;
	height: auto;
	padding: 20px 30px;
	background-color: #efefef;
	box-shadow: #333333 2px 2px 2px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -170px;
	margin-left: -220px;
	overflow: hidden;
	border-radius: 10px;
}

.config span {
	display: inline-block;
	width: 50%;
	height: 32px;
	line-height: 32px;
	color: #030305;
	font-size: 12px;
	font-family: "微软雅黑";
	overflow: hidden;
}

.config .modelName {
	width: 100%;
	height: 40px;
	line-height: 40px;
	font-size: 28px;
	background-size: auto 40px;
	background-repeat: no-repeat;
}

.config .patternLayer,
.config .customLayer {
	width: 100%;
}

.config span i {
	width: 10px;
	height: 10px;
	display: inline-block;
	margin-left: 5px;
}

.config .wheelsize {
	width: 100%;
	border-top: 1px solid #cccccc;
	height: auto;
	padding-top: 5px;
}

.config .wheelsize span {
	width: 100%;
	display: inline-block;
	height: 25px;
	line-height: 25px;
	color: #121212;
}

.config .wheelsize a {
	display: inline-block;
	padding: 3px 20px;
	margin-right: 10px;
	border: 1px solid #cccccc;
	text-decoration: none;
	cursor: pointer;
	color: #121212;
	font-size: 12px;
}

.config .wheelsize a.active {
	border: 1px solid #de0000;
}

.config .btns {
	width: 80%;
	height: auto;
	padding-top: 10px;
	position: relative;
	margin: 0 auto;
}

.config .btns .btn_cancel {
	width: 40%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	background: #c9c9c9;
	color: #ffffff;
	font-size: 14px;
	display: inline-block;
	border-radius: 10px;
	text-decoration: none;
	cursor: pointer;
	font-family: "微软雅黑";
	margin: 0 4%;
}

.config .btns .btn_confirm {
	width: 40%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	background: #f00001;
	color: #ffffff;
	font-size: 14px;
	display: inline-block;
	border-radius: 10px;
	text-decoration: none;
	cursor: pointer;
	font-family: "微软雅黑";
	margin: 0 4%;
}


.config .orderimg {
	display: none;
	width: 450px;
	height: 450px;
	position: relative;
	margin: 0 auto;
	margin-top: 20px;
	display: none;
	overflow: hidden;
}

.config .orderimg .bg {
	background-color: #dfdfdf;
	width: 450px;
	height: 450px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	transition: background-color 0.5s;
	-webkit-transition: background-color 0.5s;
}

.config .orderimg .img {
	width: 450px;
	height: 450px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position-y: 100px;
}



.reglogin {
	width: 520px;
	height: 580px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.reglogin nav {
	padding: 24px 40px;
}

.reglogin nav a {
	font-size: 20px;
	color: #c2c2c2;
	font-family: "微软雅黑";
	margin-right: 50px;
	cursor: pointer;
	text-decoration: none;
}

.reglogin nav a:hover,
.reglogin nav a.active {
	border-bottom: 3px solid #e00011;
}

.reglogin .loginbox {
	display: block;
	padding: 0 40px;
}

.reglogin .loginbox .tips {
	font-size: 12px;
	color: #c2c2c2;
	font-family: "微软雅黑";
	border-bottom: 1px solid #c2c2c2;
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.reglogin .loginbox .tips span {
	display: block;
	line-height: 30px;
}

.reglogin label {
	font-size: 14px;
	color: #c2c2c2;
	font-family: "微软雅黑";
	display: block;
	line-height: 30px;
	text-indent: 5px;
}

.reglogin input.inputtxt {
	width: 100%;
	height: 30px;
	line-height: 30px;
	background: #ffffff;
	border: 3px solid #666666;
	border-radius: 4px;
	margin-bottom: 10px;
	color: #333333;
	font-family: "微软雅黑";
	padding: 0 10px;
	box-sizing: border-box;
}

.reglogin input::-webkit-input-placeholder {
	color: #333333;
	font-family: "微软雅黑";
}

.reglogin input:-moz-placeholder {
	color: #333333;
	font-family: "微软雅黑";
}

.reglogin input::-moz-placeholder {
	color: #333333;
	font-family: "微软雅黑";
}

.reglogin input:-ms-input-placeholder {
	color: #333333;
	font-family: "微软雅黑";
}

.reglogin input.inputtxt2 {
	width: 50%;
	height: 30px;
	line-height: 30px;
	background: #ffffff;
	border: 3px solid #666666;
	border-radius: 4px;
	margin-bottom: 10px;
	color: #333333;
	font-family: "微软雅黑";
	padding: 0 10px;
	box-sizing: border-box;
	margin-right: 10px;
}

.reglogin a.btn {
	background: #e00011;
	color: #ffffff;
	font-size: 14px;
	font-family: "微软雅黑";
	padding: 8px 20px;
	border-radius: 5px;
	text-decoration: none;
	cursor: pointer;
	display: inline-block;
	line-height: 1;
	vertical-align: top;
}

.reglogin a.btn:hover {
	background: #C00011;
}

.reglogin a.btn+a.btn {
	margin-left: 40px;
}

.reglogin .errorTips {
	color: #cc0000;
	font-size: 12px;
	line-height: 40px;
}

.reglogin .regbox {
	display: none;
	padding: 0 40px;
}

.reglogin .resetpswbox {
	display: none;
	padding: 0 40px;
}

.logoutbox {
	width: 300px;
	height: 150px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -75px;
	margin-left: -150px;
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.logoutbox a.logout,
.logoutbox a.cancel {
	background: #e00011;
	color: #ffffff;
	font-size: 14px;
	font-family: "微软雅黑";
	padding: 8px 20px;
	border-radius: 5px;
	text-decoration: none;
	cursor: pointer;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -15px;
}

.logoutbox a.logout {
	margin-left: -100px;
}

.logoutbox a.cancel {
	margin-left: 30px;
}

.logoutbox a.logout:hover,
.logoutbox a.cancel:hover {
	background: #C00011;
}

.contactus {
	width: 520px;
	height: 580px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.contactus .btn-close {
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #373737;
	top: 10px;
	right: 10px;
	position: absolute;
	color: #fff;
	font-size: 20px;
	cursor: pointer;
	user-select: none;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

.contactus .btn-close:hover {
	background: #484848;
	color: #cccccc;
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
}


.contactus h1 {
	text-align: center;
	font-family: "微软雅黑";
	line-height: 60px;
	color: #f5f5f5;
}

.contactus ul {
	font-size: 14px;
	width: 90%;
	margin: 0 auto;
	margin-bottom: 10px;
	font-family: "微软雅黑";
	color: #dfdfdf;
	display: block;
}

.contactus li {
	line-height: 24px;
}

.contactus span.qrcodes {
	width: 90%;
	margin: 0 auto;
	display: block;
}

.contactus span.qrcodes img {
	width: 180px;
	height: 180px;
	margin-right: 10px;
}


.aboutus {
	width: 520px;
	height: 450px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.aboutus h1 {
	text-align: center;
	font-family: "微软雅黑";
	line-height: 60px;
	color: #f5f5f5;
}

.aboutus ul {
	font-size: 14px;
	width: 90%;
	margin: 0 auto;
	margin-bottom: 10px;
	font-family: "微软雅黑";
	color: #dfdfdf;
	display: block;
	line-height: 24px;
}

.aboutus span {
	color: #ff0000;
}


.groupon {
	width: 520px;
	height: 500px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.groupon h1 {
	text-align: center;
	font-family: "微软雅黑";
	line-height: 60px;
	color: #f5f5f5;
}

.groupon ul {
	font-size: 14px;
	width: 90%;
	margin: 0 auto;
	margin-bottom: 10px;
	font-family: "微软雅黑";
	color: #dfdfdf;
	display: block;
	line-height: 24px;
}

.groupon span {
	color: #ff0000;
}

.groupon span.qrcodes {
	width: 90%;
	margin: 0 auto;
	display: block;
}

.groupon span.qrcodes img {
	width: 180px;
	height: 180px;
	margin-right: 10px;
}

.helpCenter {
	width: 520px;
	height: 450px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.helpCenter h1 {
	text-align: center;
	font-family: "微软雅黑";
	line-height: 60px;
	color: #f5f5f5;
}

.helpCenter ul {
	font-size: 14px;
	width: 90%;
	margin: 0 auto;
	margin-bottom: 10px;
	font-family: "微软雅黑";
	color: #dfdfdf;
	display: block;
	line-height: 24px;
}

.helpCenter span {
	color: #ff0000;
}


.privacy {
	width: 700px;
	height: 500px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.privacy h1 {
	text-align: center;
	font-family: "微软雅黑";
	line-height: 60px;
	color: #f5f5f5;
	width: 100%;
}

.privacy ul {
	font-size: 14px;
	width: 96%;
	margin: 0 auto;
	margin-bottom: 10px;
	font-family: "微软雅黑";
	color: #dfdfdf;
	display: block;
	line-height: 24px;
}

.privacy li {
	line-height: 24px;
}

.privacy span {
	color: #ff0000;
}

.privacy .scroll {
	width: calc(100% - 30px);
	height: 408px;
	overflow: hidden;
	overflow-y: scroll;
	margin: 0 auto;
}

.privacy .scroll li {
	font-size: 12px;
}

.privacy .scroll strong {
	font-size: 14px;
}


.regAgreement {
	width: 700px;
	height: 500px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	overflow: hidden;
	border-radius: 10px;
	box-shadow: #ffffff82 0px 0px 10px;
}

.regAgreement h1 {
	text-align: center;
	font-family: "微软雅黑";
	line-height: 60px;
	color: #f5f5f5;
	width: 100%;
}

.regAgreement ul {
	font-size: 14px;
	width: 96%;
	margin: 0 auto;
	margin-bottom: 10px;
	font-family: "微软雅黑";
	color: #dfdfdf;
	display: block;
	line-height: 24px;
}

.regAgreement li {
	line-height: 24px;
}

.regAgreement span {
	color: #ff0000;
}

.regAgreement .scroll {
	width: calc(100% - 30px);
	height: 408px;
	overflow: hidden;
	overflow-y: scroll;
	margin: 0 auto;
}

.regAgreement .scroll li {
	font-size: 12px;
}

.regAgreement .scroll strong {
	font-size: 14px;
}



.specbox {
	width: 425px;
	height: 600px;
	position: absolute;
	background-color: #121212;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -300px;
	margin-left: -212px;
	overflow: hidden;
	border-radius: 10px;
}

.specbox img {
	width: 100%;
	height: auto;
}

.model-loading {
	width: 200px;
	height: 30px;
	line-height: 30px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -100px;
	margin-top: -15px;
	text-align: center;
	color: #cccccc;
}

.dialog {
	position: fixed;
	_position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	z-index: 9998;
}

.dialog>span.bg {
	position: fixed;
	_position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.7;
	z-index: 1;
}

.dialog>span.content {
	position: absolute;
	width: 100%;
	height: 280px;
	top: 50%;
	left: 50%;
	/* margin-left: -200px;
	margin-top: -140px; */
	transform: translate(-50%, -50%);
	z-index: 2;
}

.dialog>span.content2 {
	display: none;
	position: absolute;
	width: 700px;
	height: 500px;
	top: 50%;
	left: 50%;
	margin-left: -350px;
	margin-top: -250px;
	z-index: 3;
}

.dialog>span.content2 .btn_close {
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	color: #fff;
	font-size: 20px;
	cursor: pointer;
	position: absolute;
	z-index: 99;
	top: 10px;
	right: 10px;
	background: #373737;
	border-radius: 50%;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

.dialog>span.content2 .btn_close:hover {
	background: #484848;
	color: #cccccc;
	transform: rotate(135deg);
	-webkit-transform: rotate(135deg);
}








.customInputs {
	padding: 10px 25px 0 25px;
}

.customInputs .tag {
	width: 10%;
	padding-top: 35px;
	position: absolute;
	z-index: 10;
}

.customInputs .tag a {
	width: 100%;
	height: 40px;
	line-height: 40px;
	margin-bottom: 2px;
	background: #333;
	border-radius: 5px;
	font-size: 16px;
	color: #FFF;
	text-decoration: none;
	text-align: center;
	display: block;
	cursor: pointer;
}

.customInputs .tag a:hover {
	background: #555;
}

.customInputs .tag a.active {
	background: #555;
}

.customInputs .inputbox {
	position: relative;
	text-decoration: none;
}

.customInputs label {
	width: 70%;
	height: 25px;
	line-height: 25px;
	margin-left: 12%;
	display: block;
	font-size: 16px;
	font-family: "微软雅黑";
}

.customInputs .inputtxt {
	width: 40%;
	height: 40px;
	line-height: 40px;
	border: none;
	margin-top: 10px;
	margin-left: 12%;
	background: #333;
	font-size: 20px;
	color: #FFF;
	font-family: "微软雅黑";
	text-align: center;
	display: block;
}

.customInputs #preview {
	width: 40%;
	height: 90px;
	line-height: 90px;
	border: #666 1px solid;
	margin-top: 15px;
	margin-left: 12%;
	font-size: 40px;
	color: #FFF;
	text-align: center;
	background: none;
	display: block;
	overflow: hidden;
}

.customInputs #preview::-webkit-input-placeholder {
	color: #333;
}

.customInputs #preview::-moz-input-placeholder {
	color: #333;
}

.customInputs #preview::-ms-input-placeholder {
	color: #333;
}

.customInputs .fontlist {
	/* width: 40%; */
	height: 40px;
	line-height: 40px;
	top: 35px;
	left: 55%;
	position: absolute;
	display: inline-flex;
	overflow: hidden;
	gap: 6px;
}

.customInputs .fontlist a {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border-radius: 10px;
	background: #666;
	color: #FFF;
	font-size: 28px;
	display: inline-block;
	flex-shrink: 0;
}

.customInputs .fontlist a.active {
	background: #ff0000;
}

.customInputs .cycleTypes {
	/* width: 20%; */
	height: 40px;
	line-height: 40px;
	top: 35px;
	left: calc(55% + 200px);
	position: absolute;
	display: inline-flex;
	overflow: hidden;
	z-index: 3;
	gap: 6px;
}

.customInputs .cycleTypes a {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border-radius: 10px;
	background: #666;
	color: #FFF;
	font-size: 14px;
	display: inline-block;
	font-family: "微软雅黑";
	white-space: nowrap;
	letter-spacing: 1px;
	flex-shrink: 0;
}

.customInputs .cycleTypes a.active {
	background: #ff0000;
}

.cycleTypes {
	display: none;
}

.customInputs .colorInput {
	width: 42%;
	left: 55%;
	top: 90px;
	position: absolute;
	display: inline-flex;
}

.customInputs .colorInput .fontColor {
	width: 100%;
	font-size: 18px;
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
}

.customInputs .colorInput .fontColor a {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	border: 1px solid #ffffff;
	border-radius: 10px;
	display: inline-block;
	flex-shrink: 0;
}

.customInputs .colorInput .fontColor a.active {
	border-color: #ff0000;
}

.customInputs .btn_confirm {
	font-size: 16px;
	width: 41%;
	height: 35px;
	line-height: 35px;
	top: 145px;
	left: 55%;
	position: absolute;
	color: #FFF;
	background: #e00011;
	border-radius: 5px;
	text-align: center;
	font-family: "微软雅黑";
	cursor: pointer;
	display: none;
	overflow: hidden;
}

.font1 {
	font-family: "sfquartzitebold";
}

.font2 {
	font-family: "GeosansLight";
}

.font3 {
	font-family: "AldoSemiBold";
}

.font4 {
	font-family: "HattoriHanzoLightItalic";
}


.dialog .content .multiangle {
	width: 800px;
	height: 400px;
	top: 50%;
	left: 50%;
	margin-left: -400px;
	margin-top: -200px;
	position: absolute;
	border: #212121 10px solid;
	background: #ffffff;
	border-radius: 50px;
}

.dialog .content .multiangle .img {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	border-radius: 40px;
}


.readysubmit {
	padding: 10px 25px 0 25px;
}

.readysubmit .list {
	width: auto;
	height: auto;
	overflow: hidden;
}

.readysubmit .list .item {
	width: 2000em;
	width: 100%;
}

.readysubmit .list ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 47%;
	height: auto;
	margin-right: 3%;
	float: left;
	background: none;
	border-radius: 0;
	opacity: 1;
	box-shadow: none;
	cursor: default;
}

.readysubmit .list li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.readysubmit .list li.txt {
	height: 120px;
	line-height: 25px;
	padding: 10px;
	color: #efefef;
	font-size: 16px;
	font-family: "微软雅黑";
	background: #333333;
	border-radius: 10px;
}

.readysubmit .list li.button {
	width: 80%;
	height: 35px;
	line-height: 35px;
	color: #ffffff;
	font-size: 16px;
	font-family: "微软雅黑";
	text-align: center;
	background: #F00;
	cursor: pointer;
	border-radius: 10px;
	margin: 0 auto;
	margin-top: 10px;
}

.readysubmit .list li.button:hover {
	background: #C00;
}

.readysubmit .list li.unenable {
	background: #999999;
	cursor: normal;
}

.readysubmit .list li .favouriteInput {}

.readysubmit .list li .favouriteInput input {
	width: 100%;
	height: 35px;
	line-height: 35px;
	text-align: center;
	border: none;
	margin-top: 10px;
	background: #666;
	font-size: 18px;
	color: #FFF;
	font-family: "微软雅黑";
	display: block;
}

.readysubmit .list li .favouriteInput a {
	width: 45%;
	height: 35px;
	line-height: 35px;
	color: #ffffff;
	font-size: 16px;
	font-family: "微软雅黑";
	text-align: center;
	background: #F00;
	cursor: pointer;
	border-radius: 10px;
	margin-top: 10px;
	margin-right: 5%;
	display: inline-block;
}

.readysubmit .list li .favouriteInput a:hover {
	background: #C00;
	text-decoration: none;
}


.fixed_custom {
	width: 50px;
	position: fixed;
	right: 0;
	bottom: 15%;
	background: none;
	z-index: 100;
}

.fixed_custom>a {
	width: 50px;
	height: 50px;
	line-height: 50px;
	cursor: pointer;
	position: relative;
	text-align: center;
	display: block;
	text-decoration: none;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
	background-color: rgba(0, 0, 0, 0.6);
	opacity: 1;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 30px;
	box-sizing: border-box;
}

.fixed_custom>a:hover {
	opacity: 0.8;
}

.fixed_custom>a.btn_qrcode {
	z-index: 11;
	background-image: url(../images/icon_qrcode.png);
	border-bottom: 1px #212121 solid;
}

.fixed_custom>a.btn_cus {
	z-index: 10;
	background-image: url(../images/icon_custom.png);
	border-bottom: 1px #212121 solid;
}

.fixed_custom>a.btn_top {
	z-index: 9;
	background-image: url(../images/icon_top.png);
	height: 0;
}

.fixed_custom span.contact {
	width: 0;
	height: 100px;
	position: absolute;
	right: 51px;
	top: 0;
	opacity: 0;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

.fixed_custom span.contact:hover {
	width: 150px;
	opacity: 1;
}

.fixed_custom>a.btn_cus:hover~span.contact {
	width: 150px;
	opacity: 1;
}

.fixed_custom span.contact a {
	width: 150px;
	height: 50px;
	line-height: 50px;
	overflow: hidden;
	text-align: center;
	background: rgba(0, 0, 0, 0.6);
	display: block;
	box-sizing: border-box;
	color: #fff;
	font-size: 14px;
	font-family: "微软雅黑";
	text-decoration: none;
}

.fixed_custom span.contact a.cus_qq {
	border-bottom: 1px #212121 solid;
	cursor: pointer;
}

.fixed_custom span.contact a.cus_qq:hover {
	opacity: 0.8;
}

.fixed_custom span.qrcode {
	width: 0;
	height: 100px;
	position: absolute;
	right: 51px;
	top: 0;
	opacity: 0;
	background: rgba(0, 0, 0, 0.6) url(../images/qrcode3.png) no-repeat center;
	background-size: contain;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
}

.fixed_custom span.qrcode:hover {
	width: 100px;
	opacity: 1;
}

.fixed_custom>a.btn_qrcode:hover~span.qrcode {
	width: 100px;
	opacity: 1;
}

.floatTips {
	width: 450px;
	height: 190px;
	position: absolute;
	top: -180px;
	left: 0;
	border-radius: 10px;
	background-color: #080808;
	display: none;
}

.floatTips .content {
	padding: 20px;
	display: block;
}

.floatTips ul {
	padding: 0;
	margin: 0;
}

.floatTips ul.name {
	font-size: 24px;
	color: #ffffff;
	height: 38px;
	line-height: 38px;
}

.floatTips ul.price {
	font-size: 24px;
	color: #e00011;
	height: 38px;
	line-height: 38px;
	position: static;
	padding: 0;
	margin: 0;
}

.floatTips ul.productDesc {
	font-size: 14px;
	color: #ffffff;
	height: 40px;
	line-height: 20px;
}


.scroll::-webkit-scrollbar {
	width: 10px;
	height: 16px;
}

/*定义滚动条的轨道，内阴影及圆角*/
.scroll::-webkit-scrollbar-track {
	/*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);*/
	border-radius: 10px;
	background: rgba(55, 55, 55, 1);
}

/*定义滑块，内阴影及圆角*/
.scroll::-webkit-scrollbar-thumb {
	/*width: 10px;*/
	height: 20px;
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
	background: rgba(140, 140, 140, 1);
}



.transmissionLayer {
	display: none;
}

.breakerLayer {
	display: none;
}

.wheel2Layer {
	display: none;
}



@-webkit-keyframes fadeInTop {
	0% {
		-webkit-transform: translate(0, 20px);
		opacity: 0;
	}

	100% {
		-webkit-transform: translate(0, 0);
		opacity: 1;
	}
}

@keyframes fadeInTop {
	0% {
		transform: translate(0, 20px);
		opacity: 0;
	}

	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}

.fadeInTop {
	-webkit-animation: fadeInTop 0.5s ease-out both 1;
	animation: fadeInTop 0.5s ease-out both 1;
}

.showCtrlM {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

.hideCtrlM {
	-webkit-transform: translate3d(100%, 0, 0);
	transform: translate3d(100%, 0, 0);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}


.showCtrlRight {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

.hideCtrlRight {
	-webkit-transform: translate3d(350px, 0, 0);
	transform: translate3d(350px, 0, 0);
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}


@-webkit-keyframes fadeInTop2 {
	0% {
		-webkit-transform: translate(0, 180px);
		opacity: 0;
	}

	100% {
		-webkit-transform: translate(0, 0);
		opacity: 1;
	}
}

@keyframes fadeInTop2 {
	0% {
		transform: translate(0, 180px);
		opacity: 0;
	}

	100% {
		transform: translate(0, 0);
		opacity: 1;
	}
}

.fadeInTop2 {
	-webkit-animation: fadeInTop2 0.5s ease-out both 1;
	animation: fadeInTop2 0.5s ease-out both 1;
}



@-webkit-keyframes fadeInLeftScale {
	0% {
		-webkit-transform: scale(0.1, 1);
		-webkit-transform-origin: left;
		opacity: 0;
	}

	100% {
		-webkit-transform: scale(1, 1);
		-webkit-transform-origin: left;
		opacity: 0;
	}
}

@keyframes fadeInLeftScale {
	0% {
		transform: scale(0.1, 1);
		transform-origin: left;
		opacity: 0;
	}

	100% {
		transform: scale(1, 1);
		transform-origin: left;
		opacity: 1;
	}
}

.fadeInLeftScale {
	-webkit-animation: fadeInLeftScale 0.2s ease-out both 1;
	animation: fadeInLeftScale 0.2s ease-out both 1;
}




@-webkit-keyframes loadbikeIcon {
	0% {
		-webkit-transform: rotate(0);
	}

	100% {
		-webkit-transform: rotate(360deg);
	}
}

@keyframes loadbikeIcon {
	0% {
		transform: rotate(0);
	}

	100% {
		transform: rotate(360deg);
	}
}


@-webkit-keyframes xs {
	0% {
		-webkit-transform: scale(1.0, 1.0);
		opacity: 0.5;
	}

	95% {
		-webkit-transform: scale(2.0, 2.0);
		opacity: 0;
	}

	100% {
		-webkit-transform: scale(1.0, 1.0);
		opacity: 0;
	}
}

@keyframes xs {
	0% {
		transform: scale(1.0, 1.0);
		opacity: 0.5;
	}

	95% {
		transform: scale(2.0, 2.0);
		opacity: 0;
	}

	100% {
		transform: scale(1.0, 1.0);
		opacity: 0;
	}
}


/* 屏幕宽度 <= 750px */
@media screen and (max-width: 750px) {
	.wrap-zoom {
		zoom: 1 !important;
	}

	.wrap-screen {
		height: auto;
	}

	header {
		height: 42px;
		line-height: 42px;
	}

	header .logo {
		margin-left: 0;
		width: 100px;
		height: 42px;
	}

	header .logo a {
		width: 100px;
		height: 42px;
	}

	header nav.top {
		right: 0;
		width: calc(100% - 100px);
		display: flex;
		gap: 12px;
		justify-content: flex-end;
		padding-right: 12px;
	}

	header nav.top a {
		padding: 0;
		font-size: 12px;
	}

	.banner .btn_make {
		width: 16vw;
		height: auto;
		position: absolute;
		z-index: 10;
		bottom: 30px;
		right: 10vw;
	}

	.wrap-screen.banner,
	.wrap-screen.Xfile {
		height: auto;
	}

	.wrap-screen.banner .banner-content {
		top: unset;
		transform: unset;
		margin-top: 42px;
		width: 100%;
		height: auto;
	}

	.Xfile .Xfile-content {
		width: 100%;
		height: auto;
	}

	.Xfile .Xfile-content img {
		width: 100%;
		height: auto;
	}

	footer {
		background: #000;
		width: 100%;
		height: auto;
	}

	footer .logo {
		padding: 10px 10px 0;
		font-size: 12px;
		width: 100%;
		box-sizing: border-box;
	}

	footer .cr {
		padding: 10px 10px 0;
		width: 100%;
		box-sizing: border-box;
	}

	footer .cr i {
		float: left;
		padding-top: 30px;
		padding-left: 0;
	}

	.choosemodel .tips {
		width: 50vw;
		top: 0;
		height: auto;
		transform: translate(-50%, 0);
	}

	.choosemodel .slider .slide .name {
		width: 50vw;
		height: auto;
		/* transform: translate(-50%, 270px); */
	}

	.choosemodel .background-txt {
		height: 400px;
	}

	.choosemodel .slider .slide {
		height: 320px !important;
	}

	.choosemodel .slider .slide .name {
		top: unset;
		bottom: 0;
		transform: translate(-50%, 0);
	}

	.bx-wrapper .bx-controls-direction a {
		width: 60px;
		height: 60px;
	}

	.bx-wrapper .bx-prev {
		left: -30px;
		background-position: 30px 0;
		background-size: contain;
	}

	.bx-wrapper .bx-next {
		right: -30px;
		background-position: -30px 0;
		background-size: contain;
	}

	.reglogin,
	.contactus,
	.privacy,
	.regAgreement {
		width: 90%;
		height: 90vh;
	}

	.reglogin nav {
		padding: 16px;
	}

	.reglogin .loginbox,
	.reglogin .regbox,
	.reglogin .resetpswbox {
		padding: 0 16px;
	}

	.contactus span.qrcodes {
		width: 90%;
		display: flex;
		gap: 8px;
		padding-bottom: 20px;
	}

	.contactus span.qrcodes img {
		width: 45%;
		height: auto;
		margin-right: 0;
	}

	.dialog>span.content2 {
		width: 100%;
		height: 100%;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		margin-left: 0;
		margin-top: 0;
	}

	.privacy .scroll ,
	.regAgreement .scroll {
		height: 80%;
	}
}