.servicesVisualTitle{
	/* padding: 3.02vw 2.3vw 0; */
	padding: 100px 35px 0 35px;
}
.servicesVisualTitle p{
	font-size: 4.95vw;
	font-weight: 400;
	line-height: 1;
	color: #FFF;
	padding: 0;
}

/* .servicesVisualTitle p:nth-child(1){text-align: right;} */
.servicesVisualTitle h3{
	padding: 0 0 60px 0;
	font-size: 15.3vw;
	font-weight: 600;
	line-height: 1;
	color: #FFF;
}


.serviceType{
	background: url('/data/images/service_bg.jpg') no-repeat left bottom / 100%;
	padding: 0 1.6vw 25vw;
}
.serviceType ul{
	display: flex;
	align-items: start;
	justify-content: space-between;
}
.serviceType ul li{
	flex-grow: 1;
	padding: 0 0.7vw;

}
.serviceType ul li:nth-child(odd){
	margin-top: 185px;
}


.serviceTypeBox{
	background: rgba(13, 13, 13, 0.8);
	border: 1px solid #4C4B49;
	border-radius: 10px;
	padding: 2.1vw;
	margin-bottom: 1.4vw; 
}



.serviceTypeBox span{
	display: block;
	font-size: 0.93vw;
	line-height: 1.2;
	font-weight: 500;
	color: #FFF;
	padding: 0 0 12px 0;
}

.serviceTypeBox h4{
	display: block;
	font-size: 1.86vw;
	line-height: 1.2;
	font-weight: 400;
	color: #FFF;
	padding: 0 0 4px 0;
}

.serviceTypeBox h5{
	display: block;
	font-size: 1.04vw;
	line-height: 1.2;
	font-weight: 400;
	color: #FFF;
	padding: 0 0 3.7vw;
}


.serviceType ul li:nth-child(even) .serviceTypeBox h5{
	padding: 0 0 60px 0;
}


.serviceTypeBox p{
	display: block;
	font-size: 14px;
	line-height: 1.2;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.4);
	padding-bottom: 4px;
}
.serviceTypeBox p:nth-child(odd){
	font-size: 20px;
	padding: 0 0 1.1vw 0;
	color: rgba(255, 255, 255, 0.8)
}


.serviceMidVisual{
	text-align: center;
	padding: 0 1.146vw;
}
.serviceMidVisual img{
	width: 100%;
}
.midVisualText{
	position: relative;
	margin-top: -15.8vw;
	padding: 0 26px 50px 13px;
}
.midVisualText p{
	font-size: 4.58vw;
	font-weight: 400;
	line-height: 1.1;
}
.midVisualText p:nth-child(1){
	text-align: right;
}
.midVisualText p:nth-child(2){
	text-align: left;
}
.midVisualText p:nth-child(3){
	text-align: right;
	padding-right: 15vw;
}
.midVisualText .midVisualInfo{
	/* position: absolute;
	left: 4.8vw;
	bottom: 4.85vw; */
	position: relative;
	top: -60px;
}
.midVisualText .midVisualInfo h3{
	font-size: 16px;
	line-height: 1.4;
	color: #FFF;
	font-weight: 400;
	text-align: left;
}





