@charset "utf-8";

:root {
	--red: #ED4014;
	--yellow: #F37B1D;
	--blue: #1890FF;
	--green: #19BE6B;
	--info: #2DB7F5;
}

/* PUBLIC */
.container {
	width: 100%;
	max-width: 1280px;
	min-width: 1280px;
	margin: 0 auto;
}

.home-title {
	font-size: 30px;
	text-align: center;
}

/* HEADER */
.head {
	width: 100%;
	height: 70px;
	background-color: rgba(255, 255, 255, 1);
	box-shadow: rgb(0 0 0 / 10%) 0px 10px 40px;
	position: relative;
	z-index: 100;
}

.head.active {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;

}

.head-box {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.head-box .logo {
	width: auto;
	height: 50px;
	display: inline-block;
}

.head-box .logo img {
	height: 100%;
}

.head-box .nav {
	display: flex;
	align-items: center;
}

.head-box .nav .nav-item {
	color: #333;
	font-size: 16px;
	margin-right: 30px;
	position: relative;
	cursor: pointer;
	display: flex;
	align-items: center;
}

.head-box .nav .nav-item i {
	padding-right: 3px;
}

.head.active .head-box .nav .nav-item i {
	color: var(--blue);
}

.head-box .nav .nav-item:last-child {
	margin-right: 0;
}

/* FOOTER */
.foot {
	height: 120px;
	line-height: 120px;
	position: relative;
	margin-bottom: 110px;
}

.foot span {
	color: #333;
	font-size: 16px;
	text-align: center;
	display: block;
}

/* 轮播 */
.banner {
	width: 100%;
	height: 560px;
	overflow: hidden;
	position: relative;
}

.banner img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

.col {
	width: 100%;
	position: relative;
}

.col-1 .items,
.col-3 .items {
	margin-top: 50px;
}


/* 第一部分 */

.col-1 {
	padding: 70px 0;
	background-color: #fff;
}

.col-1 .items {

	display: flex;
	align-items: center;
	justify-content: space-between;
}

.col-1 .items .item {
	width: 280px;
	height: 200px;
	border-radius: 6px;
	background-color: #f8f8f9;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.col-1 .items .item .icon {
	width: 80px;
	height: 80px;
}

.col-1 .items .item .text {
	margin-top: 20px;
	font-size: 16px;
}


/* 第二部分 */

.col-2 {
	background: url("../images/bg1.png")/*tpa=http://cp.qdtljxly888.com/images/bg1.png*/no-repeat;
}

.col-2 .container {
	height: 180px;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
}

.col-2 .num {
	color: #fff;
	font-size: 26px;
	position: relative;
}

.col-2 .num span {
	font-size: 36px;
	letter-spacing: 3px;
	padding-right: 12px;
	position: relative;
}

.col-2 .num span:after {
	content: '+';
	position: absolute;
	top: 0;
	right: 0;
	font-size: 16px;
}

.col-2 .ui-btn {
	margin-top: 12px;
}

/* 第三部分 */
.col-3 {
	background-color: #fff;
	padding: 50px 0;
}

.col-3 .items {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.col-3 .items .item {
	width: 23%;
	margin: 0 2% 2% 0;
	padding: 30px;
	border-radius: 4px;
	background-color: #fff;
	box-shadow: rgb(60 72 88 / 15%) 0px 0px 3px 0px;
	transition: all 0.5s ease;
	position: relative;
	overflow: hidden;
	text-align: center;
	cursor: pointer;
}

.col-3 .items .item:hover {
	box-shadow: 0 30px 60px 0 rgb(0 0 0 / 20%);
	transform: translateY(-10px);
	background-color: var(--blue);
}

.col-3 .items .item:before {
	content: "";
	width: 80px;
	height: 80px;
	background-color: var(--blue);
	position: absolute;
	top: 34px;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 50%;
	opacity: 0.3;
}

.col-3 .items .item .icon {
	background: #fff;
	border: 1px solid #f3f3f3;
	width: 80px;
	height: 80px;
	line-height: 80px;
	border-radius: 50%;

	margin: 0 auto;
	position: relative;
}

.col-3 .items .item .icon i {
	font-size: 32px;
	color: var(--blue);
}

.col-3 .items .item .name {
	color: #333;
	font-size: 22px;
	margin: 15px 0;
	position: relative;
}

.col-3 .items .item:hover .name {
	color: #fff;
}

.col-3 .items .item .desc {
	color: #8492a6;
	line-height: 24px;
	position: relative;
}

.col-3 .items .item:hover .desc {
	color: rgba(255, 255, 255, .7);
}

/* 第四部分 */
.col-4 {
	background-color: #f5f9ff;
	min-height: 600px;
	position: relative;
	overflow: hidden;
}

.col-4:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #fff;
	border-bottom: 1px solid #fff;
	transform: skew(-86deg);
	transform-origin: bottom;
}

.col-4 .items {
	margin: 30px auto;
	padding: 30px 20px;
	display: flex;
}

.col-4 .items .item:first-child {
	padding-right: 20px;
}

.col-4 .items .item:last-child {
	padding-left: 20px;
}

.col-4 .items .item {
	width: 50%;
}

.col-4 .items .item img {
	max-width: 100%;
	height: 400px;
	margin: 0 auto;
	object-fit: cover;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid rgba(225, 225, 225, .3);
}

.col-4 .items .item .name {
	font-size: 30px;
	margin: 15px 0;
	font-weight: bold;
}

.col-4 .items .item .desc {
	color: #8492a6;
	font-size: 14px;
	line-height: 24px;
}

.col-4 .items .item ul {
	margin: 15px 0 0 0;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.col-4 .items .item ul li {
	width: 48%;
	font-size: 12px;
	line-height: 40px;
	color: #8492a6;
	display: flex;
	align-items: center;
}

.col-4 .items .item ul li i {
	color: var(--green);
	margin-right: 7px;
}

/* 第五部分 */
.col-5 {
	padding: 50px 0;
	background-color: #fff;
}

.col-5 .ui-piclist {
	margin-top: 50px;
}

.col-5 .ui-piclist .ui-piclist-item {
	cursor: pointer;
}

.col-5 .ui-piclist .ui-piclist-image {
	padding-bottom: 100%;
}

.col-5 .ui-piclist .ui-piclist-image img {
	height: 100%;
	object-fit: cover;
}


/* 微信弹窗 */

.wx-modal_mask {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(0 0 0 / 60%);
	z-index: 101;
	display: none;
}

.wx-modal {
	width: 480px;
	height: 456px;
	box-shadow: 0 2px 4px 0 rgb(0 0 0 / 4%);
	border-radius: 4px;
	background-color: #fff;
	display: block;
	overflow: hidden;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.wx-modal_warp {
	padding: 40px 42px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.wx-modal_warp .name {
	color: #666;
	font-size: 22px;
	font-weight: 500;
}

.wx-modal_warp .wx-id {
	color: #999;
	width: 100%;
	padding: 20px 0;
	background-color: #f5f5f5;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 30px 0 15px;
	cursor: pointer;
}

.wx-modal_warp .wx-id span {
	color: #333;
}

.wx-modal_warp .wx-id .wx-num {
	color: var(--red);
}

.wx-modal_warp .gif {
	width: 100%;
}

.wx-modal_warp .gif img {
	width: 100%;
}

.wx-modal_warp .close {
	position: absolute;
	right: 8px;
	top: 8px;
}

.wx-modal_warp .close i {
	color: #333;
	font-size: 18px;
}

/* 侧边栏 */
.sidebar {
	width: 120px;
	box-shadow: 0 2px 12px 0 hsl(0deg 0% 77% / 50%);
	position: fixed;
	bottom: 15%;
	right: 20px;
	z-index: 99;
}

.sidebar .item {
	padding: 15px 0;
	border-bottom: 1px solid #f3f3f3;
	background-color: #fff;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	cursor: pointer;
}

.sidebar .item:hover {
	background-color: var(--blue);
}

.sidebar .item i {
	color: var(--blue);
	font-size: 30px;
}

.sidebar .item span {
	color: #333;
	font-size: 14px;
	margin-top: 5px;
}

.sidebar .item:hover i,
.sidebar .item:hover span {
	color: #fff;
}

.sidebar .item.wechat {
	padding: 0;
	background: url("../img/sidebar_wx_bg.png")/*tpa=http://cp.qdtljxly888.com/img/sidebar_wx_bg.png*/ no-repeat, #fff;
	background-size: cover;
	overflow: hidden;
}

.sidebar .item.wechat .qr {
	width: 100%;
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: 3px;
	padding: 2px;
}


/* tips */

.tips {
	width: 100%;
	max-width: 1655px;
	position: fixed;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 60px;
	z-index: 100;
	height: 130px;
	background-image: url("../images/tip_bg.png")/*tpa=http://cp.qdtljxly888.com/images/tip_bg.png*/;
	background-size: cover;
}

.tips>.container {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.tips .qrcode {
	width: 115px;
	height: 115px;
}

.tips .qrcode img {
	border-radius: 6px;
	border: 1px solid rgba(0, 0, 0, .1);
	width: 100%;
}

.tips .text {
	font-size: 32px;
	color: #fff;
	font-weight: 700;
	text-shadow: 0 2px 0 #d6180e;
}


.tips .ui-btn-default {
	width: 160px;
	height: 48px;
	line-height: 48px;
	text-align: center;
	color: #ff5530;
	font-size: 24px;
	font-weight: 700;
	background: linear-gradient(180deg, #fff, #ffc4c4);
	border-radius: 100px;
	cursor: pointer;
}