#page_head {
		padding-inline: 20px;
		-webkit-margin-before: 140px;
		        margin-block-start: 140px;
}
@media screen and (min-width: 425px) {
		#page_head {
				padding-inline: 30px;
		}
}
@media screen and (min-width: 768px) {
		#page_head {
				padding-inline: 40px;
		}
}
@media screen and (min-width: 992px) {
		#page_head {
				padding-inline: 70px min(100vw - 435px, 250px);
		}
}
@media screen and (min-width: 1300px) {
		#page_head {
				padding-inline: 70px;
		}
}
@media screen and (min-width: 992px) {
		#page_head {
				-webkit-margin-before: 160px;
				        margin-block-start: 160px;
		}
}

.page_title {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 10px 10px;
		-webkit-box-align: baseline;
		    -ms-flex-align: baseline;
		        align-items: baseline;
		-webkit-padding-after: 15px;
		        padding-block-end: 15px;
		border-bottom: solid 1px #222222;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
}
@media screen and (min-width: 992px) {
		.page_title {
				gap: 20px;
		}
}

.page_title_ja {
		font-size: 3.5rem;
		line-height: 1.3;
		font-weight: 500;
}
@media screen and (min-width: 768px) {
		.page_title_ja {
				font-size: 4.5rem;
		}
}
@media screen and (min-width: 992px) {
		.page_title_ja {
				font-size: 5rem;
		}
}

.page_title_en {
		font-size: 1.6rem;
		line-height: 1.5;
}

.section_title {
		position: relative;
		font-size: 2.5rem;
		font-weight: 500;
		line-height: 1.5;
		-webkit-padding-start: 20px;
		        padding-inline-start: 20px;
		-webkit-padding-after: 15px;
		        padding-block-end: 15px;
		border-bottom: solid 1px #DBD9CD;
}
@media screen and (min-width: 992px) {
		.section_title {
				font-size: 3rem;
		}
}
.section_title::before {
		content: "";
		position: absolute;
		top: 0.8em;
		left: 0;
		translate: 0 -50%;
		width: 10px;
		height: 8px;
		background-color: #008C64;
		border-radius: 0 100vmax 100vmax 0;
}

@media screen and (min-width: 768px) {
		.section_title br {
				display: none;
		}
}

.service_section_wrap {
		position: relative;
		padding-inline: 20px;
}
@media screen and (min-width: 425px) {
		.service_section_wrap {
				padding-inline: 30px;
		}
}
@media screen and (min-width: 768px) {
		.service_section_wrap {
				padding-inline: 40px;
		}
}
@media screen and (min-width: 992px) {
		.service_section_wrap {
				padding-inline: 70px min(100vw - 435px, 250px);
		}
}
@media screen and (min-width: 1300px) {
		.service_section_wrap {
				padding-inline: 70px;
		}
}

.service_text {
		-webkit-margin-before: 60px;
		        margin-block-start: 60px;
		font-size: 1.6rem;
		line-height: 1.8;
}

.anker_group {
		-webkit-margin-before: 30px;
		        margin-block-start: 30px;
		border: solid 1px #222222;
		border-radius: 10px;
		padding: 10px;
}
@media screen and (min-width: 768px) {
		.anker_group {
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				gap: 8px;
		}
}
.anker_group + .anker_group {
		-webkit-margin-before: 10px;
		        margin-block-start: 10px;
}

