body, dl, dd, h1, h2, h3, h4, h5, h6, p, form, ul, li {
	margin: 0
}

ul, input {
	padding: 0
}

ol, li {
	margin: 0;
	padding: 0
}

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

fieldset, img {
	border: 0
}

address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal
}

ol, ul {
	list-style: none
}

del, ins {
	text-decoration: none
}

caption, th {
	text-align: left
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal
}

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

q:before, q:after {
	content: ""
}

addr, acronym {
	border: 0;
	font-variant: normal
}

sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative
}

sub {
	top: -0.5em
}

sup {
	bottom: -0.25em
}

.clearfix:after, .of-header ul:after, .of-product .of-pro-list:after,
	.of-goods ul:after, .of-how .of-how-list:after, .of-cooper ul:after,
	.news-list .date:after, .of-buy .product .num:after, .of-buy .quan ul:after,
	.of-my:after, .of-my .my-tabs ul:after, .of-my .orders-list .in:after,
	.of-my .back-order .back-product:after, .of-my .back-order .service-type .types:after,
	.same-dialog .in:after, .tickets-list ul:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden
}

.clearfix, .of-header ul, .of-product .of-pro-list, .of-goods ul,
	.of-how .of-how-list, .of-cooper ul, .news-list .date, .of-buy .product .num,
	.of-buy .quan ul, .of-my, .of-my .my-tabs ul, .of-my .orders-list .in,
	.of-my .back-order .back-product, .of-my .back-order .service-type .types,
	.same-dialog .in, .tickets-list ul {
	display: inline-block
}

* html .clearfix, * html .of-header ul, .of-header * html ul, * html .of-product .of-pro-list,
	.of-product * html .of-pro-list, * html .of-goods ul, .of-goods * html ul,
	* html .of-how .of-how-list, .of-how * html .of-how-list, * html .of-cooper ul,
	.of-cooper * html ul, * html .news-list .date, .news-list * html .date,
	* html .of-buy .product .num, .of-buy .product * html .num, * html .of-buy .quan ul,
	.of-buy .quan * html ul, * html .of-my, * html .of-my .my-tabs ul,
	.of-my .my-tabs * html ul, * html .of-my .orders-list .in, .of-my .orders-list * html .in,
	* html .of-my .back-order .back-product, .of-my .back-order * html .back-product,
	* html .of-my .back-order .service-type .types, .of-my .back-order .service-type * html .types,
	* html .same-dialog .in, .same-dialog * html .in, * html .tickets-list ul,
	.tickets-list * html ul {
	height: 1%
}

.clearfix, .of-header ul, .of-product .of-pro-list, .of-goods ul,
	.of-how .of-how-list, .of-cooper ul, .news-list .date, .of-buy .product .num,
	.of-buy .quan ul, .of-my, .of-my .my-tabs ul, .of-my .orders-list .in,
	.of-my .back-order .back-product, .of-my .back-order .service-type .types,
	.same-dialog .in, .tickets-list ul {
	display: block
}

body {
	font: 12px/1.5 "Arial", "\5FAE\8F6F\96C5\9ED1", "\5b8b\4f53", sans-serif;
	color: #000;
	background: #fff
}

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

.fb {
	font-weight: 700
}

.fn {
	font-weight: 400
}

.unl {
	text-decoration: underline
}

.no_unl {
	text-decoration: none
}

.tl {
	text-align: left
}

.tc {
	text-align: center
}

.tr {
	text-align: right
}

.bc {
	margin-left: auto;
	margin-right: auto
}

.fl {
	float: left;
	display: inline
}

.fr {
	float: right;
	display: inline
}

.vm {
	vertical-align: middle
}

.vt {
	vertical-align: top
}

.pr {
	position: relative
}

.pa {
	position: absolute
}

.abs-right {
	position: absolute;
	right: 0
}

.abs-left {
	position: absolute;
	left: 0
}

.hidden {
	visibility: hidden
}

.none {
	display: none
}

input::-webkit-search-cancel-button {
	display: none
}

input[type=search]::-ms-clear, input[type=text]::-ms-clear {
	display: none
}

body {
	min-width: 1150px
}

.noscroll {
	overflow: hidden
}

.mb38 {
	margin-bottom: 38px !important
}

.phone {
	display: none
}

.btn-blue {
	display: inline-block;
	padding: 0 28px;
	height: 40px;
	line-height: 40px;
	background: rgba(91, 150, 247, 0.1);
	border-radius: 2px;
	border: 1px solid #5b96f7;
	text-align: center;
	font-size: 20px;
	color: #327cf6;
	cursor: pointer
}

.btn-blue:hover {
	background-color: #5b96f7;
	color: #fff
}

.btn-red {
	display: inline-block;
	padding: 0 28px;
	height: 40px;
	line-height: 40px;
	background: #e35f58;
	border-radius: 2px;
	border: 1px solid #e35f58;
	text-align: center;
	font-size: 20px;
	color: #fff;
	cursor: pointer
}

.icon-close {
	font-style: normal;
	font-size: 30px;
	position: absolute;
	width: 20px;
	height: 20px;
	right: 20px;
	top: 20px;
	cursor: pointer
}

.icon-close::before, .icon-close::after {
	content: "";
	position: absolute;
	height: 16px;
	width: 1.5px;
	background: #2A4560;
	top: 2px;
	right: 9px
}

.icon-close::before {
	transform: rotate(45deg)
}

.icon-close::after {
	transform: rotate(-45deg)
}

body {
	min-width: 1440px;
	background-color: #fff
}

.of-title {
	text-align: center;
	font-size: 30px;
	line-height: 42px;
	position: relative;
	font-weight: 600;
	color: #2f3f54;
	z-index: 2
}

.of-title:after {
	content: '';
	display: block;
	position: absolute;
	z-index: 1;
	bottom: -10px;
	left: 50%;
	margin-left: -128px;
	width: 256px;
	height: 30px;
	background: #2f3f54;
	opacity: 0.1
}

.of-header {
	width: 100%;
	height: 80px;
	line-height: 80px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 3;
	background-color: #fff
}

.of-header img {
	float: left;
	vertical-align: middle;
	margin: 20px 0 0 3%;
	width: 120px
}

.of-header ul {
	position: absolute;
	left: 50%;
	transform: translateX(-50%)
}

.of-header ul li {
	float: left;
	width: 100px;
	text-align: center;
	font-size: 16px;
	font-weight: 600
}

.of-header ul a {
	color: rgba(50, 50, 50, 0.5)
}

.of-header ul a:hover {
	color: #323232
}

.of-header ul a:active {
	color: rgba(50, 50, 50, 0.5)
}

.of-header ul .active a {
	color: #323232
}

.of-header .login {
	float: right;
	margin-right: 3%;
	text-align: center;
	width: 116px;
	height: 40px;
	line-height: 40px;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 40px;
	border: 1px solid #796b64;
	font-size: 16px;
	color: #796b64;
	margin-top: 20px
}

.of-header .login.active, .of-header .login:hover {
	color: #fff;
	border-color: #327CF6;
	background-color: #327CF6
}

.swiper-container-index {
	height: 792px;
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	position: relative
}

.swiper-container-index .swiper-slide {
	position: relative
}

.swiper-container-index a, .swiper-container-index img {
	display: block;
	width: 100%;
	height: 100%
}

.swiper-container-index .text {
	position: absolute;
	left: 47%;
	top: 50%;
	text-align: center;
	transform: translate(-47%, -50%)
}

.swiper-container-index .text h2 {
	font-size: 40px;
	font-weight: bold
}

.swiper-container-index .text p {
	line-height: 33px;
	font-size: 24px
}

.swiper-container-index .pagination {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 100px;
	opacity: 0.5
}

.swiper-container-index .pagination .swiper-pagination-switch {
	display: inline-block;
	margin: 6px;
	padding: 6px;
	cursor: pointer
}

.swiper-container-index .pagination .swiper-pagination-switch:after {
	content: '';
	display: inline-block;
	width: 10px;
	height: 10px;
	background: #fff;
	border-radius: 12px
}

