@charset "utf-8";
.banner{
	background-color: #222233;
	position: relative;
	transition: all 1s;
	-webkit-transition: all 1s;
}
.banner-box{
	width: 100%;
	max-width: 1920px;
	margin: auto;
}
.banner-content{
	width: 100%;
	padding: 18.2225% 0;
	position: relative;
	overflow: hidden;
}
.banner-content-opens{
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 5;
	transition: all 1s;
	-webkit-transition: all 1s;
	display: flex;
}
.banner-change-left{
	width: 80px;
	height: 80px;
	position: absolute;
	left: 60px;
	top: 50%;
	z-index: 10;
	margin-top: -40px;
	background: url("../img/banner-btn-left.svg") no-repeat;
	background-size: 100% 100%;
	background-position: 0 0;
	opacity: 0;
	transition: all 0.6s;
	-webkit-transition: all 0.6s;
	cursor: pointer
}
.banner-change-right{
	width: 80px;
	height: 80px;
	position: absolute;
	right: 60px;
	top: 50%;
	z-index: 10;
	margin-top: -40px;
	background: url("../img/banner-btn-right.svg") no-repeat;
	background-size: 100% 100%;
	background-position: 0 0;
	opacity: 0;
	transition: all 0.6s;
	-webkit-transition: all 0.6s;
	cursor: pointer
}
.banner:hover .banner-change-left, .banner:hover .banner-change-right{
	opacity: 1
}
.banner-bottomline{
	width:100%;
	height: 8px;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 10;
	background-color: rgba(255,255,255,0.4);
	transition: all 1s;
	-webkit-transition: all 1s;
	transition-timing-function:ease-in;
	-webkit-transition-timing-function:ease-in;
}
.banner-content-item{
	height: 100%;
	flex-shrink:0;
	position: relative;
	cursor: pointer
}
.banner-content-item img{
	width: 100%;
	height: 100%;
}
.introduce{
	width: 100%;
	text-align: center;
}
.introduce-title{
	display: inline-block;
	padding:1.6% 2.5% 2.2% 2.5%;
	margin:auto;
	margin-top:80px;
	font-size:48rem;
	text-align:center;
	line-height:1;
	position:relative;
	color: #0089e2;
}
.introduce-title-topline{
	height: 85%;
	width: 97%;
	border: 2px solid #19c58c;
	border-radius: 5px;
	transform:skewX(-23.962deg);
	position:absolute;
	left:0;
	top:0;
	z-index:2;
}
.introduce-title-bottomline{
	height: 85%;
	width: 97%;
	border: 2px solid #19c58c;
	border-radius: 5px;
	transform:skewX(-23.962deg);
	position:absolute;
	right:0;
	bottom:0;
	z-index:2;
}
.introduce-describe{
	width: 100%;
	font-size: 18rem;
	line-height: 1.6;
	text-align: center;
	margin-top: 50px;
	color: #999;
}
.video{
	width: 60%;
	padding: 16.875% 0;
	margin: auto;
	position: relative;
	box-sizing: border-box;
	margin-top: 60px
}
.video-loading{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	background-color: #dddde3;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 1;
	color: #999;
	font-size: 16rem;
}
.video-pic{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	background-position: center center;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	cursor: pointer
}
.video-player-box{
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 4000;
	display: none;
}
.video-player{
	width: 100%;
	height: 100%;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center
}
.video-player-bg{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: rgba(255,255,255,0.8);
}
.video-player-window{
	width: 60%;
	padding: 16.875% 0;
	box-sizing: border-box;
	position: relative;
	background-color: #000;
}
.video-player-window-close{
	margin-top: 13px;
	padding: 7px 9px;
	text-align: center;
	background-color: #0089e2;
	display: inline-block;
	line-height: 1;
	border-radius: 0.2em;
	cursor: pointer;
	position: absolute;
	right: 0;
	top: -50px;
	color: #fff;
	font-size: 16rem;
}
.video-player-window video{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	border: none;
	object-fit: fill;
}
.values{
	width: 100%;
	margin-top:60px;
	padding: 4% 0;
	position: relative
}
.values-info{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	justify-content: space-between;
}
.values-info::before, .values-info::after{
	content: '';
    display: block;
}
.values-info-part{
	width: 8%;
	height: 100%;
	background-color: #19c58c;
	display: flex;
	align-items: center;
	line-height: 1;
	justify-content: center;
	color: #fff;
	flex-shrink: 0;
	font-size: 22rem;
	transition: all 0.5s;
	border-radius: 50%;
}
.values-info-ours{
	background-color: #0089e2;
}
.values-info-part:hover{
	background-color: #19c58c;
}
.values-info-relation{
	height: 100%;
	display: flex;
	align-items: center;
	line-height: 1;
	justify-content: center;
	color: #000000;
	flex-shrink: 0;
	font-size: 18rem;
}
.values-info-relation span{
	color: #19c58c;
	font-weight: bold
}
.culture{
	width: 100%;
	margin-top:80px;
	padding: 15% 0;
	position: relative;
	background: url("../img/describe.jpg") no-repeat;
	background-size: 50% 100%;
	background-position: 100% center;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
}
.culture:hover{
	background-position: 101% center;
	background-size: 51% 102%;
}
.culture-info{
	width: 50%;
	height: 100%;
	position: absolute;
	background-color: #0089e2;
	top: 0;
	left: 0;
	z-index: 2;
	font-size: 28rem;
	padding: 4% 0%;
	box-sizing: border-box;
	color: #fff;
	display: flex;
	justify-content: center;
}
.culture-info-box{
	height: 100%;
	line-height: 1;
	display: flex;
	justify-content: space-around;
	flex-direction: column;
	letter-spacing: 3px;
}
.culture-info-item{
	width: 100%;
	position: relative;
	padding: 10px;
	padding-bottom: 16px;
	box-sizing: border-box;
}
.culture-info-item-line-left{
	width: 3px;
	height: 12px;
	top: 0;
	position: absolute;
	left: 0;
	background-color: #19c58c
}
.culture-info-item-line-top{
	width: 12px;
	height: 3px;
	top: 0;
	position: absolute;
	left: 0;
	background-color: #19c58c
}
.grew{
	width: 100%;
	margin-top:60px;
	padding: 8% 0;
	position: relative;
}
.grew-tabline{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0%;
	bottom: 0;
	display: flex;
	justify-content:space-between;
}
.grew-tabline::before, .grew-tabline::after{
	content: '';
    display: block;
}
.grew-tabline-item{
	width: 16%;
	height: 100%;
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
	display: flex;
	flex-direction: column-reverse;
	cursor: pointer
}
.grew-tabline-item-year{
	width: 100%;
	background-color: #19c58c;
	color: #fff;
	font-size: 18rem;
	line-height: 1;
	padding: 10px 0;
	text-align: center;
	box-sizing: border-box;
}
.grew-tabline-item-detail{
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	position: relative;
	background-color: #0089e2;
	display: flex;
	align-items:center;
	justify-content: center;
	color: #fff;
	font-size: 24rem;
	text-align: center;
	flex-grow: 1
}
.guide{
	width: 100%;
	margin-top:60px;
	padding: 9% 0;
	position: relative
}
.guide-info{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	justify-content: space-between;
}
.guide-info-item{
	width: 30%;
	height: 100%;
	position: relative
}
.guide-info-item-bg{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	background-color: #24273d;
	background-position: center center;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	transition: all 0.5s;
}
.guide-info-item:hover .guide-info-item-bg{
	background-size: 110% 110%;
}
.guide-info-item-title{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index:2;
	display: flex;
	align-items: center;
	line-height: 1;
	justify-content: center;
	color: #fff;
	flex-shrink: 0;
	font-size: 28rem;
	transition: all 0.5s;
	cursor: pointer
}
.guide-info-item:hover .guide-info-item-title{
	background-color: rgba(36,39,61,0.65)
}
.hr{
	width: 100%;
	margin: 70px 0;
	text-align: center
}
.hrmail{
	width: 100%;
	padding: 3% 0;
	line-height: 1;
	font-size: 26rem;
	color: #fff;
	background-color: #0089e2;
	border-bottom: solid #19c58c 3px;
	margin-top:80px;
	text-align: center;
}
.work{
	width: 100%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	background-color: #0089e2
}
.work-item{
	width: 33.3333%;
	padding: 10% 0;
	position: relative;
	flex-shrink: 0;
}
.work:hover{
	cursor: pointer
}
.work-item-info-title{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	font-size: 28rem;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #19c58c;
	line-height: 1;
	transition:all 0.25s ease-out;
	color: #fff;
	text-decoration: underline
}
.work:hover .work-item-info-title{
	color: rgba(255,255,255,0.6)
}
.work-item:hover .work-item-info-title{
	height: 25%;
	color: #fff !important;
	text-decoration: none;
	background-color: #0089e2
}
.work-item-info-detail{
	width: 99%;
	height: 68%;
	position: absolute;
	left: 0;
	top: 25%;
	padding: 0 3% 0% 4%;
	box-sizing: border-box;
	text-align: justify;
	font-size: 14rem;
	overflow-x: hidden;
	overflow-y: auto;
	color: #fff;
	transition:all 0.25s ease-out;
	line-height: 1.4;
}
.work-item-info-detail::-webkit-scrollbar{
	width: 1.5%;
	background-color: rgba(255,255,255,0.2);
	border-radius: 999px;
}
.work-item-info-detail::-webkit-scrollbar-thumb{
	background-color: #aaa;
	border-radius: 999px;
}
.work-notice{
	width: 100%;
	box-sizing: border-box;
	padding: 0 5%;
	padding-top: 3%;
	text-align: justify;
	color: #0089e2;
	font-size: 18rem;
	line-height: 1.5
}
.connectbanner{
	width: 100%;
	padding: 7.5% 0;
	margin-top:80px;
	position: relative;
	background-color: #0089e2
}
.connectbanner-name{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 48rem;
}
.connect{
	width: 100%;
	margin-top:80px;
	display: flex;
	background-color: #fff
}
.connect-info{
	width: 50%;
	padding: 5% 0;
	padding-left: 2%;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-around
}
.connect-info-item{
	width: 100%;
	font-size: 24rem;
}
.connect-map{
	width: 50%;
	padding: 16.25% 0;
	background: url("../img/map.jpg") no-repeat;
	background-size: 100% 100%;
	background-position: center;
}
.maillist{
	width: 100%;
	margin: 70px 0;
	display: flex;
	justify-content: space-between;
}
.maillist-item{
	width: 25%;
	padding: 7% 0;
	position: relative;
	background-color: #fff;
}
.maillist-item-info{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	box-sizing: border-box;
	border-left: solid #19c58c 4px;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	padding: 10% 0;
	cursor: pointer;
}
.maillist-item-info-name{
	width: 100%;
	font-size: 24rem;
	text-align: center;
	line-height: 1;
	font-weight: bold;
	color: #0089e2
}
.maillist-item-info-add{
	width: 100%;
	font-size: 22rem;
	text-align: center;
	line-height: 1
}
.article{
	width: 100%;
	margin: 70px 0;
	display: flex;
	justify-content:space-between;
	align-items: flex-start
}
.article-nav{
	width: 200px;
	border-top: solid 3px #19c58c;
	color: #fff;
	background-color: #0089e2
}
.article-nav-name{
	width: 100%;
	padding: 13px 0;
	line-height: 1;
	box-sizing: border-box;
	font-size: 18rem;
	text-align: center;
	letter-spacing: 2px
}
.article-nav-item{
	width: 100%;
	padding: 12px 20px;
	padding-right: 0;
	line-height: 1;
	box-sizing: border-box;
	cursor: pointer;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden
}
.article-nav-item:hover, .article-nav-item-active{
	background-color: #19c58c
}
.article-content, .article-list{
	width: 1px;
	min-height: 1000px;
	margin: 0 40px;
	flex-grow: 1;
	position: relative;
	box-sizing: border-box
}
.article-list{
	padding-bottom: 50px;
}
.article-list-pages{
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: center;
	color: #fff;
	font-size: 18rem;
}
.article-list-pages div{
	display: inline-block
}
.article-list-pages b{
	color: #999;
}
.article-list-pages .disable{
	background-color: #ababab !important;
	cursor: default !important
}
.article-list-pages-other {
	line-height: 1;
	padding: 6px 10px;
	background: #FFF;
	margin: 0 12px;
	box-sizing: border-box;
	background-color: #0089e2;
	cursor: pointer
}
.article-list-pages-now, .article-list-pages-other:hover {
	line-height: 1;
	padding: 6px 10px;
	margin: 0 12px;
	box-sizing: border-box;
	background-color: #19c58c;
}
.article-list-item{
	width: 100%;
	background-color: #fff;
	padding: 3%;
	padding-bottom: 2%;
	box-sizing: border-box;
	border-bottom: solid 1px #eee;
	cursor: pointer;
	position: relative
}
.article-list-item-leftline{
	display: none;
}
.article-list-item:hover .article-list-item-leftline{
	display: block;
	width: 4px;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: #19c58c;
}
.article-list-item-pic{
	height: 70%;
	width: 18%;
	position: absolute;
	right: 3%;
	top: 15%
}
.article-list-item-pic img{
	width: 100%;
	height: 100%;
	display: block
}
.article-list-empty{
	display: none;
	width: 100%;
	background-color: #fff;
	padding: 6%;
	box-sizing: border-box;
	color: #999;
	line-height: 1;
	text-align: center
}
.article-list-item-title{
	width: 78%;
	font-size: 28rem;
	line-height: 1;
	padding-bottom: 1%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.article-list-item-description{
	width: 78%;
	color: #999;
	height: 50px;
	overflow: hidden;
	line-height: 1.5;
}
.article-list-item:hover .article-list-item-title{
	color: #0089e2
}
.article-list-item:hover .article-list-item-description{
	color: #24263d
}
.article-list-item-moreinfo{
	width: 100%;
	line-height: 1;
	padding-top: 1%;
}
.article-content{
	background-color: #fff;
	padding: 3%;
	position: relative
}
.article-content-title{
	font-size: 38rem;
	line-height: 1;
	padding-bottom: 3%;
	text-align: center;
}
.article-content-info{
	font-size: 16rem;
	line-height: 1;
	color: #999;
	text-align: center;
	padding-bottom: 2%
}
.article-content-text{
	font-size: 18rem;
	letter-spacing: 1px;
	line-height: 1.5;
	text-align: justify
}
.article-content-text img{
	max-width: 60%;
	max-height: 600px;
	margin: auto
}
.article-content-text error{
	color: #f53840;
	text-align: center;
	font-weight: bold;
	width: 100%;
	display: block
}
.article-content-text loading{
	color: #ccc;
	text-align: center;
	font-weight: bold;
	width: 100%;
	display: block
}
.product{
	width: 100%;
	margin: 30px 0;
}
.product-title{
	width: 100%;
	padding: 3% 0;
	line-height: 1;
	font-size: 32rem;
	color: #fff;
	background-color: #0089e2;
	border-bottom: solid #19c58c 3px;
	margin-top:80px;
	text-align: center;
}
.product-info{
	width: 100%;
	margin: 30px 0;
	display: flex;
	justify-content:space-between;
	align-items: flex-start;
}
.product-info-logo{
	width: 350px;
}
.product-info-logo-img{
	width: 280px;
	padding: 50px 0;
	box-sizing: border-box;
	position: relative;
	background-color: #fff;
	margin: auto;
	margin-top: 60px;
}
.product-info-logo-img img{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0
}
.product-info-logo-link{
	width: 100%;
	margin-top: 30px;
	text-align: center
}
.product-info-logo-link span{
	margin-top: 13px;
	padding: 7px 9px;
	text-align: center;
	background-color: #0089e2;

	
	line-height: 1;
	border-radius: 0.2em;
	cursor: pointer;
	color: #fff;
	font-size: 16rem;
}

.product-info-content{
	background-color: #fff;
	padding: 3%;
	position: relative;
	min-height: 1000px;
	font-size: 22rem;
	letter-spacing: 1px;
	line-height: 1.5;
	text-align: justify;
	flex-grow: 1;
	color: #999
}
.product-info-content img{
	max-width: 60%;
	max-height: 600px;
	margin: auto
}

/*响应式*/
@media screen and (max-width: 1200px){
	.banner-change-left{
		width: 8%;
		height: 0;
		padding: 4% 0;
		left: 3%;
		top: 50%;
		margin-top: -4%;
		background-size: 100% 100%;
		background-position: left top;
		opacity: 1;
		transition: none;
		-webkit-transition: none;
	}
	.banner-change-right{
		width: 8%;
		height: 0;
		padding: 4% 0;
		right: 3%;
		top: 50%;
		margin-top: -4%;
		background-size: 100% 100%;
		background-position: left top;
		opacity: 1;
		transition: none;
		-webkit-transition: none;
	}
	.banner-bottomline{
		padding: 0.5% 0;
		height: 0px;
	}
	.introduce-title{
		padding:2.4% 3.5% 2.8% 3.5%;
		margin-top:6%;
		font-size:24rem;
	}
	.introduce-title-topline{
		height: 85%;
		width: 97%;
		border: 1px solid #19c58c;
		border-radius: 5px;
	}
	.introduce-title-bottomline{
		height: 85%;
		width: 97%;
		border: 1px solid #19c58c;
		border-radius: 5px;
	}
	.introduce-describe{
		width: 90%;
		font-size: 12rem;
		line-height: 1.6;
		margin: auto;
		margin-top: 6%;
	}
	.video{
		width: 90%;
		padding: 25.3125% 0;
		margin-top: 6%;
	}
	.video-player-window{
		width: 100%;
		padding: 28.125% 0;
	}
	.video-player-window-close{
		top: -50px;
		font-size: 12rem;
		right: 3%;
	}
	.values{
		width: 90%;
		margin: auto;
		margin-top: 6%;
		padding: 5.85% 0;
	}
	.values-info::before, .values-info::after{
		display: none;
	}
	.values-info-part{
		width: 13%;
		font-size: 15rem;
	}
	.values-info-relation{
		height: 100%;
		display: flex;
		align-items: center;
		line-height: 1;
		justify-content: center;
		color: #000000;
		flex-shrink: 0;
		font-size: 12rem;
	}
	.values-info-relation span{
		font-size: 12rem;
	}
	.culture{
		margin-top: 6%;
		padding: 17% 0;
		background: url("../img/describe.jpg") no-repeat;
		background-size: 100% auto;
		background-position: center;
	}
	.culture:hover{
		background-size: 104% auto;
		background-position: center;
	}
	.culture-info{
		width: 100%;
		align-items: center;
		font-size: 14rem;
		line-height: 1.2;
		background-color: rgba(0,137,226,0.8);
		transition: all 0.5s;
		-webkit-transition: all 0.5s;
	}
	.culture-info-item{
		padding: 7px;
		padding-right: 0
	}
	.culture-info-item-line-left{
		width: 2px;
	}
	.culture-info-item-line-top{
		height: 2px;
	}
	.culture-info-item b{
		width: 100%;
		font-size: 14rem;
	}
	.grew{
		margin-top: 6%;
		padding: 15% 0;
		background-position: center;
	}
	.grew-textbg{
		font-size: 20rem;
	}
	.grew-tabline-item{
		width: 25%;
		padding-bottom: 0;
	}
	.grew-tabline-item-year{
		font-size: 14rem;
		padding: 7px 0;
	}
	.grew-tabline-item-detail{
		font-size: 13rem;
	}
	.guide{
		width: 94%;
		margin: auto;
		margin-top:6%;
		padding: 8.1% 0;
	}
	.guide-info-item{
		width: 30%;
	}
	.guide-info-item-title{
		font-size: 16rem;
	}
	.hrmail{
		width: 90%;
		margin: auto;
		font-size: 18rem;
		margin-top: 6%;
	}
	.work{
		width: 90%;
		margin: auto;
		display: block;
	}
	.work-item{
		width: 100%;
		padding: 30% 0;
	}
	.work-item-info-title{
		font-size: 24rem;
		color: #fff !important
	}
	.work:hover .work-item-info-title{
		color: #fff !important
	}
	.work-notice{
		padding: 5%;
		font-size: 15rem;
		line-height: 1.3
	}
	.connectbanner{
		width: 90%;
		padding: 10% 0;
		background-size: auto 100%;
		margin: auto;
		margin-top: 6%;
	}
	.connectbanner-name{
		font-size: 22rem;
	}
	.connect{
		width: 90%;
		margin: auto;
		margin-top: 6%;
		display: block;
	}
	.connect-info{
		width: 100%;
		padding: 4% 0;
		padding-left: 3%;
	}
	.connect-info-item{
		font-size: 14rem;
		padding: 1.5% 0;
	}
	.connect-map{
		width: 100%;
		padding: 32.5% 0;
	}
	.maillist{
		width: 90%;
		margin: 6% auto;
		margin-bottom: 0;
		display: block;
	}
	.maillist-item{
		width: 100%;
		padding: 8% 0;
		margin-bottom: 6.6666%;
	}
	.maillist-item-info{
		padding: 0;
		flex-direction: row
	}
	.maillist-item-info-name{
		width: 45%;
		font-size: 16rem;
		line-height: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0
	}
	.maillist-item-info-add{
		font-size: 18rem;
		line-height: 1;
		display: flex;
		align-items: center;
		justify-content: center
	}
	.article{
		width: 100%;
		margin: 0;
		padding-top: 6%;
		display: block;
	}
	.article-nav{
		width: 90%;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
	}
	.article-nav-name{
		padding: 3% 0;
		font-size: 16rem;
		flex-shrink: 0;
	}
	.article-nav-item{
		width: 33.333333%;
		padding: 2.5% 1%;
		font-size: 14rem;
		text-align: center;
		flex-shrink: 0;
		}
	.article-content, .article-list{
		width: 90%;
		min-height: 400px;
		margin: 6% auto;
	}
	.article-list{
		padding-bottom: 10%;
	}
	.article-list-pages{
		font-size: 14rem;
		bottom: 0;
	}
	.article-list-pages-other {
		padding: 1.3% 1.7%;
		margin: 0 2%;
	}
	.article-list-pages-now, .article-list-pages-other:hover {
		padding: 1.3% 1.7%;
		margin: 0 2%;
	}
	.article-list-item{
		padding: 3%;
		padding-bottom: 2%;
	}
	.article-list-item:hover .article-list-item-leftline{
		width: 3px
	}
	.article-list-item-pic{
		height: 60%;
		width: 22%;
		position: absolute;
		right: 3%;
		top: 20%
	}
	.article-list-empty{
		padding: 8%;
	}
	.article-list-item-title{
		width: 74%;
		font-size: 18rem;
		padding-bottom: 1.5%
	}
	.article-list-item-description{
		width: 74%;
		font-size: 14rem;
		height: 30px;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	.article-list-item-moreinfo{
		font-size: 14rem;
	}
	.article-content{
		padding: 6% 3%;
	}
	.article-content-title{
		font-size: 22rem;
	}
	.article-content-info{
		font-size: 13rem;
		padding-bottom: 7%
	}
	.article-content-text{
		font-size: 14rem;
		letter-spacing: 0;
		line-height: 1.3;
	}
	.article-content-text img{
		max-width: 90%;
	}
	.product{
		width: 90%;
		margin: auto;
	}
	.product-title{
		padding: 3% 0;
		font-size: 22rem;
		margin-top:6%;
	}
	.product-info{
		margin: 0;
		justify-content:space-between;
		align-items: center;
		flex-direction: column
	}
	.product-info-logo{
		width: 70%;
		margin-top: 6%;
	}
	.product-info-logo-img{
		width: 100%;
		padding: 17.85% 0;
		margin-top: 0;
	}
	.product-info-logo-link{
		width: 100%;
		margin-top: 6%;
		text-align: center
	}
	.product-info-logo-link span{
		margin-top: 13px;
		padding: 7px 9px;
		text-align: center;
		background-color: #0089e2;


		line-height: 1;
		border-radius: 0.2em;
		cursor: pointer;
		color: #fff;
		font-size: 16rem;
		display: inline-block;
	}

	.product-info-content{
		padding: 6% 3%;
		padding-top: 0;
		min-height: 400px;
		font-size: 18rem;
		margin-top: 6%
	}

}