@charset "UTF-8";

#site-navigation li a,
a,
a:link,
a:visited,
a:hover,
a:active,
ul#breadcrumbs li,
.h_type00 .japanese {
	color: #fff;
}

.f_menu ul li a {
	color: #000;
}

.h_type00 {
	padding: 50px 0 69px 100px;
}

@media (max-width: 1080px) {
	.h_type00 {
		width: 96%;
		margin: 10px auto 0;
		padding: 50px 0 69px 0px;
	}
}

@media (max-width: 767px) {
	.h_type00 {
		padding: 0;
		padding-bottom: 20px;
		padding-top: 40px;
	}
}

.inner1080 {
	display: block;
}

.h_type00 .english,
.h_type00 .japanese {
	color: #fff;
	text-align: left;
	margin: 0 auto;
}

.h_type00 .japanese {
	font-weight: 400;
}

@media (max-width: 767px) {
	.h_type00 .japanese {
		font-size: 17px;
	}
}

.main_contents_wrap {
	background: #6E49B5;
}

.manual-top {
	padding: 52px 0 112px;
	position: relative;
}

.manual-top::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	background: url("../../img/manual/manual-img01.png") no-repeat center center;
	background-size: 100%;
	width: 550px;
	height: 628px;
}

@media screen and (min-width: 1440px) {
	.manual-top::after {
		width: 597px;
		height: 688px;
		content: "";
		position: absolute;
		bottom: 0;
		right: 0;
		background: url("../../img/manual/manual-img01.png") no-repeat center center;
		background-size: 100%;
	}
}

.manual-top h2 {
	/* font-family: 'Yu Gothic'; */
	font-style: normal;
	font-weight: 700;
	font-size: 68px;
	line-height: 130%;
	color: #FFFFFF;
	margin-bottom: 38px;
}

.manual-top p {
	/* font-family: 'Yu Gothic'; */
	font-style: normal;
	font-weight: 500;
	font-size: 20px;
	line-height: 180%;
	color: #FFFFFF;
	max-width: 563px;
}

.manual-top p span {
	font-weight: bold;
	text-decoration-line: underline;
	text-decoration-style: wavy;
	text-decoration-color: white;
	text-decoration-thickness: 11.5%;
}

.manual-top p .spanlist {
	text-decoration-line: none;
	font-weight: bold;
	margin-left: 30px;
	list-style: unset;
	display: list-item;
}


.manual-blue-container {
	position: relative;
	background: url("../../img/manual/manual-blue-bk.jpg") repeat center center;
	background-size: 100%;
	width: 100%;
	height: auto;
	padding: 160px 0 120px;
}

.top-absolute-img-container {
	width: 785px;
	height: auto;
	position: absolute;
	top: -50px;
	left: 0;
	right: 0;
	margin: auto;
}

.top-absolute-img-container img {
	width: 100%;
}

.manual-blue-box-container {
	/* width: 100%; */
	width: 88%;
	background-color: #FFFFFF;
	padding: 60px 60px 49px;
	border-radius: 16px;
	margin-bottom: 80px;
	position: relative;
}

@media screen and (max-width: 1258px) {
	.manual-blue-box-container {
		width: -webkit-fill-available;
	}
}

.absolute-number {
	position: absolute;
	top: -50px;
	left: -50px;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background-color: #EA6024;
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 500;
	font-size: 36px;
	/* line-height: 100%; */
	text-align: center;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
}

.manual-blue-box-container h2 {
	font-style: normal;
	font-weight: 700;
	font-size: 32px;
	line-height: 51px;
	color: #000000;
	padding-bottom: 16px;
	border-bottom: solid #EA6024 1px;
	margin-bottom: 32px;
}

.box-content-flex {
	display: flex;
	justify-content: space-between;
}

.manual-blue-box-container h3 {
	font-style: normal;
	font-weight: 700;
	font-size: 24px;
	line-height: 38px;
	color: #000000;
	max-width: 530px;
	margin-bottom: 11px;
}

.flex-list-content p {
	list-style: none;
	position: relative;
	padding-left: 24px;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 200%;
	color: #000000;
	max-width: 530px;
	margin-bottom: 0;
}

.flex-list-content p::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 14px;
	height: 14px;
	background-color: #EA6024;
	border-radius: 50%;
}

.img-box-container {
	width: 320px;
	margin-left: auto;
}

.img-box-container img {
	width: 100%;
}



.pink-container {
	background-color: #FEF5F9;
	padding: 100px 0;
}

.pink-container h2 {
	font-style: normal;
	font-weight: 700;
	font-size: 36px;
	/* line-height: 100%; */
	text-align: center;
	color: #000000;
	margin-bottom: 80px;
}

.pink-box-mega-container {
	display: flex;
	flex-wrap: wrap;
	gap: 44px;
}

.pink-box {
	width: 270px;
	height: 298px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	border-radius: 16px;
	background-color: #FFFFFF;
	position: relative;
	padding: 36px 30px 0;
}

