@charset "utf-8";
/* CSS Document */

/* Main */
.Main-pc {
	position: relative;
	width: 100%;
	height: min(44.79166666666667vw, 860px);
	background-color: #c31400;
}

.MVText {
	width: min(50vw, 960px);
	padding-top: min(6.614583333333333vw, 127px);
	padding-left: min(8.020833333333333vw, 154px);
}

.Main-pc::before {
	position: absolute;
	content: "";
	background-image: url("../image/MVImage.png");
	background-size: contain;
	background-repeat: no-repeat;
	width: min(46.92708333333333vw, 901px);
	height: min(43.38541666666667vw, 833px);
	left: min(46.92708333333333vw, 901px);
	bottom: 0;
	animation: slideIn02 1.5s 1;
}

@keyframes slideIn02 {
  0% {
    opacity: 0;
  }  
  10% {
    opacity: 0;
    transform: translateX(1000px);
  }
  70% {
    opacity: 1;
    transform: translateX(0);
  }
}

@media screen and (max-width: 1200px) and (min-width: 769px) {
}

.Main-pc::after {
	position: absolute;
	content: "";
	background-image: url("../image/scroll.png");
	background-size: contain;
	background-repeat: no-repeat;
	z-index: 2;
	width: min(14.16666666666667vw, 272px);
	height: min(15.520833333333337vw, 298px);
	right: calc(50% - min(7.083333333333333vw, 136px));
	bottom: -2.34375vw;
}

.Main-under {
	background-color: #F1F1F1;
	height: min(4.84375vw, 93px);
}

/* onayami */
.onayami {
	padding-top: min(6.25vw, 120px);
	padding-bottom: min(3.125vw, 60px);
	background-color: #F1F1F1;
	position: relative;
}

.onayami::before {
	position: absolute;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-right: min(5.052083333333333vw, 97px) solid transparent;
	border-left: min(5.052083333333333vw, 97px) solid transparent;
	border-top: min(3.125vw, 60px) solid #f1f1f1;
	border-bottom: 0;
	bottom: -3.125vw;
	left: calc(50% - min(5.052083333333333vw, 97px));
}

.onayami-Title {
	/*font-size: clamp(2.0rem, 1.979166666666667vw, 3.8rem);*/
	font-size: clamp(3.0rem, 2.395833333333333vw, 4.6rem);
	text-align: center;
	font-weight: 800;
	position: relative;
}

.onayami-Title span {
	font-size: 125%;
	color: #CC1313;
}

.onayami-Title::before {
	position: absolute;
	content: "";
	width: 23vw;
	height: 2px;
	background-color: #202020;
	left: 0;
	top: 50%;
}

.onayami-Title::after {
	position: absolute;
	content: "";
	width: 23vw;
	height: 2px;
	background-color: #202020;
	right: 0;
	top: 50%;
}

.onayami-box {
	padding-top: min(3.125vw, 60px);
}

.onayami-item {
	margin: 0 auto min(2.083333333333333vw, 40px);
	background-color: #fff;
	width: min(52.08333333333333vw, 1000px);
	font-size: clamp(1.6rem, 1.666666666666667vw, 3.2rem);
	font-weight: 600;
	padding-top: 20px;
	padding-bottom: 23px;
	padding-left: min(4.166666666666667vw, 80px);
	position: relative;
}

.onayami-item:last-of-type {
	margin-bottom: 0;
}

.onayami-item::before {
	position: absolute;
	content: "";
	background-image: url("../image/onayami-item-check.svg");
	background-size: contain;
	background-repeat: no-repeat;
	width: min(1.822916666666667vw, 35px);
	height: min(1.510416666666667vw, 29px);
	left: min(0.78125vw, 15px);
	top: calc(50% - min(0.78125vw, 15px));
}

.onayami-item span {
	font-weight: 800;
}

/* strengths */
.strengths {
	padding-top: min(5.208333333333333vw, 100px);
}

.strengths-inner {
	width: min(47.91666666666667vw, 920px);
    margin: 0 auto;
}

