﻿/* 导航 */

.nav-wrap {
	background: #fff;
	z-index: 99999;
	width: 100%;
	height: 58px;
	line-height: 58px;
	color: #2b2b2b;
	font-weight: normal;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

body.webapp {
	padding-top: 58px;
}

body.webapp .nav-wrap {
	position: fixed;
	top: 0;
}

.webapp .nav-wrap {
	background: #fff;
}

.nav-wrap .nav-logo {
	width: calc(25% - 150px);
	height: 100%;
	float: left;
	text-align: center;
	font-size: 22px;
}
.nav-wxwork-logo{
	width: 150px;
	height: 100%;
	display: flex;
	align-items: center;
	float: left;
	padding-left: 15px;
	box-sizing: border-box;
}
.nav-wxwork-logo a{
	display: flex;
	align-items: center;
}

.nav-logo img {
	width: 35px;
	margin-right: 6px;
	vertical-align: middle;
}

.nav-logo a {
	color: #2b2b2b;
	display: block;
	position: relative;
	height: 100%;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.nav-wrap .top-menu {
	width: 50%;
	float: left;
	font-size: 14px;
	-webkit-font-smoothing: antialiased;
	font-family: "Microsoft YaHei", "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif;
	text-align: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.menu-one {
	width: 14%;
	height: 58px;
	z-index: 1;
	cursor: pointer;
	z-index: 999999;
}

.menu-one.active>a {
	color: #3091f2;
}

#js-custom-btn,
.check_login {
	cursor: pointer;
}

.menu-one>ul {
	display: none;
	position: absolute;
	left: 0px;
	top: 58px;
	width: 106%;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
}

li.menu-one.check_login:hover {
	color: #3091f2;
}

.menu-one:hover ul,
.menu-one:hover .product-list {
	display: block;
}

.menu-one a:hover {
	color: #3091f2;
}

.serve_ico {
	background-image: url(../../../../../static/pc/index/img/serve_ico2.svg );
	width: 13px;
	height: 17px;
	display: inline-block;
	margin: -9px 7px;
	background-size: 13px;
	background-repeat: no-repeat;
}

.serve:hover span,
.menu-one.active .serve_ico {
	background-image: url(../../../../../static/pc/index/img/serve_ico1.svg );
	width: 13px;
	height: 17px;
	display: inline-block;
	margin: -9px 7px;
	background-size: 13px;
	background-repeat: no-repeat;
}

.menu-one>a {
	display: inline-block;
	width: 100%;
	height: 100%;
	color: #2b2b2b;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.menu-one .menu-two {
	width: 100%;
	height: 46px;
	line-height: 42px;
	background-color: #fff;
}

.menu-one .menu-two:hover {
	background-color: #3091f2;
}

.menu-one .menu-two:hover a {
	color: #fff;
}

li.menu-two.check_login:hover {
	color: #fff;
}

.menu-one .menu-two>a {
	display: inline-block;
	width: 100%;
	height: 100%;
	color: #2b2b2b;
}

.nav-wrap .nav-login {
	width: 25%;
	height: 100%;
	float: right;
	justify-content: center;
	align-items: center;
}

.nav-login .login-span-wrap {
	text-align: center;
}

.nav-login .login-span-wrap span {
	padding: 6px 15px;
	cursor: pointer;
	line-height: 24px;
	border-radius: 2px;
	border: 1px solid #3091f2;
	color: #0391f2;
}

span.nav-lglogin:hover {
	color: #fff;
	background-color: #48a4ff;
}

.login-span-wrap span.nav-reg {
	color: #fff;
	background-color: #3091f2;
}

span.nav-reg:hover {
	background-color: #48a4ff;
}

.nav-lglogin,
.nav-reg {
	margin-right: 8px;
}

.nav-lglogin {
	margin-right: 8px;
}

.nav-center {
	width: 170px;
	height: 100%;
	text-align: center;
	font-size: 14px;
	position: relative;
}

.nav-center span {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	width: 70%;
	vertical-align: middle;
	display: inline-block;
}

.nav-img {
	display: inline-block;
	width: 28px;
	height: 28px;
	margin-right: 10px;
	vertical-align: middle;
}

#change-account-type {
	font-size: 14px;
	cursor: pointer;
}

#change-account-type label {
	margin-right: 10px;
	font-size: 18px;
}

.nav-vip-logo {
	width: 20px;
	margin-left: 6px;
}

/* 导航完 */

/*定制需求发布框*/

.massage {
	width: 30px;
	display: inline-block;
}

.massage a {
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
}

.massage img {
	width: 25px;
	top: 10px;
	position: relative;
	margin-right: 15px;
}

/*-----------SEO --------------*/

.nav-logo-img {
	background-image: url("../images/nav/jisu_nav_logo.svg");
	background-repeat: no-repeat;
	background-size: auto 41px;
	background-position: center right;
	position: relative;
	overflow: hidden;
	cursor: pointer;
}
.nav-logo-img-new {
	background-image: url("../../../consultation_hotline_dialog/jisu-cloud.png");
	background-repeat: no-repeat;
	background-size: auto 41px;
	background-position: center center;
	position: relative;
	overflow: hidden;
	cursor: pointer;
}


.nav-logo-img h1 {
	display: none;
	position: absolute;
}
.nav-logo-img-new h1 {
	display: none;
	position: absolute;
}

.nav-logo .logo-img {
	height: 41px;
	width: initial;
	line-height: 40px;
	font-size: 16px;
}

/*兑换券*/

#voucher {
	background: rgba(0, 0, 0, 0.4);
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
	display: none;
}

