@charset "UTF-8";


	
	
/* pagetitle
--------------------- */
#pagetitle .detail {
	padding-top: calc(70 * var(--vw-ratio));
	padding-bottom: calc(70 * var(--vw-ratio));
}
	#pagetitle .bg-en {
		font-size: calc(80 * var(--vw-ratio));
		font-weight: 500;
		line-height: 1;
		color: #EFEFEF;
		position: absolute;
		top: calc(-30 * var(--vw-ratio));
		right: 0;
		z-index: -1;
	}

	#pagetitle .detail .info {
		margin-bottom: calc(25 * var(--vw-ratio));
	}
		#pagetitle .detail .info time {
			display: block;
			line-height: 1;
			color: #A8A8A8;
			margin-right: calc(15 * var(--vw-ratio));
		}

		#pagetitle .detail .cat li {
			margin-top: calc(10 * var(--vw-ratio));
			margin-right: calc(10 * var(--vw-ratio));
			line-height: 1;
		}
		#pagetitle .detail .cat li:nth-last-child(1) {
			margin-right: 0;
		}

	#pagetitle .detail h1 {
		font-size: calc(50 * var(--vw-ratio));
		font-weight: 700;
		line-height: 1.3em;
		margin-bottom: calc(15 * var(--vw-ratio));
	}
@media screen and (max-width: 767px) {
	#pagetitle .detail {
		padding-top: calc(35 * var(--vw-ratio));
		padding-bottom: calc(30 * var(--vw-ratio));
	}
		#pagetitle .bg-en {
			display: none;
		}

		#pagetitle .detail h1 {
			font-size: calc(30 * var(--vw-ratio));
		}
}


	
	
/* other
--------------------- */
#other {
	width: 100%;
	overflow: hidden;
}
	#other .swiper-container {
		position: relative;
		padding: 0 0  calc(60 * var(--vw-ratio)) 0;
	}
		#other .swiper-container a.linkbox {
			display: block;
		}
			#other .swiper-container a.linkbox .pht {
				border-radius: calc(5 * var(--vw-ratio));
			}

			#other .swiper-container a.linkbox time {
				display: block;
				line-height: 1;
				color: #A8A8A8;
				margin-top: calc(17 * var(--vw-ratio));
				margin-bottom: calc(10 * var(--vw-ratio));
			}

			#other .swiper-container a.linkbox .cat {
				margin-bottom: calc(10 * var(--vw-ratio));
			}
				#other .swiper-container a.linkbox .cat li {
					margin-bottom: calc(7 * var(--vw-ratio));
					margin-right: calc(7 * var(--vw-ratio));
					line-height: 1;
				}
				#other .swiper-container a.linkbox .cat li:nth-last-child(1) {
					margin-right: 0;
				}

			#other .swiper-container a.linkbox h3 {
				font-weight: 600;
				line-height: 1.4em;
				text-decoration: underline;
				margin-bottom: calc(12 * var(--vw-ratio));
			}
			#other .swiper-container a.linkbox:hover h3 {
				text-decoration: none;
			}

			#other .swiper-container a.linkbox .txt-13 {
				overflow: hidden;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 2;
				line-height: 1.6em;
				margin-bottom: calc(10 * var(--vw-ratio));
			}

			#other .swiper-container a.linkbox .more {
				display: inline-block;
				position: relative;
				padding-right: calc(15 * var(--vw-ratio));
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#other .swiper-container a.linkbox:hover .more {
				padding-right: calc(12 * var(--vw-ratio));
			}
			#other .swiper-container a.linkbox .more:before {
				content: "";
				width: calc(8 * var(--vw-ratio));
				height: calc(8 * var(--vw-ratio));
				border-radius: 50%;
				background: #00053A;
				position: absolute;
				top: 50%;
				right: 0;
				margin-top: calc(-3 * var(--vw-ratio));
			}

		#other .swiper-container .swiper-pagination {
			bottom: 0;
		}
			#other .swiper-container .swiper-pagination .swiper-pagination-bullet {
				width: 8px;
				height: 8px;
				border-radius: 4px;
				background: #97ABBF;
				border: none;
				opacity: 1;
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#other .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
				width: 22px;
				background: #0D2469;
				opacity: 1;
			}
@media screen and (max-width: 767px) {
	#other .swiper-container {
		position: relative;
		padding: 0 0  calc(40 * var(--vw-ratio)) 0;
		margin-bottom: calc(30 * var(--vw-ratio));
	}
	
	#other .btn {
		margin: 0 auto;
	}
}


	
	
