@charset "UTF-8";



	
/* service01
------------------------------ */
#service01 .text {
	width: 50%;
	order: 1;
}
	#service01 .text a.bnr {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 40px;
		background: #F1F8FC;
		border-radius: 20px;
		padding: 30px;
	}
	#service01 .text a.bnr:hover {
		background: #E5F6FF;
	}
		#service01 .text a.bnr dl dt {
			font-size: 2.4rem;
			font-weight: 700;
			line-height: 1.5em;	
			margin-bottom: 3px;
		}
		#service01 .text a.bnr dl dd {
		}

#service01 .pht {
	width: 40%;
	border-radius: 20px;
	overflow: hidden;
	order: 2;
}
	#service01 .pht img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}


#service01 .loopSlider {
	height: 225px;
	overflow: hidden;
	position: relative;
	margin-top: 150px;
}
	#service01 .loopSlider .loopslider_wrap {
		height: 225px;
		display: -webkit-flex;
		display: flex;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
	}
		#service01 .loopSlider .loopslider_wrap ul {
			display: -webkit-flex;
			display: flex;
		}
			#service01 .loopSlider .loopslider_wrap ul li {
				width: 400px;
				margin: 0 10px;
			}
				#service01 .loopSlider .loopslider_wrap ul li img {
					border-radius: 20px;
				}
@media screen and (max-width: 1024px) {
	#service01 .text {
		width: 55%;
	}
		#service01 .text a.bnr {
			margin-top: 3vw;
			border-radius: 2vw;
			padding: 3vw;
		}
			#service01 .text a.bnr dl {
				width: 65%;
			}
			#service01 .text a.bnr dl dt {
				font-size: 2.2vw;
				margin-bottom: 1vw;
			}

	#service01 .pht {
		width: 40%;
		border-radius: 2vw;
	}


	#service01 .loopSlider {
		height: 22.5vw;
		margin-top: 15vw;
	}
		#service01 .loopSlider .loopslider_wrap {
			height: 22.5vw;
		}
			#service01 .loopSlider .loopslider_wrap ul li {
				width: 40vw;
				margin: 0 1vw;
			}
				#service01 .loopSlider .loopslider_wrap ul li img {
					border-radius: 2vw;
				}
}
@media screen and (max-width: 767px) {
	#service01 {
		padding-top: 12vw;
	}
		#service01 .inner {
			display: block;
		}
			#service01 .text {
				width: 100%;
				margin-top: 8vw;
			}
				#service01 .text a.bnr {
					display: block;
					margin-top: 6vw;
					border-radius: 4vw;
					padding: 6vw;
				}
					#service01 .text a.bnr dl {
						width: 100%;
						margin-bottom: 4vw;
					}
					#service01 .text a.bnr dl dt {
						font-size: 5.2vw;
						margin-bottom: 2vw;
					}

			#service01 .pht {
				width: 100%;
				border-radius: 4vw;
			}


			#service01 .loopSlider {
				height: 35vw;
				margin-top: 12vw;
			}
				#service01 .loopSlider .loopslider_wrap {
					height: 35vw;
				}
					#service01 .loopSlider .loopslider_wrap ul li {
						width: 60vw;
						margin: 0 2vw;
					}
						#service01 .loopSlider .loopslider_wrap ul li img {
							border-radius: 4vw;
						}
}



	
/* service02
------------------------------ */
#service02 {
	position: relative;
}
#service02:before {
	content: "";
	width: 100%;
	height: 100%;
	background: url("../img/index/motif.svg") no-repeat center top / 100%;
	position: absolute;
	top: -220px;
	left: 0;
	pointer-events: none;
	z-index: -1;
}
	#service02 .text {
		width: 45%;
		order: 2;
		padding-top: 120px;
		padding-bottom: 40px;
	}
		#service02 .text .txt {
			margin-bottom: 40px;
		}

	#service02 .pht {
		width: 45%;
		order: 1;
		border-radius: 20px;
		overflow: hidden;
	}
		#service02 .pht img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}