#voucher .voucherTitle {
	height: 50px;
	line-height: 50px;
	font-size: 18px;
	color: #848484;
	background: #f2f2f2;
	padding: 0 22px;
}

#voucher img.voucherCancel {
	position: absolute;
	top: 17px;
	right: 20px;
	width: 15px;
	cursor: pointer;
	height: 15px;
}

#voucher .purchaseExchange,
#voucher .enterData {
	width: 426px;
	height: 260px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -213px;
	margin-top: -130px;
	background: #fff;
	border-radius: 4px;
	overflow: hidden;
	color: #616161;
	padding-bottom: 17px;
}

.enterData .enterDataContent {
	padding: 20px 55px 20px 40px;
}

#voucher .specialExchange,
#voucher .isRedeemed {
	padding: 40px 40px 20px 40px;
	width: 350px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -213px;
	margin-top: -56px;
	background: #fff;
	border-radius: 4px;
	display: none;
	color: #616161;
}

.enterData .VoucherCode {
	line-height: 24px;
	width: calc(100% - 102px);
}

.enterData .VerificationCode {
	line-height: 24px;
	width: 100px;
}

.enterData .contentTitle {
	width: 100px;
	display: inline-block;
	text-align: right;
}

.purchaseExchange img {
	width: 70px;
	height: 70px;
}

#voucher .purchaseExchange-content {
	text-align: center;
}

#voucher .purchaseExchange-content>div {
	display: inline-block;
	margin: 40px 34px;
}

.purchase-btn {
	border: 1px solid #3091F2;
	padding: 5px 23px;
	color: #3091F2;
	margin-top: 20px;
	cursor: pointer;
	border-radius: 4px;
}

.sureData,
.sureSubmit,
.sureSpecialExchange {
	padding: 0 20px;
	line-height: 30px;
	color: #fff;
	background: #3091F2;
	border-radius: 4px;
}

.goBack-btn,
.sureData,
.RedeemedCancel,
.sureSubmit,
.sureSpecialExchange {
	display: inline-block;
	margin-left: 30px;
	cursor: pointer;
}

.VerificationImg {
	height: 28px;
	vertical-align: middle;
	float: right;
	width: 90px;
}

.goBack-btn:hover,
.RedeemedCancel:hover {
	color: #3091F2;
}

.sureData:hover,
.sureSubmit:hover,
.sureSpecialExchange:hover {
	background: rgba(48, 145, 242, 0.8)
}

