@charset "UTF-8";


.ny-banner {
	width:100%;
	height:540px;
	position:relative;
	transition:all ease .5s;
}
.ny-banner.production2 {
	height:800px;
}
.ny-banner .img {
	width:100%;
	height:100%;
	position:absolute;
	overflow:hidden;
	left:0;
	top:0;
}
.ny-banner .img img {
	max-width:initial;
	width:auto;
	height:100%;
	position:absolute;
	top:0;
	left:50%;
	transform:translateX(-50%);
}
@media(min-width:1921px) {
    .ny-banner .img img {
        max-width:none;
        width:100%;
    }
}
.ny-banner .boxs {
	position:relative;
	max-width:1600px;
	height:100%;
	z-index:2;
	margin:auto;
	color:#fff;
}
.ny-banner .boxs.n1 {
	padding-top:140px;
	letter-spacing:2px;
	transition:all ease .5s;
}
.ny-banner .boxs.n1 .t1 {
	font-size:48px;
	font-weight:bold;
	line-height:72px;
}
.ny-banner .boxs.n1 .t2 {
	font-size:22px;
	line-height:44px;
}
.ny-banner .boxs.n1 .t3 {
	width:52px;
	height:52px;
	border-radius:50%;
	border:1px solid #fff;
	position:relative;
	margin-top:59px;
}
.ny-banner .boxs.n1 .t3 span {
	position: absolute;
    display: block;
    width: 52px;
    height: 52px;
    margin: 0 auto;
    background: url(../images/icon2.png) no-repeat center center;
    cursor: pointer;
    animation: downico 1.5s ease-out infinite;
}

.production {
	width:100%;
}
.design {
	width:100%;
	padding-top:60px;
}
.design .title {
	font-size:36px;
	line-height:1;
	font-weight:bold;
	color:#fff;
	text-align:center;
	color:#222;
}
.design .txt {
	font-size:14px;
	line-height:24px;
	color:#222;
	text-align:center;
	max-width:950px;
	margin:23px auto 0;
}
.design .list {
	width:100%;
	display:table;
	margin-top:52px;
}
.design .list li {
	width:calc(20% - 2px);
	float:left;
	position:relative;
	margin:2px 1px 0;
}
.design .list li a {
	display:block;
}
.design .list li .img {
	width:100%;
	overflow:hidden;
}
.design .list li .img img {
	width:100%;
	transition:all ease .8s;
}
.design .list li .tbox {
	width:100%;
	position:absolute;
	z-index:2;
	left:0;
	bottom:0;
	height:120px;
	background:rgba(26,137,172,.7);
	text-align:center;
	padding:13px 0;
	transition:all ease .5s;
	overflow:hidden;
}
.design .list li .tbox .icon {
	width:54px;
	height:54px;
	display:inline-block;
	margin-right:10px;
}
.design .list li .tbox .icon img {
	display:inline-block;
	margin:auto;
}
.design .list li .tbox .t1 {
	font-size:18px;
	line-height:24px;
	height:24px;
	color:#fff;
	font-weight:bold;
	display:inline-block;
}
.design .list li .tbox .t2 {
	font-size:14px;
	line-height:24px;
	color:#fff;
	text-align:center;
	padding:0 15%;
	display:none;
	animation: fadeInRight .6s ease-out;
	-webkit-animation: fadeInRight .6s ease-out;
}
.design .list li:hover .img img {
	transform:scale(1.1);
}
.design .list li:hover .tbox {
	width:100%;
	position:absolute;
	z-index:2;
	left:0;
	bottom:0;
	height:210px;
	background:rgba(26,137,172,.7);
	text-align:center;
	padding:20px 0;
}
.design .list li:hover .tbox .icon {
	width:100%;
	height:54px;
	margin-right:0;
	margin-bottom:18px;
	display:block;
}
.design .list li:hover .tbox .t1 {
	font-size:18px;
	line-height:24px;
	height:24px;
	color:#fff;
	font-weight:bold;
	margin-bottom:12px;
	display:block;
	animation: fadeInLeft .5s ease-out;
	-webkit-animation:fadeInLeft .5s ease-out;
}
.design .list li:hover .tbox .t2 {
	font-size:14px;
	line-height:24px;
	color:#fff;
	text-align:center;
	padding:0 15%;
	display:block;
}