@media screen and (max-width: 1024px) {
	#service02:before {
		top: -20vw;
	}
		#service02 .text {
			padding-top: 10vw;
			padding-bottom: 4vw;
		}
			#service02 .text .txt {
				margin-bottom: 40px;
			}

		#service02 .pht {
			border-radius: 2vw;
		}
}
@media screen and (max-width: 767px) {
	#service02:before {
		top: -22vw;
	}
		#service02 .inner {
			display: block;
		}
			#service02 .text {
				width: 100%;
				padding-top: 4vw;
				padding-bottom: 0;
				position: relative;
				z-index: 2;
			}
				#service02 .text .txt {
					margin-bottom: 3vw;
				}

			#service02 .pht {
				width: 100%;
				margin-top: -6.5vw;
				border-radius: 4vw;
			}
}



	
/* service03
------------------------------ */
#service03 {
	background: #F3F9FC;
}
	#service03 .text-pht {
		margin-bottom: 50px;
	}
		#service03 .text-pht .text {
			width: 48%;
		}
			#service03 .text-pht .text .txt {
				margin-bottom: 40px;
			}

		#service03 .text-pht .pht {
			width: 48%;
			border-radius: 20px;
			overflow: hidden;
		}
			#service03 .text-pht .pht img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

	#service03 .list .box {
		width: 48%;
		margin-right: 4%;
		margin-top: 4%;
		background: #E8F3F9;
		padding: 45px;
		border-radius: 20px;
	}
	#service03 .list .box:nth-child(2n) {
		margin-right: 0;
	}
		#service03 .list .box .head-tit {
			display: flex;
			justify-content: flex-start;
			align-items: center;
			margin-bottom: 20px;
		}
			#service03 .list .box .head-tit img {
				width: 80px;
			}

			#service03 .list .box .head-tit h3 {
				width: -webkit-calc(100% - 80px);
				width: calc(100% - 80px);
				padding-left: 15px;
				font-size: 2.4rem;
				font-weight: 700;
				line-height: 1.3em;
			}
@media screen and (max-width: 1024px) {
	#service03 .text-pht {
		margin-bottom: 5vw;
	}
		#service03 .text-pht .text .txt {
			margin-bottom: 3vw;
		}

		#service03 .text-pht .pht {
			border-radius: 2vw;
		}

	#service03 .list .box {
		padding: 4vw;
		border-radius: 2vw;
	}
		#service03 .list .box .head-tit {
			margin-bottom: 2vw;
		}
			#service03 .list .box .head-tit img {
				width: 8vw;
			}

			#service03 .list .box .head-tit h3 {
				width: -webkit-calc(100% - 8vw);
				width: calc(100% - 8vw);
				padding-left: 1.5vw;
				font-size: 2.4vw;
			}
}
@media screen and (max-width: 767px) {
	#service03 .text-pht {
		display: block;
		margin-bottom: 0;
	}
		#service03 .text-pht .text {
			width: 100%;
			position: relative;
			z-index: 2;
		}
			#service03 .text-pht .text .txt {
				margin-bottom: 5vw;
			}

		#service03 .text-pht .pht {
			width: 100%;
			border-radius: 4vw;
			margin-top: -6.5vw;
		}

	#service03 .list {
		display: block;
	}
		#service03 .list .box {
			width: 100%;
			margin-right: 0;
			margin-top: 5vw;
			padding: 6vw;
			border-radius: 4vw;
		}
			#service03 .list .box .head-tit {
				margin-bottom: 4vw;
			}
				#service03 .list .box .head-tit img {
					width: 17vw;
				}

				#service03 .list .box .head-tit h3 {
					width: -webkit-calc(100% - 17vw);
					width: calc(100% - 17vw);
					padding-left: 3vw;
					font-size: 4.8vw;
				}
}



	
/* case
------------------------------ */
#case {
	background: #F3F9FC;
	position: relative;
}
	#case .marquee {
		display: flex;
		width: 100%;
		overflow: hidden;
		color: #fff;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
	}
		#case .marquee .marquee__item {
			flex: 0 0 auto;
			font-size: 12.0rem;
			font-weight: 600;
			white-space: nowrap;
			line-height: 1.3em;
			padding-right: 20px;
		}
		#case .marquee .marquee__item:nth-child(odd) {
			animation: loop 80s -40s linear infinite;
		}
		#case .marquee .marquee__item:nth-child(even) {
			animation: loop2 80s linear infinite;
		}
		@keyframes loop {
			0% {
				transform: translateX(100%);
			}
			to {
				transform: translateX(-100%);
			}
		}
		@keyframes loop2 {
			0% {
				transform: translateX(0);
			}
			to {
				transform: translateX(-200%);
			}
		}

	#case .title {
		margin-top: 40px;
	}

	#case .list .box {
		width: 32%;
		margin-right: 2%;
		margin-bottom: 40px;
	}
	#case .list .box:nth-child(3n) {
		margin-right: 0;
	}
		#case .list .box .pht {
			border-radius: 10px;
			overflow: hidden;
			position: relative;
		}
			#case .list .box .pht .job {
				display: inline-block;
				background: #fff;
				padding: 8px 20px;
				font-size: 1.4rem;
				font-weight: 500;
				line-height: 1;
				border-radius: 0 5px 0 0;
				position: absolute;
				bottom: 0;
				left: 0;
			}

		#case .list .box .text {
			padding: 20px 20px 0 20px;
		}
			#case .list .box .text h3 {
				font-size: 2.4rem;
				font-weight: 700;
				line-height: 1.3em;
				margin-bottom: 10px;
			}

	#case .achievements {
		margin-top: 40px;
		padding: 80px 50px;
		border-radius: 10px;
		overflow: hidden;
		background: url("../img/service02/achievements_bg.jpg") no-repeat center / cover;
	}
		#case .achievements h3 {
			font-size: 3.4rem;
			font-weight: 700;
			line-height: 1.3em;
			text-align: center;
			color: #fff;
			margin-bottom: 10px;
		}

		#case .achievements .txt {
			text-align: center;
			color: #fff;
			margin-bottom: 30px;
		}

		#case .achievements .btn {
			margin: 0 auto;
		}