.swiper-container-index .pagination .swiper-active-switch:after {
	background: #bbb0b0;
	border: 1px solid #fff
}

.of-product {
	padding: 120px 0 85px
}

.of-product .of-pro-list {
	width: 1095px;
	margin: 0 auto;
	padding-top: 150px
}

.of-product .of-pro-list a {
	color: #fff
}

.of-product .of-pro-list li {
	float: left;
	width: 500px;
	height: 300px;
	position: relative;
	border-radius: 4px;
	margin-bottom: 95px
}

.of-product .of-pro-list li .pc {
	display: block
}

.of-product .of-pro-list li .phone {
	display: none
}

.of-product .of-pro-list li img {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 12px;
	box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.3)
}

.of-product .of-pro-list li h3 {
	padding: 38px 58px 0;
	font-size: 30px;
	line-height: 60px;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
	position: relative;
	z-index: 2
}

.of-product .of-pro-list li p {
	padding: 0 58px;
	font-size: 20px;
	line-height: 50px;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
	position: relative;
	z-index: 2
}

.of-product .of-pro-list li strong {
	padding-left: 58px;
	display: block;
	font-size: 30px;
	font-weight: bold;
	line-height: 42px;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5);
	margin-bottom: 20px;
	position: relative;
	z-index: 2
}

.of-product .of-pro-list li button {
	margin-left: 58px;
	width: 150px;
	height: 50px;
	background: #fff;
	box-shadow: 0px 30px 50px 0px rgba(49, 157, 149, 0.5);
	border-radius: 25px;
	font-size: 20px;
	border: 0;
	position: relative;
	z-index: 2;
	outline: none
}

.of-product .of-pro-list li:nth-child(even) {
	margin-left: 95px
}

.of-product .of-pro-list li.style-1 button {
	color: #fe8b4d;
	box-shadow: 0px 30px 50px 0px rgba(236, 130, 69, 0.5)
}

.of-product .of-pro-list li.style-2 button {
	color: #fc8abd;
	box-shadow: 0px 30px 50px 0px rgba(253, 101, 178, 0.5)
}

.of-product .of-pro-list li.style-3 button {
	color: #6D2BFE;
	box-shadow: 0px 30px 50px 0px rgba(182, 76, 254, 0.5)
}

.of-product .of-pro-list li.style-4 button {
	color: #FD74B9;
	box-shadow: 0px 30px 50px 0px rgba(255, 122, 189, 0.5)
}

.of-product .of-pro-list li.style-5 button {
	color: #6a47fe;
	box-shadow: 0px 30px 50px 0px rgba(115, 129, 253, 0.5)
}

.of-product .of-pro-list li.style-6 button {
	color: #57b8a5;
	box-shadow: 0px 30px 50px 0px rgba(49, 157, 149, 0.5)
}

.of-goods {
	width: 1440px;
	margin: 0 auto;
	height: 1214px;
	padding-top: 146px;
	background: url("../../images-gw/bac-2.png");
	background-size: 100% auto
}

.of-goods ul {
	margin-left: 150px;
	padding-top: 140px;
	width: 620px
}

.of-goods ul li {
	width: 280px;
	height: 136px;
	float: left;
	background: #fafafc;
	box-shadow: 0px 30px 50px 0px rgba(107, 175, 255, 0.52);
	border-radius: 4px;
	margin: 0 40px 40px 0;
	text-align: center;
	position: relative;
	overflow: hidden
}

.of-goods ul li:nth-child(even) {
	margin-right: 0
}

.of-goods ul li h4 {
	font-size: 30px;
	color: #2f3f54;
	line-height: 60px;
	padding-top: 18px
}

.of-goods ul li p {
	font-size: 20px;
	line-height: 40px;
	color: #666
}

.of-goods ul li strong {
	position: absolute;
	right: 0;
	bottom: -72px;
	right: -10px;
	font-family: Arial-BoldMT;
	font-size: 120px;
	font-weight: bold;
	opacity: 0.2;
	color: #3798ff
}

.of-how {
	text-align: center;
	padding: 100px 0 10px
}

.of-how>p {
	font-size: 20px;
	color: #2f3f54;
	padding-top: 55px;
	margin-bottom: 90px
}

.of-how>img {
	margin-bottom: 190px
}

.of-how .of-how-list {
	width: 1210px;
	margin: 0 auto
}

.of-how .of-how-list li {
	float: left;
	width: 280px;
	height: 340px;
	background: #fafafc;
	box-shadow: 0px 30px 50px 0px rgba(190, 190, 207, 0.5);
	border-radius: 4px;
	margin-left: 30px;
	position: relative
}

.of-how .of-how-list li:first-child {
	margin-left: 0
}

.of-how .of-how-list i {
	display: block;
	position: absolute;
	top: -127px;
	left: 50%;
	margin-left: -70px;
	width: 140px;
	height: 140px;
	background: linear-gradient(180deg, #fb5399 0%, #f52960 100%);
	box-shadow: 0px 30px 50px 0px rgba(190, 190, 207, 0.5), 0px 30px 50px
		0px rgba(190, 190, 207, 0.5);
	border-radius: 70px
}

.of-how .of-how-list img {
	width: 45px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)
}

.of-how .of-how-list h3 {
	font-size: 20px;
	line-height: 60px;
	padding-top: 80px;
	font-weight: bold;
	color: #2f3f54;
	margin-bottom: 26px
}

.of-how .of-how-list p {
	display: block;
	width: 200px;
	margin: 0 auto;
	text-align: left;
	font-size: 20px;
	color: #2f3f54;
	line-height: 30px
}

