@charset "utf-8";


/*------------------------------------------------------------
	SERVICE COMMON
------------------------------------------------------------*/


#service-kv .section-wrap {
	position: relative;
}
#service-kv .section-wrap img {
	width: 100%;
	vertical-align: bottom;
}
#service-kv .section-wrap img.pc {
	display: block;
}
#service-kv .section-wrap img.sp {
	display: none;
}
#service-kv .title {
	width: 100%;
	padding: 0 30px;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 0;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
#service-kv h1 {
	font-size: 44px;
	line-height: 1.36;
	letter-spacing: .05em;
	text-indent: .05em;
	color: #fff;
}
#service-kv h1 br {
	display: none;
}


@media screen and (max-width: 800px) {
	#service-kv .section-wrap {
		width: 100%;
		padding-top: 73%;
	}
	#service-kv .section-wrap img {
		position: absolute;
		top: 0;
		left: 0;
		object-fit: cover;
		width: 100%;
		height: 100%;
	}
	#service-kv .section-wrap .btn-white {
		padding-top: 15px;
	}
	#service-kv .section-wrap .btn-white a {
		max-width: 225px;
		padding: 8px;
	}
	#service-kv .title {
		padding: 0 15px;
	}
	#service-kv h1 {
		font-size: 25px;
	}
	#service-kv h1 br {
		display: block;
	}
	#service-kv .section-wrap img.pc {
		display: none;
	}
	#service-kv .section-wrap img.sp {
		display: block;
	}
}



#service-wrap .title {
	text-align: center;
}
#service-wrap .title h2 {
	font-family: 'Roboto', sans-serif;
	font-size: 34px;
	font-weight: 500;
	color: #000;
	letter-spacing: .05em;
	text-indent: .05em;
	line-height: 1;
	padding-bottom: 20px;
	margin-bottom: .5em;
	position: relative;
}
#service-wrap .title h2:after {
	content: '';
	display: block;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 50%;
	height: 4px;
	width: 48px;
	margin-left: -24px;
}
#service-wrap .title h3 {
	font-size: 20px;
	line-height: 1.4;
	margin-bottom: 4em;
}
#service-wrap .title h3 br {
	display: none;
}

@media screen and (max-width: 800px) {
	#service-wrap .title h2 {
		font-size: 28px;
		padding-bottom: 12px;
		margin-bottom: .5em;
		position: relative;
	}
	#service-wrap .title h2:after {
		height: 2px;
		width: 24px;
		margin-left: -12px;
	}
	#service-wrap .title h3 {
		font-size: 15px;
		line-height: 1.6;
		margin-bottom: 2em;
	}
	#service-wrap .title h3 br {
		display: block;
	}
}

#service-contact {
	padding-top: 60px;
	margin-top: -60px;
}
#service-contact .section-wrap {
	padding: 100px 30px;
	background-color: #fff;
	border-top: 1px solid #eee;
}

@media screen and (max-width: 800px) {
	#service-contact .section-wrap {
		padding: 50px 15px;
		background-color: #fff;
	}
}


#service-other .section-wrap {
	padding: 50px 30px;
	background-color: #f4f4f4;
}

#service-other .service-nav {
	max-width: 1280px;
	width: 100%;
	margin: auto;
}
#service-other .service-nav h2 {
	font-size: 20px;
	line-height: 1;
	margin-bottom: 1.5em;
}
#service-other .service-list {
	display: grid;
	-ms-grid-template-columns: repeat(6,1fr);
	grid-template-columns: repeat(6,1fr);
	border-right: 1px solid #ddd;
}
#service-other .service-list li {
	border-left: 1px solid #ddd;
}
#service-other .service-list li a {
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
#service-other .service-list li a:hover {
	background-color: #ddd;
}
#service-other .service-list li a .icon {
	padding: 10px 0;
}
#service-other .service-list li a .icon img {
	width: 100%;
	max-width: 140px;
}
#service-other .service-list li a h4 {
	font-size: 15px;
	line-height: 1.5;
	font-weight: normal;
	color: #000;
	padding-bottom: 2em;
}
#service-other .service-list li a h4 .sp {
	display: none;
}

@media screen and (max-width: 800px) {
	#service-other .section-wrap {
		padding: 40px 15px;
	}
	#service-other .service-list {
		justify-content: center;
		border: none;
		-ms-grid-template-columns: repeat(3,1fr);
		grid-template-columns: repeat(3,1fr);
	}
	#service-other .service-list li {
		margin-bottom: 15px;
	}
	#service-other .service-list li:last-child,
	#service-other .service-list li:nth-child(3n) {
		border-right: 1px solid #ddd;
	}	
	#service-other .service-list li a .icon {
		padding: 0 10%;
	}
	#service-other .service-list li a h4 {
		font-size: 13px;
		line-height: 1.4;
		padding-bottom: .5em;
	}
	#service-other .service-list li a h4.sl {
		line-height: 2.8;
	}
	#service-other .service-list li a h4 .sp {
		display: block;
	}
}



/*------------------------------------------------------------
	SERVICE - PRODUCT
------------------------------------------------------------*/


.page-template-product #service-kv2 .section-wrap {
	padding: 0;
	color: #fff;
	text-align: center;
	background:url(../images/service/s-product-sec2-bg.jpg) center center/cover no-repeat;
}
.page-template-product #service-kv2 .section-wrap h2 {
	font-size: 25px;
	line-height: 1.6;
	position: relative;
	padding-top: 70px;
	margin-bottom: 1em;
}
.page-template-product #service-kv2 .section-wrap h2:before {
	content: '';
	display: block;
	width: 1px;
	height: 60px;
	background-color: #fff;
	position: absolute;
	top: 0;
	left: 50%;
}
.page-template-product #service-kv2 .section-wrap p {
	font-size: 15px;
	line-height: 2;
}
.page-template-product #service-kv2 .section-wrap p .tb {
	display: none;
}

.page-template-product #service-kv2 .section-wrap h3 {
	font-size: 300px;
	line-height: 1;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	opacity: .1;
	margin-top: -70px;
	-webkit-transform: translateY(25%);
	-ms-transform: translateY(25%);
	-o-transform: translateY(25%);
	transform: translateY(25%);
}
@media screen and (max-width: 960px) {
	.page-template-product #service-kv2 .section-wrap p .tb {
		display: block;
	}
	.page-template-product #service-kv2 .section-wrap h3 {
		font-size: 30vw;
	}
}


@media screen and (max-width: 800px) {
	.page-template-product #service-kv2 .section-wrap {
		padding: 0 15px;
	}
	.page-template-product #service-kv2 .section-wrap h2 {
		font-size: 17px;
		padding-top: 60px;
	}
	.page-template-product #service-kv2 .section-wrap h2:before {
		height: 45px;
	}
	.page-template-product #service-kv2 .section-wrap p {
		text-align: left;
		font-size: 13px;
		line-height: 1.8;
	}
	.page-template-product #service-kv2 .section-wrap p .tb {
		display: none;
	}
	.page-template-product #service-kv2 .section-wrap h3 {
		font-size: 32vw;
		margin-top: -.25em;
	}
}


#service-works .section-wrap {
	position:relative;
	width: 100%;
	padding: 100px 30px;
	background-color: #f4f4f4;
}

#service-works .works-number {
	position: absolute;
	z-index: 3;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	color: #000;
	line-height: 1;
}
#service-works .works-image {
	background-color: #fff;
}
#service-works .works-image a {
	display: block;
	overflow: hidden;
}
#service-works .works-image a img {
	width: 100%;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