@media screen and (max-width: 1024px) {
	#case .marquee .marquee__item {
		font-size: 12vw;
		padding-right: 2vw;
	}

	#case .title {
		margin-top: 4vw;
	}
	
	#case .list .box {
		margin-bottom: 4vw;
	}
		#case .list .box .pht {
			border-radius: 1vw;
		}
			#case .list .box .pht .job {
				padding: 0.8vw 2vw;
				font-size: 1.4vw;
				border-radius: 0 0.5vw 0 0;
			}

		#case .list .box .text {
			padding: 2vw 2vw 0 2vw;
		}
			#case .list .box .text h3 {
				font-size: 2.4vw;
				margin-bottom: 1vw;
			}

	#case .achievements {
		margin-top: 4vw;
		padding: 8vw 5vw;
		border-radius: 1vw;
	}
		#case .achievements h3 {
			font-size: 3.4vw;
			margin-bottom: 1vw;
		}

		#case .achievements .txt {
			margin-bottom: 3vw;
		}
}
@media screen and (max-width: 767px) {
	#case .marquee .marquee__item {
		font-size: 18vw;
		padding-right: 2vw;
	}

	#case .title {
		margin-top: 10vw;
	}
	
	#case .list {
		display: block;
	}
		#case .list .box {
			width: 100%;
			margin-right: 0;
			margin-bottom: 7vw;
		}
		#case .list .box:nth-last-child(1) {
			margin-bottom: 0;
		}
			#case .list .box .pht {
				border-radius: 2vw;
			}
				#case .list .box .pht .job {
					padding: 1.6vw 4vw;
					font-size: 3.4vw;
					border-radius: 0 1vw 0 0;
				}

			#case .list .box .text {
				padding: 4vw 4vw 0 4vw;
			}
				#case .list .box .text h3 {
					font-size: 5.2vw;
					margin-bottom: 2vw;
				}

	#case .achievements {
		margin-top: 13vw;
		padding: 12vw 7vw;
		border-radius: 2vw;
	}
		#case .achievements h3 {
			font-size: 5.6vw;
			margin-bottom: 4vw;
		}

		#case .achievements .txt {
			margin-bottom: 6vw;
		}
}



	
/* detail
------------------------------ */
#detail .list .box {
	width: 48%;
	margin-right: 4%;
	margin-top: 4%;
	background: #E9F5FB;
	border-radius: 10px;
	padding: 40px;
}
#detail .list .box:nth-child(2n) {
	margin-right: 0;
}
#detail .list .box:nth-child(2),
#detail .list .box:nth-child(3) {
	background: #F4FAFD;
}
	#detail .list .box .head {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin-bottom: 20px;
	}
		#detail .list .box .head img {
			width: 80px;
		}

		#detail .list .box .head h3 {
			width: -webkit-calc(100% - 80px);
			width: calc(100% - 80px);
			padding-left: 15px;
			font-size: 2.4rem;
			font-weight: 700;
			line-height: 1.3em;
		}