.of-how .of-how-list li:nth-child(2) i {
	background: linear-gradient(180deg, #77edf3 0%, #42d6e2 100%)
}

.of-how .of-how-list li:nth-child(3) i {
	background: linear-gradient(180deg, #7bee1c 0%, #45d80c 100%)
}

.of-how .of-how-list li:nth-child(4) i {
	background: linear-gradient(180deg, #fdcd00 0%, #fb9f00 100%)
}

.of-cooper {
	padding: 170px 0;
	background: #f9f9f9
}

.of-cooper ul {
	padding-top: 107px;
	width: 942px;
	margin: 0 auto
}

.of-cooper ul li {
	float: left;
	margin-right: 34px;
	margin-bottom: 34px;
	width: 208px;
	height: 96px;
	background: #fff;
	border-radius: 4px;
	border: 1px solid #e4e5e7
}

.of-cooper ul li:nth-child(4n) {
	margin-right: 0
}

.of-cooper ul li img {
	display: block;
	width: 100%;
	height: 100%
}

.of-footer {
	width: 100%;
	text-align: center;
	padding: 100px 0 90px;
	background: #e6effa;
	position: relative;
	color: #2A4560
}

.of-footer h3 {
	font-size: 20px;
	margin-bottom: 17px
}

.of-footer p {
	font-size: 15px;
	line-height: 40px
}

.of-footer p:last-child {
	opacity: 0.5
}

.of-footer .ewm {
	position: absolute;
	top: 50%;
	width: 100px;
	height: 100px;
	margin-top: -50px;
	right: 6%
}

.of-detial-card {
	width: 734px;
	margin: 0 auto;
	padding-left: 566px;
	position: relative;
	margin-top: 200px;
	height: 300px;
	color: #2F3F54
}

.of-detial-card .img {
	position: absolute;
	width: 500px;
	height: 300px;
	top: 0;
	left: 0;
	overflow: hidden;
	box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.3);
	border-radius: 10px
}

.of-detial-card img {
	width: 500px;
	height: 300px
}

.of-detial-card h3 {
	font-size: 30px;
	font-weight: 600;
	line-height: 42px;
	margin-bottom: 27px
}

.of-detial-card p {
	font-size: 20px;
	line-height: 28px;
	margin-bottom: 10px
}

.of-detial-card strong {
	display: block;
	font-size: 40px;
	font-weight: 600;
	color: #e35f58;
	line-height: 56px;
	margin-bottom: 22px
}

.of-detial-card a {
	width: 230px;
	display: block;
	height: 60px;
	line-height: 60px;
	background: #e35f58;
	box-shadow: 0px 30px 50px 0px rgba(227, 95, 88, 0.43);
	border-radius: 40px;
	text-align: center;
	font-size: 26px;
	font-weight: 600;
	color: #fff;
	margin-top: 45px
}

.of-detial-in {
	padding: 150px 0 75px
}

.of-detial-in .bannars {
	padding-top: 88px
}

.of-detial-in .bannars img {
	width: 900px;
	margin: 0 auto;
	display: block
}

.of-news {
	padding: 200px 0
}

.news-list {
	padding-top: 94px;
	margin: 0 auto;
	width: 1260px
}

.news-list li {
	width: 1260px;
	padding: 40px;
	margin-bottom: 50px;
	position: relative;
	background: #f9f9f9
}

.news-list .date {
	line-height: 45px
}

.news-list .date strong {
	float: left;
	width: 400px;
	text-align: right;
	margin-right: 40px;
	font-size: 30px;
	font-weight: 600;
	color: #2f3f54
}

.news-list .date em {
	float: left;
	width: 820px;
	font-size: 24px;
	color: rgba(47, 63, 84, 0.5);
	border-bottom: 1px solid rgba(47, 63, 84, 0.3)
}

.news-list img {
	position: absolute;
	top: 81px;
	left: 40px;
	display: block;
	width: 400px;
	height: 300px
}

.news-list .in {
	padding-left: 440px;
	height: 300px;
	position: relative
}

.news-list .in h4 {
	font-size: 25px;
	font-weight: 600;
	padding: 20px 0;
	color: #2f3f54;
	line-height: 42px;
	height: 84px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical
}

.news-list .in p {
	font-size: 20px;
	line-height: 28px;
	overflow: hidden;
	color: #2f3f54;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical
}

.news-list .in span {
	position: absolute;
	bottom: 0;
	left: 440px;
	font-size: 24px;
	color: rgba(47, 63, 84, 0.5)
}

.of-news-detail {
	padding: 140px 0 30px
}

.of-news-detail .in {
	width: 940px;
	padding: 70px;
	margin: 0 auto;
	background: #f9f9f9
}

.of-news-detail h2 {
	font-size: 30px;
	font-weight: 600;
	color: #2f3f54;
	line-height: 42px
}

.of-news-detail .time {
	display: block;
	font-size: 20px;
	color: rgba(47, 63, 84, 0.5);
	line-height: 80px;
	border-bottom: 1px solid rgba(47, 63, 84, 0.2);
	margin-bottom: 40px
}

.of-news-detail p {
	font-size: 20px;
	color: #2f3f54;
	line-height: 28px;
	margin-bottom: 40px
}

.of-news-detail img {
	display: block;
	width: 100%;
	margin-bottom: 40px
}

.of-about {
	width: 1340px;
	padding: 90px 0;
	margin: 0 auto
}

.of-about img {
	display: block;
	width: 100%;
	box-shadow: 0px 30px 50px 0px rgba(207, 207, 207, 0.5);
	border-radius: 10px;
	margin-bottom: 60px
}

.of-about .of-title {
	margin-bottom: 40px
}

.of-about .text {
	width: 1200px;
	padding: 70px;
	font-size: 20px;
	background: #f9f9f9;
	color: #2f3f54;
	line-height: 28px;
	text-indent: 40px;
	margin-bottom: 40px
}

.of-about .text p {
	margin-bottom: 20px
}

.of-about .text p:last-child {
	margin-bottom: 0
}

.of-buy {
	padding: 200px 0 50px;
	width: 1340px;
	margin: 0 auto
}

.of-buy .of-title {
	margin-bottom: 50px
}

.of-buy .product, .of-buy .area, .of-buy .quan {
	padding: 40px;
	width: 1260px;
	background: #f9f9f9;
	position: relative;
	margin-bottom: 30px
}

.of-buy .product img {
	width: 326px;
	height: 188px;
	border-radius: 6px
}

.of-buy .product .in {
	width: 884px;
	padding-top: 24px;
	float: right;
	font-size: 30px;
	font-weight: 600;
	color: #2f3f54;
	line-height: 56px;
	margin-bottom: 10px
}

.of-buy .product strong {
	font-size: 40px;
	display: block;
	font-weight: 600;
	margin-top: 10px;
	color: #e35f58
}

.of-buy .product .num {
	position: absolute;
	top: 116px;
	right: 40px;
	width: 134px;
	background: #f9f9f9;
	border-radius: 10px;
	border: 1px solid #d6dcdf;
	font-size: 20px
}

.of-buy .product .num button {
	float: left;
	width: 40px;
	height: 40px;
	line-height: 40px;
	color: #2F3F54;
	background: transparent;
	border: 0;
	cursor: pointer;
	outline: none
}

.of-buy .product .num button:last-child {
	line-height: 36px
}

.of-buy .product .num input {
	float: left;
	width: 52px;
	height: 40px;
	background: #fff;
	border: 1px solid #d6dcdf;
	border-top: 0;
	border-bottom: 0;
	border-radius: 0;
	outline: none;
	text-align: center
}

.of-buy .product .num input::-webkit-outer-spin-button, .of-buy .product .num input::-webkit-inner-spin-button
	{
	-webkit-appearance: none !important;
	margin: 0
}

.of-buy .area {
	padding: 40px;
	width: 1260px;
	background: #f9f9f9;
	position: relative;
	margin-bottom: 30px
}

.of-buy .area li {
	width: 1254px;
	height: 70px;
	line-height: 70px;
	border-radius: 3px;
	font-size: 18px;
	border: 1px solid transparent;
	position: relative;
	cursor: pointer
}

.of-buy .area li span {
	display: inline-block;
	width: 100px;
	text-align: center;
	font-weight: 600;
	color: #E35F58;
	visibility: hidden
}

.of-buy .area li p {
	width: 1150px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #2F3F54
}

.of-buy .area li .check {
	width: 26px;
	height: 26px;
	display: inline-block;
	vertical-align: middle;
	background: #fff;
	border: 2px solid #2F3F54;
	border-radius: 30px;
	margin-right: 20px
}

.of-buy .area li a {
	position: absolute;
	display: none;
	right: 50px;
	top: 0;
	color: #327cf6
}

.of-buy .area .active {
	background: rgba(227, 95, 88, 0.1);
	border-color: #e35f58
}

.of-buy .area .active span {
	visibility: visible
}

.of-buy .area .active a {
	display: block
}

.of-buy .area .active p, .of-buy .area .active em {
	font-weight: 600
}

.of-buy .area .active .check {
	border-color: #E35F58;
	position: relative
}

.of-buy .area .active .check:after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 10px;
	height: 10px;
	background-color: #E35F58;
	border-radius: 10px
}

.of-buy .quan ul li {
	float: left;
	width: 324px;
	height: 237px;
	background-image: url(../../images-gw/yhq.png);
	background-size: 100% 100%;
	cursor: pointer
}

.of-buy .quan ul li:hover {
	background-image: url(../../images-gw/yhq-on.png)
}

.of-buy .quan ul li:hover h4 {
	color: #fff
}

.of-buy .quan ul li:hover p {
	color: #fff
}

.of-buy .quan ul h4 {
	padding: 24px 30px 0;
	font-size: 30px;
	font-weight: 600;
	color: #e35f58;
	line-height: 56px;
	letter-spacing: 1px;
	margin-bottom: 10px;
	word-break: break-all
}

.of-buy .quan ul p {
	padding: 0 30px;
	font-size: 20px;
	color: #2f3f54;
	line-height: 28px;
	margin-bottom: 10px
}

.of-buy .quan ul .active {
	background-image: url(../../images-gw/yhq-on.png)
}

.of-buy .quan ul .active h4 {
	color: #fff
}

.of-buy .quan ul .active p {
	color: #fff
}

.of-buy .buy-tit {
	font-size: 20px;
	color: #2f3f54;
	line-height: 28px;
	margin-bottom: 25px
}

.of-buy .buy-tit a {
	float: right;
	color: #327cf6
}

.of-buy .order {
	width: 1078px;
	background: rgba(227, 95, 88, 0.1);
	border-radius: 3px;
	padding: 40px 130px;
	border: 1px solid #e35f58;
	font-size: 20px;
	color: #2f3f54;
	line-height: 28px
}

.of-buy .order p {
	margin-bottom: 20px;
	text-align: right
}

.of-buy .order .total, .of-buy .order .card, .of-buy .order .pay {
	display: inline-block;
	width: 140px
}

.of-buy .order .pay {
	font-size: 40px;
	font-weight: 600;
	color: #e35f58;
	line-height: 56px
}

.of-buy .order .confirm {
	display: inline-block;
	width: 300px;
	height: 60px;
	line-height: 60px;
	color: #fff;
	text-align: center;
	background: #e35f58;
	box-shadow: 0px 30px 50px 0px rgba(227, 95, 88, 0.43);
	border-radius: 40px;
	font-size: 25px;
	font-weight: 600
}

.of-sign {
	width: 100%;
	overflow: hidden;
	position: relative
}

.of-sign .img {
	width: 100%;
	max-height: 980px;
	overflow: hidden
}

.of-sign .img img {
	display: block;
	width: 100%
}

.of-sign .of-form {
	position: absolute;
	right: 10%;
	bottom: 12%;
	width: 554px;
	padding: 100px 0 80px;
	background: #fff;
	box-shadow: 0px 30px 50px 0px rgba(207, 207, 207, 0.5)
}

.of-sign .of-form .of-title {
	margin-bottom: 50px
}

.of-sign .of-form .label {
	width: 400px;
	height: auto;
	margin: 0 auto;
	margin-bottom: 20px;
	position: relative
}

.of-sign .of-form .label>div {
	height: 70px;
	border-bottom: 1px solid rgba(47, 63, 84, 0.2)
}

.of-sign .of-form .label .quhao {
	position: absolute;
	width: 90px;
	text-align: center;
	left: 0;
	top: 0;
	line-height: 70px;
	font-size: 20px;
	color: #2f3f54
}

.of-sign .of-form .label input {
	outline: none;
	font-size: 20px;
	padding-left: 95px;
	width: 300px;
	border: 0;
	color: #2A4560;
	line-height: 70px
}

.of-sign .of-form .label input::-moz-placeholder {
	color: rgba(47, 63, 84, 0.5) !important
}

.of-sign .of-form .label input::-webkit-input-placeholder {
	color: rgba(47, 63, 84, 0.5) !important
}

.of-sign .of-form .label .error {
	font-size: 20px;
	color: #eb4d3d;
	line-height: 40px
}

.of-sign .of-form .yzm input {
	padding-left: 0;
	padding-right: 120px;
	width: 280px
}

.of-sign .of-form .yzm .yzm-send {
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
	width: 100px;
	text-align: center;
	font-size: 20px;
	color: #327cf6;
	line-height: 70px
}

.of-sign .of-form .error-label>div {
	border-bottom: 1px solid #eb4d3d
}

.of-sign .of-form .error-label input {
	color: #eb4d3d
}

.of-sign .of-form .login, .of-sign .of-form .signup {
	display: block;
	margin: 0 auto;
	width: 300px;
	height: 60px;
	line-height: 60px;
	background: #327cf6;
	border-radius: 40px;
	outline: none;
	color: #fff;
	font-weight: bold;
	text-align: center;
	border: 0;
	font-size: 25px;
	margin-bottom: 60px
}

.of-sign .of-form>p {
	text-align: center;
	font-size: 20px;
	color: #2f3f54
}

.of-sign .of-form>p a {
	color: #327cf6
}

.of-sign .of-form .know {
	font-size: 20px;
	color: rgba(47, 63, 84, 0.5);
	line-height: 28px;
	margin-bottom: 60px
}

.of-sign .of-form .know i {
	font-style: normal;
	text-decoration: underline;
	cursor: pointer
}

.bac-bar, .bar-bac {
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.5
}

.know-book {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9
}

.know-book .in {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 40px 60px;
	width: 1028px;
	max-height: 600px;
	overflow: auto;
	background: #fff;
	box-shadow: 0px -1px 0px 0px #dde3e8;
	width: 897px;
	font-size: 18px;
	color: #2f3f54
}

.know-book h4 {
	text-align: center;
	margin-bottom: 50px
}

.know-book .close {
	font-style: normal;
	font-size: 30px;
	position: absolute;
	width: 20px;
	height: 20px;
	right: 20px;
	top: 20px;
	cursor: pointer
}

.know-book .close::before, .know-book .close::after {
	content: "";
	position: absolute;
	height: 16px;
	width: 1.5px;
	background: #2A4560;
	top: 2px;
	right: 9px
}

.know-book .close::before {
	transform: rotate(45deg)
}

.know-book .close::after {
	transform: rotate(-45deg)
}

.of-my {
	padding-top: 120px;
	background-color: #f9f9f9
}

.of-my .my-in {
	margin: 0 auto;
	width: 1280px
}

.of-my .my-tit {
	height: 90px;
	line-height: 90px;
	padding: 0 40px;
	font-size: 20px;
	color: #2f3f54;
	margin-bottom: 30px;
	background-color: #fff
}

.of-my .my-tit a {
	float: right;
	margin-top: 25px
}

.of-my .my-left {
	float: left;
	width: 180px;
	font-size: 20px;
	line-height: 28px
}

.of-my .my-left li {
	line-height: 60px
}

.of-my .my-left a {
	color: #989898
}

.of-my .my-left .active a {
	color: #327cf6
}

.of-my .my-left i {
	display: inline-block;
	width: 30px;
	height: 30px;
	vertical-align: middle;
	background-size: 90% auto;
	margin-right: 6px;
	background-repeat: no-repeat
}

.of-my .my-left li:nth-child(1) i {
	background-image: url(../../images-gw/ic1_1.png)
}

.of-my .my-left li:nth-child(2) i {
	background-image: url(../../images-gw/ic2_1.png)
}

.of-my .my-left li:nth-child(3) i {
	background-image: url(../../images-gw/ic3_1.png)
}

.of-my .my-left li:nth-child(4) i {
	background-image: url(../../images-gw/ic4_1.png)
}

.of-my .my-left li:nth-child(1).active i {
	background-image: url(../../images-gw/ic1_2.png)
}

.of-my .my-left li:nth-child(2).active i {
	background-image: url(../../images-gw/ic2_2.png)
}

.of-my .my-left li:nth-child(3).active i {
	background-image: url(../../images-gw/ic3_2.png)
}

.of-my .my-left li:nth-child(4).active i {
	background-image: url(../../images-gw/ic4_2.png)
}

.of-my .my-left li:nth-child(1):hover i {
	background-image: url(../../images-gw/ic1_2.png)
}

.of-my .my-left li:nth-child(2):hover i {
	background-image: url(../../images-gw/ic2_2.png)
}

.of-my .my-left li:nth-child(3):hover i {
	background-image: url(../../images-gw/ic3_2.png)
}

.of-my .my-left li:nth-child(4):hover i {
	background-image: url(../../images-gw/ic4_2.png)
}

.of-my .my-left li:hover a {
	color: #327cf6
}

.of-my .my-con {
	float: left;
	width: 1100px;
	margin-bottom: 60px
}

.of-my .my-con table {
	width: 100%;
	font-size: 16px;
	color: #2f3f54;
	text-align: center
}

.of-my .my-con table th {
	height: 70px;
	line-height: 70px;
	background: #f5f5f5;
	white-space: nowrap;
	padding: 0 12px;
	text-align: center
}

.of-my .my-con table tr {
	border: 1px solid #e5e5e5
}

.of-my .my-con table td {
	padding: 12px;
	text-align: center
}

.of-my .my-con table a {
	font-size: 16px
}

.of-my .orders {
	background-color: #fff
}

.of-my .location {
	padding: 40px;
	background: #fff
}

.of-my .location .controls {
	white-space: nowrap
}

.of-my .my-tabs {
	background: #fff
}

.of-my .my-tabs ul {
	padding: 0 20px;
	border-bottom: 1px solid #dde3e8
}

.of-my .my-tabs li {
	float: left;
	width: 120px;
	height: 70px;
	text-align: center;
	line-height: 70px
}

.of-my .my-tabs li a {
	font-size: 20px;
	color: #2f3f54
}

.of-my .my-tabs .active {
	border-bottom: 5px solid #327cf6
}

.of-my .my-tabs .active a {
	color: #327cf6
}

.of-my .my-tabs li:hover a {
	color: #327cf6
}

.of-my .orders-list {
	padding: 40px;
	width: 1020px;
	margin: 0 auto
}

.of-my .orders-list h3 {
	height: 70px;
	line-height: 70px;
	padding: 0 30px;
	font-size: 20px;
	color: #2f3f54;
	background: #f5f5f5
}

.of-my .orders-list h3 span {
	margin-right: 60px
}

.of-my .orders-list .in {
	border: 1px solid #e5e5e5;
	border-bottom: 0;
	padding: 30px;
	position: relative
}

.of-my .orders-list .in:last-child {
	border-bottom: 1px solid #e5e5e5
}

.of-my .orders-list .in img {
	width: 300px;
	height: 173px;
	float: left;
	background: #ffe597;
	border-radius: 10px;
	box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.2)
}