#service-works .works-image a:hover img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	-o-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	-webkit-filter: brightness(.7);
	filter: brightness(.7);	
}
#service-works .works-text-wrap {
	background-color: #fff;
	text-align: left;
}
#service-works .works-client {
	color: #000;
	display: block;
	font-weight: bold;
	font-size: 14px;
	line-height: 1.6;
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 1.5em;
}

#service-works .works-client::after {
	content:"";
	display:block;
	width: 50px;
	height: 1px;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 0;
}
#service-works .works-title {
	display: block;
	color: #888;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.5;
}
#service-works .works-title .sp {
	display: none;
}
#service-works .works-btn a {
	color: #000;
	display: block;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 2em;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
#service-works .works-btn a:hover {
	opacity: .6;
}
#service-works .works-btn i {
	font-size: 1.2em;
}


#service-works .works-box {
	position: relative;
}
#service-works .works-row {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	margin: auto;
	width: 100%;
	max-width: 1280px;
}
#service-works .works-row.row-1 {
	margin-bottom: 5%;
}
#service-works .works-01 {
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
#service-works .works-01 .works-number {
	font-size: 250px;
	left: 16%;
	top: -19%;
}
#service-works .works-01 .works-image {
	width: 59%;
}
#service-works .works-01 .works-text {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-align-items: flex-end;
	align-items: flex-end;
	padding: 6% 4%;
	width: 41%;
	background-color: #fff;
}
#service-works .works-row.row-2 {
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
	padding-bottom: 5%;
}
#service-works .works-02 {
	width: 48%;
	padding-top: 12%;
}
#service-works .works-02 .works-number {
	left: 13%;
	top: 3%;
	font-size: 205px;
}
#service-works .works-02 .works-text {
	position: relative;
	z-index: 2;
	margin: auto;
	margin-top: -6%;
	width: 90%;
}
.works-02 .works-text .works-text-wrap {
	width: 100%;
	padding: 7%;
}


#service-works .works-03 {
	width: 48%;
}
#service-works .works-03 .works-number {
	left: 61%;
	top: 72%;
	font-size: 145px;
}

#service-works .works-03 .works-text {
	position: relative;
	z-index: 2;
	margin: auto;
	margin-top: -6%;
	width: 90%;
}
#service-works .works-03 .works-text .works-text-wrap {
	width: 100%;
	padding: 7%;
}


#service-works .works-04 {
	width: 60%;
}
#service-works .works-04 .works-number {
	left: -14%;
	top: -16%;
	font-size: 290px;
}
#service-works .works-04 .works-image {
	padding: 4%;
	padding-bottom: 0;
}

#service-works .works-04 .works-text .works-text-wrap {
	padding: 4% 8% 5%;
	width: 100%;
}

#service-works .works-row.row-3 {
	padding-bottom: 5%;
}

#service-works .works-05 {
	width: 37%;
	padding-top: 6%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap-reverse;
	-moz-flex-wrap: wrap-reverse;
	-ms-flex-wrap: wrap-reverse;
	-o-flex-wrap: wrap-reverse;
	flex-wrap: wrap-reverse;
	align-content: flex-end;
}
#service-works .works-05 .works-number {
	left: 60%;
	top: 1%;
	font-size: 126px;
}

#service-works .works-05 .works-text {
	width: 100%;
	position: relative;
	z-index:2;
}
#service-works .works-05 .works-text .works-text-wrap {
	padding: 8%;
	margin:auto;
	width: 90%;
}
#service-works .works-05 .works-image {
	margin-top: -5%;
}

#service-works .works-06 {
	width: 32%;
	padding-top: 2%;
}
#service-works .works-06 .works-number {
	left: 64%;
	top: 0;
	font-size: 78px;
}
#service-works .works-06 .works-image {
	padding: 7%;
	padding-bottom: 0;
}

#service-works .works-06 .works-text {
	width: 100%;
}
#service-works .works-06 .works-text .works-text-wrap {
	padding: 7%;
}

#service-works .works-07 {
	width: 32%;
	padding-top: 7%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap-reverse;
	-moz-flex-wrap: wrap-reverse;
	-ms-flex-wrap: wrap-reverse;
	-o-flex-wrap: wrap-reverse;
	flex-wrap: wrap-reverse;
	-ms-align-items: flex-start;
	align-items: flex-start;
	align-content: flex-start;
}

#service-works .works-07 .works-number {
	left: 64%;
	top: 41%;
	font-size: 145px;
}
#service-works .works-07 .works-image {
	width: 100%;
	padding: 7%;
	padding-top: 0;
}

#service-works .works-07 .works-text {
	width: 100%;
}
#service-works .works-07 .works-text .works-text-wrap {
	width: 100%;
	padding: 7%;
}


#service-works .works-08 {
	width: 32%;
}

#service-works .works-08 .works-number {
	left: 16%;
	top: -15%;
	font-size: 112px;
}
#service-works .works-08 .works-image {
	padding: 7%;
	padding-bottom: 0;
}

#service-works .works-08 .works-text {
	width: 100%;
}
#service-works .works-08 .works-text .works-text-wrap {
	padding: 7%;
}


@media screen and (max-width: 1340px) {
	#service-works .works-01 .works-number {
		font-size: 18.7vw;
	}
	#service-works .works-02 .works-number {
		font-size: 15.3vw;
	}
	#service-works .works-03 .works-number {
		font-size: 10.8vw;
	}
	#service-works .works-04 .works-number {
		font-size: 21.6vw;
	}
	#service-works .works-05 .works-number {
		font-size: 9.4vw;
	}
	#service-works .works-06 .works-number {
		font-size: 5.8vw;
	}
	#service-works .works-07 .works-number {
		font-size: 10.8vw;
	}
	#service-works .works-08 .works-number {
		font-size: 8.4vw;
	}
}
@media screen and (max-width: 800px) {
	#service-works .section-wrap {
		padding: 50px 15px;
	}
	#service-works .works-client {
		font-size: 3.2vw;
	}
	#service-works .works-client::after {
		width: 3.2em;
	}
	#service-works .works-title {
		font-size: 4.5vw;
	}
	#service-works .works-title .sp {
		display: block;
	}
	#service-works .works-btn a {
		font-size: 3.2vw;
	}
	#service-works .works-row.row-1 {
		margin-bottom: 10vw;
	}
	#service-works .works-01 {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#service-works .works-01 .works-image {
		width: 100%;
	}
	#service-works .works-01 .works-text {
		width: 100%;
	}
	#service-works .works-01 .works-number {
		font-size: 24vw;
		left: 66%;
		top: 43%;
	}
	#service-works .works-row.row-2 {
		margin-bottom: 10vw;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#service-works .works-02 {
		width: 100%;
		padding-top: 0;
		padding-left: 14%;
		margin-bottom: 10vw;
		-webkit-transform: translateX(15px);
		-ms-transform: translateX(15px);
		-o-transform: translateX(15px);
		transform: translateX(15px);
	}
	#service-works .works-02 .works-number {
		font-size: 21.3vw;
		left: 20%;
		top: -11%;
	}
	#service-works .works-03 {
		width: 100%;
		padding-top: 0;
		padding-right: 14%;
		-webkit-transform: translateX(-15px);
		-ms-transform: translateX(-15px);
		-o-transform: translateX(-15px);
		transform: translateX(-15px);
	}
	#service-works .works-03 .works-number {
		font-size: 19.3vw;
		left: 72%;
		top: 85%;
	}
	#service-works .works-row.row-3 {
		padding-bottom: 10vw;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#service-works .works-04 {
		width: 100vw;
		margin-left: -15px;
		margin-right: -15px;
		margin-bottom: 10vw;
	}
	#service-works .works-04 .works-number {
		font-size: 24vw;
		left: -4%;
		top: -7%;
	}
	#service-works .works-05 {
		width: 100%;
		padding-top: 0;
		padding-left: 14%;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		align-content: flex-start;
		-webkit-transform: translateX(15px);
		-ms-transform: translateX(15px);
		-o-transform: translateX(15px);
		transform: translateX(15px);
	}
	#service-works .works-05 .works-image {
		width: 100%;
		margin-top: 0;
	}
	#service-works .works-05 .works-text {
		margin-top: -6%;
	}
	#service-works .works-05 .works-number {
		font-size: 16.8vw;
		left: 69%;
		top: -9%;
	}
	#service-works .works-row.row-4 {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#service-works .works-06 {
		width: 100%;
		padding-top: 0;
		padding-right: 14%;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		align-content: flex-start;
		-webkit-transform: translateX(-15px);
		-ms-transform: translateX(-15px);
		-o-transform: translateX(-15px);
		transform: translateX(-15px);
		margin-bottom: 10vw;
	}
	#service-works .works-06 .works-number {
		font-size: 21.3vw;
		left: 11%;
		top: -8%;
	}
	#service-works .works-07 {
		width: 100%;
		padding-top: 0;
		padding-left: 14%;
		align-content: flex-start;
		-webkit-transform: translateX(15px);
		-ms-transform: translateX(15px);
		-o-transform: translateX(15px);
		transform: translateX(15px);
		margin-bottom: 10vw;
	}
	#service-works .works-07 .works-number {
		font-size: 20vw;
		left: 73%;
		top: 31%;
	}
	#service-works .works-08 {
		width: 100%;
		padding-top: 0;
		padding-right: 14%;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		align-content: flex-start;
		-webkit-transform: translateX(-15px);
		-ms-transform: translateX(-15px);
		-o-transform: translateX(-15px);
		transform: translateX(-15px);
	}
	#service-works .works-08 .works-number {
		font-size: 16vw;
		left: 10%;
		top: -11%;
	}
}


