*,
*:before,
*:after {
	box-sizing: border-box;
}

html {
	font-size: 16px;
	height: 100%;
	scroll-behavior: smooth;
}

html,
body {
	overflow-x: hidden;
}

body {
	color: #202020;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	line-height: 1.5;
}

img,
video,
object {
	border: none;
	display: block;
	height: auto;
	max-width: 100%;
}

a {
	text-decoration: none;
}

/*===================================================================
# Header
===================================================================*/

.header {
	height: 88px;
	left: 0;
	margin-top: 24px;
	padding-inline: 20px;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 101;
}

.header__inner {
	align-items: center;
	background: rgba(245, 245, 248, 0.8);
	border-radius: 999px;
	display: grid;
	grid-template-columns: 131px 1fr;
	height: 100%;
	margin-inline: auto;
	max-width: 1376px;
	width: 100%;
}

.header__logo {
	margin-left: 66px;
}

.header__logo a svg {
	vertical-align: middle;
}

.header__nav {
	align-items: center;
	display: flex;
	justify-content: end;
	margin-right: 88px;
}

.header__list {
	display: flex;
	-moz-column-gap: 40px;
	column-gap: 40px;
}

.header__list li a {
	font-size: 20px;
	font-weight: 500;
	letter-spacing: 0.8px;
	line-height: normal;
	transition: color 0.3s ease;
}

/*===================================================================
# Footer
===================================================================*/