.of-my .orders-list .in p {
	line-height: 45px;
	width: 300px;
	float: left;
	margin-left: 30px;
	font-size: 20px;
	padding-top: 20px;
	color: #2f3f54
}

.of-my .orders-list .in span {
	float: left;
	width: 170px;
	line-height: 173px;
	margin-left: 20px;
	font-size: 20px;
	color: #2f3f54
}

.of-my .orders-list .in a {
	float: left;
	margin-top: 60px
}

.of-my .back-order {
	width: 1100px;
	margin: 0 auto
}

.of-my .back-order .back-product {
	padding: 50px;
	margin-bottom: 30px;
	background-color: #fff
}

.of-my .back-order .back-product img {
	width: 300px;
	height: 173px;
	float: left;
	background: #ffe597;
	border-radius: 10px
}

.of-my .back-order .back-product p {
	line-height: 45px;
	width: 300px;
	float: left;
	margin-left: 50px;
	font-size: 20px;
	padding-top: 20px;
	color: #2f3f54
}

.of-my .back-order .back-product p strong {
	color: #E35F58
}

.of-my .back-order .service-type {
	margin-bottom: 50px;
	background-color: #fff
}

.of-my .back-order .service-type h3 {
	height: 70px;
	line-height: 70px;
	padding: 0 40px;
	font-size: 20px;
	color: #2f3f54;
	border-bottom: 1px solid rgba(47, 63, 84, 0.3)
}