#service-our_clients .section-wrap {
	width: 100%;
	padding: 100px 30px 20vw;
	text-align: center;
	background: url(../images/service/bg-our_clients.jpg) center bottom no-repeat;
	background-color: #fff;
	background-size: contain;
}
#service-our_clients h2 {
	max-width:380px;
	width:60%;
	margin:0 auto 7%;
}
#service-our_clients h2 .sp {
	display: none;
}
#service-our_clients img.logos-our_clients.pc {
	max-width:980px;
	width:100%;
	margin: auto;
}
#service-our_clients img.logos-our_clients.sp {
	display: none;
}

@media screen and (max-width: 800px) {
	#service-our_clients .section-wrap {
		width: 100%;
		padding: 50px 0 30vw;
		background-size: 160vw auto;
	}
	#service-wrap #service-our_clients .title h3 {
		margin-bottom: 2em;
	}
	#service-our_clients img.logos-our_clients.pc {
		display: none;
	}
	#service-our_clients img.logos-our_clients.sp {
		display: block;
		width: 84%;
		margin: auto;
	}
}


#service-about .section-wrap {
	width: 100%;
	max-width: 1020px;
	padding: 20px 30px 0;
	margin: 0 auto;
}
#service-about .btn-contact-wrap {
	margin-bottom: 60px;
}
#service-about .about-section1,
#service-about .about-section2 {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	padding-bottom:10%;
}
#service-about .about-section1 {
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
#service-about .about-section-sp {
	display: none;
}
#service-about .about-section1 .section1-image.for-mb,
#service-about .about-section2 .section2-image.for-mb {
	display:none;
}
#service-about .about-section1 .section1-image {
	width:39%;
	padding:3% 0 0 0;
}
#service-about .about-section1 .section1-txt {
	width: 50%;
}
#service-about .about-section2 .section2-image {
	width:40%;
	padding: 0;
}
#service-about .about-section2 .section2-txt {
	width: 58%;
}

#service-about h2 {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 70px;
	line-height: 1;
	margin-bottom: .5em;
}
#service-about h2 .reg {
	font-size: 30px;
}
#service-about h2 .ja {
	font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
	font-size: 20px;
	line-height: 1.5;
	margin-top: 1.5em;
	font-weight: bold;
	display: block;
}
#service-about .about-text p {
	font-size:15px;
	line-height: 2;
	margin-bottom:2em;
}
#service-about .about-text h3 {
	font-size:24px;
	font-weight:bold;
	line-height:1.4;
	margin-bottom: .2em;
}


@media screen and (max-width: 800px) {
	#service-about .section-wrap {
		padding: 0 15px 20px;
	}
	#service-about .btn-contact-wrap {
		margin-bottom: 50px;
	}
	#service-about .about-section1 {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-flex-direction: column-reverse;
		-moz-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		-o-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
	#service-about h2 {
		font-size: 40px;
		line-height: 1;
	}
	#service-about h2 .reg {
		font-size: 15px;
	}
	#service-about h2 .ja {
		font-size: 17px;
		line-height: 1.5;
	}
	#service-about .about-text p {
		font-size: 13px;
		line-height: 1.8;
		margin-bottom: 1.8em;
	}
	#service-about .about-text h3 {
		font-size: 14px;
	}
	#service-about .about-section1 .section1-txt {
		width: 100%;
	}
	#service-about .about-section1 .section1-image {
		width: 100%;
		text-align: center;
	}
	#service-about .about-section1 .section1-image img {
		width: 73.6%;
	}
	#service-about .about-section2 {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-flex-direction: column-reverse;
		-moz-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		-o-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
	#service-about .about-section2 .section2-txt {
		width: 100%;
	}
	#service-about .about-section2 .section2-image {
		width: 100%;
		text-align: center;
	}
	#service-about .about-section2 .section2-image img {
		width: 73.6%;
	}
}







/*------------------------------------------------------------
	SERVICE - DSP
------------------------------------------------------------*/


.page-template-dsp #message .section-wrap ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	width: 100%;
	max-width: 420px;
	margin: 50px auto 0;
	justify-content: space-between;
}
.page-template-dsp #message .section-wrap ul li {
	width: 14.3%;
}

.dsp-works .works-list {
	max-width: 1280px;
	width: 100%;
	margin: auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: space-between;
}
.dsp-works .works-list li {
	width: 31.25%;
	margin-bottom: 3.125%;
	background-color: #fff;
}
.dsp-works .works-list li .thumb {
	width: 100%;
	padding-top: 56.25%;
	position: relative;
	overflow: hidden;
}
.dsp-works .works-list li .thumb img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.dsp-works .works-list li .thumb a:hover img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	-o-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	-webkit-filter: brightness(.7);
	filter: brightness(.7);	
}
.dsp-works .works-list li .txt {
	width: 100%;
	background-color: #fff;
	padding: 8%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	text-align: left;
}
.dsp-works .works-list li .txt .client {
	color: #000;
	display: block;
	font-weight: bold;
	font-size: 14px;
	line-height: 1.6;
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 1.5em;
}

.dsp-works .works-list li .txt .client:after {
	content:"";
	display:block;
	width: 50px;
	height: 1px;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 0;
}
.dsp-works .works-list li .txt .movie-title {
	display: block;
	color: #888;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.5;
}
.dsp-works .works-list li .txt .play-btn {
	color: #000;
	display: block;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 2em;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.dsp-works .works-list li .txt .play-btn:hover {
	opacity: .6;
}
.page-template-dsp .btn-contact-wrap {
	padding: 60px 30px 120px;
	text-align: center;
}
.page-template-dsp .btn-contact-wrap p {
	font-size: 15px;
	line-height: 2;
}
.page-template-dsp .btn-contact-wrap .btn-black {
	padding-top: 20px;
}

#dsp-case .section-wrap {
	padding-bottom: 100px;
}
#dsp-case .kv,
#dsp-case .kv a {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	width: 100%;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
#dsp-case .kv a:hover {
	opacity: .6;
}
#dsp-case .kv .main {
	position: relative;
	width: 66%;
	padding-top: 37%;
}
#dsp-case .kv .sub {
	position: relative;
	width: 34%;
}
#dsp-case .kv .sub .sub1 {
	position: absolute;
	width: 100%;
	height: 50%;
	top: 0;
	left: 0;
}
#dsp-case .kv .sub .sub2 {
	position: absolute;
	width: 100%;
	height: 50%;
	bottom: 0;
	left: 0;
}