.anker_parent {
		position: relative;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-webkit-padding-start: 45px;
		        padding-inline-start: 45px;
		padding-block: 8px;
		border-radius: 10px;
		-webkit-transition: background-color 0.3s;
		transition: background-color 0.3s;
}
@media screen and (min-width: 768px) {
		.anker_parent {
				width: 50%;
				max-width: 255px;
		}
}
.anker_parent::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 20px;
		width: 7px;
		height: 12px;
		background-color: #008C64;
		-webkit-mask-image: url("../img/common/arrow.svg");
		        mask-image: url("../img/common/arrow.svg");
		-webkit-mask-size: cover;
		        mask-size: cover;
		translate: -50% -50%;
		-webkit-transition: background-color 0.3s, translate 0.3s;
		transition: background-color 0.3s, translate 0.3s;
}
.anker_parent span {
		place-content: center;
		height: 100%;
		border-left: solid 1px #DBD9CD;
		-webkit-padding-start: 15px;
		        padding-inline-start: 15px;
		color: #222222;
		font-size: 1.6rem;
		letter-spacing: 0.04em;
		-webkit-transition: color 0.3s;
		transition: color 0.3s;
}
@media (hover: hover) and (pointer: fine) {
		.anker_parent:hover {
				background-color: #008C64;
				color: #fff;
		}
		.anker_parent:hover span {
				color: #fff;
		}
		.anker_parent:hover::before {
				background-color: #fff;
				translate: -50% calc(-50% + 3px);
		}
}

.anker_child_group {
		display: -ms-grid;
		display: grid;
		gap: 10px;
		-webkit-margin-before: 10px;
		        margin-block-start: 10px;
}
@media screen and (min-width: 768px) {
		.anker_child_group {
				-webkit-margin-before: 0;
				        margin-block-start: 0;
				-webkit-box-flex: 1;
				    -ms-flex: 1;
				        flex: 1;
				gap: 7px;
				-ms-grid-columns: 1fr 7px 1fr;
				grid-template-columns: 1fr 1fr;
		}
}

.anker_group_wrap {
		-webkit-box-flex: 1;
		    -ms-flex: 1;
		        flex: 1;
		-webkit-margin-before: 10px;
		        margin-block-start: 10px;
}
@media screen and (min-width: 768px) {
		.anker_group_wrap {
				-webkit-margin-before: 0;
				        margin-block-start: 0;
		}
}
.anker_group_wrap .anker_child_group {
		-webkit-margin-before: 10px;
		        margin-block-start: 10px;
}

.anker_child_button {
		position: relative;
		display: block;
		padding-inline: 45px 0px;
		padding-block: 8px;
		border: solid 1px #DBD9CD;
		border-radius: 10px;
		-webkit-transition: background-color 0.3s;
		transition: background-color 0.3s;
}
@media screen and (min-width: 992px) {
		.anker_child_button {
				padding-inline: 45px 15px;
		}
}
.anker_child_button::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 20px;
		width: 7px;
		height: 12px;
		background-color: #008C64;
		-webkit-mask-image: url("../img/common/arrow.svg");
		        mask-image: url("../img/common/arrow.svg");
		-webkit-mask-size: cover;
		        mask-size: cover;
		translate: 0 -50%;
		-webkit-transition: background-color 0.3s, translate 0.3s;
		transition: background-color 0.3s, translate 0.3s;
}
.anker_child_button span {
		display: block;
		border-left: solid 1px #DBD9CD;
		-webkit-padding-start: 15px;
		        padding-inline-start: 15px;
		color: #222222;
		line-height: 1.5;
		height: 100%;
		padding-block: 10px;
		place-content: center;
		font-size: 1.6rem;
		letter-spacing: 0.04em;
		-webkit-transition: color 0.3s;
		transition: color 0.3s;
}
@media screen and (min-width: 992px) {
		.anker_child_button span {
				font-size: 1.5rem;
				line-height: 1.4;
		}
}
@media (hover: hover) and (pointer: fine) {
		.anker_child_button:hover {
				background-color: #008C64;
				color: #fff;
		}
		.anker_child_button:hover span {
				color: #fff;
		}
		.anker_child_button:hover::before {
				background-color: #fff;
				translate: 0 calc(-50% + 3px);
		}
}

#consulting, #solution {
		padding-inline: 20px;
		-webkit-margin-before: 80px;
		        margin-block-start: 80px;
}
@media screen and (min-width: 425px) {
		#consulting, #solution {
				padding-inline: 30px;
		}
}
@media screen and (min-width: 768px) {
		#consulting, #solution {
				padding-inline: 40px;
		}
}
@media screen and (min-width: 992px) {
		#consulting, #solution {
				padding-inline: 70px min(100vw - 435px, 250px);
		}
}
@media screen and (min-width: 1300px) {
		#consulting, #solution {
				padding-inline: 70px;
		}
}
@media screen and (min-width: 992px) {
		#consulting, #solution {
				-webkit-margin-before: 100px;
				        margin-block-start: 100px;
		}
}