.serviceContactus{
	margin: 0 48px 0 40px;
	padding: 2vw 3vw;
	background: rgba(217, 217, 217, 0.1);
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.serviceContactus p{
	font-size: 2.6vw;
	font-weight: 400;
	line-height: 1;
	color: #FFF;
}

.serviceContactus a{
	font-size: 1.2vw;
	font-weight: 400;
	line-height: 3.5vw;
	color: #FFF;
	display: inline-block;
	height: 3.5vw;
	border: 1px solid rgba(255,255,255,.15);
	border-radius: 40px;
	padding: 0 1.5vw;
}





.serviceInfo{
	/* padding: 4.17vw 1.146vw 7.66vw; */
	padding: 4.17vw 48px 7.66vw 40px;
}
.serviceInfo ul{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-left: -0.7vw;
	margin-right: -0.7vw;
}
.serviceInfo ul li{
	display: inline-block;
	vertical-align: top;
	width: 33.333%;
	padding: 0 0.7vw;
}
.serviceInfoBox{
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 10px;
	padding: 1.7vw 2.1vw 2vw;
}
.serviceInfoBox span{
	display: block;
	font-size: 5.2vw;
	line-height: 1.3;
	font-weight: 300;
	color: #FFF;
}

.serviceInfoBox span b{
	font-weight: 300;
}
.serviceInfoBox p{
	font-size: 14px;
	line-height: 1.6;
	font-weight: 400;
	color: #FFF;
	word-break: keep-all;
}

.serviceInfoBox p.infoCate{
	padding-bottom: 10vw;
}









.serviceClients{
	max-width: 1210px;
	width: 100%;
	margin: 0 auto;
}
.serviceClients h4{text-align: center; padding: 0 0 15px;}
.serviceClients h4 span{
	display: inline-block;
	font-size: 1.25vw;
	line-height: 2.1vw;
	font-weight: 400;
	color: #FFF;
	border: 1px solid #FFF;
	border-radius: 4px;
	padding: 0 0.52vw;
}
.serviceClients h3{
	font-size: 4vw;
	line-height: 1;
	font-weight: 400;
	color: #FFF;
	text-align: center;
}
.serviceClientsList{
	padding: 10.9vw 2.3vw  13.4vw;
}
.serviceClientsList ul{font-size: 0;}
.serviceClientsList ul li{
	display: inline-block;
	width: 25%;
	padding: 0 2.8vw 4vw;
}
.serviceClientsImage{}
.serviceClientsImage img{
	width: 100%;
}



.serviceProject{
	padding: 0 48px 0 40px;
}
.serviceProject h4{
	text-align: center;
	margin-bottom: 10px;
}
.serviceProject h4 span {
	display: inline-block;
	font-size: 1.25vw;
	line-height: 2.1vw;
	font-weight: 400;
	color: #FFF;
	border: 1px solid #FFF;
	border-radius: 4px;
	padding: 0 0.52vw;
}
.serviceProject .serviceProjectTitle{
	padding: 3.1vw 0;	
}
.serviceProject .serviceProjectTitle p{
	font-size: 4.58vw;
	line-height: 1;
	font-weight: 400;
	color: #FFF;
	word-break: keep-all;
}
.serviceProject .serviceProjectTitle p:nth-child(1){
	text-align: right;
}

.serviceProjectList{
	padding: 0 0 8.33vw;
}

.serviceProjectList ul{}
.serviceProjectList ul li{
	padding: 0 0 0.833vw;
	position: relative;
}

.serviceProjectThumb{
	display: none;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, 80%);
	z-index: 8;
}

.serviceProjectThumb img{
	width: 240px;
	height: 160px;
}

.serviceProjectList ul li:hover .serviceProjectThumb{
	display: block;
}