#dsp-case .kv .main img,
#dsp-case .kv .sub img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#dsp-case .content {
	margin: auto;
	max-width: 1020px;
	width: 100%;
	padding: 0 30px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
#dsp-case .content .txt {
	-webkit-flex: 1;
	-moz-flex: 1;
	-ms-flex: 1;
	-o-flex: 1;
	flex: 1;
	text-align: left;
	padding-right: 30px;
}
#dsp-case .content .txt .ttl {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	border-bottom: 1px solid #ddd;
	padding: 40px 0;
	margin-bottom: 40px;
}
#dsp-case .content .txt .ttl .logo {
	width: 200px;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
}
#dsp-case .content .txt .ttl .client {
	-webkit-flex: 1;
	-moz-flex: 1;
	-ms-flex: 1;
	-o-flex: 1;
	flex: 1;
	padding-left: 1em;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	font-size: 18px;
}
#dsp-case .content .txt .ttl .client h4 {
	line-height: 1.6;
}
#dsp-case .content .txt .description {
	font-size: 15px;
	line-height: 2;
}
#dsp-case .content .txt .description p:not(:last-child) {
	margin-bottom: 2em;
}
#dsp-case .content .img {
	width: 360px;
	padding-top: 40px;
}
#dsp-case .content .img li:not(:last-child) {
	margin-bottom: 30px;
}


.page-template-dsp #service-kv2 .section-wrap {
	color: #fff;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	text-align: center;
	min-height: 500px;
	padding: 30px;
	background:url(../images/service/s-dsp-kv2-bg.jpg) center center/cover no-repeat;
}
.page-template-dsp #service-kv2 .section-wrap .txt-wrap {
	width: 100%;
}
.page-template-dsp #service-kv2 .section-wrap h2 {
	font-size: 25px;
	line-height: 1.68;
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0 auto 1.7em;
	padding-bottom: 1.5em;
}
.page-template-dsp #service-kv2 .section-wrap h2 .sp {
	display: none;
}
.page-template-dsp #service-kv2 .section-wrap h2:after {
	content: '';
	display: block;
	height: 1px;
	width: 100%;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
}
.page-template-dsp #service-kv2 .section-wrap p {
	font-size: 15px;
	line-height: 2;
}

@media screen and (max-width: 800px) {
	.page-template-dsp #message .section-wrap ul {
		max-width: 265px;
		margin: 25px auto 0;
		justify-content: space-between;
	}
	.page-template-dsp #message .section-wrap ul li {
		width: 14.3%;
	}
	.dsp-works .works-list li {
		width: 100%;
		background-color: #fff;
		margin-bottom: 15px;
	}
	.dsp-works .works-list li:last-child {
		margin-bottom: 0;
	}
	.dsp-works .works-list li .txt {
		padding: 25px;
	}
	.dsp-works .works-list li .txt .client {
		font-size: 12px;
	}
	.dsp-works .works-list li .txt .client:after {
		width: 25px;
	}
	.dsp-works .works-list li .txt .movie-title {
		font-size: 17px;
	}
	.dsp-works .works-list li .txt .movie-title br {
		display: none;
	}
	.dsp-works .works-list li .txt .play-btn {
		font-size: 12px;
	}
	.page-template-dsp .btn-contact-wrap {
		padding: 30px 15px 60px;
		text-align: center;
	}
	.page-template-dsp .btn-contact-wrap p {
		font-size: 13px;
		line-height: 1.8;
		text-align: left;
	}
	.page-template-dsp .btn-contact-wrap .btn-black {
		padding-top: 10px;
	}
	#dsp-case .section-wrap {
		padding-bottom: 60px;
	}
	#dsp-case .kv,
	#dsp-case .kv a {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#dsp-case .kv .main {
		width: 100%;
		padding-top: 56.25%;
	}
	#dsp-case .kv .sub {
		width: 100%;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
	}
	#dsp-case .kv .sub .sub1 {
		position: relative;
		width: 50%;
		height: auto;
		padding-top: 28.125%;
	}
	#dsp-case .kv .sub .sub2 {
		position: relative;
		width: 50%;
		height: auto;
		padding-top: 28.125%;
	}
	#dsp-case .content {
		padding: 0 15px;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#dsp-case .content .txt {
		width: 100%;
		padding-right: 0;
	}
	#dsp-case .content .txt .ttl {
		padding: 30px 0;
		margin-bottom: 30px;
	}
	#dsp-case .content .txt .ttl .logo {
		width: 125px;
	}
	#dsp-case .content .txt .ttl .client {
		font-size: 14px;
	}
	#dsp-case .content .txt .description {
		font-size: 13px;
		line-height: 1.8;
	}
	#dsp-case .content .txt .description p:not(:last-child) {
		margin-bottom: 1.8em;
	}
	#dsp-case .content .txt .description p br {
		display: none;
	}
	#dsp-case .content .img {
		width: 100%;
		padding-top: 20px;
	}
	#dsp-case .content .img ul {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#dsp-case .content .img ul li {
		width: 49%;
		margin-top: 2%;
	}
	#dsp-case .content .img li:not(:last-child) {
		margin-bottom: 0;
	}
	.page-template-dsp #service-kv2 .section-wrap {
		padding: 60px 15px;
		min-height: 350px;
		background:url(../images/service/s-dsp-kv2-bg-sp.jpg) center center/cover no-repeat;
	}
	.page-template-dsp #service-kv2 .section-wrap h2 {
		font-size: 17px;
	}
	.page-template-dsp #service-kv2 .section-wrap h2 .sp {
		display: block;
	}
	.page-template-dsp #service-kv2 .section-wrap p {
		text-align: left;
		font-size: 13px;
	}
}

/*------------------------------------------------------------
	SERVICE - DRONE
------------------------------------------------------------*/


#case-study .section-wrap {
	background-color: #f4f4f4;
	padding: 100px 30px;
	overflow: hidden;
}

#case-study ul {
	width: 100%;
	max-width: 1200px;
	margin: auto;
}
#case-study ul li {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}
#case-study ul li:nth-child(odd) {
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
#case-study ul li:nth-child(even) {
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
}
#case-study ul li .txt {
	width: 54%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
}
#case-study ul li .img {
	width: 46%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
}
#case-study ul li .txt-wrap {
	padding: 65px 50px;
	position: relative;
	width: 100%;
}
#case-study ul li .txt-wrap:before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	font-size: 150px;
	line-height: 1;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
	color: #ddd;
}
#case-study ul li:nth-child(1) .txt-wrap:before {
	content: '01';
}
#case-study ul li:nth-child(2) .txt-wrap:before {
	content: '02';
}
#case-study ul li:nth-child(3) .txt-wrap:before {
	content: '03';
}
#case-study ul li:nth-child(4) .txt-wrap:before {
	content: '04';
}
#case-study ul li:nth-child(5) .txt-wrap:before {
	content: '05';
}
#case-study ul li:nth-child(6) .txt-wrap:before {
	content: '06';
}
#case-study ul li .txt h2 {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	font-size: 90px;
	line-height: 1.1;
	position: relative;
	z-index: 2;
}
#case-study ul li .txt h3 {
	font-size: 24px;
	font-weight: bold;
	line-height: 1.6;
	margin: .75em 0 .5em;
}
#case-study ul li .txt p {
	font-size: 15px;
	line-height: 2;
}
@media screen and (max-width: 1260px) {
	#case-study .section-wrap {
		padding: 100px 2.4vw;
	}
	#case-study ul li .txt-wrap {
		padding: 5.16vw 3.97vw;
	}
	#case-study ul li .txt-wrap:before {
		font-size: 11.9vw;
	}
	#case-study ul li .txt h2 {
		font-size: 7.14vw;
	}
	#case-study ul li .txt h3 {
		font-size: 1.9vw;
		font-size: calc(13px + 0.87vw);
	}
	#case-study ul li .txt p {
		font-size: 1.19vw;
		font-size: calc(11px + 0.32vw);
	}
}