.pink-box::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: -33px;
	width: 18px;
	height: 22px;
	background: url(../../img/manual/blue-arrow.svg) no-repeat center center;
	background-size: 100%;
	top: 0;
	margin: auto;
}


.pink-box:nth-child(3)::after {
	display: none;
}


.pink-box:nth-child(5)::after {
	display: none;
}

.pink-box-number {
	position: absolute;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #EA6024;
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 500;
	font-size: 22px;
	/* line-height: 100%; */
	text-align: center;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
	top: 18px;
	left: 18px;
}

.pink-box-img-container {
	width: 60px;
	height: 60px;
	margin-bottom: 16px;
}

.pink-box-img-container img {
	width: 100%;
}

.pink-box h3 {
	font-style: normal;
	font-weight: 700;
	font-size: 18px;
	line-height: 140%;
	text-align: center;
	color: #000000;
	margin-bottom: 19px;
}

.pink-box p {
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 160%;
	text-align: left;
	color: #000000;
}



.sky-container {
	background-color: #F0F5F5;
	padding: 100px 0;
}

.sky-container h2 {
	/* font-family: 'Yu Gothic'; */
	font-style: normal;
	font-weight: 700;
	font-size: 36px;
	/* line-height: 57px; */
	text-align: center;
	color: #251E1C;
	margin-bottom: 70px;
}

.sky-white-container {
	width: 100%;
	background-color: #FFFFFF;
	padding: 48px 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.white-sky-img-container {
	width: 440px;
	margin-bottom: 40px;
}

.white-sky-img-container img {
	width: 100%;
}

.sky-white-container h3 {
	/* font-family: 'Yu Gothic'; */
	font-style: normal;
	font-weight: 700;
	font-size: 22px;
	line-height: 35px;
	color: #000000;
	margin-bottom: 6px;
}

.pink-separator {
	width: 36px;
	height: 3px;
	background-color: #F77BB0;
	margin-bottom: 18px;
}

.sky-white-container p {
	/* font-family: 'Yu Gothic'; */
	font-style: normal;
	font-weight: 500;
	font-size: 20px;
	line-height: 32px;
	text-align: center;
	color: #000000;
	margin-bottom: 0;
}

.question-answer {
	background-color: #fff;
	padding: 100px 0;
}

.question-answer h2 {
	/* font-family: 'Yu Gothic'; */
	font-style: normal;
	font-weight: 700;
	font-size: 36px;
	line-height: 57px;
	text-align: center;
	color: #251E1C;
	margin-bottom: 80px;
}

.question-mega-flex-container {
	display: flex;
	justify-content: space-between;
	margin-bottom: 80px;
}

.question-box {
	display: flex;
	gap: 13px;
}

.question-logo {
	width: 34px;
	height: 34px;
	background-color: #58C1C3;
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 500;
	font-size: 20px;
	text-align: center;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
}

.question-answer-content {
	max-width: 477px;
}

.question-title {
	font-style: normal;
	font-weight: 700;
	font-size: 22px;
	line-height: 35px;
	color: #000000;
	margin-bottom: 20px;
}

.answer-title {
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 26px;
	color: #000000;
}

.question-bottom-img-container {
	width: 398.58px;
	margin-bottom: 16px;
	margin-left: auto;
	margin-right: auto;
}

.question-bottom-img-container img {
	width: 100%;
}

.button-red-question {
	display: flex;
	padding: 10px;
	gap: 10px;
	background: #E84A4A;
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
	border-radius: 8px;
	font-style: normal;
	font-weight: 700;
	font-size: 24px;
	line-height: 38px;
	color: #FFFFFF;
	margin: 0 auto;
	max-width: 460px;
	justify-content: center;
	text-decoration: none;
	transition: all 0.3s ease;
}

.button-red-question:hover {
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.5);
	opacity: 0.8;
}


/* ================================================
   Responsive Styles - Tablet (max-width: 1080px)
   ================================================ */
@media screen and (max-width: 1080px) {

	.manual-top {
		padding: 40px 20px 90px;
	}

	.manual-top::after {
		width: 350px;
		height: 402px;
	}

	.manual-top h2 {
		font-size: 52px;
		margin-bottom: 30px;
	}

	.manual-top p {
		font-size: 18px;
	}

	.manual-blue-container {
		padding: 120px 0px 100px;
	}

	.top-absolute-img-container {
		width: 600px;
		top: -40px;
	}

	.manual-blue-box-container {
		padding: 50px 40px;
		margin-bottom: 60px;
	}

	.absolute-number {
		width: 100px;
		height: 100px;
		font-size: 30px;
		top: -40px;
		left: -40px;
	}

	.manual-blue-box-container h2 {
		font-size: 28px;
		line-height: 44px;
	}

	.manual-blue-box-container h3 {
		font-size: 22px;
		line-height: 34px;
	}

	.img-box-container {
		width: 280px;
	}

	.pink-container {
		padding: 80px 20px;
	}

	.pink-container h2 {
		font-size: 32px;
		margin-bottom: 60px;
	}

	.pink-box-mega-container {
		gap: 30px;
		justify-content: center;
	}

	.pink-box {
		width: 240px;
		height: 268px;
	}

	.sky-container {
		padding: 80px 20px;
	}

	.sky-container h2 {
		font-size: 32px;
		margin-bottom: 60px;
	}

	.white-sky-img-container {
		width: 380px;
	}

	.sky-white-container h3 {
		font-size: 20px;
	}

	.sky-white-container p {
		font-size: 18px;
	}

	.question-answer {
		padding: 80px 20px;
	}

	.question-answer h2 {
		font-size: 32px;
		margin-bottom: 60px;
	}

	.question-mega-flex-container {
		flex-direction: column;
		gap: 40px;
		margin-bottom: 60px;
	}

	.question-answer-content {
		max-width: 100%;
	}

	.question-bottom-img-container {
		width: 320px;
	}

	.button-red-question {
		font-size: 22px;
		max-width: 400px;
	}
}