#voucher .specialExchange a {
	text-decoration: underline;
	color: #3091F2;
}

.feng-img {
	position: absolute;
	left: 62%;
	top: 5px;
}

.product-list {
	display: none;
	position: fixed;
	left: calc((100% - 1147px)/2);
	top: 58px;
	right: 0;
	width: 1147px;
	padding-top: 20px;
	padding-bottom: 40px;
	background-color: #fff;
	border: 1px solid #DDE0EA;
}

.product-list>div {
	display: inline-block;
	width: 200px;
	text-align: left;
	vertical-align: top;
	line-height: 20px;
	margin-right: 40px;
}


.product-list li {
	position: relative;
}

.product-list li:hover .nav-title {
	color: #0391f2;
}

.product-title {
	font-size: 16px;
	color: #303445;
	line-height: 30px;
	font-weight: 600;
}
.product-title-new {
	font-size: 16px;
	color: #303445;
	line-height: 30px;
	font-weight: 600;
}

.product-title::after {
	content: '';
	width: 166px;
	height: 1px;
	background-color: #e5e5e5;
	display: block;
	margin-top: 15px;
}
.product-title-new::after {
	content: '';
	width: 200px;
	height: 1px;
	background-color: #e5e5e5;
	display: block;
	margin-top: 15px;
}

.product-title.func-title::after {
	width: 220px;
}

.nav-title {
	font-size: 14px;
	color: #494d5c;
	padding: 15px 0 3px;
	cursor: pointer;
}

.nav-desc {
	font-size: 12px;
	color: #494d5c;
	opacity: 0.5;
	cursor: pointer;
	margin-bottom: 6px;
	display: inline-block;
}

.func-intro li {
	display: inline-block;
	text-align: left;
	width: 100px;
	vertical-align: top;
}

.func-intro li:nth-child(2n+1) {
	margin-right: 20px;
}

