@charset "utf-8";
@-ms-viewport {
	width: device-width;
}
/*---------------------------------------
チェック
---------------------------------------*/
/*
*{
	border:1px solid #FF0000;
}
*/
/*---------------------------------------
clearfix
---------------------------------------*/
.clearfix {
	*zoom: 1;
}
.clearfix:before, .clearfix:after {
	display: table;
	content: "";
	line-height: 0;
}
.clearfix:after {
	clear: both;
}
/*---------------------------------------
全体
---------------------------------------*/
body {
	margin: 0;
	padding: 0;
	font-family: YakuHanJP, 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
	font-feature-settings: "palt";
	font-weight: 400;
	background: #ffffff;
	position: relative;
	width: 100%;
}
.main_inner {
	max-width: 1000px;
	width: 100%;
	margin: 0 auto;
}

.sp{
	display: none;
}

@media (max-width: 799px) {
	.sp{
	display: block;
}
	.pc{
	display: none;
}
}
/*---------------------------------------
header
---------------------------------------*/
/*header*/
.header_wrap {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #ffffff;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.header_logo {
	padding-left: 0.5em;
}
.header_logo a {
	display: flex;
	align-items: center;
	gap: 0.5em;
}
.header_logo p {
	white-space: nowrap;
	flex-shrink: 0;
	line-height: 1.4;
	font-size: 0.6em;
}
span.header_cs {
	font-size: 1.3em;
	font-weight: bold;
}
.header_logo img {
	width: auto;
	max-height: 50px;
}
.header_wrap nav {
	font-family: var(--montserrat-font-family);
	font-style: var(--montserrat-font-style);
	font-weight: 100;
	color: #333333;
	font-size: 1em;
}
.header_wrap nav span.header_nav_rubi {
	font-size: 0.7em;
}
.header_wrap nav ul {
	display: flex;
	align-items: center;
	text-align: center;
}
.header_wrap nav ul li {
	padding: 0.8em 1em;
}
.header_wrap nav ul li:nth-of-type(4) {
	background: #3385DE;
	background: linear-gradient(137deg, rgba(51, 133, 222, 1) 0%, rgba(42, 100, 199, 1) 100%);
	border-right: 1px solid #ffffff;
	color: #ffffff;
}
.header_wrap nav ul li:nth-of-type(5) {
	background: #3385DE;
	background: linear-gradient(137deg, rgba(51, 133, 222, 1) 0%, rgba(42, 100, 199, 1) 100%);
	color: #ffffff;
}
/* ハンバーガーメニュー（SP表示時） */
.hamburger_menu_sp {
	display: none; /* PCでは非表示 */
	padding: 0.8em 1em;
	background: #3385DE;
	background: linear-gradient(137deg, rgba(51, 133, 222, 1) 0%, rgba(42, 100, 199, 1) 100%);
}
.hamburger_menu_sp button {
	background: none;
	border: none;
	font-size: 1.8em;
	color: #ffffff;
	cursor: pointer;
}
.global {
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.5s ease, visibility 0.5s ease;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(0, 0, 0, 0.8);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	z-index: 9999;
	overflow-y: auto;
}
.global.active {
	visibility: visible;
	opacity: 1;
}
.global.close {
	opacity: 0;
	visibility: hidden;
}
.global .menu_wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	text-align: center;
	position: relative;
	z-index: 2;
}
/* 背景クリック領域 */
.global_back_drop {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.global_menu_wrapper ul {
	list-style: none;
	padding: 0;
	margin: 0;
	z-index: 2;
	font-family: var(--montserrat-font-family);
	font-style: var(--montserrat-font-style);
	font-weight: 100;
}
.global_menu_wrapper ul li {
	margin: 1em 0;
}
.global_menu_wrapper ul li a {
	color: #fff;
	font-size: 1.3em;
	text-decoration: none;
}
.global_menu_wrapper .header_nav_rubi {
	display: block;
	font-size: 0.6em;
	color: #ccc;
}
.top_close_bt {
	position: absolute;
	top: 0.3em;
	right: 0.5em;
	font-size: 2em;
	color: #fff;
	cursor: pointer;
	z-index: 3;
}
/* メディアクエリで表示切り替え */
@media screen and (max-width: 799px) {
	.header_wrap nav {
		display: none; /* PCナビを非表示に */
	}
	.hamburger_menu_sp {
		display: block; /* SPで表示 */
	}
}
/* bodyスクロール禁止 */
.no_scroll {
	position: fixed;
	width: 100%;
	overflow: hidden;
}
/*---------------------------------------
footer
---------------------------------------*/
footer {
	background: #ffffff;
	box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.1);
	padding: 3em 0 1.5em 0;
	position: relative;
	z-index: 3;
}
.footer_logo {
	width: 30%;
	margin: 0 auto;
}
.footer_logo a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
}
.footer_logo p {
	white-space: nowrap;
	flex-shrink: 0;
	line-height: 1.4;
	font-size: 0.6em;
}
.footer_logo img {
	width: 40%;
}
footer ul {
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--montserrat-font-family);
	font-style: var(--montserrat-font-style);
	font-weight: 100;
	font-size: 1em;
	text-align: center;
	margin: 3em auto 2.5em auto;
	width: 70%;
}
footer ul li span.header_nav_rubi {
	font-size: 0.7em;
}
footer ul li {
	width: calc(100% / 5);
}
p.footer_caption {
	text-align: center;
	font-size: 0.8em;
	color: #333333;
	margin: 0 auto 1em auto;
	line-height: 1.7em;
}
p.footer_copyright {
	text-align: center;
	font-size: 0.7em;
	color: #333333;
	font-family: var(--montserrat-font-family);
	font-style: var(--montserrat-font-style);
	font-weight: 100;
}
@media screen and (max-width: 799px) {
	.footer_logo {
		width: 50%;
	}
	footer ul {
		display: block; /* 横並び解除 */
		width: 90%; /* 幅広く確保 */
		margin: 2em auto;
	}
	footer ul li {
		width: 100%;
		margin-bottom: 1em;
	}
	p.footer_caption {
		width: 90%;
	}
}
/*---------------------------------------
キービジュアル
---------------------------------------*/
/* 全体 */
.kv {
	position: relative;
	height: 100vh;
	width: 100%;
	overflow: hidden;
}
.kv_overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
	z-index: 1;
}
/* キャッチコピー（全体） */
.kv_text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
	color: #fff;
	text-align: center;
	width: 100%;
	max-width: 1000px;
}
/* キャッチコピー（日本語コピー） */
.kv_sub_copy {
	font-size: 2em;
	letter-spacing: 0.3em;
	font-family: var(--oldstandard-font-family);
	opacity: 0; /* 最初は非表示 */
	transition: opacity 1s ease-in-out; /* `on`クラス追加時に表示 */
}
/* `on` クラスを追加した際に表示されるように */
.kv_sub_copy.on {
	opacity: 1; /* 表示させる */
}
/* キャッチコピー（英語コピー） */
.kv_svg_wrapper {
	transform: rotate(-5deg);
	overflow: visible;
	margin: 2em auto;
	width: 98%;
}
.kv_svg_wrapper svg {
	width: 100%;
	max-width: 1000px;
	display: block;
	margin: 0 auto;
	fill: #fff;
}
.kv_svg_wrapper img {
	opacity: 0; /* 初期状態は非表示 */
	transition: opacity 1s ease-in-out;
	filter: brightness(0) invert(1); /* SVGを白色に反転させる */
}
.kv_svg_wrapper img.on {
	opacity: 1; /* アニメーション後に表示 */
}
/* 会社説明 */
.kv_about {
	font-weight: 100;
	line-height: 2.3em;
	font-size: 1.2em;
	opacity: 0; /* 初期状態は非表示 */
	transition: opacity 1s ease-in-out;
}
.kv_about.on {
	opacity: 1; /* アニメーション後に表示 */
}
/* 下矢印のスタイル */
.scroll-down {
	opacity: 0; /* 初期状態で非表示 */
	animation: bounce 1.5s infinite; /* 上下に動くアニメーション */
	transition: opacity 1s ease-in-out; /* フェードインで表示 */
}
.scroll-down img {
	margin: 3em auto 0 auto;
	width: 15px;
	height: auto;
}
/* 上下に動くアニメーション */
@keyframes bounce {
	0%, 100% {
		transform: translateX(-50%) translateY(0); /* 通常位置 */
	}
	50% {
		transform: translateX(-50%) translateY(5px); /* 少し小さい振り幅で移動 */
	}
}
/* 下矢印の表示タイミング */
.kv_about.on + .scroll-down {
	opacity: 1; /* kv_aboutが表示された後に下矢印を表示 */
}
/* vegas.jsのプログレスバーを非表示 */
.vegas-timer {
	display: none;
}
@media screen and (max-width: 799px) {
	.kv_sub_copy {
		font-size: 1.3em;
	}
	.kv_about {
		font-size: 0.9em;
	}
}
/*---------------------------------------
font定義
---------------------------------------*/ :root {
	--montserrat-font-family: "Montserrat", sans-serif;
	--montserrat-font-style: normal;
	--oldstandard-font-family: "Old Standard TT", serif;
	--oldstandard-font-style: normal;
}
/* Montserrat */
.montserrat {
	font-family: var(--montserrat-font-family);
	font-style: var(--montserrat-font-style);
}
.montserrat_100 {
	font-weight: 100;
}
.montserrat_200 {
	font-weight: 200;
}
.montserrat_300 {
	font-weight: 300;
}
.montserrat_400 {
	font-weight: 400;
}
.montserrat_500 {
	font-weight: 500;
}
.montserrat_600 {
	font-weight: 600;
}
.montserrat_700 {
	font-weight: 700;
}
.montserrat_800 {
	font-weight: 800;
}
.montserrat_900 {
	font-weight: 900;
}
/* Old Standard TT */
.old_standard {
	font-family: var(--oldstandard-font-family);
	font-style: var(--oldstandard-font-style);
}
.old_standard_400 {
	font-weight: 400;
}
.old_standard_700 {
	font-weight: 700;
}
.white {
	color: #ffffff;
}
/*---------------------------------------
img定義
---------------------------------------*/
a img {
	display: inline;
}
.img_100 {
	width: 100%;
}
.img_90 {
	width: 90%;
}
.img_80 {
	width: 80%;
}
.common_bn {
	text-align: center;
	margin: 3em auto 2em auto;
}
.common_bn a {
	display: inline;
}
.common_bn a img {
	width: 65%;
}
@media (max-width: 799px) {
	.common_bn {
		margin: 2em auto;
	}
	.common_bn a img {
		width: 85%;
	}
}
/*---------------------------------------
hover定義
---------------------------------------*/
a:hover {
	opacity: 0.8;
}
a:hover img {
	opacity: 0.8;
}
/*---------------------------------------
共通ボタン
---------------------------------------*/
/* READ MOREボタン */
.common_read_more_btn {
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--montserrat-font-family);
	font-style: var(--montserrat-font-style);
	font-weight: 100;
	color: #ffffff;
	font-size: 1em;
	margin: 3em auto 1em auto;
	position: relative;
	width: 30%;
}
.common_read_more_btn a {
	padding: 0.8em 2em 0.8em 1.5em;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	text-decoration: none;
	color: inherit;
	position: relative;
	z-index: 1;
}
.common_read_more_btn::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 0.5em;
	transform: translateY(-50%);
	width: 15px;
	height: 15px;
	background: url('../img/btn_arrow.png') no-repeat center center;
	background-size: contain;
}
.common_read_more_btn.red {
	background-color: #e40011;
}
.common_read_more_btn.blue {
	background-color: #3385de;
}
@media screen and (max-width: 799px) {
	.common_read_more_btn {
		margin: 2em auto 1em auto;
		width: 60%;
	}
}
/*---------------------------------------
ローディング
---------------------------------------*/
/* ローディング画面全体 */
#loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100dvh; /* iOS対応 */
	background: #ffffff;
	/*
  background: #ffffff; /* 初期状態は白 */
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9999;
	opacity: 1;
	overflow: hidden; /* 内容がはみ出さないように */
	transition: background 2s ease-in-out; /* 背景色を変えるアニメーション */
}
#background-fill {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffffff; /* 初期は白色 */
	z-index: -1; /* ロゴの下に配置 */
	animation: slideBackground 0.8s ease-in-out forwards;
	transform-origin: top left; /* アニメーション開始点を左上に */
}
@keyframes slideBackground {
	0% {
		width: 0%;
		transform: skewX(-18deg); /* 最初は斜めに */
	}
	100% {
		width: 180%;
		background: #3385de;
		/*
    background-color: #3385de;*/
		transform: skewX(-18deg); /* 最終的に戻す */
	}
}
/* ロゴ（静止状態） */
#logo {
	position: absolute;
	opacity: 1; /* ロゴは最初から表示 */
	fill: #ffffff;
}
/* 背景色が青に変わった後にフェードアウト */
#loading.fade-out {
	opacity: 0;
	pointer-events: none; /* 背景が消えてもクリックできないようにする */
	transition: opacity 0.8s ease-in-out; /* フェードアウトアニメーション */
}
@media screen and (max-width: 799px) {
	#loading svg {
		width: 40%;
	}
}
/*---------------------------------------
共通部分
---------------------------------------*/
/* 各セクション（全体）*/
.common_section {
	padding: 6em 0;
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 799px) {
	.common_section {
		padding: 3em 0.5em;
	}
}
/* セクションタイトル（共通） */
.section_title {
	margin-bottom: 2em;
}
.section_title h1 dl dt {
	font-family: var(--oldstandard-font-family);
	font-style: var(--oldstandard-font-style);
	font-weight: 400;
	font-size: 1.5em;
}
.section_title h1 dl dd {
	font-weight: 400;
	font-size: 0.6em;
	margin: 0;
}
/* セクションタイトル（左寄せ） */
.section_title.left h1 dl {
	display: flex;
	flex-direction: column;
}
/* セクションタイトル（右寄せ） */
.section_title.right h1 dl {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
/* セクションタイトル（中央寄せ） */
.section_title.center h1 dl {
	text-align: center;
}
/* 各セクション（説明文）*/
.section_text {
	line-height: 3em;
}
.section_text.right {
	text-align: right;
}
.section_text.center {
	text-align: center;
}
@media screen and (max-width: 799px) {
	.section_text {
		line-height: 2.5em;
		font-size: 0.9em;
	}
	.section_text.right {
		text-align: left;
	}
	.section_title.right h1 dl {
		align-items: flex-start;
	}
}
/*---------------------------------------
各セクション（VISON）
---------------------------------------*/
.section_01_bg {
	position: relative;
	background-image: url('../img/bg_people.jpg'); /* 背景画像 */
	background-size: cover;
	background-position: center center;
	/*
  height: 100vh; /* 高さを指定、ビューポートにフィットさせる */
	width: 100%;
	overflow: hidden;
}
/* 背景画像の上に薄い白いオーバーレイ */
.section_01_bg::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.4); /* 白いオーバーレイ（透明度50%） */
	z-index: 1; /* コンテンツの下に配置 */
}
/* 左側の白い矩形 */
.white_masked_left {
	position: absolute;
	top: 0;
	left: 0;
	width: 30%;
	height: 100%;
	background-color: white;
	z-index: 1;
}
/* 左側の三角形（上辺が並行） */
.white_masked_left:before {
	content: "";
	position: absolute;
	top: 0;
	left: 100%;
	width: 0;
	height: 0;
	border-left: 30vw solid white;
	border-bottom: 100vh solid transparent;
	z-index: 2;
}
/* 右側の白い矩形 */
.white_masked_right {
	position: absolute;
	top: 0;
	right: 0;
	width: 10%;
	height: 100%;
	background-color: white;
	z-index: 1;
}
/* 右側の三角形（底辺が並行） */
.white_masked_right:before {
	content: "";
	position: absolute;
	top: 0;
	right: 100%;
	width: 0;
	height: 0;
	border-right: 30vw solid white;
	border-top: 100vh solid transparent;
	z-index: 2;
}
.vison_signature {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	margin-top: 10em;
}
.vison_signature img {
	max-width: 100%;
	display: inline-block;
	margin-bottom: 1em;
}
.vison_signature p {
	line-height: 1.7em;
}
@media screen and (max-width: 799px) {
	.vison_signature {
		margin-top: 4em;
	}
	.vison_signature img {
		max-width: 60%;
	}
	.section_01_bg::before {
		background-color: rgba(255, 255, 255, 0.7);
	}
	/* 左側の白い矩形 */
	.white_masked_left {
		width: 5%;
	}
	/* 左側の三角形（上辺が並行） */
	.white_masked_left:before {
		border-left: 60vw solid white;
		border-bottom: 900px solid transparent;
	}
	/* 右側の白い矩形 */
	.white_masked_right {
		width: 0;
	}
	/* 右側の三角形（底辺が並行） */
	.white_masked_right:before {
		border-right: 60vw solid white;
		border-top: 900px solid transparent;
	}
}
/*---------------------------------------
各セクション（SERVICES）
---------------------------------------*/
.section_02_bg {
	background: rgba(177, 203, 231, 0.5);
	position: absolute;
	width: 80%;
	right: 0;
	height: 90vh;
	z-index: 2;
	margin-top: 15em;
}
.services_list {
  display: flex;
  flex-wrap: wrap; /* 複数行に分けて配置 */
  gap: 2rem; /* アイテム間のスペース */
  margin-top: 2em;
}