#solution {
		-webkit-padding-after: 80px;
		        padding-block-end: 80px;
}
@media screen and (min-width: 992px) {
		#solution {
				-webkit-padding-after: 100px;
				        padding-block-end: 100px;
		}
}

.service_block {
		-webkit-margin-before: 80px;
		        margin-block-start: 80px;
}
@media screen and (min-width: 992px) {
		.service_block {
				-webkit-margin-before: 100px;
				        margin-block-start: 100px;
		}
}

.service_contents {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: reverse;
		    -ms-flex-direction: column-reverse;
		        flex-direction: column-reverse;
		gap: 30px;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-webkit-margin-before: 30px;
		        margin-block-start: 30px;
}
@media screen and (min-width: 768px) {
		.service_contents {
				-webkit-box-orient: horizontal;
				-webkit-box-direction: normal;
				    -ms-flex-direction: row;
				        flex-direction: row;
				-webkit-box-align: start;
				    -ms-flex-align: start;
				        align-items: flex-start;
				gap: 50px;
		}
}

.service_img {
		width: 250px;
}

.service_description {
		-webkit-box-flex: 1;
		    -ms-flex: 1;
		        flex: 1;
}

.service_description_text {
		font-size: 1.6rem;
		line-height: 1.8;
}

.solution_catch {
		-webkit-margin-before: 20px;
		        margin-block-start: 20px;
		font-size: 2rem;
		line-height: 1.5;
		font-weight: 500;
}

.solution_list {
		-webkit-margin-before: 20px;
		        margin-block-start: 20px;
		display: -ms-grid;
		display: grid;
		gap: 5px;
}
.solution_list li {
		position: relative;
		-webkit-padding-start: 20px;
		        padding-inline-start: 20px;
		font-size: 1.6rem;
		line-height: 1.8;
}
.solution_list li::before {
		content: "";
		position: absolute;
		top: 1em;
		left: 6px;
		width: 5px;
		height: 5px;
		border-radius: 50%;
		background-color: #222222;
		translate: 0 -50%;
}

.casestudy_box {
		-webkit-margin-before: 40px;
		        margin-block-start: 40px;
		padding: 30px;
		border: solid 1px #DBD9CD;
		border-radius: 6px;
}
@media screen and (min-width: 768px) {
		.casestudy_box {
				padding: 30px 40px;
		}
}

.casestudy_title {
		font-size: 2rem;
		line-height: 1;
		-webkit-padding-after: 20px;
		        padding-block-end: 20px;
		border-bottom: solid 1px #DBD9CD;
}

.casestudy_box_contents {
		-webkit-margin-before: 30px;
		        margin-block-start: 30px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		gap: 30px;
}
@media screen and (min-width: 768px) {
		.casestudy_box_contents {
				-webkit-box-orient: horizontal;
				-webkit-box-direction: normal;
				    -ms-flex-direction: row;
				        flex-direction: row;
				-webkit-box-align: start;
				    -ms-flex-align: start;
				        align-items: flex-start;
				gap: 50px;
		}
}

.casestudy_info {
		width: 250px;
}

.casestudy_thumbnail {
		aspect-ratio: 3/2;
		overflow: hidden;
		border-radius: 6px;
}
.casestudy_thumbnail img {
		display: block;
		width: 100%;
		height: 100%;
}

.casestudy_spec {
		-webkit-margin-before: 10px;
		        margin-block-start: 10px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
}
.casestudy_spec + .casestudy_spec {
		-webkit-margin-before: 7px;
		        margin-block-start: 7px;
}
.casestudy_spec dt {
		font-size: 1.3rem;
		line-height: 16px;
		-webkit-padding-end: 8px;
		        padding-inline-end: 8px;
		border-right: solid 1px #DBD9CD;
}
.casestudy_spec dd {
		-webkit-box-flex: 1;
		    -ms-flex: 1;
		        flex: 1;
		-webkit-padding-start: 8px;
		        padding-inline-start: 8px;
		font-size: 1.3rem;
		line-height: 16px;
}