.func-intro li div {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.product-list img {
	position: absolute;
	left: -32px;
	top: 18px;
}

/* todo消息列表 */
.row {
	display: flex;
	flex-direction: row;
}

.col {
	display: flex;
	flex-direction: column;
}

.center {
	display: flex;
	justify-content: center;
	align-items: center;
}

.blue {
	color: #0391f2;
}

.hover-bg-grey:hover {
	background-color: #F8F8F8;
}

.menu-message {
	width: 16px;
	height: 16px;
	margin-right: 15px;
}

.menu-message>img {
	width: 16px;
	height: 16px;
	position: relative;
	top: -18px;
}

.menu-message:hover>img {
	animation: bellshake 2s ease-out infinite;
}

.menu-messagebox {
	display: none;
	position: relative;
	right: 191px;
	top: -39px;
	width: 390px;
	z-index: 100000;
	box-shadow: 0px 3px 9px 0px rgba(48, 52, 69, 0.1);
	border-radius: 4px;
	border: 1px solid rgba(232, 232, 232, 1);
	background-color: #fff;
}

.menu-message-arraw {
	position: relative;
	top: -10px;
	right: -191px;
	z-index: -1;
	width: 0;
	height: 0;
	border-width: 0 8px 10px;
	border-style: solid;
	border-color: transparent transparent #eee;
	/*透明 透明  灰*/
	position: relative;
}

.menu-messagenavitem {
	font-size: 14px;
	width: 129px;
	justify-content: center;
	align-items: center;
}

.menu-messagenavitem>span {
	cursor: pointer;
}

.menu-messagenavitem>img {
	width: 15px;
	height: 15px;
	margin-right: 5px;
}

.menu-messagenav-partition {
	color: #e9e9e9;
}

.menu-messagenavitem-dot {
	position: relative;
	top: -8px;
	left: -1px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
}

.reddot {
	background: rgba(233, 57, 61, 1);
}

.menu-messagelist {
	width: 390px;
	align-items: center;
	border-bottom: 1px solid #E8E8E8;
	border-top: 1px solid #E8E8E8;
}

.menu-messagelistitem {
	padding: 15px 0px 15px 30px;
	width: 360px;
	height: 35px;
	justify-content: start;
}

.menu-messagelistitem>img {
	width: 35px;
	height: 35px;
	margin-right: 16px;
}

.menu-messagelistitem-info {
	height: 35px;
	align-items: self-start;
}

.menu-messagelistitem-info>span {
	font-size: 14px;
	line-height: 14px;
	width: 306px;
	text-align: start;
	font-weight: 400;
	color: rgba(48, 52, 69, 1);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.menu-messagelistitem-info>p {
	overflow-y: hidden;
	height: 12px;
	font-size: 12px;
	line-height: 12px;
	font-weight: 400;
	color: rgba(89, 96, 123, 1);
	margin-top: 9px;
	width: 290px;
	text-align: start;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.menu-messagefooter {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 390px;
	height: 49px;
	color: #0391f2;
	font-size: 12px;
	line-height: 12px;
	font-weight: 400;
}

.menu-messagefooter>a {
	width: 390px;
	height: 49px;
	color: #0391f2;
	font-size: 12px;
	line-height: 12px;
	cursor: pointer;
	text-align: center;
	line-height: 49px;
	font-weight: 400;
}

.notice-img-reddot {
	width: 16px;
	height: 16px;
	background: rgba(233, 57, 61, 1);
	border-radius: 50%;
	justify-content: center;
	position: relative;
	right: -6px;
	font-size: 12px;
	top: -68px;
	align-items: center;
	color: #fff;
}

.menu-messagelist-nomore {
	margin: 34px 0px 31px;
	width: 80px;
	height: 85px;
	align-items: center;
}

.menu-messagelist-nomore>span {
	font-size: 12px;
	color: rgba(159, 165, 187, 1);
	line-height: 22px;
}

.menu-messagelist-nomore>img {
	width: 80px;
	height: 64px;
}

.message-dialogbox {
	position: fixed;
	display: none;
	background-color: rgba(0, 0, 0, 0.4);
	z-index: 999;
	width: 100%;
	height: 100%;
	top: 0px;
}

.message-dialogbox-mid {}

.message-dialogbox>div {
	width: auto;
	position: relative;
	height: auto;
	border-radius: 2px;
}

.message-dialogbox>div>a {
	width: auto;
	display: block;
	height: auto;
	position: relative;
	border-radius: 2px;
}

.message-dialogbox>div>a>img:not(.message-dialogbox-close) {
	border-radius: 2px;
	min-width: 100px;
	min-height: 100px;
	display: block;
}

.message-dialogbox>div:last-child {
	position: fixed;
	right: 0;
	bottom: 0;
}

.message-dialogbox>div .message-dialogbox-close {
	position: absolute;
	right: 7px;
	top: 7px;
	width: 19px;
	z-index: 1;
	height: 17px;
	cursor: pointer;
}

/*
 *  This animation shake a bell.
 *  The percents are separated to add a "delay" between cycles
 *
 *  name: bell-shake
 */

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

	3.75% {
		-webkit-transform: rotate(25deg);
		transform: rotate(25deg)
	}

	15% {
		-webkit-transform: rotate(-25deg);
		transform: rotate(-25deg)
	}

	22.5% {
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg)
	}

	29% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}

	35% {
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg)
	}

	43% {
		-webkit-transform: rotate(-2deg);
		transform: rotate(-2deg)
	}

	50%,
	100% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
}

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

	3.75% {
		-webkit-transform: rotate(25deg);
		transform: rotate(25deg)
	}

	15% {
		-webkit-transform: rotate(-25deg);
		transform: rotate(-25deg)
	}

	22.5% {
		-webkit-transform: rotate(15deg);
		transform: rotate(15deg)
	}

	29% {
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg)
	}

	35% {
		-webkit-transform: rotate(5deg);
		transform: rotate(5deg)
	}

	43% {
		-webkit-transform: rotate(-2deg);
		transform: rotate(-2deg)
	}

	50%,
	100% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg)
	}
}

/* todo消息列表 end*/