/* ================================================
   Responsive Styles - Mobile (max-width: 767px)
   ================================================ */
@media screen and (max-width: 767px) {

	.manual-top {
		padding: 30px 15px 175px;
	}

	.manual-top::after {
		width: 200px;
		height: 230px;
		background-size: contain;
		left: 0;
		margin: auto;
	}

	.manual-top h2 {
		font-size: 32px;
		margin-bottom: 20px;
	}

	.manual-top p {
		font-size: 16px;
		max-width: 100%;
	}

	.manual-top p .spanlist {
		margin-left: 20px;
	}

	.manual-blue-container {
		padding: 80px 0 60px;
	}

	.top-absolute-img-container {
		width: 110%;
		max-width: 400px;
		top: -30px;
	}

	.manual-blue-box-container {
		padding: 30px 20px;
		margin-bottom: 60px;
	}

	.absolute-number {
		width: 60px;
		height: 60px;
		font-size: 24px;
		top: -33px;
		left: 0;
		right: 0;
		margin: auto;
	}

	.manual-blue-box-container h2 {
		font-size: 20px;
		line-height: 30px;
		margin-bottom: 20px;
		padding-bottom: 7px;
	}

	.box-content-flex {
		flex-direction: column;
		gap: 30px;
	}

	.manual-blue-box-container h3 {
		font-size: 18px;
		line-height: 30px;
		max-width: 100%;
	}

	.flex-list-content p {
		font-size: 14px;
		max-width: 100%;
		padding-left: 20px;
	}

	.flex-list-content p::before {
		width: 10px;
		height: 10px;
		top: 15px;
	}

	.img-box-container {
		width: 100%;
		max-width: 320px;
		margin: 0 auto;
	}

	.pink-container {
		padding: 60px 15px;
	}

	.pink-container h2 {
		font-size: 20px;
		margin-bottom: 30px;
	}

	.pink-box-mega-container {
		gap: 20px;
		justify-content: center;
	}

	.pink-box {
		width: 100%;
		max-width: 300px;
		height: auto;
		padding: 36px 20px 30px;
	}

	.pink-box::after {
		display: none !important;
	}

	.pink-box-number {
		width: 40px;
		height: 40px;
		font-size: 20px;
		top: 15px;
		left: 15px;
	}

	.pink-box h3 {
		font-size: 16px;
	}

	.pink-box p {
		font-size: 14px;
		margin-bottom: 0;
	}

	.sky-container {
		padding: 60px 15px;
	}

	.sky-container h2 {
		font-size: 20px;
		margin-bottom: 30px;
	}

	.sky-white-container {
		padding: 30px 15px;
		width: auto;
	}

	.white-sky-img-container {
		width: 90%;
		max-width: 300px;
		margin-bottom: 30px;
	}

	.sky-white-container h3 {
		font-size: 18px;
		line-height: 28px;
		text-align: center;
	}

	.pink-separator {
		width: 30px;
		height: 2px;
	}

	.sky-white-container p {
		font-size: 16px;
		line-height: 26px;
		padding: 0 15px;
	}

	.question-answer {
		padding: 60px 0;
	}

	.question-answer h2 {
		font-size: 20px;
		line-height: 30px;
		margin-bottom: 30px;
	}

	.question-mega-flex-container {
		flex-direction: column;
		gap: 30px;
		margin-bottom: 40px;
	}

	.question-box {
		align-items: flex-start;
	}

	.question-logo {
		width: 30px;
		height: 30px;
		font-size: 18px;
	}

	.question-answer-content {
		max-width: 88%;
	}

	.question-title {
		font-size: 18px;
		line-height: 28px;
		margin-bottom: 15px;
	}

	.answer-title {
		font-size: 14px;
		line-height: 22px;
	}

	.question-bottom-img-container {
		width: 90%;
		max-width: 280px;
	}

	.button-red-question {
		font-size: 18px;
		line-height: 28px;
		max-width: 100%;
		padding: 12px 20px;
	}
}

.cta_block {
	padding-bottom: 100px;
	padding-top: 100px;
	margin-top: -30px;
	margin-bottom: -30px;
}

@media screen and (max-width:767px) {
	.cta_block {
		padding-bottom: 60px;
		padding-top: 60px;
	}
}