.of-my .back-order .service-type .types {
	padding: 30px 40px
}

.of-my .back-order .service-type .types p {
	width: 500px;
	height: 128px;
	line-height: 128px;
	background: rgba(91, 150, 247, 0.1);
	border-radius: 2px;
	border: 1px solid #5b96f7;
	float: left;
	margin-left: 16px;
	cursor: pointer
}

.of-my .back-order .service-type .types p:first-child {
	margin-left: 0
}

.of-my .back-order .service-type .types p:first-child i {
	background-image: url(../../images-gw/ic_th.png)
}

.of-my .back-order .service-type .types p.active:first-child i {
	background-image: url(../../images-gw/ic_th_2.png)
}

.of-my .back-order .service-type .types p:last-child i {
	background-image: url(../../images-gw/ic_tk.png)
}

.of-my .back-order .service-type .types p.active:last-child i {
	background-image: url(../../images-gw/ic_tk_2.png)
}

.of-my .back-order .service-type .types p i {
	display: inline-block;
	width: 78px;
	height: 78px;
	background-size: 78px 78px;
	vertical-align: middle;
	margin: 0 30px
}

.of-my .back-order .service-type .types p span {
	display: inline-block;
	font-size: 20px;
	font-weight: 600;
	color: #323232;
	padding-top: 35px;
	line-height: 28px;
	vertical-align: top
}

.of-my .back-order .service-type .types p em {
	font-weight: 400;
	color: rgba(47, 63, 84, 0.7)
}

.of-my .back-order .service-type .types .active {
	background-color: #5B96F7;
	border-color: #5B96F7
}

.of-my .back-order .service-type .types .active span, .of-my .back-order .service-type .types .active em
	{
	color: #fff
}

.of-my .back-order .service-type .money {
	padding: 20px 40px;
	font-size: 20px;
	color: rgba(47, 63, 84, 0.9)
}

.of-my .back-order .service-type .money p {
	width: 500px;
	height: 60px;
	overflow: hidden;
	line-height: 60px;
	color: rgba(47, 63, 84, 0.5);
	background: #fff;
	border-radius: 3px;
	border: 1px solid #dde3e8;
	margin-top: 12px
}

.of-my .back-order .service-type .money input {
	width: 400px;
	height: 100%;
	border: 0;
	outline: none
}

.of-my .back-order .service-type .reason p {
	width: 1018px
}

.of-my .back-order .service-type .reason input {
	padding: 0 25px;
	width: 950px
}

.of-my .back-order .service-type a {
	margin: 50px 40px 75px 0
}

.same-dialog {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9
}

.same-dialog .in {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	background-color: #fff;
	width: 1020px;
	height: auto
}

.same-dialog .in h4 {
	text-align: center;
	font-size: 20px;
	color: #2f3f54;
	line-height: 28px;
	padding: 30px 0
}

.same-dialog .pay-detial, .same-dialog .geter-detial {
	float: left;
	width: 450px;
	padding-left: 60px;
	line-height: 45px;
	font-size: 20px;
	color: #2f3f54;
	margin-bottom: 50px
}

.same-dialog .pay-detial h5, .same-dialog .geter-detial h5 {
	color: rgba(47, 63, 84, 0.5)
}

.same-dialog .pay-detial {
	position: relative
}

.same-dialog .pay-detial:after {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	width: 1px;
	height: 100%;
	background-color: rgba(47, 63, 84, 0.3)
}

.same-dialog .seding-detial {
	padding: 0 60px;
	font-size: 15px;
	color: #2f3f54;
	line-height: 30px
}

.same-dialog .seding-detial h5 {
	font-size: 20px;
	color: rgba(47, 63, 84, 0.5);
	margin-bottom: 15px
}

.same-dialog .seding-detial ul {
	max-height: 220px;
	overflow: auto
}

.same-dialog .seding-detial li {
	position: relative;
	padding-left: 23px;
	padding-bottom: 15px;
	overflow: hidden
}

.same-dialog .seding-detial li:last-child {
	margin-bottom: 0
}

.same-dialog .seding-detial li:before {
	content: '';
	width: 15px;
	height: 20px;
	display: block;
	position: absolute;
	background-color: #fff;
	z-index: 3;
	top: 7px;
	left: 0
}

.same-dialog .seding-detial li:after {
	content: '';
	width: 2px;
	height: 100%;
	display: block;
	position: absolute;
	background-color: #DDE3E8;
	top: 7px;
	left: 4px
}

.same-dialog .seding-detial li:last-child:after {
	display: none
}

.same-dialog .seding-detial li:first-child .l:before {
	background: #e35f58
}

.same-dialog .seding-detial li:first-child .l:after {
	background: #e35f58
}

.same-dialog .seding-detial .l, .same-dialog .seding-detial .r,
	.same-dialog .seding-detial .m {
	float: left
}

.same-dialog .seding-detial .l {
	width: 160px
}

.same-dialog .seding-detial .l:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 9.5px;
	width: 10px;
	height: 10px;
	background: #e35f58;
	opacity: 0.3;
	background: #acb2ba;
	opacity: 0.3;
	z-index: 4;
	border-radius: 10px
}

.same-dialog .seding-detial .l:after {
	content: '';
	display: block;
	position: absolute;
	left: 3px;
	top: 12.5px;
	width: 4px;
	height: 4px;
	z-index: 5;
	border-radius: 4px;
	background: #acb2ba
}