.page-template-youtube #service-wrap .title h3 br {
	display: block;
}
.page-template-youtube #service-works .section-wrap {
	background-color: #fff;
	border-bottom: 1px solid #f4f4f4;
}
.page-template-youtube #service-works .dsp-works .works-list li {
	border: 1px solid #ddd;
}

@media screen and (max-width: 800px) {
	#case-study .section-wrap {
		padding: 50px 15px;
	}
	#case-study ul li {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#case-study ul li .img {
		width: 100%;
		text-align: center;
		justify-content: center;
		padding: 0 20px;
	}
	#case-study ul li .img img {
		max-width: 550px;
		width: 100%;
	}
	#case-study ul li .txt {
		width: 100%;
	}
	#case-study ul li .txt-wrap {
		padding: 30px 15px;
		padding-right: 0;
	}
	#case-study ul li .txt-wrap:before {
		font-size: 67.5px;
	}
	#case-study ul li .txt h2 {
		font-size: 40px;
	}
	#case-study ul li .txt h3 {
		font-size: 16px;
	}
	#case-study ul li .txt p {
		font-size: 13px;
		line-height: 1.8;
	}
}

/*------------------------------------------------------------
	SERVICE - DRONE
------------------------------------------------------------*/

.drone-works .works-list {
	max-width: 1280px;
	width: 100%;
	margin: auto;
}
.drone-works .works-list li {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	margin-top: 6.25%;
}
.drone-works .works-list li:first-child {
	margin-top: 0;
}
.drone-works .works-list li:nth-child(even) {
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
.drone-works .works-list li:nth-child(odd) {
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
}
.drone-works .works-list li .thumb {
	width: 62.5%;
	padding-top: 35%;
	position: relative;
	overflow: hidden;
}
.drone-works .works-list li .thumb img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.drone-works .works-list li .thumb a:hover img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	-o-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	-webkit-filter: brightness(.7);
	filter: brightness(.7);	
}
.drone-works .works-list li .txt {
	width: 37.5%;
	background-color: #fff;
	padding: 5.625%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	text-align: left;
}
.drone-works .works-list li .txt .client {
	color: #000;
	display: block;
	font-weight: bold;
	font-size: 14px;
	line-height: 1.6;
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 1.5em;
}

.drone-works .works-list li .txt .client:after {
	content:"";
	display:block;
	width: 50px;
	height: 1px;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 0;
}
.drone-works .works-list li .txt .movie-title {
	display: block;
	color: #888;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.5;
}
.drone-works .works-list li .txt .play-btn {
	color: #000;
	display: block;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 2em;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.drone-works .works-list li .txt .play-btn:hover {
	opacity: .6;
}
.drone-works .btn-black {
	padding: 100px 0 0;
}

.page-template-drone #service-kv2 .section-wrap {
	color: #fff;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	text-align: center;
	min-height: 760px;
	padding: 30px;
	background:url(../images/service/s-drone-kv2-bg.jpg) center center/cover no-repeat;
}
.page-template-drone #service-kv2 .section-wrap .txt-wrap {
	width: 100%;
}
.page-template-drone #service-kv2 .section-wrap h2 {
	font-size: 25px;
	line-height: 1.68;
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0 auto 1.7em;
	padding-bottom: 1.5em;
}
.page-template-drone #service-kv2 .section-wrap h2:after {
	content: '';
	display: block;
	height: 1px;
	width: 100%;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
}
.page-template-drone #service-kv2 .section-wrap p {
	font-size: 15px;
	line-height: 2;
}
.page-template-drone #service-kv2 .section-wrap h3 {
	font-size: 20px;
	line-height: 1.5;
	margin-top: 2em;
	margin-bottom: 1em;
}
.page-template-drone #service-kv2 .section-wrap ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
}
.page-template-drone #service-kv2 .section-wrap ul li {
	width: 33.33%;
	max-width: 260px;
	padding: 0 15px;
}
.page-template-drone #service-kv2 .section-wrap ul li .thumb img {
	max-width: 100px;
}
.page-template-drone #service-kv2 .section-wrap ul li p {
	font-size: 16px;
	font-weight: bold;
	margin-top: .5em;
}
.page-template-drone #service-kv2 .section-wrap ul li p .sp {
	display: none;
}
.page-template-drone #service-kv2 .section-wrap ul li p span {
	display: block;
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	font-size: 40px;
	line-height: 1.1;
}


@media screen and (max-width: 800px) {
	.drone-works .works-list li {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.drone-works .works-list li .thumb {
		width: 100%;
		padding-top: 56.25%;
	}
	.drone-works .works-list li .txt {
		width: 100%;
		padding: 25px;
	}
	.drone-works .btn-black {
		padding: 40px 0 0;
	}
	.drone-works .works-list li {
		margin-top: 15px;
	}
	.drone-works .works-list li .txt .client {
		font-size: 12px;
	}
	.drone-works .works-list li .txt .client:after {
		width: 25px;
	}
	.drone-works .works-list li .txt .movie-title {
		font-size: 17px;
	}
	.drone-works .works-list li .txt .movie-title br {
		display: none;
	}
	.drone-works .works-list li .txt .play-btn {
		font-size: 12px;
	}
	.page-template-drone #service-kv2 .section-wrap {
		padding: 60px 15px;
		min-height: 540px;
		background:url(../images/service/s-drone-kv2-bg-sp.jpg) center center/cover no-repeat;
	}
	.page-template-drone #service-kv2 .section-wrap h2 {
		font-size: 17px;
	}
	.page-template-drone #service-kv2 .section-wrap p {
		text-align: left;
		font-size: 13px;
	}
	.page-template-drone #service-kv2 .section-wrap h3 {
		font-size: 15px;
	}
	.page-template-drone #service-kv2 .section-wrap ul li {
		padding: 0 5px;
	}
	.page-template-drone #service-kv2 .section-wrap ul li p {
		font-size: 13px;
		line-height: 1.45;
		text-align: center;
	}
	.page-template-drone #service-kv2 .section-wrap ul li p .sp {
		display: block;
	}
	.page-template-drone #service-kv2 .section-wrap ul li .thumb img {
		max-width: 64px;
	}
	.page-template-drone #service-kv2 .section-wrap ul li p span {
		font-size: 28px;
		margin-top: .2em;
	}
}


/*------------------------------------------------------------
	SERVICE - LIVE
------------------------------------------------------------*/


