@charset "UTF-8";




	
/* kv
----------------------*/
#kv {
	padding-top: 180px;
}
	#kv .head {
		max-width: 980px;
		margin: 0 auto 60px auto;
		text-align: center;
	}
		#kv .head h1 {
			padding: 30px 100px;
			display: inline-block;
			font-size: 5.8rem;
			font-weight: 700;
			line-height: 1;
			position: relative;
		}
		#kv .head h1:before {
			content: "";
			width: 30px;
			height: 100%;
			background: url("../img/bar_left.svg") no-repeat left top / auto 100%;
			position: absolute;
			top: 0;
			left: 0;
		}
		#kv .head h1:after {
			content: "";
			width: 30px;
			height: 100%;
			background: url("../img/bar_right.svg") no-repeat right top / auto 100%;
			position: absolute;
			top: 0;
			right: 0;
		}

	#kv h2 {
		font-size: 3.6rem;
		font-weight: 700;
		line-height: 1.3em;
		margin-bottom: 20px;
		text-align: center;
	}

	#kv .txt {
		margin-bottom: 20px;
		text-align: center;
	}

	#kv .txt:nth-last-child(1) {
		margin-bottom: 0;
	}

	#kv .logo {
		width: 700px;
		height: 138px;
		overflow: hidden;
		margin: 40px auto 10px auto;
	}
@media screen and (max-width: 1024px) {
	#kv {
		padding-top: 150px;
	}
		#kv .head {
			margin: 0 auto 6vw auto;
		}
			#kv .head h1 {
				padding: 3vw 10vw;
				font-size: 5.8vw;
			}

		#kv h2 {
			font-size: 3.6vw;
			margin-bottom: 2vw;
		}

		#kv .txt {
			margin-bottom: 2vw;
		}

		#kv .logo {
			width: 70vw;
			height: 13.8vw;
			margin: 4vw auto 1vw auto;
		}
}
@media screen and (max-width: 767px) {
	#kv {
		padding-top: 100px;
	}
		#kv .head {
			margin: 0 auto 10vw auto;
		}
			#kv .head h1 {
				padding: 4vw 6vw;
				font-size: 6.8vw;
			}

		#kv h2 {
			font-size: 5.6vw;
			margin-bottom: 4vw;
		}

		#kv .txt {
			margin-bottom: 4vw;
		}

		#kv .logo {
			margin: 8vw auto 4vw auto;
		}
}




	
/* effect
----------------------*/
#effect .box {
	width: 48%;
	background: #F8F9F6;
	padding: 50px 40px;
}
	#effect .box h3 {
		font-size: 2.6rem;
		font-weight: 700;
		line-height: 1.3em;
		text-align: center;
		margin-bottom: 20px;
	}

	#effect .box .pht {
		margin-bottom: 20px;
	}

	#effect .box ul li {
		font-size: 1.6rem;
		line-height: 1.4em;
		margin-bottom: 5px;
	}
	#effect .box ul li:nth-last-child(1) {
		margin-bottom: 0;
	}

	#effect .box .row {
		width: 45%;
	}
		#effect .box .row h5 {
			font-size: 1.8rem;
			margin-bottom: 10px;
			margin-top: 20px;
		}
@media screen and (max-width: 1024px) {
	#effect .box {
		padding: 5vw 4vw;
	}
		#effect .box h3 {
			font-size: 2.6vw;
			margin-bottom: 2vw;
		}

		#effect .box .pht {
			margin-bottom: 2vw;
		}

		#effect .box ul li {
			font-size: 1.5vw;
			margin-bottom: 0.5vw;
		}

		#effect .box .row h5 {
			font-size: 1.7vw;
			margin-bottom: 1vw;
			margin-top: 2vw;
		}
}
@media screen and (max-width: 767px) {
	#effect .inner {
		display: block;
	}
		#effect .box {
			width: 100%;
			padding: 7vw 6vw;
		}
			#effect .box h3 {
				font-size: 4.6vw;
				margin-bottom: 4vw;
			}

			#effect .box .pht {
				margin-bottom: 4vw;
			}

			#effect .box ul li {
				font-size: 3.2vw;
				margin-bottom: 1vw;
			}

			#effect .box .row h5 {
				font-size: 3.6vw;
				margin-bottom: 2vw;
				margin-top: 4vw;
			}
}




	
/* point
----------------------*/
#point .text-pht {
	margin-bottom: 100px;
}
#point .text-pht:nth-last-child(1) {
	margin-bottom: 0;
}
	#point .text-pht .text {
		width: 47%;
	}
	#point .text-pht:nth-child(even) .text {
		order: 2;
	}
		#point .text-pht .text .head {
			font-size: 3.0rem;
			font-weight: 700;
			line-height: 1;
			color: #A5A5A5;
			padding-left: 18px;
			margin-bottom: 10px;
			position: relative;
		}
		#point .text-pht .text .head:before {
			content: "";
			width: 10px;
			height: 10px;
			border-radius: 50%;
			background: #B51A1F;
			position: absolute;
			top: 50%;
			left: 0;
			margin-top: -5px;
		}

		#point .text-pht .text h2 {
			font-size: 3.6rem;
			font-weight: 700;
			line-height: 1.3em;
			margin-bottom: 15px;
		}

		#point .text-pht .text h3 {
			font-size: 2.6rem;
			font-weight: 700;
			line-height: 1.3em;
			margin-top: 25px;
			margin-bottom: 12px;
		}

		#point .text-pht .text .btn {
			margin-top: 25px;
		}
			#point .text-pht .text .btn a {
				width: 100%;
			}

	#point .text-pht .pht {
		width: 53%;
	}
	#point .text-pht:nth-child(odd) .pht {
		margin-right: -6.8%;
	}
	#point .text-pht:nth-child(even) .pht {
		margin-left: -6.8%;
		order: 1;
	}