@media screen and (max-width: 1200px) and (min-width: 769px) {
	.strengths-inner {
		width: min(56.25vw, 1080px);
	}
}

.strengths-Title {
	font-size: clamp(3.0rem, 3.333333333333333vw, 6.4rem);
	font-weight: 800;
	line-height: 1.3;
	position: relative;
	margin-bottom: min(2.604166666666667vw, 50px);
}

.strengths-Title::before {
	position: absolute;
	content: "";
	background-image: url("../image/strengths1.png");
	background-size: contain;
	background-repeat: no-repeat;
	width: min(20.98958333333333vw, 403px);
	height: min(20.36458333333333vw, 391px);
	right: 0;
	bottom: min(-2.604166666666667vw, -50px);
	z-index: -1;
}

.strengths-Title::after {
	position: absolute;
	content: "";
	height: 12px;
	width: min(23.95833333333333vw, 460px);
	bottom: -5%;
	left: 0;
	background-color: #EEFF07;
}
	
.strengths-item {
	padding: 45px 45px 20px;
}

.strengths-title {
	position: relative;
	text-align: center;
	font-size: clamp(2.0rem, 1.979166666666667vw, 3.8rem);
	line-height: 1.3;
	color: #fff;
	font-weight: 800;
	margin-bottom: min(1.041666666666667vw, 20px);
}

.strengths-title::before {
	position: absolute;
	content: "";
	background-image: url("../image/point1.png");
	background-size: contain;
	background-repeat: no-repeat;
	width: min(4.0625vw, 78px);
	height: min(2.239583333333333vw, 43px);
	left: 0;
	top: 0;
}

.strengths-title span {
	text-align: center;
	font-size: clamp(3.0rem, 3.020833333333333vw, 5.8rem);
}

.strengths-text {
	background-color: #fff;
	text-align: justify;
	font-size: clamp(1.4rem, 1.25vw, 2.4rem);
	font-weight: 400;
	padding: 23px 25px;
	line-height: 1.5;
}

.strengths-text span {
	font-weight: 400;
	font-size: 90%;
}

.strengths-item1 {
	background-image: url("../image/strengths2.png");
	background-size: cover;
	background-repeat: no-repeat;
	margin-bottom: min(2.34375vw, 45px);
}

.strengths-item2 {
	background-image: url("../image/strengths3.png");
	background-size: cover;
	background-repeat: no-repeat;
	margin-bottom: min(2.34375vw, 45px);
}

.strengths-item2 .strengths-title::before {
	background-image: url("../image/point2.png");
}

.strengths-item3 {
	background-image: url("../image/strengths4.png");
	background-size: cover;
	background-repeat: no-repeat;
}

.strengths-item3 .strengths-title::before {
	background-image: url("../image/point3.png");
}

/* tool-Title, flow-Title, faq-Title */
.tool-Title, .flow-Title, .faq-Title {
	text-align: center;
	font-size: clamp(3.0rem, 2.395833333333333vw, 4.6rem);
	font-weight: 800;
	letter-spacing: 0.05em;
}

.tool-Title span, .flow-Title span, .faq-Title span {
	position: relative;
}

.tool-Title span::before, .faq-Title span::before {
	position: absolute;
	content: "";
	background-image: url("../image/title-daruma-r.png");
	background-repeat: no-repeat;
	background-size: contain;
	right: -3.4vw;
	top: -3.6vw;
	width: min(6.510416666666667vw, 125px); 
	height: min(6.041666666666667vw, 116px);
}

.flow-Title span::before {
	position: absolute;
	content: "";
	background-image: url("../image/title-daruma-l.png");
	background-repeat: no-repeat;
	background-size: contain;
	left: -4.25vw;
	top: -4.5vw;
	width: min(8.072916666666667vw, 155px); 
	height: min(8.229166666666667vw, 158px);
}

.tool-Title span::after, .flow-Title span::after, .faq-Title span::after {
	position: absolute;
	content: "";
	height: 7px;
	width: 100%;
	bottom: -2%;
	left: 0;
	background-color: #CC1313;
}

/* tool */
.tool {
	padding-top: min(6.770833333333333vw, 130px);
}