/* case
--------------------- */
#case .sidenav {
	width: 20%;
	order: 1;
}
	#case .sidenav .cell {
		margin-bottom: calc(35 * var(--vw-ratio));
	}
		#case .sidenav h3 {
			margin-bottom: calc(10 * var(--vw-ratio));
		}

		#case .sidenav ul.cat-list {
			border-radius: calc(5 * var(--vw-ratio));
			border: solid 1px #1A2E44;
			background: #fff;
			overflow: hidden;
		}
			#case .sidenav ul.cat-list li {
				border-bottom: solid 1px #1A2E44;
			}
			#case .sidenav ul.cat-list li:nth-last-child(1) {
				border-bottom: none;
			}
				#case .sidenav ul.cat-list li a {
					display: flex;
					justify-content: flex-start;
					align-items: center;
					background: url("../img/icon_arrow_btn_border.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
					height: calc(50 * var(--vw-ratio));
					padding: 0 calc(15 * var(--vw-ratio));
					font-weight: 500;
					line-height: 1.3em;
					cursor: pointer;
					transition: 0.3s;
					-webkit-transition: 0.3s;
				}
				#case .sidenav ul.cat-list li a:hover {
					background: url("../img/icon_arrow_btn_blue.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
					color: #00053A;
				}

#case .content {
	width: 72%;
	order: 2;
}
	#case .content .list {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		column-gap: calc(50 * var(--vw-ratio));
		row-gap: calc(50 * var(--vw-ratio));
	}
		#case .content .list a.linkbox {
			display: block;
		}
			#case .content .list a.linkbox .pht {
				border-radius: calc(5 * var(--vw-ratio));
			}

			#case .content .list a.linkbox time {
				display: block;
				line-height: 1;
				color: #A8A8A8;
				margin-top: calc(17 * var(--vw-ratio));
				margin-bottom: calc(10 * var(--vw-ratio));
			}

			#case .content .list a.linkbox .cat{
				margin-bottom: calc(10 * var(--vw-ratio));
			}
				#case .content .list a.linkbox .cat li {
					margin-bottom: calc(7 * var(--vw-ratio));
					margin-right: calc(7 * var(--vw-ratio));
					line-height: 1;
				}
				#case .content .list a.linkbox .cat li:nth-last-child(1) {
					margin-right: 0;
				}

			#case .content .list a.linkbox h3 {
				font-weight: 600;
				line-height: 1.4em;
				text-decoration: underline;
				margin-bottom: calc(12 * var(--vw-ratio));
			}
			#case .content .list a.linkbox:hover h3 {
				text-decoration: none;
			}

			#case .content .list a.linkbox .txt-13 {
				overflow: hidden;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 2;
				line-height: 1.6em;
				margin-bottom: calc(10 * var(--vw-ratio));
			}

			#case .content .list a.linkbox .more {
				display: inline-block;
				position: relative;
				padding-right: calc(15 * var(--vw-ratio));
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#case .content .list a.linkbox:hover .more {
				padding-right: calc(12 * var(--vw-ratio));
			}
			#case .content .list a.linkbox .more:before {
				content: "";
				width: calc(8 * var(--vw-ratio));
				height: calc(8 * var(--vw-ratio));
				border-radius: 50%;
				background: #00053A;
				position: absolute;
				top: 50%;
				right: 0;
				margin-top: calc(-3 * var(--vw-ratio));
			}
@media screen and (max-width: 767px) {
	#case .inner {
		display: block;
	}
		#case .sidenav {
			width: 100%;
		}
	
		#case .content {
			width: 100%;
			margin-bottom: calc(60 * var(--vw-ratio));
		}
			#case .content .list {
				grid-template-columns: repeat(2, 1fr);
				column-gap: calc(25 * var(--vw-ratio));
				row-gap: calc(30 * var(--vw-ratio));
			}
				#case .content .list a.linkbox time {
					margin-top: calc(15 * var(--vw-ratio));
					margin-bottom: calc(10 * var(--vw-ratio));
				}

				#case .content .list a.linkbox .cat {
					font-size: calc(11 * var(--vw-ratio));
					margin-bottom: 0;
				}

				#case .content .list a.linkbox h3 {
					font-size: calc(15 * var(--vw-ratio));
					margin-bottom: calc(14 * var(--vw-ratio));
				}

				#case .content .list a.linkbox .txt-13 {
					display: none;
				}
}


	
	
/* case-detail
--------------------- */
#case-detail .pht {
	width: calc(600 * var(--vw-ratio));
	margin-left: calc(-60 * var(--vw-ratio));
}
	#case-detail .pht .flowting {
		border-radius: 0 calc(5 * var(--vw-ratio)) calc(5 * var(--vw-ratio)) 0;
		position: sticky;
		top: calc(130 * var(--vw-ratio));
		left: 0;
	}