.same-dialog .seding-detial .m {
	width: 90px
}

.same-dialog .seding-detial .r {
	width: 620px
}

.same-dialog .seding-detial .r span {
	line-height: 21px;
	display: inline-table
}

.same-dialog .seding-detial p {
	line-height: 21px
}

.same-dialog .controls {
	text-align: right;
	padding-right: 60px;
	padding: 30px 60px 30px 0
}

.same-dialog .controls a {
	margin-left: 30px
}

.same-dialog .status {
	display: inline-block;
	padding: 30px 0;
	width: 121px;
	height: 121px
}

.same-dialog .text {
	text-align: center;
	font-size: 20px;
	color: #2f3f54;
	line-height: 28px;
	padding-bottom: 100px
}

.add-location .in, .add-wl .in, .add-tickets .in {
	padding: 0 60px
}

.add-location .inp, .add-wl .inp, .add-tickets .inp {
	float: left;
	width: 500px;
	font-size: 20px;
	color: #2f3f54
}

.add-location .inp input, .add-wl .inp input, .add-tickets .inp input {
	width: 448px;
	height: 58px;
	padding: 0 25px;
	line-height: 58px;
	background: #fff;
	border-radius: 3px;
	border: 1px solid #dde3e8;
	margin: 6px 0 50px
}

.add-location .controls, .add-wl .controls, .add-tickets .controls {
	padding-right: 0
}

.add-location .person, .add-location .gs, .add-wl .person, .add-wl .gs,
	.add-tickets .person, .add-tickets .gs {
	margin-right: 20px
}

.add-location .select-city, .add-wl .select-city, .add-tickets .select-city
	{
	clear: both;
	font-size: 20px;
	min-height: 90px;
	margin-bottom: 32px;
	color: #2f3f54
}

.add-location .select-city .select-ui, .add-wl .select-city .select-ui,
	.add-tickets .select-city .select-ui {
	float: left;
	position: relative;
	width: 448px;
	height: 58px;
	line-height: 58px;
	padding: 0 25px;
	background: #fff;
	border-radius: 3px;
	border: 1px solid #dde3e8;
	position: relative
}

.add-location .select-city .select-ui>span:after, .add-wl .select-city .select-ui>span:after,
	.add-tickets .select-city .select-ui>span:after {
	content: '';
	display: block;
	position: absolute;
	border-width: 10px;
	border-color: #788995 transparent transparent;
	border-style: solid;
	top: 25px;
	right: 20px
}

.add-location .select-city .select-ui:last-child, .add-wl .select-city .select-ui:last-child,
	.add-tickets .select-city .select-ui:last-child {
	margin-left: 20px
}

.add-location .select-city .select-ui:hover ul, .add-wl .select-city .select-ui:hover ul,
	.add-tickets .select-city .select-ui:hover ul {
	display: block
}

.add-location .select-city .select-ui ul, .add-wl .select-city .select-ui ul,
	.add-tickets .select-city .select-ui ul {
	max-height: 160px;
	overflow: auto;
	display: none;
	left: -1px;
	top: 59px;
	width: 498px;
	line-height: 32px;
	font-size: 16px;
	background: #fff;
	border: 1px solid #dde3e8;
	position: absolute;
	z-index: 3
}

.add-location .select-city .select-ui ul li, .add-wl .select-city .select-ui ul li,
	.add-tickets .select-city .select-ui ul li {
	cursor: pointer;
	width: 448px;
	padding: 0 25px
}

.add-location .select-city .select-ui ul li:hover, .add-wl .select-city .select-ui ul li:hover,
	.add-tickets .select-city .select-ui ul li:hover {
	background: #f9f9f9
}

.add-location .ticket, .add-wl .ticket, .add-tickets .ticket {
	float: none
}

.add-location .detial-location, .add-location .inp-ticket, .add-wl .detial-location,
	.add-wl .inp-ticket, .add-tickets .detial-location, .add-tickets .inp-ticket
	{
	clear: both;
	font-size: 20px;
	width: 968px !important;
	height: 58px;
	padding: 0 25px;
	line-height: 58px;
	background: #fff;
	border-radius: 3px;
	border: 1px solid #dde3e8
}

.tickets-list {
	padding: 30px 0 50px 50px
}

.tickets-list ul li {
	float: left;
	width: 324px;
	height: 237px;
	background-image: url(../../images-gw/yhq.png);
	background-size: 100% 100%;
	cursor: pointer;
	margin: 0 20px 25px 0
}

.tickets-list ul h4 {
	padding: 24px 30px 0;
	font-size: 40px;
	font-weight: 600;
	color: #e35f58;
	line-height: 56px;
	letter-spacing: 1px;
	margin-bottom: 10px;
	word-break: break-all
}

.tickets-list ul p {
	padding: 0 30px;
	font-size: 20px;
	color: #2f3f54;
	line-height: 28px;
	margin-bottom: 10px
}

.tickets-list ul .active {
	background-image: url(../../images-gw/yhq-on.png)
}

.tickets-list ul .active h4 {
	color: #fff
}

.tickets-list ul .active p {
	color: #fff
}

.tickets-list ul .grey {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
	_filter: none
}

.tickets-list ul a {
	display: block;
	width: 130px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	margin-left: 30px;
	background: rgba(227, 95, 88, 0.1);
	border-radius: 2px;
	border: 1px solid #e35f58;
	font-size: 20px;
	color: #e35f58
}

.dialog-alert {
	z-index: 10
}

.an_toLeft {
	animation: toLeft 0.5s linear 0s;
	-webkit-animation: toLeft 0.5s linear 0s;
	-ms-animation: toLeft 0.5s linear 0s;
	animation-fill-mode: both;
	opacity: 1 !important;
	filter: alpha(opacity = 100) !important
}

.an_delay1 {
	animation-delay: .1s
}

.an_delay2 {
	animation-delay: .2s
}

.an_delay3 {
	animation-delay: .3s
}

.an_delay4 {
	animation-delay: .4s
}

.an_delay5 {
	animation-delay: .5s
}

.an_delay6 {
	animation-delay: .6s
}

.an_delay7 {
	animation-delay: .7s
}

.an_delay8 {
	animation-delay: .8s
}

.an_delay9 {
	animation-delay: .9s
}

.an_delay10 {
	animation-delay: 1s
}

.an_delay11 {
	animation-delay: 1.1s
}

.an_delay12 {
	animation-delay: 1.2s
}

.an_delay13 {
	animation-delay: 1.3s
}

.an_delay14 {
	animation-delay: 1.4s
}

.an_delay15 {
	animation-delay: 1.5s
}

.an_delay16 {
	animation-delay: 1.6s
}

.an_delay17 {
	animation-delay: 1.7s
}

.an_delay18 {
	animation-delay: 1.8s
}

.an_delay19 {
	animation-delay: 1.9s
}

.an_delay20 {
	animation-delay: 2s
}

.an_delay21 {
	animation-delay: 2.1s
}

.an_delay22 {
	animation-delay: 2.2s
}

.an_delay23 {
	animation-delay: 2.3s
}

.an_delay24 {
	animation-delay: 2.4s
}

.an_delay25 {
	animation-delay: 2.5s
}

.an_delay26 {
	animation-delay: 2.6s
}

.an_delay27 {
	animation-delay: 2.7s
}

.an_delay28 {
	animation-delay: 2.8s
}

.an_delay29 {
	animation-delay: 2.9s
}

.an_delay30 {
	animation-delay: 3s
}

.an_delay31 {
	animation-delay: 3.1s
}

.an_delay32 {
	animation-delay: 3.2s
}

.an_delay33 {
	animation-delay: 3.3s
}

.an_delay34 {
	animation-delay: 3.4s
}

.an_delay35 {
	animation-delay: 3.5s
}

.an_delay36 {
	animation-delay: 3.6s
}

.an_delay37 {
	animation-delay: 3.7s
}

.an_delay38 {
	animation-delay: 3.8s
}

.an_delay39 {
	animation-delay: 3.9s
}