.case_study_body {
		-webkit-box-flex: 1;
		    -ms-flex: 1;
		        flex: 1;
}

.case_study_title {
		font-size: 1.6rem;
		font-weight: 500;
		line-height: 1.8;
		letter-spacing: 0.02em;
}

.casestudy_category {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 5px;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		-webkit-margin-before: 15px;
		        margin-block-start: 15px;
}
.casestudy_category li {
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
}
.casestudy_category li span {
		display: block;
		border: solid 1px #DBD9CD;
		border-radius: 6px;
		padding: 8px;
		line-height: 1;
		-webkit-transition: background-color 0.3s;
		transition: background-color 0.3s;
		color: #222222;
		font-size: 1.2rem;
		line-height: 1;
		-webkit-transition: color 0.3s;
		transition: color 0.3s;
}

.casestudy_goul {
		-webkit-margin-before: 15px;
		        margin-block-start: 15px;
		font-size: 1.6rem;
		font-weight: 600;
		line-height: 1.5;
}

.casestudy_text {
		-webkit-margin-before: 20px;
		        margin-block-start: 20px;
		font-size: 1.6rem;
		line-height: 1.8;
}
@media screen and (min-width: 768px) {
		.casestudy_text {
				font-size: 1.4rem;
				-webkit-margin-before: 10px;
				        margin-block-start: 10px;
		}
}

.casestudy_link {
		-webkit-margin-before: 30px;
		        margin-block-start: 30px;
		font-size: 1.6rem;
		color: #222222;
		display: block;
		width: -webkit-fit-content;
		width: -moz-fit-content;
		width: fit-content;
		-webkit-margin-start: auto;
		        margin-inline-start: auto;
		-webkit-transition: opacity 0.3s;
		transition: opacity 0.3s;
}
.casestudy_link span {
		color: #008C64;
		font-weight: 300;
}
@media (hover: hover) and (pointer: fine) {
		.casestudy_link:hover {
				opacity: 0.7;
		}
}

.contact_cta {
		padding: 50px 35px;
		border: solid 1px #DBD9CD;
		border-radius: 6px;
}

.contact_cta_text {
		font-size: 1.7rem;
		line-height: 2;
		text-box-trim: trim-both;
		text-align: center;
}
@media screen and (min-width: 768px) {
		.contact_cta_text {
				font-size: 2rem;
		}
}
@media screen and (min-width: 768px) {
		.contact_cta_text .sp {
				display: none;
		}
}

.contact_cta_button {
		display: block;
		-webkit-margin-before: 40px;
		        margin-block-start: 40px;
		border-radius: 6px;
		background-color: #222222;
		padding-block: 27px;
		width: 100%;
		text-align: center;
		border: solid 1px #222222;
		-webkit-transition: background-color 0.3s;
		transition: background-color 0.3s;
		max-width: 350px;
		margin-inline: auto;
}
.contact_cta_button span {
		position: relative;
		color: #fff;
		font-size: 1.6rem;
		font-weight: 500;
		line-height: 1.5;
		-webkit-padding-start: 24px;
		        padding-inline-start: 24px;
		-webkit-transition: color 0.3s;
		transition: color 0.3s;
}
@media screen and (min-width: 992px) {
		.contact_cta_button span {
				font-size: 2rem;
		}
}
.contact_cta_button span::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 0;
		width: 18px;
		height: 20px;
		-webkit-mask-image: url(../img/common/contact_icon.svg);
		        mask-image: url(../img/common/contact_icon.svg);
		-webkit-mask-size: cover;
		        mask-size: cover;
		background-color: #DBD9CD;
		translate: 0 -50%;
		-webkit-transition: background-color 0.3s;
		transition: background-color 0.3s;
}
@media (hover: hover) and (pointer: fine) {
		.contact_cta_button:hover {
				background-color: #FAF8F4;
		}
		.contact_cta_button:hover span {
				color: #222222;
		}
		.contact_cta_button:hover span::before {
				background-color: #222222;
		}
}