.process {
	width:100%;
	background:#f2f2f2;
	padding:80px 7.8%;
}
.process .title {
	font-size:36px;
	font-weight:bold;
	color:#222;
	text-align:center;
	line-height:1;
}
.process .txt {
	font-size:14px;
	line-height:24px;
	color:#222;
	text-align:center;
	margin-top:23px;
}
.process .list {
	width:100%;
	margin:82px auto 0;
	display:table;
}
.process .list li {
	width:24%;
	height:250px;
	float:left;
	margin-right:-1px;
	border:1px solid #d8d8d8;
	text-align:center;
	position:relative;
	padding-top:50px;
	cursor:pointer;
	transition:all ease .5s;
	background:#fff;
}
.process .list li:hover {
	
	padding-top:92px;
}
.process .list li.on {
	width:27.5%;
	padding-top:92px;
}
.process .list li .num {
	width:52px;
	height:52px;
	background:#21abd7;
	line-height:52px;
	position:absolute;
	top:-23px;
	left:50%;
	transform:translateX(-50%);
	border-radius:50%;
	font-size:24px;
	color:#fff;
	font-style:oblique;
	text-align:left;
	padding-left:8px;
}
.process .list li .num:before {
	width:66px;
	height:66px;
	background:rgba(33,171,215,.1);
	content:"";
	position:absolute;
	left:-7px;
	top:-7px;
	border-radius:50%;
}
.process .list li .num:after {
	width:80px;
	height:80px;
	background:rgba(33,171,215,.05);
	content:"";
	position:absolute;
	left:-14px;
	top:-14px;
	border-radius:50%;
}
.process .list li .icon {
	width:60px;
	height:60px;
	margin:auto;
	position:relative;
}
.process .list li .icon img {
	width:60px;
	height:60px;
	position:absolute;
	left:0;
	top:0;
}
.process .list li .icon img:last-child {
	opacity:0;
	z-index:2;
	transition:all ease .5s;
}
.process .list li:hover .icon img:last-child {
	opacity:1;
}
.process .list li.on .icon img:last-child {
	opacity:1;
}
.process .list li .t1 {
	font-size:18px;
	line-height:24px;
	font-weight:bold;
	color:#222;
	margin-top:36px;
	transition:all ease .5s;
}
.process .list li:hover .t1 {
	color:#21abd7;
}
.process .list li.on .t1 {
	color:#21abd7;
}
.process .list li .t2 {
	font-size:14px;
	line-height:24px;
	color:#222;
	margin:20px auto;
	display:none;
	padding:0 13%;
}
.process .list li:hover .t2 {
	display:block;
	animation: fadeInUp .5s ease-out;
}
.process .list li.on .t2 {
	display:block;
}