#case-detail .content {
	width: calc(600 * var(--vw-ratio));
}
	#case-detail .content h2 {
		border-top: solid 1px #DDDFE0;
		margin-top: calc(70 * var(--vw-ratio));
		padding-top: calc(20 * var(--vw-ratio));
		margin-bottom: calc(15 * var(--vw-ratio));
		font-size: calc(26 * var(--vw-ratio));
		color: #00053A;
		position: relative;
	}
	#case-detail .content h2:nth-child(1) {
		margin-top: 0;
	}
	#case-detail .content h2:before {
		content: "";
		width: calc(30 * var(--vw-ratio));
		height: 1px;
		background: #00053A;
		position: absolute;
		top: -1px;
		left: 0;
	}

	#case-detail .content p {
		font-size: calc(16 * var(--vw-ratio));
		line-height: calc(32 * var(--vw-ratio));
		margin-bottom: calc(15 * var(--vw-ratio));
	}

	#case-detail .content .txt-13 {
		margin-top: calc(50 * var(--vw-ratio));
		font-size: calc(13 * var(--vw-ratio));
		line-height: calc(28 * var(--vw-ratio));
	}

	#case-detail .content .wp-block-list li {
		font-size: calc(16 * var(--vw-ratio));
		line-height: calc(28 * var(--vw-ratio));
		margin-bottom: calc(5 * var(--vw-ratio));
		padding-left: calc(15 * var(--vw-ratio));
		position: relative;
	}
		#case-detail .content .wp-block-list li:before {
			content: "";
			width: calc(8 * var(--vw-ratio));
			height: calc(8 * var(--vw-ratio));
			background: #A6AEC4;
			border-radius: 50%;
			position: absolute;
			top: calc(9 * var(--vw-ratio));
			left: 0;
		}

	#case-detail .content .btn {
		margin: calc(70 * var(--vw-ratio)) auto 0 auto;
	}
@media screen and (max-width: 767px) {
	#case-detail .inner {
		display: block;
	}
		#case-detail .pht {
			width: -webkit-calc(100% + calc(50 * var(--vw-ratio)));
			width: calc(100% + calc(50 * var(--vw-ratio)));
			margin-left: calc(-25 * var(--vw-ratio));
		}
			#case-detail .pht .flowting {
				border-radius: 0 calc(5 * var(--vw-ratio)) calc(5 * var(--vw-ratio)) 0;
				position: sticky;
				top: calc(130 * var(--vw-ratio));
				left: 0;
			}

		#case-detail .content {
			width: 100%;
			margin-top: calc(60 * var(--vw-ratio));
		}
			#case-detail .content h2 {
				margin-top: calc(60 * var(--vw-ratio));
				padding-top: calc(15 * var(--vw-ratio));
				margin-bottom: calc(10 * var(--vw-ratio));
				font-size: calc(22 * var(--vw-ratio));
			}

			#case-detail .content p {
				line-height: calc(30 * var(--vw-ratio));
			}

			#case-detail .content .txt-13 {
				margin-top: calc(30 * var(--vw-ratio));
				line-height: calc(26 * var(--vw-ratio));
			}

			#case-detail .content .wp-block-list li {
				line-height: calc(26 * var(--vw-ratio));
			}

			#case-detail .content .btn {
				margin: calc(60 * var(--vw-ratio)) auto 0 auto;
			}
}

/* relservice（事例詳細の関連サービス内部リンク）
---------------------------------------------------------- */
#case-detail .content .relservice {
	margin-top: calc(50 * var(--vw-ratio));
}
	#case-detail .content .relservice > .txt-14 {
		margin-bottom: calc(10 * var(--vw-ratio));
		font-weight: 500;
	}

	#case-detail .content .relservice ul {
		border-radius: calc(5 * var(--vw-ratio));
		border: solid 1px #1A2E44;
		background: #fff;
		overflow: hidden;
	}
		#case-detail .content .relservice ul li {
			border-bottom: solid 1px #1A2E44;
			margin-bottom: 0;
			padding-left: 0;
		}
		#case-detail .content .relservice ul li:nth-last-child(1) {
			border-bottom: none;
		}
			#case-detail .content .relservice ul li a {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				background: url("../img/icon_arrow_btn_border.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
				height: calc(50 * var(--vw-ratio));
				padding: 0 calc(15 * var(--vw-ratio));
				font-weight: 500;
				line-height: 1.3em;
				cursor: pointer;
				transition: 0.3s;
				-webkit-transition: 0.3s;
			}
			#case-detail .content .relservice ul li a:hover {
				background: url("../img/icon_arrow_btn_blue.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
				color: #00053A;
			}
@media screen and (max-width: 767px) {
	#case-detail .content .relservice {
		margin-top: calc(35 * var(--vw-ratio));
	}
		#case-detail .content .relservice ul li a {
			height: calc(54 * var(--vw-ratio));
		}
}