.services_item {
  background: #ffffff;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
	flex: 1 1 calc(50% - 2rem); /* 全て2列構成（PC版） */
}

.services_image {
	position: relative;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}
.services_image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}
/* hover時に画像をズームイン */
.services_item:hover .services_image img {
	transform: scale(1.1);
}
/* READ MOREボタン */
.read_more_btn {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 0.5em 1em;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--montserrat-font-family);
	font-style: var(--montserrat-font-style);
	font-weight: 100;
	color: #ffffff;
	font-size: 0.8em;
}
.read_more_btn::after {
	content: "";
	display: inline-block;
	width: 15px; /* 矢印画像のサイズ */
	height: 15px;
	background: url('../img/btn_arrow.png') no-repeat center center;
	background-size: contain;
	margin-left: 0.5em; /* 文字と矢印の間隔 */
}
.read_more_btn.red {
	background-color: #e40011;
}
.read_more_btn.blue {
	background-color: #3385de;
}
.services_content {
	padding: 1em;
	color: #000000;
}
.services_title {
	font-size: 1em;
	margin-bottom: 0.5em;
}
.services_title span.services_title_rubi,
.services_item_detail_title span.services_title_rubi{
	font-weight: normal;
	font-size: 0.9em;
}
.services_description {
	font-size: 0.8em;
	font-weight: 400;
	line-height: 1.7em;
	color: #333333;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* 2行まで表示 */
	-webkit-box-orient: vertical;
}
/* スマホ版 - 1列構成 */
@media (max-width: 799px) {
	.section_02_bg {
		width: 80%;
		height: 150vh;
	}
  .services_item {
    flex: 1 1 100%; /* 全て縦並びにする */
  }
  
  /* サービス画像の高さ調整 */
  .services_image {
    height: 140px;
  }
  
  /* サービス内容のパディング調整 */
  .services_content {
    padding: 0.5em;
  }
}
/*---------------------------------------
各セクション（ABOUT US）
---------------------------------------*/
.section_03_bg {
	position: relative;
	background: #ffffff;
	/*
  height: 100vh; /* 高さを指定、ビューポートにフィットさせる */
	width: 100%;
	overflow: hidden;
	z-index: 2;
}
.company_info_wrapper {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 1em;
	margin-top: 4em;
}
.company_info_wrapper dl {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
	width: 50%;
}
.company_info_wrapper dl dt {
	width: 30%;
}
.company_info_wrapper dl dd {
	width: 65%;
	margin: 0 0 2em 0;
}
.company_info_wrapper .company_map {
	width: 50%;
}
.company_info_wrapper .company_map iframe {
	width: 100%;
	height: 450px;
}
@media (max-width: 799px) {
	.company_info_wrapper {
		display: block;
		margin-top: 4em;
	}
	.company_info_wrapper dl {
		width: 100%;
	}
	.company_info_wrapper dl dd {
		margin: 0 0 1.5em 0;
	}
	.company_info_wrapper .company_map {
		width: 90%;
		margin: 0 auto;
	}
	.company_info_wrapper .company_map iframe {
		height: 300px;
	}
}
/*---------------------------------------
各セクション（RECRUIT）
---------------------------------------*/
.section_04_bg {
	background: #3385de;
}
/*---------------------------------------
下層ページ・共通ページ
---------------------------------------*/
.common_bg {
	background: rgba(177, 203, 231, 0.5);
	position: absolute;
	width: 80%;
	right: 0;
	height: calc(100% - 45em);
	z-index: 2;
	margin-top: 15em;
}
/* 業務内容 */
.services_item_detail_wrapper {
	margin: 4em auto 0 auto;
}
.services_item_detail {
	background: #ffffff;
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
	width: 60%;
	margin: 0 auto 3em auto;
}
.services_item_detail_title {
	position: relative;
	width: 100%;
	margin: 0 auto;
}
.services_item_detail_title img {
	width: 100%;
	height: 100px;
	object-fit: cover;
	display: block;
}
.services_item_detail_title h3 {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	font-size: 1.5em;
	text-align: center;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
	margin: 0;
	padding: 0 1em;
	width: 100%;
	box-sizing: border-box;
}
.services_item_detail p {
	padding: 1em;
	line-height: 1.8em;
	font-size: 0.9em;
}
@media (max-width: 799px) {
	.services_item_detail {
		width: 100%;
	}
}
/* お問合せ */
.contact_form {
	width: 100%;
	max-width: 600px;
	margin: 3em auto 0 auto;
}
.contact_form_group {
	margin-bottom: 1.5em;
}
.contact_form_group label {
	display: block;
	margin-bottom: 0.5em;
}
.contact_form_group input, .contact_form_group textarea {
	width: 100%;
	padding: 0.8em;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 1em;
	box-sizing: border-box;
}
.contact_form_submit {
	text-align: center;
}
.contact_form_submit button {
	background-color: #3385de;
	color: #fff;
	font-size: 1em;
	padding: 0.8em 2em;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: background 0.3s ease;
}
.contact_form_submit button:hover {
	background-color: #555;
}
.contact_form_group textarea {
	resize: vertical;
}
.contact_form_error {
	margin-top: 2em;
	color: #e40011;
	margin-bottom: 1.2em;
	text-align: center;
	line-height: 1.7em;
}
.confirm_text {
	background: #f9f9f9;
	padding: 0.8em;
	border: 1px solid #ccc;
	border-radius: 4px;
	line-height: 1.6;
	font-size: 1em;
	white-space: pre-wrap;
}
.contact_form_back {
	text-align: center;
	margin-top: 2em;
}
.contact_form_back button {
	background-color: #ccc;
	color: #333;
	font-size: 1em;
	padding: 0.6em 2em;
	border: none;
	border-radius: 4px;
	cursor: pointer;
}
.contact_form_back button:hover {
	background-color: #bbb;
}