.relevant-information {
	width:100%;
	padding:80px 7.8% 43px;
}
.relevant-information .title {
	font-size:36px;
	font-weight:bold;
	color:#222;
	text-align:center;
	line-height:1;
}
.relevant-information .txt {
	font-size:14px;
	line-height:24px;
	color:#222;
	text-align:center;
	margin-top:22px;
}
.relevant-information .list {
	max-width:1600px;
	margin:45px auto 0;
	display:table;
}
.relevant-information .list li {
	float:left;
	width:23.75%;
	height:150px;
	border:1px solid #d8d8d8;
	margin-right:1.6%;
	margin-bottom:27px;
	box-sizing:border-box;
	padding:20px 40px 0 30px;
	transition:all ease .3s;
}
.relevant-information .list li:hover {
	border:1px solid #21abd7;
}
.relevant-information .list li:nth-child(4n) {
	margin-right:0;
}
.relevant-information .list li a {
	display:block;
}
.relevant-information .list li .t1 {
	font-size:16px;
	line-height:30px;
	height:60px;
	color:#222;
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.relevant-information .list li .t2 {
	font-size:12px;
	line-height:24px;
	color:#999;
	margin-top:18px;
}

.column {
	width:100%;
	padding:54px 7.8% 0;
}
.column .txt {
	font-size:14px;
	line-height:24px;
	color:#222;
}
.column .list {
	width:100%;
	display:table;
	margin-top:75px;
}
.column .list li {
	width:21.875%;
	height:215px;
	margin-right:4.125%;
	float:left;
	padding:0 10px;
	border-bottom:2px solid #222;
	margin-bottom:70px;
	position:relative;
}
.column .list li:after {
	content:"";
	width:0;
	height:2px;
	background:#21abd7;
	position:absolute;
	left:0;
	bottom:-2px;
	transition:all ease-in-out .5s;
}
.column .list li:hover:after {
	width:100%;
}
.column .list li:nth-child(4n) {
	margin-right:0;
}
.column .list li .icon {
	height:62px;
}
.column .list li .icon img{
    max-height:62px;
}
.column .list li .t1 {
	font-size:16px;
	line-height:24px;
	font-weight:bold;
	color:#222;
	margin-top:36px;
}
.column .list li .t2 {
	font-size:14px;
	line-height:24px;
	color:#666;
	margin-top:10px;
}

.relevant-case {
	width:100%;
	padding:60px 7.8%;
	background:#f6f6f6;
}
.relevant-case .title {
	font-size:24px;
	line-height:30px;
	font-weight:bold;
	color:#222;
}
.case-list {
	width:100%;
	display:table;
	margin-top:0px;
}
.case-list li {
	width:24%;
	float:left;
	margin-right:1.33%;
	margin-bottom:20px;
	background:#fff;
}
.case-list li:nth-child(4n) {
	margin-right:0;
}
.case-list li:hover {
	box-shadow:0 0 15px 1px rgba(0,0,0,.1);
}
.case-list li .img {
	width:100%;
	overflow:hidden;
}
.case-list li .img  img {
    width:100%;
    -moz-transition: all 0.5s linear;
    -o-transition:  all 0.5s linear;
    transition: all 0.5s linear;
}
.case-list li:hover .img img {
    -webkit-transform:  scale(1.05) ; 
    -moz-transform: scale(1.05) ; 
    -ms-transform: scale(1.05);     
    -o-transform:  scale(1.05) ; 
    transform:  scale(1.05);
}
.case-list li .tbox {
	width:100%;
	box-sizing:border-box;
	border:1px solid #ebebeb;
	border-top:none;
	padding:20px 20px 16px;
}
.case-list li .tbox .title {
	width:100%;
	position:relative;
	line-height:36px;
}
.case-list li .tbox .title .t1 {
	font-size:16px;
	font-weight:bold;
	color:#222;
}
.case-list li .tbox .title .t2 {
	font-size:14px;
	color:#666;
}
.case-list li .tbox .title .icon {
	position:absolute;
	right:0;
	top:0;
}
.case-list li .tbox .title .icon span {
	display:inline-block;
	width:18px;
	height:16px;
	margin-left:10px;
}
.case-list li .tbox .title .icon .icon1 {
	background:url(../images/icon17.png) center center no-repeat;
}
.case-list li .tbox .title .icon .icon2 {
	background:url(../images/icon18.png) center center no-repeat;
}
.case-list li .tbox .title .icon .icon3 {
	background:url(../images/icon19.png) center center no-repeat;
}
.case-list li .tbox .more {
	width:100%;
	border-top:1px solid #e3e3e3;
	margin-top:7px;
	font-size:14px;
	color:#666;
	line-height:36px;
	padding:7px;
	background:url(../images/icon20.png) right center no-repeat;
	transition:all ease .3s;
}
.case-list li:hover .tbox .more {
	background:url(../images/icon21.png) right center no-repeat;
}

.relevant-information.s {
	padding:60px 7.8% 43px;
}
.relevant-information.s .title {
	font-size:24px;
	font-weight:bold;
	color:#222;
	line-height:1;
	text-align:left;
}
.relevant-information.s .txt {
	font-size:14px;
	line-height:24px;
	color:#222;
	margin-top:24px;
	text-align:left;
}

.txt_topic h2{
	font-size:24px;
	line-height:60px;
	height:60px;
	color:#333;
	font-weight:bold;
}
.txt_topic .editor{
	line-height:2;
	color:#333;
	font-size:14px;
}

.topic_news_list{
	width:84.4%;
	margin:0 auto;
	border-top:1px solid #eee;
	clear:both;
	padding:20px 0;
}
.topic_news_list li{
	width:calc(33% - 20px);
	float:left;
	line-height:20px;
	padding: 10px 0;
	text-align:left;
	font-size:14px;
	margin-left: 20px;
	list-style-type:square;
}

@media(max-width:1660px) {
	.ny-banner .boxs,.news-info,.news .box1,.news .list1,.page-list {
		margin:0 30px;
	}
	.case-tj {
		margin:60px 30px 0;
	}
	.ny-banner .nb-menu {
		padding-left:30px;
	}
}
@media(max-width:1370px) {
	.ny-banner {
		height:540px;
	}
	.ny-banner.production2{
		height:580px;
	}
	.ny-banner .boxs.n1 {
		padding-top:150px;
	}
	.design .list li .tbox .t2 {
		padding:0 12%;
		margin-top: 30px;
	}
	.relevant-information .list li {
		    padding: 20px 20px 0;
	}

	.topic_news_list li{
		width:calc(50% - 20px);
	}

}
@media(max-width:1330px) {
	.ny-banner .boxs.n1 .breadcrumbs {
		display:none;
	}
}
@media(max-width:1200px) {
	.ny-banner .boxs.n1 .t1{
		font-size: 36px;
	}
	.ny-banner .boxs.n2 .box .t2 {
		padding:10px;
		line-height:30px;
	}

	.design .list li .tbox{
		padding: 18px 0;
	}
	.design .list li .tbox .icon{
		width: 43px;
		height: 43px;
	}
	.design .list li .tbox .t1{
		font-size: 16px;
	}
	.design .list li:hover .tbox .t2{
		padding: 0 8%;
	}

	.case-list li .tbox .title .t1{
		font-size: 14px;
	}
	.column{
		padding: 54px 3% 0;
	}
	.relevant-case{
		padding: 60px 3%;
	}
	.relevant-information.s{
		padding: 60px 3% 43px;
	}


}

@media(max-width:900px) {

	.ny-banner .boxs.n1 .t1{
		font-size: 24px;
	}
	.design .title,
	.process .title{
		font-size: 24px;
	}
	.design .txt{
		font-size: 18px;
		padding: 0 30px;
	}

	.design .list li{
		width: calc(33.3% - 2px);
	}

	.process{
		padding: 80px 2%;
	}
	.relevant-information{
		padding: 80px 2% 43px;
	}
	.relevant-information .title{
		font-size: 24px;
	}
	.relevant-information .list{
		margin: 30px auto 0;
	}
	.relevant-information .list li{
		padding: 10px 10px 0;
		height: 120px;
	}
	.relevant-information .list li .t2{
		margin-top: 10px;
	}

	.column{
		padding: 54px 3% 0;
	}
	.topic_news_list li{
		width: calc(100% - 20px);
	}
	.topic_news_list{
		width: 94%;
	}

	.relevant-case{
		padding: 60px 3%;
	}
	.case-list li{
		width: 49%;
		margin-right: 2%;
	}
	.case-list li:nth-child(2n){
		margin-right: 0;
	}
	.relevant-information.s{
		padding: 60px 3% 43px;
	}
	.relevant-information .list li{
		width: 49%;
		margin-right: 2%;
	}
	.relevant-information .list li:nth-child(2n){
		margin-right: 0;
	}

}

@media(max-width:767px) {
	.ny-banner{
		height: 460px;
	}
	.ny-banner .boxs.n1 .t1{
		font-size: 20px;
		line-height: 40px;
	}
	.ny-banner .boxs.n1 .t2{
		font-size: 14px;
		line-height: 26px;
	}
	.ny-banner .boxs.n1 .t3{
		width: 40px;
    	height: 40px;
	}
	.ny-banner .boxs.n1 .t3 span{
		width: 40px;
    	height: 40px;
	}

	.design .title{
		font-size: 20px;
	}
	.design .txt{
		font-size: 14px;
	}
	.design .list li{
		width: calc(50% - 2px);
	}
	.design .list li .tbox{
		height: 60px;
	}
	.design .list li .tbox .t1{
		font-size: 14px;
	}
	.design .list li .tbox .icon{
		width: 30px;
		height: 30px;
	}

	.process .list li{
		width: 50%;
		padding-top: 70px;
	}
	.process .list li.on{
		width: 100%;
		padding-top: 55px;
	}
	.process .list li .t1{
		margin-top: 20px;
	}
	.relevant-information{
		padding: 80px 2% 0;
	}
	.relevant-information .title{
		font-size: 20px;
	}
	.relevant-information .list li{
		width: 48%;
		margin-right: 4%;
		padding: 10px 5px 0;
		height: 90px;
		margin-bottom: 10px;
	}
	.relevant-information .list li:nth-child(2n){
		margin-right: 0;
	}
	.relevant-information .list li .t1{
		font-size: 14px;
		line-height: 20px;
		height: 40px;
	}
	.relevant-information .list li .t2{
		margin-top: 10px;
		font-size: 10px;
		letter-spacing: -1px;
	}


	.ny-banner.production2{
		height: 460px;
	}
	.ny-banner .boxs.n1{
		padding-top: 160px;
	}
	.column .list li{
		width: 49%;
		margin-right: 2%;
	}
	.column .list li:nth-child(2n){
		margin-right: 0;
	}
	.case-list li{
		width: 100%;
		margin-right: 0;
	}

	.relevant-case .title{
		font-size: 20px;
	}
	.relevant-information.s .title{
		font-size: 20px;
	}


	
}