.live-works .works-list {
	max-width: 1280px;
	width: 100%;
	margin: auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
}
.live-works .works-list li {
	width: 48%;
	background-color: #fff;
}
.live-works .works-list li .thumb {
	width: 100%;
	padding-top: 56.25%;
	position: relative;
	overflow: hidden;
}
.live-works .works-list li .thumb img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.live-works .works-list li .thumb a:hover img {
	-webkit-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	-o-transform: scale(1.1,1.1);
	transform: scale(1.1,1.1);
	-webkit-filter: brightness(.7);
	filter: brightness(.7);	
}
.live-works .works-list li .txt {
	width: 100%;
	background-color: #fff;
	padding: 8%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	text-align: left;
}
.live-works .works-list li .txt .client {
	color: #000;
	display: block;
	font-weight: bold;
	font-size: 14px;
	line-height: 1.6;
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 1.5em;
}

.live-works .works-list li .txt .client:after {
	content:"";
	display:block;
	width: 50px;
	height: 1px;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 0;
}
.live-works .works-list li .txt .movie-title {
	display: block;
	color: #888;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.5;
}
.live-works .works-list li .txt .play-btn {
	color: #000;
	display: block;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 2em;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.live-works .works-list li .txt .play-btn:hover {
	opacity: .6;
}
.live-works .btn-black {
	padding: 100px 0 0;
}


.page-template-live #service-kv2 .section-wrap {
	color: #fff;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	text-align: center;
	min-height: 520px;
	padding: 30px;
	background:url(../images/service/s-live-kv2-bg.jpg) center center/cover no-repeat;
}
.page-template-live #service-kv2 .section-wrap .txt-wrap {
	width: 100%;
}
.page-template-live #service-kv2 .section-wrap h2 {
	font-size: 25px;
	line-height: 1.68;
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0 auto 1.7em;
	padding-bottom: 1.5em;
}
.page-template-live #service-kv2 .section-wrap h2:after {
	content: '';
	display: block;
	height: 1px;
	width: 100%;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
}
.page-template-live #service-kv2 .section-wrap p {
	font-size: 15px;
	line-height: 2;
}

.page-template-live #service-kv2 .section-wrap ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	width: 100%;
	max-width: 330px;
	margin: 50px auto 0;
	justify-content: space-between;
}
.page-template-live #service-kv2 .section-wrap ul li {
	width: 18.18%;
}


@media screen and (max-width: 800px) {
	.live-works .works-list {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.live-works .works-list li {
		width: 100%;
		background-color: #fff;
		margin-top: 15px;
	}
	.live-works .works-list li:first-child {
		margin-top: 0;
	}
	.live-works .works-list li .txt {
		padding: 25px;
	}
	.live-works .works-list li .txt .client {
		font-size: 12px;
	}
	.live-works .works-list li .txt .client:after {
		width: 25px;
	}
	.live-works .works-list li .txt .movie-title {
		font-size: 17px;
	}
	.live-works .works-list li .txt .movie-title br {
		display: none;
	}
	.live-works .works-list li .txt .play-btn {
		font-size: 12px;
	}
	.live-works .btn-black {
		padding: 40px 0 0;
	}
	.page-template-live #service-kv2 .section-wrap {
		padding: 60px 15px;
		min-height: 345px;
		background:url(../images/service/s-live-kv2-bg-sp.jpg) center center/cover no-repeat;
	}
	.page-template-live #service-kv2 .section-wrap h2 {
		font-size: 17px;
	}
	.page-template-live #service-kv2 .section-wrap p {
		text-align: left;
		font-size: 13px;
	}
	.page-template-live #service-kv2 .section-wrap ul {
		max-width: 204px;
		margin: 25px auto 0;
		justify-content: space-between;
	}
	.page-template-live #service-kv2 .section-wrap ul li {
		width: 18%;
	}

}


/*------------------------------------------------------------
	SERVICE - PERSONALIZED VIDEO
------------------------------------------------------------*/

#scene .section-wrap {
	background-color: #f4f4f4;
	padding: 100px 30px;
}
#scene .section-wrap ul {
	width: 100%;
	max-width: 1100px;
	margin: auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
}
#scene .section-wrap ul li {
	width: 27.3%;
}
#scene .section-wrap ul li h4 {
	text-align: center;
	font-size: 20px;
	line-height: 1.6;
	margin: 0 0 1em;
}
#scene .section-wrap ul li p {
	text-align: left;
	font-size: 15px;
	line-height: 2;
}

.page-template-personalized-video #service-works .section-wrap {
	background-color: #fff;
}
.page-template-personalized-video #service-works .live-works .works-list li {
	border: 1px solid #ddd;
}

.page-template-personalized-video #service-kv2 .section-wrap {
	color: #fff;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	-ms-align-items: center;
	align-items: center;
	text-align: center;
	min-height: 654px;
	padding: 30px;
	background:url(../images/service/s-pv-kv2-bg.jpg) center center/cover no-repeat;
}
.page-template-personalized-video #service-kv2 .section-wrap .txt-wrap {
	width: 100%;
}
.page-template-personalized-video #service-kv2 .section-wrap h2 {
	font-size: 25px;
	line-height: 1.68;
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0 auto 1.7em;
	padding-bottom: 1.5em;
}
.page-template-personalized-video #service-kv2 .section-wrap h2:after {
	content: '';
	display: block;
	height: 1px;
	width: 100%;
	background-color: #fff;
	position: absolute;
	bottom: 0;
	left: 0;
}
.page-template-personalized-video #service-kv2 .section-wrap ul {
	width: 100%;
	max-width: 1100px;
	margin: auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
}
.page-template-personalized-video #service-kv2 .section-wrap ul li {
	width: 27.3%;
}
.page-template-personalized-video #service-kv2 .section-wrap ul li .thumb img {
	width: 192px;
}
.page-template-personalized-video #service-kv2 .section-wrap ul li h3 {
	font-size: 20px;
	line-height: 1.6;
	margin: 1em 0;
}
.page-template-personalized-video #service-kv2 .section-wrap ul li p {
	text-align: left;
	font-size: 15px;
	line-height: 2;
}

#effect .section-wrap {
	padding: 100px 30px;
}
#effect .section-wrap .content {
	width: 100%;
	max-width: 960px;
	margin: auto;
}
#effect .section-wrap .content h2 {
	font-size: 18px;
	line-height: 2;
}
#effect .section-wrap .content p {
	font-size: 15px;
	line-height: 2;
	margin-bottom: 2em;
}
#effect .section-wrap .effect {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	margin-bottom: 80px;
}
#effect .section-wrap .effect > li {
	width: 48%;
}

#effect .section-wrap .effect > li h3 {
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	line-height: 2;
	padding: .25em 0;
	text-align: center;
	margin-bottom: 5px;
}
#effect .section-wrap .effect > li.effect1 > h3 {
	background-color: #000;
}
#effect .section-wrap .effect > li.effect2 > h3 {
	background-color: #555;
}
#effect .section-wrap .effect > li .thumb {
	margin-bottom: 15px;
}
#effect .section-wrap .effect > li ul {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	text-align: center;
}
#effect .section-wrap .effect > li ul li {
	width: 33.3%;
	border-right: 1px solid #ddd;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: center;
}
#effect .section-wrap .effect > li ul li:first-child {
	border-left: 1px solid #ddd;
}
#effect .section-wrap .effect > li ul.line1 li {
	font-size: 13px;
	line-height: 1.5;
	padding: .75em 0 0;
}
#effect .section-wrap .effect > li ul.line1 li span {
	display: inline;
	white-space: nowrap;
}
#effect .section-wrap .effect > li ul.line2 li {
	font-size: 34px;
	line-height: 1.5;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
}
#effect .section-wrap .effect > li ul.line2 li span {
	font-size: 26px;
}
#effect .section-wrap .effect > li.effect1 ul.line2 li {
	color: #e33434;
}
#effect .section-wrap .effect > li.effect2 ul.line2 li {
	color: #999;
}
#effect .section-wrap .content > h3 {
	font-size: 20px;
	line-height: 1.9;
	text-align: center;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	padding: .5em 0;
	margin-bottom: 3em;
}
#effect .section-wrap .content > h3 span {
	display: inline;
	white-space: nowrap;
}
#effect .section-wrap .content > h4 {
	text-align: center;
	font-size: 25px;
	line-height: 1.9;
}
#effect .section-wrap .content > h4 span {
	display: inline;
	white-space: nowrap;
}