@media screen and (max-width: 1024px) {
	#detail .list .box {
		border-radius: 1vw;
		padding: 4vw;
	}
		#detail .list .box .head {
			margin-bottom: 2vw;
		}
			#detail .list .box .head img {
				width: 7vw;
			}

			#detail .list .box .head h3 {
				width: -webkit-calc(100% - 7vw);
				width: calc(100% - 7vw);
				padding-left: 1.5vw;
				font-size: 2.2vw;
			}
}
@media screen and (max-width: 767px) {
	#detail .list {
		display: block;
	}
		#detail .list .box {
			width: 100%;
			border-radius: 2vw;
			padding: 7vw;
			margin-right: 0;
			margin-top: 7vw;
		}
			#detail .list .box .head {
				margin-bottom: 4vw;
			}
				#detail .list .box .head img {
					width: 14vw;
				}

				#detail .list .box .head h3 {
					width: -webkit-calc(100% - 14vw);
					width: calc(100% - 14vw);
					padding-left: 3vw;
					font-size: 4.8vw;
				}
}



	
/* contents
------------------------------ */
#contents .text-pht {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 100px;
}
#contents .text-pht:nth-last-child(1) {
	margin-bottom: 0;
}
	#contents .text-pht .text {
		width: 47%;
	}
	#contents .text-pht:nth-child(2n) .text {
		order: 2;
	}

	#contents .text-pht .pht {
		width: 47%;
		border-radius: 10px;
		overflow: hidden;
	}
	#contents .text-pht:nth-child(2n) .pht {
		order: 1;
	}

#contents .bnr-cta {
	margin-top: 40px;
	padding: 80px 50px;
	border-radius: 10px;
	overflow: hidden;
	background: url("../img/service03/bnt_bg.jpg") no-repeat center / cover;
}
	#contents .bnr-cta h3 {
		font-size: 3.4rem;
		font-weight: 700;
		line-height: 1.3em;
		text-align: center;
		color: #fff;
		margin-bottom: 10px;
	}

	#contents .bnr-cta .txt {
		text-align: center;
		color: #fff;
		margin-bottom: 30px;
	}

	#contents .bnr-cta .btn {
		margin: 0 auto;
	}
@media screen and (max-width: 1024px) {
	#contents .text-pht {
		margin-bottom: 10vw;
	}
		#contents .text-pht .pht {
			border-radius: 1vw;
		}

	#contents .bnr-cta {
		margin-top: 4vw;
		padding: 8vw 5vw;
		border-radius: 1vw;
	}
		#contents .bnr-cta h3 {
			font-size: 3.4vw;
			margin-bottom: 1vw;
		}

		#contents .bnr-cta .txt {
			margin-bottom: 3vw;
		}
}
@media screen and (max-width: 767px) {
	#contents .text-pht {
		display: block;
		margin-bottom: 15vw;
	}
		#contents .text-pht .text {
			width: 100%;
			margin-bottom: 6vw;
		}
	
		#contents .text-pht .pht {
			width: 100%;
			border-radius: 2vw;
		}

	#contents .bnr-cta {
		margin-top: 13vw;
		padding: 12vw 7vw;
		border-radius: 2vw;
	}
		#contents .bnr-cta h3 {
			font-size: 5.6vw;
			margin-bottom: 4vw;
		}

		#contents .bnr-cta .txt {
			margin-bottom: 6vw;
		}
}