.contact_cta {
		-webkit-margin-before: 40px;
		        margin-block-start: 40px;
}
@media screen and (min-width: 992px) {
		.contact_cta {
				-webkit-margin-before: 100px;
				        margin-block-start: 100px;
		}
}

.sticky_layout {
		position: fixed;
		bottom: 20px;
		right: 10px;
		width: 200px;
		display: none;
		z-index: 10;
		-webkit-transition: opacity 0.3s;
		transition: opacity 0.3s;
}
@media screen and (min-width: 992px) {
		.sticky_layout {
				display: block;
				right: 10px;
		}
}
@media screen and (min-width: 1150px) {
		.sticky_layout {
				right: min(100vw - 435px, 250px);
				translate: 100% 0;
		}
}
@media screen and (min-width: 1300px) {
		.sticky_layout {
				translate: 100% 0;
				right: calc((100vw - 800px) / 2 - 50px);
		}
}
.sticky_layout._hidden {
		opacity: 0;
}

.sticky_box {
		padding: 20px;
		border: solid 1px #222222;
		border-radius: 10px;
		container-type: inline-size;
		background-color: #FAF8F4;
}

.sticky_section_list {
		display: -ms-grid;
		display: grid;
		gap: 15px;
}
.sticky_section_list + .sticky_section_list {
		border-top: solid 1px #DBD9CD;
		-webkit-padding-before: 15px;
		        padding-block-start: 15px;
		-webkit-margin-before: 15px;
		        margin-block-start: 15px;
}

.sticky_section_list_item {
		position: relative;
		font-size: 1.2rem;
		line-height: 1.4;
}
.sticky_section_list_item:first-of-type {
		color: #008C64;
		font-size: 1.5rem;
}
.sticky_section_list_item::before {
		content: "";
		position: absolute;
		top: 0.5em;
		left: 0;
		width: 7px;
		height: 7px;
		background-color: #008C64;
		border-radius: 50%;
		translate: -13px 0;
		opacity: 0;
		-webkit-transition: opacity 0.3s;
		transition: opacity 0.3s;
}
.sticky_section_list_item a {
		font-weight: 500;
		color: currentColor;
		-webkit-transition: color 0.3s;
		transition: color 0.3s;
}
@media (hover: hover) and (pointer: fine) {
		.sticky_section_list_item a:hover {
				color: #008C64;
		}
}
.sticky_section_list_item._current::before {
		opacity: 1;
}

.sticky_contact_button {
		display: block;
		-webkit-margin-before: 20px;
		        margin-block-start: 20px;
		border-radius: 6px;
		background-color: #222222;
		padding-block: 30px;
		width: 100%;
		text-align: center;
		border: solid 1px #222222;
		-webkit-transition: background-color 0.3s;
		transition: background-color 0.3s;
		max-width: 350px;
		margin-inline: auto;
}
.sticky_contact_button span {
		position: relative;
		color: #fff;
		font-size: 1.6rem;
		font-weight: bold;
		line-height: 1.5;
		-webkit-padding-start: 24px;
		        padding-inline-start: 24px;
		-webkit-transition: color 0.3s;
		transition: color 0.3s;
}
.sticky_contact_button span::before {
		content: "";
		position: absolute;
		top: 50%;
		left: 0;
		width: 18px;
		height: 20px;
		-webkit-mask-image: url(../img/common/contact_icon.svg);
		        mask-image: url(../img/common/contact_icon.svg);
		-webkit-mask-size: cover;
		        mask-size: cover;
		background-color: #DBD9CD;
		translate: 0 -50%;
		-webkit-transition: background-color 0.3s;
		transition: background-color 0.3s;
}
@media (hover: hover) and (pointer: fine) {
		.sticky_contact_button:hover {
				background-color: #ffffff;
		}
		.sticky_contact_button:hover span {
				color: #222222;
		}
		.sticky_contact_button:hover span::before {
				background-color: #222222;
		}
}