@media screen and (max-width: 800px) {
	#scene .section-wrap {
		padding: 50px 15px;
	}
	#scene .section-wrap ul {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#scene .section-wrap ul li {
		width: 100%;
	}
	#scene .section-wrap ul li .img {
		text-align: center;
		width: 100%;
	}
	#scene .section-wrap ul li .img img {
		width: 50%;
		max-width: 300px;
	}
	#scene .section-wrap ul li h4 {
		font-size: 17px;
		margin-bottom: .5em;
	}
	#scene .section-wrap ul li p {
		font-size: 13px;
		line-height: 1.8;
		margin-bottom: 1.8em;
	}
	.page-template-personalized-video #service-kv2 .section-wrap {
		padding: 60px 15px;
		min-height: 860px;
		background:url(../images/service/s-pv-kv2-bg-sp.jpg) center center/cover no-repeat;
	}
	.page-template-personalized-video #service-kv2 .section-wrap h2 {
		font-size: 17px;
	}
	.page-template-personalized-video #service-kv2 .section-wrap ul {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.page-template-personalized-video #service-kv2 .section-wrap ul li {
		width: 100%;
		margin-top: 25px;
	}
	.page-template-personalized-video #service-kv2 .section-wrap ul li:first-child {
		margin-top: 0;
	}
	.page-template-personalized-video #service-kv2 .section-wrap ul li .thumb img {
		width: 150px;
	}
	.page-template-personalized-video #service-kv2 .section-wrap ul li h3 {
		font-size: 17px;
	}
	.page-template-personalized-video #service-kv2 .section-wrap ul li p {
		font-size: 13px;
		line-height: 1.8;
	}
	#effect .section-wrap {
		padding: 50px 15px;
	}
	#effect .section-wrap .content h2 {
		font-size: 15px;
		line-height: 1.7;
		margin-bottom: .5em;
	}
	#effect .section-wrap .content p {
		font-size: 13px;
		line-height: 1.8;
		margin-bottom: 1.8em;
	}
	#effect .section-wrap .effect {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
		margin-bottom: 30px;
	}
	#effect .section-wrap .effect > li {
		width: 100%;
		margin-top: 25px;
	}
	#effect .section-wrap .effect > li:first-child {
		margin-top: 0;
	}
	#effect .section-wrap .effect > li .thumb img {
		width: 100%;
	}
	#effect .section-wrap .effect > li ul.line1 li {
		font-size: 11px;
	}
	#effect .section-wrap .effect > li ul li:first-child {
		border-left: none;
	}
	#effect .section-wrap .effect > li ul li:last-child {
		border-right: none;
	}
	#effect .section-wrap .effect > li ul.line2 li {
		font-size: 24px;
	}
	#effect .section-wrap .effect > li ul.line2 li span {
		font-size: 15px;
		vertical-align: bottom;
	}
	#effect .section-wrap .content > h3 {
		font-size: 15px;
		line-height: 1.6;
		padding: 1em 0;
	}
	#effect .section-wrap .content > h4 {
		font-size: 17px;
		line-height: 1.6;
	}
}




/*------------------------------------------------------------
	SERVICE - Web
------------------------------------------------------------*/


.page-template-web #message .message {
	display: block;
	text-align: center;
}
.page-template-web #message .message h2 {
	width: 100%;
	font-size: 24px;
	line-height: 42px;
	margin-bottom: 1.7em;
	padding-bottom: 1.7em;
	border-bottom: 1px solid #000;
}

@media screen and (max-width: 800px) {
	.page-template-web #message .message h2 {
		font-size: 17px;
		text-align: left;
		line-height: 1.7;
	}
	.page-template-web #message .message p {
		text-align: left;
		font-size: 14px;
	}
}

.web-works .works-list {
	max-width: 1280px;
	width: 100%;
	margin: auto;
}
.web-works .works-list li {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	margin-top: 6.25%;
}
.web-works .works-list li:first-child {
	margin-top: 0;
}
.web-works .works-list li:nth-child(even) {
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
.web-works .works-list li:nth-child(odd) {
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
}
.web-works .works-list li .thumb {
	width: 62.5%;
	padding-top: 35%;
	position: relative;
	overflow: hidden;
}
.web-works .works-list li .thumb img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.web-works .works-list li .txt {
	width: 37.5%;
	background-color: #fff;
	padding: 5.625%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	text-align: left;
}
.web-works .works-list li .txt .client {
	color: #000;
	display: block;
	font-weight: bold;
	font-size: 22px;
	line-height: 1.36;
	position: relative;
	padding-bottom: 1em;
	margin-bottom: 1.5em;
}

.web-works .works-list li .txt .client:after {
	content:"";
	display:block;
	width: 50px;
	height: 1px;
	background-color: #000;
	position: absolute;
	bottom: 0;
	left: 0;
}
.web-works .works-list li .txt .description {
	font-size: 16px;
	line-height: 1.875;
}
.web-works .btn-black {
	padding: 100px 0 0;
}


@media screen and (max-width: 800px) {
	
	.web-works .works-list li {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	.web-works .works-list li .thumb {
		width: 100%;
		padding-top: 56.25%;
	}
	.web-works .works-list li .txt {
		width: 100%;
		padding: 25px;
	}
	.web-works .btn-black {
		padding: 40px 0 0;
	}
	.web-works .works-list li {
		margin-top: 15px;
	}
	.web-works .works-list li .txt .client {
		font-size: 17px;
		margin-bottom: 1.25em;
	}
	.web-works .works-list li .txt .client:after {
		width: 25px;
	}
	.web-works .works-list li .txt .description {
		font-size: 14px;
		line-height: 1.8;
	}
}


#web-our_clients .section-wrap {
	width: 100%;
	max-width: 960px;
	margin: auto;
	padding: 100px 30px;
	text-align: center;
	background-color: #fff;
	background-size: contain;
}

#web-our_clients .logo-list {
	margin: -2.8% auto 60px;
	width: 100%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
}
#web-our_clients .logo-list li {
	width: 22.9%;
	margin-right: 2.8%;
	margin-top: 2.8%;

}
#web-our_clients .logo-list li:nth-child(4n) {
	margin-right: 0;
}

@media screen and (max-width: 800px) {
	#web-our_clients .section-wrap {
		width: 100%;
		padding: 50px 30px;
	}
	#web-our_clients .logo-list {
		margin-bottom: 5px;
	}
	#web-our_clients .logo-list li {
		width: 44.6%;
		margin-right: 10.8%;
	}
	#web-our_clients .logo-list li:nth-child(2n) {
		margin-right: 0;
	}
	#web-wrap #web-our_clients .title h3 {
		margin-bottom: 2em;
	}
}

#scene-web .section-wrap {
	padding: 100px 0;
	background-color: #f4f4f4;
}
#scene-web ul {
	width: 100%;
	max-width: 1000px;
	margin: auto;
	margin-top: -20px;
}
#scene-web ul li {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	margin-top: 50px;
}
#scene-web ul li:nth-child(odd) {
	-webkit-flex-direction: row-reverse;
	-moz-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	-o-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