.tool-box {
	display: -webkit-box;
	display: flex;
	-webkit-box-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	justify-content: space-between;
	gap: 3%;
	padding-top: min(3.90625vw, 75px);
}

/* flow */
.flow {
	padding-top: min(10.41666666666667vw, 200px);
}

.flow-wrapper {
	padding-top: min(6.510416666666667vw, 125px);
}

.flow-box {
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
}

.flow-item {
	font-size: clamp(2.0rem, 1.875vw, 3.6rem);
	font-weight: 800;
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	padding-top: 45px;
	padding-bottom: 40px;
	padding-left: min(2.083333333333333vw, 40px);
	padding-right: min(2.083333333333333vw, 40px);
	background-color: #fff;
	border-bottom: 3px solid #202020;
	border-left: 3px solid #202020;
	border-right: 3px solid #202020;
	position: relative;
}

.flow-item-red {
	color: #CC1313;
}

.flow-item::before {
	position: absolute;
	content: "";
	height: 3px;
	width: 100%;
	top: 0;
	left: 0;
	border-top: 3px solid;
	border-image: linear-gradient(90deg,rgba(32, 32, 32, 1) 0%, rgba(32, 32, 32, 1) 14%, rgba(255, 255, 255, 1) 14%, rgba(255, 255, 255, 1) 86%,rgba(32, 32, 32, 1) 86%, rgba(32, 32, 32, 1) 100%) 1;
}

.triangle {
	position: relative;
}

.triangle::after {
	position: absolute;
	content: "▶";
	top: 40%;
	right: 0;
	transform: translateX(5vw);
	color: #202020;
	font-size: clamp(1.4rem, 2.083333333333333vw, 4.0rem);
}

.flow-item1, .flow-item2, .flow-item3, .flow-item4, .flow-item5, .flow-item6 {
	position: relative;
}

.flow-item1::after, .flow-item2::after, .flow-item3::after, .flow-item4::after, .flow-item5::after, .flow-item6::after {
	position: absolute;
	font-family: "Inter", sans-serif;
	font-weight: 900;
	color: #202020;
	text-align: center;
	writing-mode: horizontal-tb;
	font-size: clamp(3.0rem, 2.708333333333333vw, 5.2rem);
	top: -5.5%;
	left: calc(50% - 1.6vw);
}
.flow-item1::after {
	content: "01";
}
.flow-item2::after {
	content: "02";
}
.flow-item3::after {
	content: "03";
}
.flow-item4::after {
	content: "04";
}
.flow-item5::after {
	content: "05";
}
.flow-item6::after {
	content: "06";
}

.flow-link {
	text-align: right;
	color: #CC1313;
	font-size: clamp(1.4rem, 1.145833333333333vw, 2.2rem);
	text-decoration: underline;
	padding-top: 35px;
}

/* faq */
.faq {
	padding-top: min(6.770833333333333vw, 130px);
	padding-bottom: min(10.416666666666677vw, 200px);
}

.faq-box {
	padding-top: min(3.90625vw, 75px);
}

.faq-item {
	background-color: #FFFBFB;
	padding: 25px 75px 30px;
	margin-top: 50px;
}

.faq-item:first-child {
	margin-top: 0;
}

.faq-Q {
	font-size: clamp(2.0rem, 1.770833333333333vw, 3.4rem);
	font-weight: 600;
	line-height: 1.5;
	position: relative;
	text-align: justify;
}

.faq-Q::before {
	position: absolute;
	content: "Q";
	color: #CC1313;
	font-size: clamp(2.0rem, 1.875vw, 3.6rem);
	top: -7.5%;
	left: -4%;
}

.faq-A {
	font-size: clamp(1.4rem, 1.25vw, 2.4rem);
	padding-top: 15px;
	line-height: 1.5;
	text-align: justify;
}

.faqbuttonWrap {
	padding-top: min(3.90625vw, 75px);
}