.an_delay40 {
	animation-delay: 4s
}

@
keyframes toTop { 0%{
	transform: translate3d(0px, 100px, 0);
	opacity: 0;
	filter: alpha(opacity = 0)
}

100%{
transform
:translate3d
(0px
,
0
px
,
0);
opacity
:
1;filter
:alpha
(opacity=100)
}
}
@media screen and (min-width: 1025px) and (max-width: 1439px) {
	body {
		min-width: 1152px
	}
	.of-product .of-pro-list {
		width: 1095px
	}
	.of-goods {
		width: 1152px;
		height: 914px;
		background-repeat: no-repeat
	}
	.of-goods ul {
		margin-left: 100px
	}
	.of-how .of-how-list {
		width: 1090px
	}
	.of-how .of-how-list li {
		width: 250px;
		height: 340px
	}
	.of-detial-card {
		width: 534px
	}
	.of-detial-in .bannars img {
		width: 1100px;
		margin: 0 auto;
		display: block
	}
	.news-list {
		width: 1060px
	}
	.news-list li {
		width: 980px
	}
	.news-list .date em {
		width: 520px
	}
	.of-about {
		width: 1100px
	}
	.of-about .text {
		width: 960px
	}
	.of-buy {
		width: 1100px;
		margin: 0 auto
	}
	.of-buy .of-title {
		margin-bottom: 50px
	}
	.of-buy .product, .of-buy .area, .of-buy .quan {
		width: 1020px
	}
	.of-buy .product .in {
		width: 644px
	}
	.of-buy .area {
		width: 1020px
	}
	.of-buy .area li {
		width: 1014px
	}
	.of-buy .area li p {
		width: 910px
	}
	.of-buy .order {
		padding-right: 80px;
		width: 888px
	}
	.of-sign .of-form {
		padding: 50px 0 40px;
		bottom: 6%
	}
	.know-book .in {
		max-height: 500px
	}
	.of-my .my-in {
		width: 1100px
	}
	.of-my .my-left {
		width: 150px
	}
	.of-my .my-con {
		width: 950px
	}
	.of-my .orders-list {
		padding: 40px;
		width: 870px
	}
	.of-my .orders-list .in p {
		width: 220px
	}
	.of-my .orders-list .in span {
		width: 100px
	}
	.tickets-list {
		padding: 30px 0 50px 20px
	}
	.tickets-list ul li {
		width: 290px;
		height: 237px;
		transform: scale(0.8)
	}
}