.serviceProjectBox{
	background-color: #000;
	background-image: url("/data/images/services/service_arrowdown.png");
	background-repeat: no-repeat;
	background-size: 60px;
	background-position: right 40px center;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 10px;
	padding: 1.7vw calc(2.9vw + 60px) 1.7vw 2.9vw;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.serviceProjectBox:hover{
	background: #FFF;
	background-image: url("/data/images/services/service_arrowdown_black.png");
	background-repeat: no-repeat;
	background-size: 60px;
	background-position: right 40px center;
}
.serviceProjectBox:hover > div{
	color: #000;
}
.readmore .serviceProjectBox{
	justify-content: center;
	background-image: none;
}
.readmore .serviceProjectBox:hover{
	background: #FFF;
	background-image: none;
}


.serviceProjectList ul li.serviceProjectLast .serviceProjectBox{
	background: none;
	text-align: center;
	display: inline-block;
	border: 0;
	padding: 20px 48px;
}

.serviceProjectList ul li.serviceProjectLast:hover .serviceProjectThumb{
	display: none;
}

.serviceProjectList ul li.serviceProjectLast .serviceProjectBox:hover > div{
	color: #FFF;
}
.serviceProjectList ul li {text-align: center}

@media screen and (max-width: 767px){
	
	.servicesInner {overflow: hidden;}
	.serviceProject {padding: 0;}
	.servicesVisualTitle{
		padding: 22px 20px 0;
	}
	.servicesVisualTitle p{
		padding: 0;
		font-size: 32px;
		word-break: keep-all;
	}
	.servicesVisualTitle p:nth-child(1){
		text-align: left;
	}
	.servicesVisualTitle p:nth-child(3){
		text-align: right;
	}
	.servicesVisualTitle h3{
		padding: 19px 0 56px;
		font-size: 40px;
		line-height: 36px;
	}
	
	
	
	.serviceType{
		padding: 0 20px 197px;
		background: url(/data/images/service_bg_m.png) no-repeat center / 100%;
	}
	.serviceType ul{
		display: block;
	}
	.serviceType ul li{
		padding: 0;
	}
	.serviceType ul li:nth-child(odd){
		margin-top: 0;
	}
	
	
	.serviceTypeBox{
		padding: 20px;
		margin-bottom: 12px;
	}
	.serviceTypeBox span{
		font-size: 12px;
		line-height: 16px;
		padding: 0 0 11px 0;
	}
	.serviceTypeBox h4{
		font-size: 20px;
		line-height: 26px;
		padding: 0;
	}
	.serviceTypeBox h5{
		font-size: 13px;
		line-height: 17px;
		padding: 0 0 42px;
	}
	.serviceType ul li:nth-child(even) .serviceTypeBox h5{
		padding: 0 0 42px;
	}
	
	.serviceTypeBox p{
		font-size: 13px;
	}
	
	.serviceTypeBox p:nth-child(odd) {padding: 0 0 12px;}
	
	
	.serviceMidVisual img{
		width: 100%;
	}
	.serviceMidVisual video {
		transform: scale(2);
	}
	.midVisualText{
		margin-top: 0;
		padding: 0 20px 48px;
	}
	.midVisualText p{
		font-size: 8vw;
		line-height: 1.2;
		word-break: keep-all;
	}
	
	.midVisualText p:nth-child(1){
		text-align: left;
	}
	.midVisualText p:nth-child(2){
		text-align: left;
	}
	.midVisualText p:nth-child(3){
		padding-right: 0;
	}
	
	.midVisualText .midVisualInfo{
		position: unset;
		left: unset;
		bottom: unset;
		padding: 18px 0 0;
	}
	.midVisualText .midVisualInfo h3{
		font-size: 13px;
		line-height: 1.4;
	}
	
	
	
	
	
	.serviceContactus{
		display: none;
	}
	.serviceContactus.orange{
		display: block;
		padding: 40px 32px;
		margin: 0 20px;
		background: #FF4800;
	}

	
	.serviceContactus p{
		font-size: 21px;
		line-height: 27px;
		text-align: center;
		padding: 0 0 32px;
	}
	.serviceContactus a{
		display: block;
		width: 100%;
		height: 48px;
		line-height: 48px;
		font-size: 18px;
		text-align: center;
	}
	
		
	.serviceContactus.orange h3{
		font-size: 21px;
		font-weight: 400;
		line-height: 27px;
		text-align: center;
		color: #FFF;
		word-break: keep-all;
		padding: 0 0 13px;
	}
	
		
	.serviceContactus.orange p{
		font-family: SUIT;
		font-size: 23px;
		font-weight: 400;
		line-height: 1.2;
		text-align: center;
		color: #FFF;
		word-break: keep-all;
		padding: 0 0 20px 0;
	}
	
	
	
	
	
	.serviceInfo{
		padding: 32px 20px;
	}
	.serviceInfo ul{
		margin-left: 0;
		margin-right: 0;
		display: block;
	}
	
	.serviceInfo ul li{
		width: 100%;
		padding: 0 0 16px;
	}
	.serviceInfoBox{
		padding: 20px;
	}
	.serviceInfoBox span{
		font-size: 50px;
		line-height: 65px;
	}
	
	.serviceInfoBox p{
		font-size: 13px;
		line-height: 21px;
	}
	
	.serviceInfoBox p.infoCate{
		padding: 0 0 44px;
	}
	
	.serviceProjectBox{
		background-size: 40px;
		background-position: right 6px center;
	}
	.serviceProjectBox:hover{
		background-size: 40px;
		background-position: right 6px center;
	}
	
	
	.serviceClients{
		padding: 31px 20px 0;
	}
	.serviceClients h4 span{
		font-size: 13px;
		line-height: 27px;
		height: 29px;
		padding: 0 10px;
	}
	
	.serviceClients h3{
		font-size: 32px;
		line-height: 42px;
	}
	.serviceClients h3.serviceClientsTitleTop{
		/* text-align: right; */
		text-align: left
	}
	.serviceClients h3.serviceClientsTitleBot{
		text-align: left;
	}
	
	
	.serviceClientsList{
		padding: 68px 0 102px;
	}
	
	.serviceClientsList ul li{
		width: 33.333%;
		padding: 0 10px 18px;
	}
	
	
	.serviceProject .serviceProjectTitle{
		min-width: 360px;
		padding: 0 20px 57px;
	}
	
	
	.serviceProject h4 span{
		font-size: 13px;
		line-height: 27px;
		height: 29px;
		padding: 0 10px;
	}
	
	.serviceProject .serviceProjectTitle p{
		font-size: 32px;
		line-height: 38px;
	}
	.serviceProject .serviceProjectTitle p:nth-child(1){
		text-align: left;
	}
	.serviceProject .serviceProjectTitle p:nth-child(2){
		text-align: left;
	}
	.serviceProject .serviceProjectTitle p:nth-child(3){
		text-align: right;
	}
	.serviceProjectList{
		padding: 0 20px 68px;
	}
	.serviceProjectList ul li{
		padding: 0 0 12px;
		text-align: left;
	}
	
	
	.serviceProjectList ul li.readmore{
		text-align: center;
	}
	
	/* .serviceProjectList ul li.readmore .serviceProjectBox{
		padding: 25px 0;
	} */
	.serviceProjectBox{
		display: block !important;
		padding: 24px 20px 24px 20px;
	}
	
}