.faqbuttonWrap .button {
	background-color: #E81111;
	color: #fff;
	padding-top: 25px;
	padding-bottom: 25px;
	box-shadow:  0px 3px 6px 0px rgba(0, 0, 0, 0.16);
	display: block;
	text-align: center;
	font-size: clamp(2.0rem, 1.5625vw, 3.0rem);
	font-weight: 600;
	position: relative;
}

.faqbuttonWrap .button span {
	position: relative;
}

.faqbuttonWrap .button span::after {
	position: absolute;
	content: "▶";
	top: calc(50% - 0.7vw);
	right: -10%;
	color: #fff;
	font-size: clamp(1.4rem, 1.458333333333333vw, 2.8rem);
}

@media screen and (max-width: 768px) {
	.Main-sp {
		position: relative;
		margin-top: 9vh;
	}
	.Main-sp::after {
		position: absolute;
		content: "";
		background-image: url("../image/scroll.png");
		background-size: contain;
		background-repeat: no-repeat;
		z-index: 2;
		width: 35.41666666666667vw;
		height: 38.80208333333333vw;
		right: calc(50% - 17.70833333333334vw);
		bottom: -11.34375vw;
	}
	.onayami {
		padding-top: 15.625vw;
		padding-bottom: 7.8125vw;
	}
	.onayami::before {
		border-right: 12.63020833333333vw solid transparent;
		border-left: 12.63020833333333vw solid transparent;
		border-top: 7.8125vw solid #f1f1f1;
		border-bottom: 0;
		bottom: -7.8125vw;
		left: calc(50% - 12.63020833333333vw);
	}
	.onayami-Title {
		font-size: 7.291666666666667vw;
		line-height: 1.5;
	}
	.onayami-Title span {
		/*font-size: 5.46875vw;*//*4.2rem*/
		color: #CC1313;
	}
	.onayami-Title::before, .onayami-Title::after {
		display: none;
	}
	.onayami-box {
		padding-top: 5.859375vw;/*45px*/
	}
	.onayami-item {
		margin-bottom: 5.208333333333333vw;/*40px*/
		width: 100%;
		font-size: 5.46875vw;/*42px*/
		padding-left: 10.41666666666667vw;/*80px*/
		line-height: 1.25;
		padding-top: 4.166666666666667vw;
		padding-bottom: 4.557291666666667vw;
	}
	.onayami-item:last-of-type {
		margin-bottom: 0;
	}
	.onayami-item::before {
		width: 4.557291666666667vw;/*35px*/
		height: 3.776041666666667vw;/*29px*/
		left: 1.953125vw;/*15px*/
		top: calc(50% - 1.953125vw);
	}
	.strengths-inner {
		width: 92vw;
	}
	.strengths {
		padding-top: 11.06770833333333vw;/*85px*/
	}
	.strengths-Title {
		font-size: 7.291666666666667vw;/*5.6rem*/
		margin-bottom: 6.510416666666667vw;/*50px*/
	}
	.strengths-Title::before {
		width: 39.0625vw;
		height: 37.23958333333333vw;
		right: -5%;
		bottom: -6.510416666666667vw;
		z-index: -1;
	}
	.strengths-Title::after {
		width: 54vw;
		bottom: -2.3vw;
	}
	.strengths-item {
		padding: 15.625vw 3.90625vw 3.90625vw;
	}
	.strengths-title {
		font-size: 4.947916666666667vw;/*3.8rem*/
		margin-bottom: 3.90625vw;/*30px*/
	}
	.strengths-title::before {
		width: 22vw;
		height: 11.19791666666667vw;
		left: calc(50% - 10vw);
		top: -12.5vw;
	}
	.strengths-title span {
		font-size: 6.770833333333333vw;/*5.2rem*/
	}
	.strengths-text {
		font-size: 4.166666666666667vw;/*3.2rem*/
		padding: 3.90625vw;/*30px*/
		line-height: 1.75;
	}
	.strengths-item1 {
		margin-bottom: 5.859375vw;/*45px*/
	}
	.strengths-item2 {
		margin-bottom: 5.859375vw;/*45px*/
	}
	.tool-Title, .flow-Title, .faq-Title {
		font-size: 8.072916666666667vw;/*62px*/
	}
	.tool-Title span, .flow-Title span, .faq-Title span {
		position: relative;
	}
	.tool-Title span::before, .faq-Title span::before {
		right: -10vw;
		top: -9vw;
		width: 16.27604166666667vw; 
		height: 15.10416666666667vw;
	}
	.flow-Title span::before {
		left: -10vw;
		top: -10vw;
		width: 20.18229166666667vw; 
		height: 20.57291666666667vw;
	}
	.tool {
		padding-top: 15.625vw;
	}
	.tool-box {
		flex-wrap: wrap; 
		padding-top: 7.8125vw;
	}
	.tool-item {
		padding-top: 5.859375vw;/*45px*/
		width: 44vw;
	}
	.flow {
		padding-top: 26.04166666666667vw;
	}
	.flow-wrapper {
		padding-top: 15.625vw;
	}
	.flow-box {
		flex-direction: column;
	}
	.flow-item {
		font-size: 5.46875vw;/*42px*/
		writing-mode: horizontal-tb;
		-ms-writing-mode: horizontal-tb;
		text-align: center;
		padding-top: 5.859375vw;/*45px*/
		padding-bottom: 3.90625vw;/*30px*/
		padding-left: 0;
		padding-right: 0;
		background-color: #fff;
		margin-top: 13.02083333333333vw;/*100px*/
	}
	.flow-item:first-child {
		margin-top: 0;
	}
	.flow-item::before {
		border-image: linear-gradient(90deg,rgba(32, 32, 32, 1) 0%, rgba(32, 32, 32, 1) 35%, rgba(255, 255, 255, 1) 35%, rgba(255, 255, 255, 1) 65%,rgba(32, 32, 32, 1) 65%, rgba(32, 32, 32, 1) 100%) 1;
	}
	.triangle {
		position: relative;
	}
	.triangle::after {
		position: absolute;
		content: "▶";
		bottom: -21vw;
		right: 50vw;
		transform: translateX(0);
		transform: rotate(90deg);
		font-size: 5.46875vw;/*42px*/
	}
	.flow-item1, .flow-item2, .flow-item3, .flow-item4, .flow-item5, .flow-item6 {
		position: relative;
	}
	.flow-item1::after, .flow-item2::after, .flow-item3::after, .flow-item4::after, .flow-item5::after, .flow-item6::after {
		font-size: 6.770833333333333vw;
		top: -3.90625vw;/*30px*/
		left: calc(50% - 3.385416666666667vw);
	}
	.flow-link {
		font-size: 3.125vw;/*24px*/
		text-decoration: underline;
		padding-top: 35px;
	}
	.faq {
		padding-top: 15.625vw;
		padding-bottom: 31.25vw;
	}
	.faq-box {
		padding-top: 15.625vw;
	}
	.faq-item {
		padding: 5.46875vw 5.46875vw 5.46875vw 7.291666666666667vw;/*42px*/;
		margin-top: 8.463541666666667vw;
	}
	.faq-item:first-child {
		margin-top: 0;
	}
	.faq-Q {
		font-size: 4.947916666666667vw;/*3.8rem*/
	}
	.faq-Q::before {
		font-size: 4.947916666666667vw;/*3.8rem*/
		top: 0;
		left: -4vw;
	}
	.faq-A {
		font-size: 4.166666666666667vw;/*3.2rem*/
	}
	.faqbuttonWrap {
		padding-top: 9.765625vw;
	}
	.faqbuttonWrap .button {
		padding-top: 3.90625vw;
		padding-bottom: 3.90625vw;
		font-size: 4.947916666666667vw;/*3.8rem*/
	}
	.faqbuttonWrap .button span {
		position: relative;
	}
	.faqbuttonWrap .button span::after {
		/*border-top: 1.432291666666667vw solid transparent;
		border-bottom: 1.432291666666667vw solid transparent;
		border-left: 2.604166666666667vw solid #ffffff;
		border-right: 0;*/
		top: calc(50% - 2.083333333333334vw);
		right: -6vw;
		font-size: 4.166666666666667vw;/*3.2rem*/
	}
}