@media screen and (min-width: 0px) and (max-width: 1025px) {
	body {
		min-width: 0
	}
	.of-title {
		font-size: .8rem;
		line-height: 1.1333333333rem
	}
	.of-title:after {
		bottom: -.4666666667rem;
		left: 50%;
		margin-left: -4.4rem;
		width: 8.8rem;
		height: .9333333333rem
	}
	.of-header {
		width: 100%;
		height: 3.3333333333rem;
		line-height: 3.3333333333rem
	}
	.of-header img {
		margin: 1.2666666667rem 0 0 1rem;
		width: 3.3333333333rem;
		position: relative;
		z-index: 5
	}
	.of-header ul {
		position: static;
		left: 0;
		transform: translateX(0)
	}
	.of-header ul li {
		float: left;
		width: auto;
		font-size: .6666666667rem
	}
	.of-header ul li:first-child {
		margin-left: .8333333333rem
	}
	.of-header ul a {
		display: block;
		padding: 0 .4rem
	}
	.of-header ul a:hover {
		color: rgba(50, 50, 50, 0.5)
	}
	.of-header ul li.active a {
		color: #323232 !important
	}
	.of-header .login {
		display: none
	}
	.swiper-container-index {
		padding-top: 3.3333333333rem;
		height: 13.7333333333rem
	}
	.swiper-container-index .text {
		text-align: center
	}
	.swiper-container-index .text h2 {
		font-size: .9333333333rem
	}
	.swiper-container-index .text p {
		text-align: center;
		width: 20rem;
		line-height: .9333333333rem;
		font-size: .6666666667rem
	}
	.swiper-container-index .pagination {
		display: none
	}
	.of-product {
		padding: 1.4666666667rem 0
	}
	.of-product .of-pro-list {
		width: 100%;
		padding-top: 1.6666666667rem
	}
	.of-product .of-pro-list li {
		float: none;
		width: 20rem;
		height: 6.6666666667rem;
		border-radius: .6666666667rem;
		margin-bottom: 1.3333333333rem;
		background-size: 100% 100%;
		margin: 0 auto 1.6666666667rem;
		box-shadow: 0px 1rem 1.6666666667rem 0px rgba(190, 190, 207, 0.3);
		overflow: hidden
	}
	.of-product .of-pro-list li .pc {
		display: none
	}
	.of-product .of-pro-list li .phone {
		display: block
	}
	.of-product .of-pro-list li img {
		display: none
	}
	.of-product .of-pro-list li h3 {
		padding: 1rem 0 0 1.3333333333rem;
		font-size: 1rem;
		line-height: .9333333333rem;
		margin-bottom: .4rem
	}
	.of-product .of-pro-list li p {
		padding: 0 1.3333333333rem;
		font-size: .5333333333rem;
		line-height: .7333333333rem;
		margin-bottom: .2666666667rem
	}
	.of-product .of-pro-list li strong {
		padding-left: 1.3333333333rem;
		display: block;
		font-size: .6666666667rem;
		line-height: .9333333333rem;
		margin-bottom: .4666666667rem
	}
	.of-product .of-pro-list li button {
		margin-left: 1.3333333333rem;
		width: 4.1333333333rem;
		height: 1.2rem;
		border-radius: 1.6666666667rem;
		font-size: .6666666667rem
	}
	.of-product .of-pro-list li:nth-child(even) {
		margin: 0 auto 1.6666666667rem
	}
	.of-goods {
		width: 100%;
		margin: 0 auto;
		height: 21.6666666667rem;
		padding-top: 2.3333333333rem;
		background-size: 100% auto;
		background-repeat: no-repeat
	}
	.of-goods ul {
		margin-left: 0;
		padding: 2.6666666667rem 0 0 1.3333333333rem;
		box-sizing: border-box;
		width: 16.6666666667rem
	}
	.of-goods ul li {
		width: 6.6666666667rem;
		height: 3.3333333333rem;
		border-radius: .2666666667rem;
		margin: 0 .6666666667rem .6666666667rem 0
	}
	.of-goods ul li h4 {
		font-size: .6666666667rem;
		line-height: .9333333333rem;
		padding-top: .8333333333rem
	}
	.of-goods ul li p {
		font-size: .5333333333rem;
		line-height: 1rem
	}
	.of-goods ul li strong {
		bottom: -1rem;
		right: 0rem;
		font-size: 2rem
	}
	.of-how {
		padding: .8rem 0 3.3333333333rem
	}
	.of-how>p {
		font-size: .6666666667rem;
		padding-top: 1.3333333333rem;
		margin: 0 2.3333333333rem 1.3333333333rem
	}
	.of-how>img {
		width: 80%;
		display: block;
		margin: 0 auto 3.3333333333rem
	}
	.of-how .of-how-list {
		width: 20rem;
		margin: 0 auto
	}
	.of-how .of-how-list li {
		float: none;
		width: 20rem;
		height: 8rem;
		box-shadow: 0px 30px 50px 0px rgba(190, 190, 207, 0.5);
		border-radius: .2666666667rem;
		margin-left: 0;
		margin-bottom: .6666666667rem
	}
	.of-how .of-how-list i {
		top: 1.6666666667rem;
		left: 1rem;
		margin-left: 0;
		width: 4.6666666667rem;
		height: 4.6666666667rem;
		border-radius: 4.6666666667rem
	}
	.of-how .of-how-list img {
		width: 1.6666666667rem;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%)
	}
	.of-how .of-how-list h3 {
		font-size: .9333333333rem;
		line-height: 1.2rem;
		text-align: left;
		padding: 2.2rem 0 0 6.6666666667rem;
		margin-bottom: .6666666667rem
	}
	.of-how .of-how-list p {
		padding-left: 6.6666666667rem;
		width: 11.6666666667rem;
		font-size: .6666666667rem;
		line-height: .9333333333rem;
		margin-left: 0
	}
	.of-how .of-how-list li:nth-child(2) i {
		background: linear-gradient(180deg, #77edf3 0%, #42d6e2 100%)
	}
	.of-how .of-how-list li:nth-child(3) i {
		background: linear-gradient(180deg, #7bee1c 0%, #45d80c 100%)
	}
	.of-how .of-how-list li:nth-child(4) i {
		background: linear-gradient(180deg, #fdcd00 0%, #fb9f00 100%)
	}
	.of-cooper {
		padding: 2rem 0
	}
	.of-cooper ul {
		padding-top: 1.6666666667rem;
		width: 23.3333333333rem
	}
	.of-cooper ul li {
		float: left;
		margin: 0 1.6666666667rem 1.6666666667rem 0;
		width: 6.6666666667rem;
		height: 3rem;
		box-sizing: border-box
	}
	.of-cooper ul li:nth-child(4n) {
		margin-right: 1.6666666667rem
	}
	.of-cooper ul li:nth-child(3n) {
		margin-right: 0
	}
	.of-footer {
		padding: 1.3333333333rem 0
	}
	.of-footer h3 {
		font-size: .8rem;
		margin-bottom: .6666666667rem
	}
	.of-footer p {
		font-size: .6666666667rem;
		line-height: 1.3333333333rem
	}
	.of-footer .ewm {
		position: static;
		width: 6.6666666667rem;
		height: 6.6666666667rem;
		margin: 1rem auto
	}
	.of-mobile-buy {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 9
	}
	.of-mobile-buy .ewm {
		position: absolute;
		top: 10.3333333333rem;
		left: 50%;
		transform: translate(-50%, 0%);
		width: 9.7333333333rem;
		height: 9.7333333333rem;
		background: #d8d8d8;
		border: 1px solid #979797
	}
	.of-mobile-buy .bac {
		position: absolute;
		top: 0;
		left: 50%;
		transform: translate(-50%, 0%);
		width: 15.6666666667rem
	}
	.of-mobile-buy p {
		position: absolute;
		left: 0;
		width: 100%;
		top: 22.6666666667rem;
		text-align: center;
		font-size: .8rem;
		font-weight: 600;
		color: #2f3f54;
		line-height: 1.1333333333rem
	}
	.of-mobile-buy .icon-close {
		font-size: 2rem;
		width: 1.4666666667rem;
		height: 1.4666666667rem;
		right: 11.6666666667rem;
		top: 28rem;
		border: 1px solid #fff;
		border-radius: 1.6666666667rem
	}
	.of-mobile-buy .icon-close::before, .of-mobile-buy .icon-close::after {
		content: "";
		position: absolute;
		height: 1.0666666667rem;
		width: 1.5px;
		border-radius: 2px;
		background: #fff;
		top: .1666666667rem;
		right: .7rem
	}
	.of-detial-card {
		width: 100%;
		box-sizing: border-box;
		padding-left: 13.8rem;
		margin-top: 4rem;
		height: 6.6666666667rem
	}
	.of-detial-card .img {
		left: 1.3333333333rem;
		width: 11.3333333333rem;
		height: 6.6666666667rem;
		border-radius: .6666666667rem;
		box-shadow: 0px .6666666667rem 1rem 0px rgba(0, 0, 0, 0.1)
	}
	.of-detial-card img {
		width: 100%;
		height: 100%;
		display: block
	}
	.of-detial-card h3 {
		font-size: .6666666667rem;
		line-height: .9333333333rem;
		margin-bottom: .2666666667rem
	}
	.of-detial-card p {
		font-size: .5333333333rem;
		line-height: .7333333333rem;
		height: 1.4666666667rem;
		overflow: hidden;
		width: 10.3333333333rem;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		margin-bottom: .3333333333rem
	}
	.of-detial-card strong {
		font-size: .8rem;
		line-height: 1.1333333333rem;
		margin-bottom: .4rem
	}
	.of-detial-card a {
		width: 5.3333333333rem;
		display: block;
		height: 1.6666666667rem;
		line-height: 1.6666666667rem;
		box-shadow: 0px 1rem 1.6666666667rem 0px rgba(227, 95, 88, 0.2);
		border-radius: 1.3333333333rem;
		font-size: .6666666667rem;
		margin-top: .8333333333rem
	}
	.of-detial-in {
		padding: 2.3333333333rem 0 1.3333333333rem
	}
	.of-detial-in .bannars {
		padding-top: 1.3333333333rem
	}
	.of-detial-in .bannars img {
		width: 100%
	}
	.of-news {
		padding: 4rem 0 2rem
	}
	.news-list {
		padding-top: 1.6666666667rem;
		margin: 0 auto;
		width: 23rem
	}
	.news-list li {
		width: 23rem;
		padding: .5333333333rem;
		padding-bottom: 0;
		padding-bottom: .6666666667rem;
		box-sizing: border-box;
		margin-bottom: 1.3333333333rem
	}
	.news-list .date {
		line-height: 1.1333333333rem
	}
	.news-list .date strong {
		width: 8.6666666667rem;
		margin-right: .6666666667rem;
		font-size: .8rem
	}
	.news-list .date em {
		width: 12.3333333333rem;
		font-size: .6666666667rem;
		box-sizing: border-box;
		border-bottom: 1px solid rgba(47, 63, 84, 0.3)
	}
	.news-list img {
		position: absolute;
		top: 1.8666666667rem;
		left: .6666666667rem;
		display: block;
		width: 8.6666666667rem;
		height: 6.6666666667rem;
		border-radius: .2666666667rem
	}
	.news-list .in {
		padding-left: 9.3333333333rem;
		height: 6.6666666667rem;
		word-break: break-all
	}
	.news-list .in h4 {
		font-size: .9333333333rem;
		margin: .3333333333rem 0;
		padding: 0;
		width: 12.3333333333rem;
		line-height: 1.3333333333rem;
		height: 2.6666666667rem
	}
	.news-list .in p {
		font-size: .6666666667rem;
		line-height: .9333333333rem;
		max-height: 1.8666666667rem;
		width: 12.3333333333rem;
		-webkit-line-clamp: 2
	}
	.news-list .in span {
		left: auto;
		right: .6666666667rem;
		font-size: .6666666667rem;
		bottom: .3333333333rem
	}
	.of-news-detail {
		padding: 3.8rem 0 2rem
	}
	.of-news-detail .in {
		width: 23rem;
		padding: .6666666667rem;
		box-sizing: border-box
	}
	.of-news-detail h2 {
		font-size: .9333333333rem;
		line-height: 1.3333333333rem
	}
	.of-news-detail .time {
		font-size: .6666666667rem;
		line-height: 1.4666666667rem;
		margin-bottom: .6666666667rem
	}
	.of-news-detail p {
		font-size: .6666666667rem;
		line-height: .9333333333rem;
		margin-bottom: .6666666667rem
	}
	.of-news-detail img {
		display: block;
		width: 18.6666666667rem;
		margin: 0 auto .6666666667rem
	}
	.of-about {
		width: 23rem;
		padding: 3.6666666667rem 0 2.6666666667rem;
		margin: 0 auto
	}
	.of-about img {
		display: block;
		width: 100%;
		box-shadow: 0px 1rem 1.6666666667rem 0px rgba(207, 207, 207, 0.5);
		border-radius: .6666666667rem;
		margin-bottom: 1.3333333333rem
	}
	.of-about .of-title {
		margin-bottom: 1.6666666667rem
	}
	.of-about .text {
		width: 100%;
		padding: 1.3333333333rem;
		font-size: .6666666667rem;
		box-sizing: border-box;
		line-height: .9333333333rem;
		text-indent: 1.3333333333rem;
		margin-bottom: 1.3333333333rem
	}
	.of-about .text p {
		margin-bottom: .6666666667rem
	}
}
/*# sourceMappingURL=styles.css.map */