@charset "utf-8";

/* ------------------------------
    products_index
------------------------------ */

/* itnro */

#intro .map {
	position: relative;
}
#intro .map .bg {
	width: 100%;
}
#intro .map .btn01 {
	position: absolute;
	right: 50px;
	top: 230px;
}
#intro .map .btn02 {
	position: absolute;
	left: 60px;
	top: 70px;
}
#intro .map .btn03 {
	position: absolute;
	right: 140px;
	top: 110px;
}

@media screen and (max-width : 767px) {

	#intro .map .btn01,
	#intro .map .btn02,
	#intro .map .btn03 {
		width: 25vw;
	}
	#intro .map .btn01 {
		right: 2vw;
		top: 26vw;
	}
	#intro .map .btn02 {
		left: 4vw;
		top: 5vw;
	}
	#intro .map .btn03 {
		right: 7vw;
		top: 8vw;
	}

}

/* detail */

#contents_main .catch {
	font-size: 1.8rem;
	line-height: 1.4;
	font-weight: bold;
}
#contents_main .intro .imgCol_t {
	padding-top: 30px;
}
#contents_main .intro .txt {
	font-size: 1.4rem;
}
#contents_main .intro .imgCol_i {
	width: 45%;
	text-align: center;
}
#contents_main .products {
	margin: 30px 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
#contents_main .products .grid_3 {
	justify-content: center;
	margin-top: 30px;
}
#contents_main .products .grid_3 .img {
	text-align: center;
}
#contents_main .products li {
	position: relative;
	padding-bottom: 20px;
}
#contents_main .products li:nth-child(3n+3)::before {
	content: '';
	position: absolute;
	width: calc( 300% + 120px );
	height: 1px;
	right: 0;
	top: 100%;
	border-top: 1px solid #ddd;
}
#contents_main .products li .txt {
	color: #29478c;
	text-align: center;
	font-size: 1.8rem;
	margin-top: .5em;
}
#contents_main .case {
	margin-top: 40px;
}
#contents_main .case .ttl-color {
	font-size: 1.4rem;
	font-weight: normal;
	margin-bottom: 1em;
}
#contents_main .case .col > *,
#contents_main .case .imgCol > * {
	margin-left: 20px;
}
#contents_main .case .imgCol .col {
	margin-top: 20px;
}
#juutaku .case .flex,
#juutaku .case .ttl-color {
	margin: 40px 0;
}

@media (min-width: 768px) {

	#contents_main .products li {
		width: calc((100% - 60px * 2) / 3);
		margin-left: 60px;
	}
	#contents_main .products li:nth-child(3n+1) {
		margin-left: 0;
	}
	#contents_main .case .flex {
		justify-content: center;
		align-items: flex-end;
	}
	#contents_main .case .flex > * {
		margin-left: 20px;
	}
	#contents_main .case .flex > *:first-child {
		margin-left: 0;
	}

}

@media screen and (max-width : 767px) {

	#contents_main .catch {
		font-size: 4vw;
		margin: 8% 0;
	}
	#contents_main .intro .imgCol_t {
		padding-top: 0;
	}
	#contents_main .intro .txt {
		font-size: 3.5vw;
	}
	#contents_main .intro .imgCol_i {
		width: 30%;
	}
	#contents_main .products {
		margin: 5% 0;
	}
	#contents_main .products .grid_3 {
		margin: 5% 0;
	}
	#contents_main .products li {
		padding-bottom: 0;
	}
	#contents_main .products li:nth-child(3n+3)::before {
		display: none;
	}
	#contents_main .products li .txt {
		font-size: 4vw;
	}
	#contents_main .case {
		margin-top: 5%;
	}
	#contents_main .case .ttl-color {
		font-size: 3.5vw;
	}
	#contents_main .case .col > * {
		margin-left: 3vw;
	}
	#contents_main .case .col > *:first-child,
	#contents_main .case .imgCol > * {
		margin-left: 0;
	}
	#contents_main .case .imgCol .col {
		margin-top: 5%;
	}
	#juutaku .case .flex,
	#juutaku .case .ttl-color {
		margin: 5% 0;
	}
	#contents_main .case .flex {
		justify-content: center;
	}
	#contents_main .case .flex > * {
		text-align: center;
	}

}