@media screen and (max-width: 1024px) {
	#point .text-pht {
		margin-bottom: 10vw;
	}
		#point .text-pht .text .head {
			font-size: 2.8vw;
			padding-left: 1.8vw;
			margin-bottom: 1vw;
		}
		#point .text-pht .text .head:before {
			width: 1vw;
			height: 1vw;
			margin-top: -0.5vw;
		}

		#point .text-pht .text h2 {
			font-size: 2.8vw;
			margin-bottom: 1.5vw;
		}

		#point .text-pht .text h3 {
			font-size: 2.3vw;
			margin-top: 2.5vw;
			margin-bottom: 1.2vw;
		}

		#point .text-pht .text .btn {
			margin-top: 2.5vw;
		}
}
@media screen and (max-width: 767px) {
	#point .text-pht {
		display: block;
		margin-bottom: 14vw;
	}
		#point .text-pht .text {
			width: 100%;
			margin-bottom: 6vw;
		}
			#point .text-pht .text .head {
				font-size: 5.0vw;
				padding-left: 4vw;
				margin-bottom: 2vw;
			}
			#point .text-pht .text .head:before {
				width: 2vw;
				height: 2vw;
				margin-top: -1vw;
			}

			#point .text-pht .text h2 {
				font-size: 5.0vw;
				margin-bottom: 4vw;
			}

			#point .text-pht .text h3 {
				font-size: 4.4vw;
				margin-top: 5vw;
				margin-bottom: 3vw;
			}

			#point .text-pht .text .btn {
				margin-top: 2.5vw;
			}
	
		#point .text-pht .pht {
			width: 100%;
			margin: 0 !important;
		}
}
	



	
/* faq
----------------------*/
#faq .ttl {
	width: 150px;
	-ms-writing-mode: tb-lr;
	writing-mode: vertical-lr;
}
	#faq .ttl .en {
		font-size: 2.0rem;
		line-height: 1;
	}

	#faq .ttl h2 {
		font-size: 3.6rem;
		line-height: 1;
		margin-left: 10px;
	}


#faq .text {
	width: -webkit-calc(100% - 150px);
	width: calc(100% - 150px);
}
	#faq .text dl {
		background: #F8F9F6;
		margin-bottom: 15px;
	}
	#faq .text dl:nth-last-child(1) {
		margin-bottom: 0;
	}
		#faq .text dl dt {
			padding: 15px 50px 15px 50px;
			font-size: 2.0rem;
			line-height: 1.3em;
			font-weight: 600;
			background: url("../img/icon_open.svg") no-repeat right 20px center;
			position: relative;
			cursor: pointer;
		}
		#faq .text dl dt.active {
			background: url("../img/icon_close.svg") no-repeat right 20px center;
		}
		#faq .text dl dt:before {
			content: "Q";
			font-size: 2.2rem;
			font-weight: 700;
			line-height: 1.3em;
			font-family: 'Manrope', sans-serif;
			color: #C4C4C4;
			position: absolute;
			top: 15px;
			left: 20px;
		}

		#faq .text dl dd {
			display: none;
			padding: 0 20px 15px 50px;
			font-size: 1.6rem;
			line-height: 1.8em;
			position: relative;
		}
		#faq .text dl dd:before {
			content: "A";
			font-size: 2.2rem;
			font-weight: 700;
			line-height: 1.3em;
			font-family: 'Manrope', sans-serif;
			color: #B51A1F;
			position: absolute;
			top: 0;
			left: 20px;
		}
@media screen and (max-width: 1024px) {
	#faq .ttl {
		width: 15%;
	}
		#faq .ttl .en {
			font-size: 2.0vw;
		}

		#faq .ttl h2 {
			font-size: 3.6vw;
		}


	#faq .text {
		width: 85%;
	}
		#faq .text dl {
			margin-bottom: 2%;
		}
			#faq .text dl dt {
				padding: 3% 8% 3% 8%;
				font-size: 2.2vw;
				line-height: 1.3em;
				font-weight: 600;
				background: url("../img/icon_open.svg") no-repeat right 20px center;
				position: relative;
				cursor: pointer;
			}
			#faq .text dl dt.active {
				background: url("../img/icon_close.svg") no-repeat right 20px center;
			}
			#faq .text dl dt:before {
				display: flex;
				justify-content: center;
				align-items: center;
				height: 100%;
				font-size: 2.4vw;
				top: 0;
				left: 3%;
			}

			#faq .text dl dd {
				padding: 0 8% 3% 8%;
				font-size: 1.8vw;
			}
			#faq .text dl dd:before {
				font-size: 2.4vw;
				left: 3%;
			}
}
@media screen and (max-width: 767px) {
	#faq .inner {
		display: block;
	}
		#faq .ttl {
			width: 100%;
			writing-mode: inherit;
			writing-mode: inherit;
			text-align: center;
			margin-bottom: 7%;
		}
			#faq .ttl .en {
				font-size: 4.0vw;
				margin-bottom: 2%;
			}

			#faq .ttl h2 {
				font-size: 5.6vw;
				margin-left: 0;
			}


		#faq .text {
			width: 100%;
		}
			#faq .text dl {
				margin-bottom: 4%;
			}
				#faq .text dl dt {
					padding: 5% 15% 5% 14%;
					font-size: 3.8vw;
				}
				#faq .text dl dt:before {
					font-size: 4.0vw;
					left: 6%;
				}

				#faq .text dl dd {
					padding: 0 8% 5% 14%;
					font-size: 3.4vw;
				}
				#faq .text dl dd:before {
					font-size: 4.0vw;
					left: 6%;
				}
}