#scene-web ul li:nth-child(even) {
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	-o-flex-direction: row;
	flex-direction: row;
}
#scene-web ul li .txt {
	width: 47%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
}
#scene-web ul li .img {
	width: 53%;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-ms-align-items: center;
	align-items: center;
	justify-content: flex-end;
	padding: 0 20px 0 0;
}
#scene-web ul li:nth-child(even) .img {
	padding: 0 0 0 20px;
	justify-content: flex-start;
}
#scene-web ul li:nth-child(1) .img img {
	max-width: 452px;
}
#scene-web ul li:nth-child(2) .img img {
	max-width: 494px;
}
#scene-web ul li:nth-child(3) .img {
	justify-content: center;
}
#scene-web ul li:nth-child(3) .img img {
	max-width: 291px;
}
#scene-web ul li:nth-child(4) .img img {
	max-width: 501px;
}
#scene-web ul li:nth-child(5) .img img {
	max-width: 481px;
}

#scene-web ul li .txt-wrap {
	padding: 0 50px 0 20px;
	position: relative;
	width: 100%;
}
#scene-web ul li:nth-child(even) .txt-wrap {
	padding: 0 20px 0 50px;
}
#scene-web ul li .txt h2 {
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	font-size: 70px;
	line-height: .97;
	position: relative;
	z-index: 2;
}
#scene-web ul li .txt h2 > span {
	display: inline-block;
	text-align: left;
	position: relative;
}
#scene-web ul li .txt h2 > span > span {
	position: relative;
	z-index: 1;
}
#scene-web ul li .txt-wrap h2 > span:before {
	position: absolute;
	top: -65px;
	left: -30px;
	z-index: 1;
	font-size: 120px;
	line-height: 1;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
	color: #ddd;
}
#scene-web ul li:nth-child(even) .txt-wrap h2 > span:before {
	left: auto;
	right: -85px;
}
#scene-web ul li:nth-child(1) .txt-wrap h2 > span:before {
	content: '01';
}
#scene-web ul li:nth-child(2) .txt-wrap h2 > span:before {
	content: '02';
}
#scene-web ul li:nth-child(3) .txt-wrap h2 > span:before {
	content: '03';
}
#scene-web ul li:nth-child(4) .txt-wrap h2 > span:before {
	content: '04';
}
#scene-web ul li:nth-child(5) .txt-wrap h2 > span:before {
	content: '05';
}
#scene-web ul li:nth-child(6) .txt-wrap h2 > span:before {
	content: '06';
}

#scene-web ul li .txt h3 {
	font-size: 24px;
	font-weight: bold;
	line-height: 1.6;
	margin: 0 0 .75em;
}
#scene-web ul li .txt p {
	font-size: 15px;
	line-height: 2;
}
#scene-web .btn-black {
	padding-top: 90px;
}

@media screen and (max-width: 800px) {
	#scene-web .section-wrap {
		padding: 50px 30px;
	}
	#scene-web ul li {
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		-o-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#scene-web ul li .img {
		width: 100%;
		text-align: center;
		justify-content: center;
		padding: 0;
	}
	#scene-web ul li:nth-child(even) .img {
		padding: 0;
		justify-content: center;
	}
	#scene-web ul li:nth-child(1) .img img {
		max-width: 60.5vw
	}
	#scene-web ul li:nth-child(2) .img img {
		max-width: 65.8vw;
	}
	#scene-web ul li:nth-child(3) .img {
		justify-content: center;
	}
	#scene-web ul li:nth-child(3) .img img {
		max-width: 38.8vw;
	}
	#scene-web ul li:nth-child(4) .img img {
		max-width: 66.8vw;
	}
	#scene-web ul li:nth-child(5) .img img {
		max-width: 64vw;
	}
	#scene-web ul li .txt {
		width: 100%;
	}
	#scene-web ul li .txt-wrap,
	#scene-web ul li:nth-child(even) .txt-wrap {
		padding: 30px 0 0 0;
		padding-right: 0;
	}
	#scene-web ul li .txt h2 {
		font-size: 40px;
		line-height: 1;
		position: relative;
		z-index: 2;
	}
	#scene-web ul li .txt-wrap h2 > span:before,
	#scene-web ul li:nth-child(even) .txt-wrap h2 > span:before {
		top: -30px;
		left: -10px;
		right: auto;
		font-size: 68px;
	}
	#scene-web ul li .txt h3 {
		font-size: 17px;
	}
	#scene-web ul li .txt p {
		font-size: 14px;
		line-height: 1.8;
	}
	#scene-web ul li .txt p br {
		display: none;
	}
	#scene-web .btn-black {
		padding-top: 30px;
	}

}

#web-flow .section-wrap {
	padding: 100px 30px;
}
#web-flow .web-step ul {
	position: relative;
	max-width: 1280px;
	width: 100%;
	margin: auto;
	display: grid;
	text-align: center;
	grid-template-columns: 1fr 1fr 1fr;
	column-gap: 40px;
}
#web-flow .web-step ul::before {
	content: '';
	position: absolute;
	top: 105px;
	left: 17%;
	width: 66%;
	height: 1px;
	background-color: #ddd;
	
}
#web-flow .web-step ul li {
	position: relative;
	z-index: 1;
}
#web-flow .web-step ul li p.step {
	text-align: center;
	font-family: 'Roboto';
	font-weight: 500;
	font-size: 14px;
	line-height: 1;
	letter-spacing: .05em;
	text-indent: .05em;
	height: 40px;
}
#web-flow .web-step ul li .thumb {
	background-color: #fff;
	display: inline-block;
	max-width: 240px;
	width: 100%;
}
#web-flow .web-step ul li .thumb img {
	width: 130px;
}
#web-flow .web-step ul li h3 {
	font-size: 22px;
	line-height: 32px;
	font-weight: bold;
	margin: 1em 0;
}
#web-flow .web-step ul li p {
	font-size: 15px;
	line-height: 2;
	text-align: left;
}
@media screen and (max-width: 800px) {
	#web-flow .section-wrap {
		padding: 50px 15px;
	}
	#web-flow .web-step ul {
		display: block;
	}
	#web-flow .web-step ul::before {
		height: 100%;
		top: 0;
		left: 50%;
		width: 1px;
	}
	#web-flow .web-step ul li {
		background-color: #fff;
		padding: 10px 0;
	}
	#web-flow .web-step ul li:not(:first-child) {
		margin-top: 50px;
	}
	#web-flow .web-step ul li p.step {
		font-size: 11px;
		height: 20px;
	}
	#web-flow .web-step ul li .thumb {
		background-color: #fff;
		display: inline-block;
		max-width: 100%;
		width: 100%;
	}
	#web-flow .web-step ul li .thumb img {
		width: 90px;
	}
	#web-flow .web-step ul li h3 {
		font-size: 17px;
		line-height: 1.2;
		font-weight: bold;
		margin: 1em 0;
	}
	#web-flow .web-step ul li p {
		font-size: 14px;
		line-height: 1.8;
		text-align: left;
	}
}



@-webkit-keyframes fadeInUpC{0%{opacity:0;-webkit-transform:translate3d(0,50%,0);transform:translate3d(0,50%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpC{0%{opacity:0;-webkit-transform:translate3d(0,50%,0);transform:translate3d(0,50%,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInUpC{-webkit-animation-name:fadeInUpC;animation-name:fadeInUpC}




@-webkit-keyframes fadeInUpCSP{0%{opacity:0;-webkit-transform:translate3d(0,10%,0);transform:translate3d(0,10%,0)}to{opacity:1;-webkit-transform:none;transform:none}}@keyframes fadeInUpCSP{0%{opacity:0;-webkit-transform:translate3d(0,10%,0);transform:translate3d(0,10%,0)}to{opacity:1;-webkit-transform:none;transform:none}}.fadeInUpCSP{-webkit-animation-name:fadeInUpCSP;animation-name:fadeInUpCSP}