.footer {
	background: linear-gradient(to bottom, rgba(3, 116, 195, 0) -61.07%, rgba(3, 116, 195, 0.1) -49.23%, rgba(3, 116, 195, 0.5) -37.39%, rgba(3, 84, 163, 0.682046) 5.25%, rgba(2, 47, 127, 0.891061) 54.21%, #021C6C 96.85%);
	padding-block: 61px 73px;
}

.footer__inner.--under {
	max-width: 1120px; /* 下層ページ */
}

.footer__contents {
	display: flex;
	justify-content: space-between;
	max-width: 1140px;
}

.footer__content.--under {
	margin-left: -10px; /* 下層ページ */
}

.footer__title-wrap {
	align-items: center;
	display: flex;
	margin-bottom: 31px;
}

.footer__title {
	color: #F5F5F8;
	font-size: 28px;
	font-weight: 500;
	line-height: normal;
}

.footer__copyright {
	color: #F5F5F8;
	font-family: "Inria Sans";
	font-size: 14px;
	letter-spacing: 1.4px;
	line-height: normal;
	margin-left: 12px;
}

.footer__copyright.--pc {
	display: block;
}

.footer__copyright.--sp {
	display: none;
}

.footer__lists {
	display: flex;
	-moz-column-gap: 40px;
	column-gap: 40px;
	flex-wrap: wrap;
	margin-top: 5px;
	max-width: 413px;
	row-gap: 24px;
}

.footer__list a {
	color: var(--text-white, #F5F5F8);
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.64px;
	line-height: normal;
	transition: color 0.3s ease;
}

/*===================================================================
# Button
===================================================================*/

.btn__link {
	background: #fff;
	border: 1px solid #041F6E;
	display: inline-block;
	overflow: hidden;
	padding: 12px 75px 12px 32px;
	position: relative;
	transition: border-color 0.5s ease 0.2s;
}

.btn__link.--white {
	background: #041F6E;
	border-color: #F5F5F8;
}

.btn__link.--left {
	padding: 12px 31px 12px 65px;
}

.btn__link.--contact {
	width: 213px;
}

.btn__link::before {
	border-bottom: 61px solid #FF9900;
	border-right: 50px solid transparent;
	bottom: 0;
	box-sizing: border-box;
	content: "";
	left: 0;
	position: absolute;
	right: -50px;
	top: 0;
	transform: translateX(-100%);
	transition: all 0.5s ease-in-out;
	z-index: 1;
}

.btn__link-text,
.btn__link-arrow {
	color: #041F6E;
	font-size: 24px;
	font-weight: 500;
	letter-spacing: 0.96px;
	line-height: normal;
	transition: color 0.2s ease 0.2s;
}

.btn__link-text.--white,
.btn__link-arrow.--white {
	color: #F5F5F8;
}

.btn__link-text {
	display: inline-block;
	position: relative;
	z-index: 2;
}

.btn__link-arrow {
	left: calc(100% + 19px);
	position: absolute;
	top: 50%;
	transition: color 0.2s ease 0.3s, left 0.5s ease 0.2s;
	translate: 0 -50%;
}

.btn__link-arrow.--left {
	left: auto; /* サンクスページ */
	right: calc(100% + 8px);
	transition: color 0.3s ease 0s, right 0.5s ease 0s;
}

/*===================================================================
# ドロワー
===================================================================*/

.drawer {
	background: #FFF;
	border-radius: 32px 32px 28px 28px;
	height: auto;
	left: 50%;
	overflow-y: scroll;
	position: fixed;
	top: 12px;
	transition: translate 0.5s ease;
	translate: -50% -103%;
	width: calc(100% - 28px);
	z-index: 100;
}

.drawer.js-show {
	translate: -50% 0%;
}

.drawer__body {
	height: -moz-fit-content;
	height: fit-content;
	padding-block: 88px 40px;
	padding-left: 65px;
	width: 100%;
}

.drawer__list {
	display: flex;
	flex-direction: column;
	row-gap: 32px;
}

.drawer__list li a {
	color: #041F6E;
	font-size: 20px;
	line-height: normal;
}

.drawer__btn {
	background: #fff;
	border-radius: 100vmax;
	color: #001A75;
	display: inline-block;
	font-size: 20px;
	line-height: normal;
	padding: 6px 30px;
}

.drawer__icon {
	display: none;
	flex-direction: column;
	height: 20px;
	justify-content: space-between;
	position: fixed;
	right: 66px;
	top: 30px;
	width: 30px;
	z-index: 102;
}

.drawer__icon--bar {
	background-color: #041F6E;
	height: 2px;
	transition: all 0.5s ease;
	width: 100%;
}

/* メニューが開いている時 */

.drawer__icon.js-show .drawer__icon--bar:nth-of-type(1) {
	rotate: 45deg;
	translate: 0 9px;
}

.drawer__icon.js-show .drawer__icon--bar:nth-of-type(2) {
	display: none;
}

.drawer__icon.js-show .drawer__icon--bar:nth-of-type(3) {
	rotate: -45deg;
	translate: 0 -9px;
}

/*===================================================================
# インナー幅
===================================================================*/

.inner {
	margin-inline: auto;
	max-width: 1240px; /* インナー幅は1240px */
}

/*===================================================================
# Section
===================================================================*/

.section__title {
	align-items: center;
	display: flex;
	gap: 16px;
	width: 202px;
}

.section__title-wrapper {
	display: flex;
	justify-content: center;
}

.section__title-wrapper.--left {
	justify-content: start; /* TOP サービス・会社情報・経営理念 */
}

.section__title-rectangle {
	margin-top: 10px; /* 縦中央にするための調整 */
}

.section__title-rectangle.--white svg path {
	fill: #F5F5F8;
}

.section__title.--contact {
	width: 290px; /* TOP お問い合わせ */
}

.section__title.--top-works {
	width: 112px; /* TOP 事業 */
}

.section__title-text {
	color: #041F6E;
	font-size: 44px;
	font-weight: 500;
	line-height: normal;
}

.section__title-text.--white {
	color: #F5F5F8;
}

/*===================================================================
# Sub-page
===================================================================*/

.sub-page {
	background: url(../../assets/img/page-title-bg.webp) center center/cover no-repeat, url(../../assets/img/page-title-bg.png) center center/cover no-repeat; /* 下層ページのタイトルと背景画像 */
	height: 320px;
	width: 100%;
}

.sub-page__title {
	color: #041F6E;
	font-size: 56px;
	font-weight: 700;
	line-height: 150%; /* 84px */
	margin-inline: auto;
	max-width: 1120px;
	padding-top: 160px;
}

/*===================================================================
# Fv
===================================================================*/

.fv__inner {
	margin-inline: auto;
	max-width: 1440px;
	position: relative;
}

.fv__message-container,
.fv__img-1,
.fv__img-2 {
	opacity: 0;
}

.fv__message-container {
	background: linear-gradient(270deg, rgba(3, 116, 195, 0) 0%, rgba(3, 116, 195, 0.1) 7.5%, rgba(3, 116, 195, 0.5) 15%, rgba(3, 84, 163, 0.68) 27%, rgba(2, 47, 127, 0.89) 55.5%, #021C6C 100%);
	left: 0;
	padding: 53px 116px 56px 144px;
	position: absolute;
	top: 112px;
	transform: translateX(-1000px); /* 初期位置 */
	z-index: 4;
}

.fv__message-text {
	color: #F5F5F8;
	font-size: 56px;
	font-weight: 700;
	line-height: 123%;
}

.fv__message-text .char {
	opacity: 0;
}

.fv__img-1 {
	margin-left: auto; /* 背景画像 */
	margin-right: 0;
	position: relative;
	transform: translateX(1000px); /* 初期位置 */
	z-index: 1;
}

.fv__img-2 {
	bottom: 60px;
	left: 0;
	position: absolute; /* タブレットを見ながらミーティングをしている画像 */
	transform: translateY(500px); /* 初期位置 */
	z-index: 3;
}

.fv__blur {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 9.09%, rgba(255, 255, 255, 0.12) 25.91%, rgba(255, 253, 253, 0.58) 62.26%, rgba(255, 253, 253, 0.58) 62.27%, rgba(255, 252, 252, 0.8) 76.36%, rgba(255, 252, 252, 0.9) 85.91%, #FFFCFC 100%);
	bottom: 0;
	height: 99px;
	left: 0;
	position: absolute;
	width: 100%;
	z-index: 3;
}

/*===================================================================
# Top-Service
===================================================================*/

.top-service {
	padding-block: 71px 120px;
}

.top-service__inner {
	position: relative;
}

.top-service__contents-container {
	background: #041F6E;
	margin-left: 20px;
	margin-right: auto;
	max-width: 760px;
	padding: 65px 70px 55px 70px;
	position: relative;
	z-index: 2;
}

.top-service__text {
	color: #F5F5F8;
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-block: 56px 38px;
	text-align: justify;
}

.top-service__rectangle {
	background: #136AA9;
	height: 119px;
	position: absolute;
	right: 340px;
	top: 70px;
	transform: rotate(90deg);
	width: 194px;
	z-index: 0;
}

.top-service__img {
	bottom: -120px;
	position: absolute;
	right: -7px;
	z-index: 1;
}

/*===================================================================
# Top-Works
===================================================================*/

.top-works {
	background: #EDEDF5;
	padding-block: 160px;
	text-align: center;
}

.top-works__contents {
	display: flex;
	justify-content: space-between;
	margin-block: 86px 56px;
	margin-inline: auto;
	max-width: 1120px;
}

.top-works__content {
	background: rgba(255, 255, 255, 0.5);
	border-radius: 16px;
	padding-block: 34px 56px;
	position: relative;
}

.top-works__content-num {
	color: rgba(209, 209, 209, 0.4);
	font-size: 40px;
	font-weight: 700;
	left: 50%;
	letter-spacing: 1.6px;
	line-height: 180%; /* 72px */
	position: absolute;
	top: -39px;
	translate: -50%;
}

.top-works__content-title {
	font-size: 24px;
	letter-spacing: 0.96px;
	line-height: 180%; /* 43.2px */
	text-align: center;
}

.top-works__content-img {
	margin-inline: 51px;
	margin-top: 24px;
}

/*===================================================================
# Top-Message
===================================================================*/

.top-message {
	background: #041F6E;
}

.top-message__inner {
	max-width: 1440px;
	position: relative;
}

.top-message__contents-container {
	margin-left: auto;
	margin-right: 160px;
	max-width: 652px;
	padding-block: 157px 120px;
	padding-left: 20px;
}

.top-message .section__title {
	justify-content: start;
}

.top-message__text {
	color: #F5F5F8;
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-block: 55px 39px;
	text-align: justify;
}

.top-message__img {
	height: auto;
	left: 0;
	position: absolute;
	top: 0;
	width: 35.625%;
}

.top-message__img.--sp {
	display: none;
}

/*===================================================================
# Company
===================================================================*/

.company {
	background: #EDEDF5;
	padding-block: 157px 160px;
	text-align: center;
}

.company__inner {
	max-width: 772px;
}

.company__table {
	border-collapse: collapse;
	border-spacing: 0;
	margin-top: 47px;
	width: 100%;
}

.company__table-title,
.company__table-content {
	font-size: 20px;
	height: 68px;
	letter-spacing: 0.8px;
	line-height: 68px;
	position: relative;
	text-align: left;
}

.company__table-title::after,
.company__table-content::after {
	background: #857BB5;
	bottom: 1px;
	content: "";
	left: 0px;
	position: absolute;
	width: 100%;
}

.company__table-title {
	padding-left: 25px;
	width: 193px;
}

.company__table-title::after {
	height: 2px;
}

.company__table-content {
	padding-left: 56px;
	width: calc(100% - 193px);
}

.company__table-content::after {
	height: 1px;
}

.company__table-content-link {
	cursor: pointer;
	transition: color 0.3s ease;
}

/*===================================================================
# Contact
===================================================================*/

.contact {
	background: #041F6E;
	padding-block: 50px;
	padding-inline: 40px;
}

.contact__inner {
	background: #FFF;
	margin-inline: auto;
	max-width: 1330px;
	padding-block: 105px;
	padding-inline: 20px;
}

.contact__message {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-block: 50px 39px;
	text-align: center;
}

.contact__form {
	margin-inline: auto;
	width: 512px;
}

.contact__row {
	margin-bottom: 40px; /* 各入力項目 */
}

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

.contact__row.--aifs {
	align-items: flex-start;
}

.contact__head {
	font-size: 20px; /* 項目名 */
	line-height: 100%; /* 20px */
}

.contact__head span.--must {
	display: inline-flex;
	position: relative;
}

.contact__head span.--must::after {
	color: #D32929;
	content: "（必須）";
	display: inline-block;
	font-size: 20px;
	left: 100%;
	line-height: 100%; /* 20px */
	position: absolute;
	top: 50%;
	translate: 0 -50%;
	white-space: nowrap;
}

.contact__agreement {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-block: 43px 15px;
	text-align: center;
}

.contact__agreement-link {
	color: #857BB5;
	transition: color 0.3s ease;
}

.contact__agreement-link:hover {
	color: #FF9900;
}

.contact__submit {
	text-align: center;
}

.contact__submit button:focus {
	outline: 1px solid #FF9900; /* フォーカス時 */
}

.contact__submit button:focus.btn__link {
	border: none;
}

input[type=text],
input[type=email],
input[type=tel],
textarea {
	background: #f0f0f0;
	background: #FFF;
	border: none;
	border: 1px solid #B3B3B3;
	border-radius: 8px;
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-top: 12px;
	padding: 10px;
	width: 100%;
}

input[type=text]::-moz-placeholder,
input[type=email]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
textarea::-moz-placeholder {
	color: #B3B3B3;
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
}

input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=tel]::placeholder,
textarea::placeholder {
	color: #B3B3B3;
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
}

/* フォーカス時 */

input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
textarea:focus {
	border: none;
	outline: 1px solid #FF9900;
}

textarea {
	height: 213px;
	resize: vertical;
}

.contact__error-message {
	color: red;
	font-size: 16px;
	font-weight: 700;
	margin-top: 6px;
}

.error-outline {
	outline: 2px solid red !important;
}

/*===================================================================
# Service
===================================================================*/

.service {
	background: #EDEDF5;
}

.service__inner {
	margin-inline: auto;
	max-width: 1120px;
	padding-block: 123px 156px;
}

.service__main-text {
	font-size: 36px;
	letter-spacing: 1.44px;
	line-height: normal;
	text-align: center;
}

.service__contents {
	margin-top: 91px;
}

.service__content {
	align-items: flex-start;
	border-radius: 24px 24px 0px 0px;
	display: flex;
	justify-content: space-between;
	padding: 41px 59px 57px 64px;
	position: relative;
	-moz-column-gap: 20px;
	column-gap: 20px;
}

.service__content.--01,
.service__content.--02,
.service__content.--03 {
	opacity: 0; /* 初期値 */
	transform: translateY(100%);
}

.service__content.--01 {
	background: #041F6E;
}

.service__content.--02 {
	background: #203E95;
	margin-top: -20px;
}

.service__content.--03 {
	background: #445892;
	margin-top: -20px;
}

.service__content-text-container {
	margin-top: 9px;
	max-width: 758px;
}

.service__content-main-text {
	color: #F5F5F8;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0.96px;
	line-height: 180%; /* 43.2px */
	text-align: justify;
}

.service__content-sub-text {
	color: #F5F5F8;
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-top: 24px;
	text-align: justify;
}

.service__content-num {
	color: rgba(209, 209, 209, 0.4);
	font-size: 72px;
	font-weight: 700;
	letter-spacing: 2.88px;
	line-height: 1;
}

.service__sub-text {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-top: 92px;
	text-align: justify;
}

/*===================================================================
# Works
===================================================================*/

.works {
	background: #EDEDF5;
}

.works__inner {
	margin-inline: auto;
	max-width: 1120px;
	padding-block: 120px;
}

.works__content {
	margin-bottom: 120px; /* 各事業 */
}

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

.works__content-upper {
	align-items: center;
	background: #FFF;
	display: flex; /* 事業タイトル部分 */
	height: 230px;
	padding-left: 138px;
}

.works__content-upper-text-wrap {
	align-items: center;
	display: flex;
	gap: 16px;
}

.works__content-upper-num {
	color: rgba(209, 209, 209, 0.4);
	font-size: 55.363px;
	font-weight: 700;
	letter-spacing: 2.215px;
}

.works__content-upper-title {
	color: #041F6E;
	font-size: 36px;
	letter-spacing: 1.44px;
}

.works__img.--1 {
	margin-left: 123px;
}

.works__img.--2 {
	margin-left: 126px;
}

.works__img.--3 {
	margin-left: 267px;
}

.works__content-lower {
	display: flex; /* 事業内容部分 */
	justify-content: space-between;
	position: relative;
}

.works__content-lower-description {
	max-width: 532px;
	padding: 67px 66px 24px;
}

.works__content-lower-title {
	color: #041F6E;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0.96px;
	line-height: 180%; /* 43.2px */
	text-align: center;
}

.works__content-lower-img {
	margin-inline: auto;
	margin-top: 29px;
}

.works__content-lower-img img {
	height: auto;
	width: 100%;
}

.works__content-lower-text {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-top: 32px;
	text-align: justify;
}

.works__content-lower-line {
	background: rgba(4, 31, 110, 0.4);
	height: 80%;
	left: 50%;
	position: absolute;
	top: 83px;
	translate: -50%;
	width: 2px;
}

.works__content-lower-line.--pc {
	display: block;
}

.works__content-lower-line.--sp {
	display: none;
}

.works__message {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	margin-top: 120px;
	text-align: justify;
}

/*===================================================================
# Message
===================================================================*/

.message {
	background: #EDEDF5;
}

.message__inner {
	margin-inline: auto;
	max-width: 1120px;
	padding-block: 120px 115px;
}

.message__text {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
	text-align: justify;
}

.message__text.--space {
	margin-bottom: 34px;
}

.message__text.--num {
	list-style-type: decimal; /* 数字（1, 2, 3...）を使用 */
	padding-left: 33px; /* 数字とテキストの余白 */
}

.message__text li {
	list-style: normal;
}

/*===================================================================
# Policy
===================================================================*/

.policy {
	background: #EDEDF5;
}

.policy__inner {
	margin-inline: auto;
	max-width: 1120px;
	padding-block: 112px 187px;
}

.policy__upper-text,
.policy__text {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 180%; /* 36px */
}

.policy__upper-text {
	margin-bottom: 41px;
	text-align: right; /* 制定・会社名・代表者名 */
}

.policy__text {
	text-align: justify;
}

.policy__text.--space {
	margin-bottom: 36px;
}

.policy__text.--space-left {
	margin-left: 20px;
}

.policy__text.--list {
	padding-left: 29px; /* 左端からの余白 */ /* 黒丸のリスト */
}

.policy__text.--list li {
	position: relative; /* 疑似要素で黒丸を配置 */
}

.policy__text.--list li::before {
	color: #202020; /* 黒丸の色 */
	content: "•"; /* 黒丸を手動で設定 */
	font-size: 16px; /* 黒丸のサイズを変更 */
	left: -16px;
	line-height: 2.25;
	position: absolute;
	top: 0;
}

.policy__text.--list li.--id-space {
	margin-left: 29px;
}

.policy__text.--alpha {
	padding-left: 58px; /* 左端からの余白 */ /* アルファベットのリスト */
}

.policy__text.--alpha li {
	list-style-type: lower-alpha; /* 小文字のアルファベット（a, b, c...） */
}

.policy__text.--num {
	padding-left: 33px; /* 数字とテキストの余白 */
}

.policy__text.--num li {
	list-style-type: decimal; /* 数字（1, 2, 3...）を使用 */
	position: static;
}

/*===================================================================
# Thanks
===================================================================*/

.thanks {
	background: #EDEDF5;
	flex-grow: 1; /* コンテンツ領域を広げて余白を埋める */
}

.thanks__body-wrapper {
	display: flex; /* フッターが画面の下に配置されるようにmainとfooterをラップ */
	flex-direction: column;
	justify-content: space-between;
	min-height: 100vh;
}

.thanks__inner {
	margin-inline: auto;
	max-width: 1120px;
	padding-block: 273px;
	text-align: center;
}

.thanks__main-message {
	font-size: 44px;
	font-weight: 500;
	line-height: normal;
}

.thanks__text {
	font-size: 20px;
	letter-spacing: 0.8px;
	line-height: 200%;
	margin-block: 57px 52px;
}

/*===================================================================
# 改行のレスポンシブ
===================================================================*/

.br-sp {
	display: none;
}

@media (any-hover: hover) {

.header__list li a:hover {
	color: #FF9900;
}

.footer__list a:hover {
	color: #FF9900;
}

.btn__link:hover {
	border-color: #FF9900;
}

.btn__link:hover::before {
	transform: translateX(0);
}

.btn__link:hover .btn__link-text,
.btn__link:hover .btn__link-arrow {
	color: #fff;
}

.btn__link:hover .btn__link-arrow {
	left: calc(100% + 14px);
}

.btn__link:hover .btn__link-arrow.--left {
	left: auto;
	right: calc(100% + 13px);
}

.company__table-content-link:hover {
	color: #041F6E;
}

}

@media screen and (min-width: 768px) and (max-width: 1023px) {

.header__inner {
	grid-template-columns: 125px 1fr;
}

.header__logo {
	margin-left: 30px;
}

.header__nav {
	margin-right: 30px;
}

.header__list {
	-moz-column-gap: 20px;
	column-gap: 20px;
}

.header__list li a {
	font-size: 18px;
}

.footer__contents {
	gap: 10px;
}

.footer__content.--under {
	margin-left: 0;
}

.footer__copyright {
	font-size: 12px;
	text-wrap: nowrap;
}

.footer__lists {
	-moz-column-gap: 20px;
	column-gap: 20px;
}

.inner {
	margin-inline: 40px;
}

.sub-page__title {
	font-size: clamp(1.75rem, 0.921rem + 3.68vw, 3.5rem);
	margin-left: 40px;
}

.fv__message-container {
	padding-left: 80px;
}

.fv__img-1 {
	height: 70Vh;
}

.fv__img-2 {
	bottom: 0;
}

.top-service {
	padding-block: 71px 327px;
}

.top-service__contents-container {
	z-index: 1;
}

.top-service__rectangle {
	bottom: -41px;
	left: -18px;
	right: auto;
	top: auto;
}

.top-service__img {
	bottom: -327px;
	right: 0;
	z-index: 2;
}

.top-works__contents {
	align-items: center;
	flex-direction: column;
	gap: 56px;
}

.top-works__content {
	min-width: 500px;
}

.top-works__content-img {
	margin-inline: auto;
	width: 74.3421052632%;
}

.top-message__contents-container {
	margin-left: auto;
	margin-right: 0px;
	padding-left: 0;
	width: calc(100% - 404px);
}

.top-message__img {
	left: -40px;
	top: 50%;
	translate: 0 -50%;
	width: 384px;
}

.company__inner {
	margin-inline: auto;
	padding-inline: 40px;
}

.service__inner {
	margin-inline: 40px;
}

.service__main-text {
	text-align: left;
}

.works__content-upper {
	justify-content: center;
	padding-left: 0px;
}

.works__content-upper-title {
	font-size: 28px;
}

.works__img.--1,
.works__img.--2,
.works__img.--3 {
	margin-left: 50px;
}

.works__content-lower {
	justify-content: center;
}

.works__content-lower-description {
	padding-left: 30px;
	padding-right: 30px;
	width: 50%;
}

.works__message {
	padding-inline: 20px;
}

.message__inner {
	margin-inline: 40px;
}

.policy__inner {
	margin-inline: 40px;
}

}

@media screen and (min-width: 1024px) and (max-width: 1239px) {

.footer__content.--under {
	margin-left: 0;
}

.inner {
	margin-inline: 40px;
}

.sub-page__title {
	font-size: clamp(1.75rem, 0.921rem + 3.68vw, 3.5rem);
	margin-left: 40px;
}

.fv__img-2 {
	bottom: 0;
	height: auto;
	max-height: 325px;
	width: auto;
}

.top-service {
	padding-block: 71px 212px;
}

.top-service__rectangle {
	right: 223px;
}

.top-service__img {
	bottom: -212px;
	right: 0;
	z-index: 2;
}

.top-works__content-img {
	margin-inline: 40px;
}

.top-message__contents-container {
	margin-left: auto;
	margin-right: 0px;
	padding-left: 0;
	width: calc(100% - 424px);
}

.top-message__img {
	left: -40px;
	top: 50%;
	translate: 0 -50%;
	width: 384px;
}

.company__inner {
	margin-inline: auto;
}

.service__inner {
	margin-inline: 40px;
}

.works__content-lower-description {
	width: 50%;
}

.works__message {
	padding-inline: 20px;
}

.message__inner {
	margin-inline: 40px;
}

.policy__inner {
	margin-inline: 40px;
}

.thanks__inner {
	margin-inline: 40px;
}

}

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

.header {
	padding-inline: 0;
}

.header {
	height: 56px;
	margin-top: 12px;
}

.header__inner {
	grid-template-columns: 81px 1fr;
	margin-inline: 14px;
	width: calc(100% - 28px);
}

.header__logo {
	height: 44px;
	margin-left: 36px;
	width: 44px;
}

.header__nav {
	display: none;
}

.footer {
	padding-block: 45px 49px;
}

.footer__inner {
	margin-inline: 16px !important;
}

.footer__contents {
	flex-direction: column;
}

.footer__content.--under {
	margin-left: 0;
}

.footer__title-icon {
	height: 40px;
	width: 40px;
}

.footer__title {
	font-size: 24px;
}

.footer__copyright {
	font-size: 12px;
	letter-spacing: 1.2px;
}

.footer__copyright.--pc {
	display: none;
}

.footer__copyright.--sp {
	display: block;
	margin-left: 8px;
	margin-top: 21px;
}

.footer__lists {
	margin-left: 8px;
	-moz-column-gap: 16px;
	column-gap: 16px;
	margin-top: 0;
	max-width: none;
	row-gap: 21px;
}

.footer__list a {
	display: inline-block;
	font-size: 14px;
	letter-spacing: 0.56px;
	width: 150px;
}

.btn__link {
	padding: 10px 61px 10px 32px;
}

.btn__link.--left {
	padding: 10px 23px 10px 49px;
}

.btn__link.--contact {
	padding: 12px 75px 12px 38px;
}

.btn__link-text,
.btn__link-arrow {
	font-size: 18px;
	letter-spacing: 0.72px;
}

.btn__link-arrow {
	left: calc(100% + 12px);
}

.btn__link-arrow.--contact {
	left: calc(100% + 19px);
}

.drawer__icon {
	display: flex;
}

.inner {
	margin-inline: 28px;
}

.section__title {
	width: 176px;
}

.section__title.--contact {
	width: 251px;
}

.section__title.--top-works {
	gap: 9px;
	width: 92px;
}

.section__title-text {
	font-size: 36px;
	letter-spacing: 1.44px;
}

.sub-page {
	background: url(../../assets/img/page-title-bg-sp.webp) center center/cover no-repeat, url(../../assets/img/page-title-bg-sp.png) center center/cover no-repeat;
	height: 160px;
}

.sub-page__title {
	font-size: clamp(1.75rem, 0.921rem + 3.68vw, 3.5rem);
	line-height: 130%; /* 36.4px */
	padding-left: 7.5%;
	padding-top: 88px;
}

.fv__inner {
	width: 100%;
}

.fv__message-container {
	background: linear-gradient(270deg, rgba(3, 116, 195, 0.1) 0%, rgba(3, 116, 195, 0.5) 12%, rgba(3, 84, 163, 0.68) 21.5%, rgba(2, 47, 127, 0.89) 44.5%, #021C6C 84.9%);
	padding-bottom: 32px;
	padding-left: 7.7777777778%;
	padding-right: 0;
	padding-top: 27px;
	top: 68px;
	width: 100%;
}

.fv__message-text {
	font-size: clamp(1.875rem, 0.438rem + 6.39vw, 3.5rem);
	line-height: 131%;
}

.fv__img-2 {
	bottom: 115px;
	height: auto;
	width: 100%;
}

.top-service {
	padding-block: 37px 212px;
}

.top-service__inner {
	margin-inline: 0;
}

.top-service__contents-container {
	margin-left: 0;
	padding: 80px 28px 74px;
	z-index: 1;
}

.top-service__text {
	font-size: 16px;
	letter-spacing: 0.32px;
	margin-block: 32px 23px;
}

.top-service__rectangle {
	bottom: -41px;
	left: -38px;
	right: auto;
	top: auto;
}

.top-service__img {
	bottom: -215px;
	right: 0;
	width: 323px;
	z-index: 2;
}

.top-works {
	padding-block: 79px 74px;
}

.top-works__contents {
	align-items: center;
	flex-direction: column;
	gap: 56px;
	margin-block: 61px 56px;
}

.top-works__content {
	max-width: 500px;
	padding-block: 30px 48px;
	width: 100%;
}

.top-works__content-title {
	font-size: 20px;
	letter-spacing: 0.8px;
}

.top-works__content-img {
	margin-inline: auto;
	margin-top: 20px;
	width: 74.3421052632%;
}

.top-message__contents-container {
	margin-right: auto;
	padding-block: 79px 68px;
	padding-left: 0;
	width: 100%;
}

.top-message__text {
	font-size: 16px;
	letter-spacing: 0.32px;
	margin-block: 39px 26px;
}

.top-message__img {
	display: none;
}

.top-message__img.--sp {
	display: block;
	position: static;
	width: 100%;
}

.company {
	padding-block: 80px 79px;
}

.company__table {
	margin-top: 31px;
}

.company__table-title,
.company__table-content {
	font-size: 16px;
	height: 119px;
	letter-spacing: 0.32px;
	line-height: 180%; /* 28.8px */
	vertical-align: middle;
}

.company__table-title {
	padding-left: 0;
	width: 37.8289473684%;
}

.company__table-content {
	padding-left: 16px;
	width: calc(100% - 115px);
}

.contact {
	padding-block: 12px;
	padding-inline: 12px;
}

.contact__inner {
	padding-block: 69px;
	padding-inline: 15px;
}

.contact__message {
	font-size: 16px;
	letter-spacing: 0.32px;
	line-height: 180%; /* 28.8px */
	margin-block: 49px 37px;
}

.contact__form {
	max-width: 512px;
	width: 100%;
}

.contact__row {
	margin-bottom: 36px;
}

.contact__head {
	font-size: 16px;
}

.contact__head span.--must::after {
	font-size: 16px;
}

.contact__agreement {
	font-size: 16px;
	letter-spacing: 0.32px;
	margin-block: 46px 17px;
}

input[type=text],
input[type=email],
input[type=tel],
textarea {
	margin-top: 8px;
	padding: 5px 0 5px 10px;
}

input[type=text]::-moz-placeholder,
input[type=email]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
textarea::-moz-placeholder {
	font-size: 16px;
	line-height: 100%; /* 16px */
}

input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=tel]::placeholder,
textarea::placeholder {
	font-size: 16px;
	line-height: 100%; /* 16px */
}

textarea {
	height: 215px;
}

.service__inner {
	margin-inline: 28px;
	padding-block: 63px 65px;
}

.service__main-text {
	font-size: 24px;
	letter-spacing: 0.96px;
	text-align: left;
}

.service__contents {
	margin-top: 50px;
}

.service__content {
	align-items: center;
	border-radius: 16px 16px 0 0;
	flex-direction: column-reverse;
	margin-inline: auto;
	max-width: 500px;
	padding: 25px 24px 58px 24px;
}

.service__content:last-of-type {
	border-radius: 16px;
}

.service__content-main-text {
	font-size: 20px;
	letter-spacing: 0.8px;
	margin-top: 8px;
}

.service__content-sub-text {
	font-size: 16px;
	letter-spacing: 0.32px;
	margin-top: 15px;
}

.service__content-num {
	font-size: 48px;
	letter-spacing: 1.92px;
}

.service__sub-text {
	font-size: 16px;
	letter-spacing: 0.32px;
	margin-top: 48px;
}

.works__inner {
	padding-block: 64px 78px;
}

.works__content {
	margin-bottom: 95px;
}

.works__content-upper {
	flex-direction: column;
	height: auto;
	padding: 4px 0px 31px;
}

.works__content-upper-text-wrap {
	gap: 10px;
}

.works__content-upper-num {
	font-size: 40px;
	letter-spacing: 1.6px;
	line-height: 180%; /* 72px */
}

.works__content-upper-title {
	font-size: 24px;
	letter-spacing: 0.96px;
}

.works__img-wrapper {
	height: 25%;
	width: 36.1111111111%;
}

.works__img img {
	height: auto;
	width: 100%;
}

.works__img.--1,
.works__img.--2,
.works__img.--3 {
	margin-left: auto;
	margin-right: auto;
}

.works__content-lower {
	align-items: center;
	flex-direction: column;
	position: static;
}

.works__content-lower-description {
	max-width: none;
	padding: 33px 28px 34px;
	width: 100%;
}

.works__content-lower-description.--upper {
	position: relative;
}

.works__content-lower-title {
	font-size: 20px;
	letter-spacing: 0.8px;
}

.works__icon-img-wrapper {
	display: block;
	height: 26.3157894737%;
	margin-inline: auto;
	width: 26.3157894737%;
}

.works__content-lower-text {
	font-size: 16px;
	letter-spacing: 0.32px;
	margin-top: 15px;
}

.works__content-lower-line {
	bottom: 3px;
	height: 2px;
	left: 28px;
	top: auto;
	translate: 0;
	width: calc(100% - 56px);
}

.works__content-lower-line.--pc {
	display: none;
}

.works__content-lower-line.--sp {
	display: block;
}

.works__message {
	font-size: 16px;
	letter-spacing: 0.32px;
	margin-top: 52px;
	padding-inline: 28px;
}

.message__inner {
	margin-inline: 28px;
	padding-block: 64px;
}

.message__text {
	font-size: 16px;
	letter-spacing: 0.32px;
}

.message__text.--space {
	margin-bottom: 30px;
}

.message__text.--num {
	padding-left: 24px;
}

.policy__inner {
	margin-inline: 28px;
	padding-block: 64px 65px;
}

.policy__upper-text,
.policy__text {
	font-size: 16px;
	letter-spacing: 0.32px;
}

.policy__text.--space {
	margin-bottom: 30px;
}

.policy__text.--space-left {
	margin-left: 16px;
}

.policy__text.--list {
	padding-left: 24px;
}

.policy__text.--alpha {
	padding-left: 49px;
}

.policy__text.--num {
	padding-left: 24px;
}

.thanks__inner {
	padding-block: 131px;
}

.thanks__main-message {
	font-size: 26px;
	letter-spacing: 1.04px;
}

.thanks__text {
	font-size: 16px;
	letter-spacing: 0.32px;
	line-height: 230%;
	margin-block: 38px 49px;
}

.br-sp {
	display: block;
}

}