@charset "utf-8";

/*-----------------------------------------------------
  共通リンク設定
-----------------------------------------------------*/
/* リンク下線表示 */
a {
	text-decoration: underline !important;
}

/* ホバー時は下線を非表示 */
a:hover {
	text-decoration: none;
}

/* フッター内リンク */
.footer a:hover {
	text-decoration: none !important;
}

/*-----------------------------------------------------
  2カラムレイアウト
-----------------------------------------------------*/
/* 横並びコンテナ */
.box-2 {
	display: inline-flex;
	width: 100%;
	margin: 0 auto;
}

/* 各カラム */
.box-2 div {
	width: 50%;
	padding: 20px;
	text-align: center;
}

/*-----------------------------------------------------
  メインビジュアル
-----------------------------------------------------*/
/* キャッチコピー */
.hero-text h2 {
	font-size: 180%;
}

/*-----------------------------------------------------
  見出しデザイン
-----------------------------------------------------*/
/* h2タイトル */
h2.title-04 {
	color: #364e96;
	margin: 20px 5px 30px 5px;
	padding: 0.5em 5px;
	border-top: solid 3px #364e96;
	border-bottom: solid 3px #364e96;
	font-size: 2em;
	line-height: 100%;
}

/* h3タイトル（帯デザイン） */
h3.title-05 {
	color: #000;
	padding: 0.4em 1.2em;
	width: 100%;
	margin: 1em 1.0em 1em 0;
	font-size: 1.75em;
	position: relative;
	border-bottom: solid 3px #d7d7d7;
	background-color: #f7f7f7;
}

/* 左アクセント（濃色） */
h3.title-05::before {
	background-color: #0168b3;
	border-radius: 5px;
	content: '';
	position: absolute;
	top: 5px;
	left: 5px;
	width: 8px;
	height: 80%;
	text-align: center;
}

/* 左アクセント（淡色） */
h3.title-05::after {
	background-color: #D3EDFB;
	border-radius: 5px;
	content: '';
	position: absolute;
	top: 5px;
	left: 18px;
	width: 8px;
	height: 80%;
	background-image: none;
	transform: none;
}

/* h3リンクタイトル */
h3.title-06 {
	color: #000;
	padding: 20px;
	width: 100%;
	margin: 0 auto;
	font-size: 1.3em;
	position: relative;
	border-top: solid 1px #006eb0;
	border-bottom: none;
	box-shadow: none;
	text-align: center;
}

/* 装飾を削除 */
h3.title-06::after {
	content: none;
}

/* リンク色 */
h3.title-06 a {
	color: #006eb0;
}

/* ホバー時 */
h3.title-06 a:hover {
	text-decoration: none;
}

/* h4タイトル（背景付き） */
h4.title-03 {
	padding: 0.5em 0.3em;
	background: #CCECFB;
	border-left: 12px double #0094d6;
	font-size: 1.5em;
	margin: 0.5em;
}

/* h4タイトル（背景付き） */
h4.title-02 {
	padding: 0.5em 0.3em;
	background: #CCECFB;
	border-left: 12px double #0094d6;
	font-size: 1.5em;
	margin: 0.5em;
}

/* h4タイトル（ダイヤ装飾） */
h4.title-01 {
	position: relative;
	padding: 0.1em 2.2em;
	width: 95%;
	margin: 0 1.0em 15px 10px;
	border-bottom: 2px solid #D3EDFB;
	box-shadow: 0px 4px 0px 0px #0168b3;
	font-size: 1.5em;
	border-left: none;
	background: none;
}

/* ダイヤマーク */
h4.title-01::after {
	position: absolute;
	content: '';
	bottom: 35%;
	left: .8em;
	width: 12px;
	height: 12px;
	background-color: #0168b3;
	transform: rotate(45deg);
}

/* シンプルタイトル */
h4.title-04 {
	box-shadow: none;
}

/* 装飾削除 */
h4.title-04::after {
	content: none;
}

/*-----------------------------------------------------
  サービス一覧
-----------------------------------------------------*/
ul.service {
	font-size: 90%;
	margin: 20px 0;
}

ul.service li {
	padding: 0;
}

/*-----------------------------------------------------
  テーブルデザイン
-----------------------------------------------------*/
.table_design01 {
	border-collapse: collapse;
	width: 100%;
	max-width: 750px;
	margin: auto;
}

/* セル共通 */
.table_design01 th,
.table_design01 td {
	border: 1px solid #ddd;
	background-color: #fff;
	padding: 1em;
}

/* 見出しセル */
.table_design01 th {
	background-color: #4682b4;
	color: #fff;
	font-weight: bold;
	text-align: center;
	min-width: 4em;
}

/* 左列 */
.table_design01 td:first-child {
	background: #ebebeb;
	font-weight: bold;
	width: 30%;
}

/* リスト余白 */
.table_design01 td li {
	margin-left: 15px !important;
}

/*-----------------------------------------------------
  リスト
-----------------------------------------------------*/
/* 番号付きリスト */
ol {
	list-style: none;
	counter-reset: number;
	margin: 20px;
}

/* 箇条書き */
ul {
	margin: 5px 0;
}

ul li {
	position: relative;
	margin-left: 30px;
	padding-top: 5px;
	list-style: disc;
}

ol li {
	position: relative;
	padding-top: 10px;
}

/* 独自番号表示 */
ol li::before {
	counter-increment: number;
	content: '（' counter(number) '）';
}

/*-----------------------------------------------------
  会社案内ナビ
-----------------------------------------------------*/
.company_navi li,
.company_navi-02 li,
.company_navi-03 li {
	list-style: none;
	margin: 15px;
	padding: 0 5px;
	text-align: center;
}

/* リンク */
.company_navi li a,
.company_navi-02 li a,
.company_navi-03 li a {
	text-decoration: none;
}

/* 横並び */
.company_navi-02,
.company_navi-03 {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 20px 0;
}

/* リンク文字 */
.company_navi-02 a,
.company_navi-03 a {
	color: #000;
	font-weight: bold;
}

/* ホバー時 */
.company_navi-02 li:hover,
.company_navi-03 li:hover {
	border-bottom: 3px solid #4D9BE8;
}

/*-----------------------------------------------------
  パンくず
-----------------------------------------------------*/
#breadcrumb li {
	margin: 10px 0;
	padding: 0 5px;
}

/*-----------------------------------------------------
  左寄せ画像
-----------------------------------------------------*/
.left_box {
	float: left;
}

.left_box img {
	width: 200px;
}

.left {
	text-align: left !important;
}

/*-----------------------------------------------------
  メッセージリスト
-----------------------------------------------------*/
ol.message {
	margin: 0 20px 20px 60px;
}

/* 漢数字リスト */
ol.cjk-ideographic li {
	list-style-type: cjk-ideographic;
}

/* 独自番号を非表示 */
ol.cjk-ideographic ::before {
	display: none;
}

/*-----------------------------------------------------
  GOODポイント
-----------------------------------------------------*/
/* リスト全体 */
ul.good li {
	list-style-type: none !important;
}

/* 通常のリストマークを削除 */
ul.good {
	position: relative;
}

/* 説明文 */
ul.good p {
	margin: 15px 20px 15px 80px;
}

/* アイコン */
li.list_good::before {
	content: "";
	display: inline-block;
	background-image: url("../images/about/good_icon2.png");
	background-repeat: no-repeat;
	background-size: cover;
	width: 4em;
	height: 4em;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

/* 区切り線 */
li.list_good {
	border-bottom: 1px dotted #999;
}

/*-----------------------------------------------------
  画像・レイアウト
-----------------------------------------------------*/
/* .margin内の画像を右寄せ */
.margin p.img_30 {
	text-align: right;
}

* 画像幅を内容に合わせて右寄せ */ p.img_30 {
	width: fit-content;
	text-align: right;
}

/* 区切り線 */
div.line {
	border-bottom: 1px solid #CCC;
	clear: both;
}

/*-----------------------------------------------------
  プロフィールレイアウト
-----------------------------------------------------*/
/* 左側（画像エリア） */
.box_left {
	width: 30%;
	float: left;
	text-align: center;
	margin: 30px 0;
}

/* 右側（プロフィール情報） */
.box_right {
	width: 70%;
	float: left;
	text-align: left;
	margin: 25px 0;
}

/* プロフィール画像 */
.box_left img {
	width: 65%
}

/* プロフィール情報 */
dl.profile {
	display: flex;
	flex-wrap: wrap;
	padding: 10px 20px 0 0;
}

/* 項目名 */
dl.profile dt {
	width: 20%;
	text-align: right;
	padding: 0;
	font-weight: bold;
}

/* 内容 */
dl.profile dd {
	width: 80%;
	padding: 0;
}

/* 右側本文 */
.box_right p {
	margin: 0;
	padding: 0 !important;
}

/*-----------------------------------------------------
  下線付きテキスト
-----------------------------------------------------*/
/* 強調下線 */
p.line_02 {
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 3px;
	text-decoration-color: #01b1ff;
}

/* 先頭アイコン */
p.line_02::before {
	font-family: "Font Awesome 5 Free";
	content: "\025cf";
	/*アイコンの種類*/
	position: absolute;
	color: #01b1ff;
	/*アイコン色*/
}

/*-----------------------------------------------------
  余白調整
-----------------------------------------------------*/
/* 左余白 */
.space {
	padding: 0 0 0 20px !important;
}

/* 下余白 */
.space_02 {
	padding: 0 0 20px 0;
}

/*-----------------------------------------------------
  協力会社・採用
-----------------------------------------------------*/
/* 協力会社リスト */
.cooperation {
	font-size: 120%;
	font-weight: bold;
	color: #2c2c2f;
}

/* リストマーク非表示 */
.cooperation li {
	list-style-type: none;
}

/* 採用画像 */
.recruit-02 {
	width: 30%;
	float: inline-end;
	padding: 10px;
	line-height: 80%;
}

/*-----------------------------------------------------
  見出し
-----------------------------------------------------*/
/* h3余白 */
h3 {
	margin: 20px 0;
}

/*-----------------------------------------------------
  文字色・装飾
-----------------------------------------------------*/
/* 赤文字 */
.red {
	color: red;
	font-weight: bold;
}

/* 赤文字（別色） */
.red-03 {
	color: #ff2617;
}

/* 緑文字 */
.green {
	color: #016a16;
}

/* 緑文字（大・下線） */
.green-02 {
	color: #016a16;
	font-size: 150%;
	text-decoration: underline;
	font-weight: bold;
}

/* 緑文字（中） */
.green-03 {
	color: #016a16;
	font-size: 120%;
	font-weight: bold;
}

/* 緑背景 */
.green-04 {
	background-color: #afd262;
}

/* 薄緑背景 */
.green-05 {
	background-color: #f0fdd2;
}

/* ライン線 */
.underline {
	text-decoration: underline;
}

/* 青文字 */
.blue {
	color: #004bb6;
}

/* 青太字 */
.blue-02 {
	color: #004bb6;
	font-weight: bold;
}

/* 青太字＋中央揃え */
.blue-03 {
	color: #0168b3;
	font-weight: bold;
	align-items: center;
	display: grid;
	padding: 0 !important;
}

/* 青背景 */
.blue-04 {
	background-color: #7ec8ff;
}

/* 水色背景 */
.blue-05 {
	background-color: #8bcdee;
}

/* 薄水色背景 */
.blue-06 {
	background-color: #cfefff;
}

/* 水色背景（優先） */
.blue-07 {
	background-color: #8bcdee !important;
}

/*-----------------------------------------------------
  テーブル
-----------------------------------------------------*/
/* 見出し行 */
tr.color {
	background-color: #00008b;
	color: #fff;
	font-weight: bold;
}

/*-----------------------------------------------------
  ステップフロー
-----------------------------------------------------*/
/* ラベル丸アイコン */
.stepflow_label::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 5px;
	left: 0;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: solid 3px #4dd0e1;
	background-color: #4dd0e1;
}

/* リストマーク非表示 */
ul.stepflow li {
	list-style: none;
}

/*-----------------------------------------------------
  文字揃え
-----------------------------------------------------*/
/* 右寄せ */
.right {
	text-align: -webkit-right;
	text-align: right;
	line-height: 130%;
}

/* Safari対応右寄せ */
.right-02 {
	text-align: -webkit-right;
}

/*-----------------------------------------------------
  ボックスデザイン
-----------------------------------------------------*/
/* コンテンツボックス */
.box-01 {
	margin: 20px auto;
	padding: 1em 1em 1em;
	border-top: 5px solid #0094D6;
	border-radius: 3px;
	box-shadow: 0 2px 1px rgb(0 0 0 / 20%);
	background-color: #f2f2f2;
}

/* ボックスタイトル */
.box-01>div {
	margin-bottom: .5em;
	color: #0094D6;
	font-weight: 600;
	font-size: 1.05em;
	text-align: center;
}

/* ボックス本文 */
.box-01>p {
	margin: 0;
	color: #333;
}

/*-----------------------------------------------------
  文字サイズ
-----------------------------------------------------*/
/* 極小文字 */
.small {
	font-size: 50%;
}

/* 小文字 */
.small-02 {
	font-size: 90%;
}

/* 小文字（80%） */
.small-03 {
	font-size: 80%;
}

/* 小文字（70%） */
.small-04 {
	font-size: 70%;
}

/* 小文字（70%） */
.small_02 {
	font-size: 70%;
}

.amount-02 .small_02 {
	font-size: 100%;
}

/* 小文字（90%） */
.small_03 {
	font-size: 90%;
	line-height: normal;
}


/*-----------------------------------------------------
  サイドメニュー
-----------------------------------------------------*/
/* アコーディオン内リスト */
.side_acc_content ul li {
	list-style: none;
	margin: 0;
}

/*-----------------------------------------------------
  ステップフロー
-----------------------------------------------------*/
/* ラベル余白調整 */
.stepflow_label {
	padding: 0 !important;
}

/*-----------------------------------------------------
  リスト
-----------------------------------------------------*/
/* 通常リスト */
.list_02 li {
	color: #556b2f;
	padding: 0;
	list-style: disc !important;
}

/* フローリスト */
ul.list_flow li {
	color: #556b2f !important;
	padding: 0 !important;
	margin: 0 0 0 40px !important;
	list-style: disc !important;
}

/*-----------------------------------------------------
  ボタン
-----------------------------------------------------*/
/* 四角ボタン */
.square_btn01 {
	display: inline-block;
	position: relative;
	padding: 0.75em;
	text-decoration: none;
	color: #FFF;
	background: #0080c9;
	transition: .4s;
	border-radius: 4px;
	font-size: 0.9em;
	font-weight: bold;
}

/* ホバー時 */
.square_btn01:hover {
	opacity: 0.8;
}

/* シミュレーションボタン */
.button_simu {
	display: block;
	position: relative;
	text-decoration: none;
	height: 35px;
	width: 280px;
	text-align: left;
	color: #0000A0;
	border: solid 1px #0000A0;
	font-size: 0.85em;
	padding: 0.3em 1.2em;
	margin: 0.5em 0;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-o-transition: 0.3s;
	-ms-transition: 0.3s;
	transition: 0.3s;
	font-weight: normal;
}

/* カード型ボタン */
.button-03 {
	display: flex;
	justify-content: left;
	align-items: center;
	margin: 10px auto;
	padding: 1.2em 2.5em 1.2em 0;
	border: none;
	border-radius: 5px;
	box-shadow: 0 2px 3px rgb(0 0 0 / 25%), 0 2px 3px -2px rgb(0 0 0 / 15%);
	background-color: #fff;
	color: #333;
	font-weight: 600;
	font-size: 110%;
	border: 1px solid #ccc;
	text-align: left;
}

/* 矢印 */
.button-03::before {
	transform: rotate(45deg);
	width: 8px;
	height: 8px;
	margin: 0 20px;
	border-top: 2px solid #333;
	border-right: 2px solid #333;
	content: '';
	padding: 2px;
}

/* ホバー */
.button-03:hover {
	background-color: #1d4293;
	color: #fff;
}

/* ホバー時矢印 */
.button-03:hover::before {
	transform: rotate(45deg);
	width: 8px;
	height: 8px;
	margin: 0 20px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	content: '';
}

/* メインCTAボタン */
.button-04 {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 20px auto;
	padding: 1.2em 2.5em;
	border: none;
	border-radius: 5px;
	box-shadow: 0 2px 3px rgb(0 0 0 / 25%), 0 2px 3px -2px rgb(0 0 0 / 15%);
	background-color: #166f03;
	color: #fff;
	font-weight: 600;
	font-size: 110%;
	width: 95%;
	letter-spacing: 0.3em;
	border: 2px solid #fff;
}

/* 矢印 */
.button-04::after {
	transform: rotate(45deg);
	width: 10px;
	height: 10px;
	margin-left: 10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	content: '';
}

/* ホバー */
.button-04:hover {
	background-color: #115703;
}

/* 横幅100%ボタン */
.button-05 {
	width: 100%;
}

/*-----------------------------------------------------
  テーブル
-----------------------------------------------------*/
/* エリア表セル */
.area_01 td.line_03 {
	border: 1px solid #666 !important;
	text-align: center !important;
	vertical-align: middle !important;
	width: 25% !important;
	text-align: left !important;
	padding-left: 10px;
}

/*-----------------------------------------------------
  余白
-----------------------------------------------------*/
/* 下余白 */
.margin-b {
	margin-bottom: 30px;
}

/* 左余白 */
.padding_10 {
	padding-left: 10px;
}

/*-----------------------------------------------------
  ボックス
-----------------------------------------------------*/
/* 緑ボックス */
.box-03 {
	padding: 10px 10px 15px;
	margin: 2em 2em;
	color: #2c2c2f;
	background: #f0fdec;
	border-top: solid 5px #409b17;
	border-bottom: solid 5px #409b17;
}

/* ラベル付きボックス */
.box-04 {
	position: relative;
	margin: 1.9em auto 0;
	padding: 0 1.5em;
	border: 2px solid #2589d0;
	border-radius: 3px;
	width: 95%;
}

/* ラベル */
.box-04 span {
	position: absolute;
	top: -2.2em;
	left: -2px;
	padding: .3em 2em;
	border-radius: 5px 5px 0 0;
	background-color: #2589d0;
	color: #fff;
}

/* リスト余白 */
.box-04 ul {
	padding: 10px 0;
}

/* 画像付きボックス */
.box-05 img {
	width: 20%;
	float: right;
}

.box-05 p {
	padding: 0px 50px 20px !important;
}

.box-05 ul {
	padding: 0 50px !important;
}

.box-05 span.bold {
	padding: 10px 50px 0;
	font-weight: bold;
	clear: both;
}

/* レイアウト */
.box-06 {
	float: right;
	width: 80%;
}


/*-----------------------------------------------------
  強調文字
-----------------------------------------------------*/
/* 大文字 */
.big_01 {
	font-size: 180%;
	font-weight: bold;
	line-height: normal;
}

.big_02 {
	font-size: 130%;
	font-weight: bold;
}

.big_03 {
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 150%;
}

.big {
	font-size: 120%;
	line-height: normal;
}

/* マーカー */
.highlight {
	text-decoration: underline;
	text-underline-offset: -0.2em;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 227, 0, 0.63);
	text-decoration-skip-ink: none;
}

/*-----------------------------------------------------
  iframe
-----------------------------------------------------*/
iframe {
	margin: 0 auto;
	padding: 0;
	text-align: center;
	width: 100%;
}

/* 募集要項iframe高さ */
.requirements {
	height: 2350px;
}

/*-----------------------------------------------------
  WordPress見出し
-----------------------------------------------------*/
/* h4見出し */
h4.wp-block-heading {
	padding: 0 0 0 40px;
	border: none;
	background: none;
	font-size: 120%;
	clear: both;
}

/* h4大見出し */
h4.wp-block-heading-02 {
	position: static;
	width: 95%;
	padding: 0 0 0 0;
	border: none;
	background: none;
	font-size: 150%;
	box-shadow: none;
}

/* ダイヤ装飾 */
h4.wp-block-heading-02::after {
	position: absolute;
	content: '';
	bottom: 35%;
	left: .8em;
	width: 12px;
	height: 12px;
	background-color: #0168b3;
	transform: rotate(45deg);
}

/* 下線 */
h4.wp-block-heading span {
	border-bottom: 3px solid navy;
}

/*-----------------------------------------------------
  黄色系
-----------------------------------------------------*/
/* 黄色背景 */
.yellow {
	background: yellow;
	margin: 0 20px 0 0;
}

/* 黄色文字 */
.yellow-04 {
	color: yellow;
	font-size: 270%;
}

/* 黄色背景 */
.yellow-05 {
	background-color: yellow;
}

/* 黄土色背景 */
.yellow-06 {
	background-color: #bba842;
}

/*-----------------------------------------------------
  レイアウト
-----------------------------------------------------*/
/* Rubyレイアウト */
.box-08 {
	display: block ruby;
	padding: 0;
	margin: 0 0 0 20px;
}

/* 2カラム */
.box-07 {
	width: 48%;
	padding: 5px;
}

/* 上下余白 */
.box-09 {
	padding: 20px 0;
}

/* 枠付きボックス */
.box-10 {
	border: 2px solid #ccc;
	padding: 10px;
	margin: 10px 20px;
}

/* 注意ボックス */
.box-11 {
	max-width: 800px;
	margin: 0 auto;
	border: 3px solid #C41A41;
	border-radius: 5px;
	color: #333333;
}

/* タイトル */
.box-11 div {
	display: inline-flex;
	align-items: center;
	column-gap: 4px;
	position: relative;
	top: -13px;
	left: 10px;
	margin: 0 7px;
	padding: 0 8px;
	background: #fff;
	color: #C41A41;
	font-weight: 600;
	vertical-align: top;
	font-size: 130%;
}

/* アイコン */
.box-11 div::before {
	width: 22px;
	height: 22px;
	content: '';
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.8659 3.00017L22.3922 19.5002C22.6684 19.9785 22.5045 20.5901 22.0262 20.8662C21.8742 20.954 21.7017 21.0002 21.5262 21.0002H2.47363C1.92135 21.0002 1.47363 20.5525 1.47363 20.0002C1.47363 19.8246 1.51984 19.6522 1.60761 19.5002L11.1339 3.00017C11.41 2.52187 12.0216 2.358 12.4999 2.63414C12.6519 2.72191 12.7782 2.84815 12.8659 3.00017ZM10.9999 16.0002V18.0002H12.9999V16.0002H10.9999ZM10.9999 9.00017V14.0002H12.9999V9.00017H10.9999Z' fill='%23C41A41'%3E%3C/path%3E%3C/svg%3E");
}

/* 本文 */
.box-11 p {
	margin: 0;
	padding: 0 !important;
}

/* リスト */
.box-11 ul {
	padding: 0 20px 5px 20px;
}

/*-----------------------------------------------------
  お問い合わせiframe高さ
-----------------------------------------------------*/
.contact {
	height: 3300px;
}

.contact_01 {
	height: 2300px;
}

.contact_02 {
	height: 2300px;
}

.contact_03 {
	height: 2500px;
}

.contact_04 {
	height: 2500px;
}

.contact_05 {
	height: 2100px;
}

.contact_06 {
	height: 3000px;
}

.contact_07 {
	height: 1800px;
}


/*-----------------------------------------------------
  文字装飾
-----------------------------------------------------*/
/* 行間 */
.line_01 {
	line-height: normal;
}

/* 下線 */
.line_05 {
	border-bottom: solid 2px #7e7e7e;
}

/* リンク下線なし */
p.banner3 a,
.space1 a,
.decorationnone {
	text-decoration: none;
}

/* h5見出し */
h5 {
	padding: 0.5em 2.5em 0 2.5em;
	background: #fff;
}

/*-----------------------------------------------------
  吹き出し
-----------------------------------------------------*/
/* 黄色 */
.balloon-001 {
	display: flex;
	justify-content: left;
	position: relative;
	max-width: 700px;
	margin: 15px auto;
	padding: .8em 1.2em;
	border-radius: 25px;
	background-color: #f7e882;
	color: #000000;
}

.balloon-001::before {
	position: absolute;
	bottom: -15px;
	width: 30px;
	height: 15px;
	background-color: #f7e882;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	content: '';
	left: 100px;
}

.balloon-001 ul li {
	list-style: none;
	font-weight: bold;
	font-size: 120%;
}

/* 水色 */
.balloon-002 {
	display: flex;
	justify-content: left;
	position: relative;
	max-width: 700px;
	margin: 15px auto;
	padding: .8em 1.2em;
	border-radius: 25px;
	background-color: #7ec8ff;
	color: #000000;
}

.balloon-002::before {
	position: absolute;
	bottom: -15px;
	width: 30px;
	height: 15px;
	background-color: #7ec8ff;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	content: '';
	left: 100px;
}

/* オレンジ */
.balloon-003 {
	display: flex;
	justify-content: left;
	position: relative;
	max-width: 700px;
	margin: 15px auto;
	padding: .8em 1.2em;
	border-radius: 25px;
	background-color: #fba966;
	color: #000000;
}

.balloon-003::before {
	position: absolute;
	bottom: -15px;
	width: 30px;
	height: 15px;
	background-color: #fba966;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	content: '';
	left: 100px;
}

/*-----------------------------------------------------
  ボタン
-----------------------------------------------------*/
/* ボタン画像 */
.button_bl_m_ib {
	width: 60%;
	height: 100%;
	padding: 20px;
}

/*-----------------------------------------------------
  テーブル・エリア一覧
-----------------------------------------------------*/
/* 枠線なし */
.lineno {
	border: none;
	box-shadow: none;
}

/* 横幅50% */
.width50 {
	width: 50%;
}

/* エリア一覧 */
table.area_list_02,
table.area_list_03,
table.area_list_04 {
	width: 380px;
}

/* セル */
.area_list_02 td,
.area_list_03 td,
.area_list_04 td {
	border: 1px solid #979797;
	padding: 0 10px;
}

/* 横並び */
.area_02 {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
	display: inline-flex;
	margin: 20px 0;
}

.area_02 div {
	margin-right: 20px;
	caption-side: top;
}

/* 左列 */
.area_list_02 td:nth-of-type(1),
.area_list_03 td:nth-of-type(1) {
	background-color: #ccf9d3;
	width: 20px;
}

/* 市町村 */
.area_list_02 td:nth-of-type(2),
.area_list_03 td:nth-of-type(2) {
	width: 150px;
}

/* 金額 */
.area_list_02 td:nth-of-type(3),
.area_list_03 td:nth-of-type(3) {
	text-align: right;
}

/* エリア一覧4 */
.area_list_04 td:nth-of-type(1) {
	padding: 7px;
}

.area_list_04 th {
	padding: 7px;
	background-color: #ccf9d3;
	border: 1px solid #979797;
}

/*-----------------------------------------------------
  余白・色
-----------------------------------------------------*/

.margin30 {
	margin-left: 30px;
}

.margin40 {
	margin-right: 40px;
}

.red-02 {
	background-color: #ffbfbf;
}

.yellow-02 {
	background-color: #f0e68c;
}

.yellow-03 {
	background-color: #fdebc8;
	padding-bottom: 10px;
	margin: 0 10px;
}

/* 非表示 */
.none {
	display: none;
}

/* 小文字 */
.fonts {
	font-size: 85%;
}

/*-----------------------------------------------------
  投稿画像
-----------------------------------------------------*/
/* サムネイル */
.post-thumbnail {
	width: 45%;
	margin: 5px;
}

.post-thumbnail img {
	margin: 5px;
	height: auto;
}

/* 一覧画像 */
.post-images {
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

/* 中央画像 */
.center img {
	width: 80%;
	padding: 10px;
}

/*-----------------------------------------------------
  リボン
-----------------------------------------------------*/
/* オレンジ */
.ribbon20-wrapper {
	display: block;
	position: relative;
	margin: 0 auto;
	padding: 20px 0;
}

.ribbon20 {
	display: inline-block;
	position: absolute;
	right: 0;
	top: 0;
	box-sizing: border-box;
	padding: 0 12px;
	margin: 0;
	height: 30px;
	line-height: 30px;
	font-size: 18px;
	letter-spacing: 0.1em;
	color: white;
	background: #df7300;
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.12);
}

/* 青 */
.ribbon21-wrapper {
	display: block;
	position: relative;
	margin: 0 auto;
	padding: 20px 0;
}

.ribbon21 {
	display: inline-block;
	position: absolute;
	right: 0;
	top: 0;
	box-sizing: border-box;
	padding: 0 12px;
	margin: 0;
	height: 30px;
	line-height: 30px;
	font-size: 18px;
	letter-spacing: 0.1em;
	color: white;
	background: #0086df;
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.12);
}

/*-----------------------------------------------------
  その他
-----------------------------------------------------*/
/* パンフレット */
.pamphlet {
	margin: 0 auto;
}

/* スライドショー非表示 */
.slb_slideshow {
	display: none;
}

/* 施工事例 */
#main .list {
	padding-bottom: 20px;
}

/*-----------------------------------------------------
  ページネーション
-----------------------------------------------------*/
.pagination {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.pagination a {
	box-sizing: border-box;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	color: #1d4293;
	border: 1px solid #ddd;
	padding: 5px 10px;
	margin: 0px 1px;
}

.pagination a:not(:hover) {
	text-decoration: none;
}

.pagination a:hover {
	background-color: #ccc;
}

.pagination .current {
	background-color: #1d4293;
	color: #fff;
	pointer-events: none;
	border: 1px solid #1d4293;
	padding: 5px 10px;
	margin: 0px 1px;
	border-radius: 5px;
}

.pagination ul li {
	display: inline-block;
	margin: 0;
	padding: 0;
}


.prev.page-numbers,
.next.page-numbers{
  position: initial;
  background: none;
  width: 0;
  font-size: 16px;
}

/* 「…」 */
.page-numbers.dots {
    min-width: auto !important;
    padding: 0 5px !important;
    border: none !important;
    background: transparent !important;
	position: revert;
	display: contents;
}

/*-----------------------------------------------------
  カテゴリー一覧
-----------------------------------------------------*/
.list_category h4 {
	padding: 0em 0em 0.3em 0.3em !important;
	margin: 0px auto 15px !important;
	box-shadow: none;
	border-bottom: none;
	font-size: 100%;
}

.list_category_02 {
	display: inline-flex;
	width: 30%;
}

/*-----------------------------------------------------
  レイアウト
-----------------------------------------------------*/
/* 横幅100% */
.box-12 {
	width: 100%;
}

/* カテゴリー一覧の見出し装飾を非表示 */
.list_category h4::after {
	display: none;
}

/* カテゴリー一覧サムネイル */
.list_category .post-thumbnail {
	width: auto;
}

/*-----------------------------------------------------
  ボックス13
-----------------------------------------------------*/
/* 上部ライン付きボックス */
.box-13 {
	display: flex;
	box-shadow: 0 0 7px rgba(0, 0, 0, 0.3);
	border-style: solid;
	border-width: 7px 0 0 0;
	border-color: #0074bf;
}

/* テキスト */
.box-13-text {
	margin: 0;
	padding: 15px 0 0 0;
}

/* 大文字 */
.box-13-big {
	font-size: 1.5em;
}

.box-13-big-02 {
	font-size: 1.5em;
}

/* 太字 */
.box-13-bold {
	font-weight: bold;
}

/* 写真 */
.box-13-photo {
	padding: 10px 0 0 0;
}

/*-----------------------------------------------------
  フロー表示
-----------------------------------------------------*/
/* 横並びフロー */
.box-14,
.box-20 {
	display: flex;
	margin: 40px 0px;
	border-bottom: 1px solid #ccc;
	padding: 0 0 20px 0;
	justify-content: center;
}

/* 各ブロック */
.box-14 div,
.box-20 div {
	width: 27%;
	line-height: 100%;
	padding-bottom: 20px;
}

/* 矢印エリア */
.box-14 div.arrow-s {
	width: 15%;
}

/* 横矢印 */
.arrow-s {
	content: "";
	background-image: url("../images/denki/yajirushi1.png");
	background-repeat: no-repeat;
	background-position: center 90px;
}

/* 縦矢印 */
div.arrow-s-02 {
	width: 100%;
	height: 60px;
}

.arrow-s-02 {
	content: "";
	background-image: url("../images/denki/yajirushi1.png");
	background-repeat: no-repeat;
	background-position: center;
	transform: rotateZ(90deg);
}

div.arrow-s-04 {
	width: 100%;
	height: 60px;
}

.arrow-s-04 {
	content: "";
	background-image: url("../images/denki/yajirushi1.png");
	background-repeat: no-repeat;
	background-position: center;
	transform: rotateZ(125deg);
}

/* 説明 */
.box-14 p,
.box-20 p {
	padding: 0 5px !important;
	text-align: center;
	font-size: 0.9em;
	line-height: 120%;
}

/* 画像 */
.box-14 div img,
.box-20 div img {
	padding: 5px;
}

/* 数字 */
.box-14-big,
.box-20-big {
	font-size: 2.3em;
	line-height: normal;
}

/*-----------------------------------------------------
  余白ユーティリティ
-----------------------------------------------------*/
.space_03 {
	margin: 0 !important;
	padding: 0 !important;
}

.space_04 {
	margin: 20px 0 !important;
}

.space_05 {
	margin: 0 20px !important;
}

.space_06 {
	padding: 0 !important;
}

.space_07 {
	padding: 0 0 0 20px !important;
}

.space_08 {
	margin: 0 0 40px 0 !important;
}

.space_09 {
	padding: 0 0 40px 0 !important;
}

.space_10 {
	padding: 30px 0 !important;
	vertical-align: middle;
}

.space_11 {
	margin: 20px 10px !important;
}

.space_12 {
	margin: 20px !important;
}

.space_13 {
	padding: 10px !important;
}

.space_14 {
	padding: 20px !important;
	margin: 30px 0 0 0 !important;
}

.space_15 {
	margin: 20px 15px !important;
}

.space_16 {
	padding: 20px 0 0 0 !important;
}

.space_17 {
	margin: 0 !important;
	padding: 0 !important;
}

.space_18 {
	margin: 20px 10px !important;
}

.space_20 {
	margin: 0 0 20px 0 !important;
}

.space_21 {
	margin: 0 0 0 50px !important;
	padding: 0 !important;
}

.space_22 {
	margin: 20px 0 0 0 !important;
	padding: 0 0 0 15px !important;
}

.space_23 {
	margin: 0px 55px 20px 0 !important
}

.space_24 {
	padding: 0 0 0 10px !important;
}

.space_25 {
	padding: 20px 20px 10px 20px !important;
	margin: 20px auto !important;
}

.space_26 {
	padding: 0 0 0 25px !important;
}

/*-----------------------------------------------------
  ボックス15～19
-----------------------------------------------------*/
/* 2カラムボックス */
.box-15 {
	display: flex;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

/* 注意ボックス */
.box-16 {
	border: 1px solid #ccc;
	margin: 20px 0;
	padding: 20px 0 0;
	background-color: #f3fdc1;
}

/* 補足ボックス */
.box-17 {
	border: 1px solid #ccc;
	margin: 25px 0 0 0;
	background-color: #f3fdc1;
}

.box-17 span {
	padding: 0 10px;
	font-weight: bold;
}

/* 下段 */
.box-18 {
	display: flex;
	border-top: 1px solid #ccc;
	background-color: #fff;
}

/* 横並び */
.box-19 {
	display: flex;
	border: 1px solid #ccc;
}

.box-19 div {
	width: 100%;
}

/*-----------------------------------------------------
  写真・本文
-----------------------------------------------------*/
/* 写真 */
.photo01 {
	width: 30%;
	border-right: 1px solid #ccc;
}

.photo01 img {
	width: 90%;
	padding: 20px;
}

/* 本文 */
.text01 {
	padding: 20px 0;
	width: 70%;
}

.text-right {
	text-align: right;
}

/* 小文字 */
.box-15-text-s {
	font-size: 0.9em;
	line-height: 100%;
}

/* 大文字 */
.text-big {
	font-size: 1.6em;
	font-family: HGS創英角ｺﾞｼｯｸUB, serif;
}

/*-----------------------------------------------------
  テキストブロック
-----------------------------------------------------*/
/* 左カラム */
.text-01 {
	border-left: 1px solid #ccc;
	width: 70%;
}

/* 枠付きテキスト */
.text-02 {
	display: flex;
	border: 1px solid #ccc;
	width: 70%;
	margin: 10px auto;
	line-height: 100%;
}

.text-02 p {
	background-color: #e3e3e3;
	border-right: 1px solid #ccc;
}

.text-02 ul {
	padding-bottom: 10px;
}

/* 小文字 */
.text-s {
	font-size: 0.7em;
	padding: 0px !important;
}

/*-----------------------------------------------------
  左画像
-----------------------------------------------------*/
.photo-left {
	width: 30%;
	margin: auto;
}

.photo-left p {
	text-align: center;
}

.photo-left p img {
	width: 80%;
}

/*-----------------------------------------------------
  強調文字
-----------------------------------------------------*/
.big-03 {
	font-size: 2em;
}

.big-03 span {
	color: #909090;
	font-size: 0.9em;
}

.big-04 {
	font-size: 2.3em;
}

/*-----------------------------------------------------
  金額表
-----------------------------------------------------*/
.amount td,
.amount th {
	border: 1px solid #ccc;
	padding: 10px 20px;
	vertical-align: middle;
}

.amount th {
	background-color: #f3fdc1;
	text-align: center;
}


/* 金額表 */
.amount tr td:nth-of-type(2) {
	text-align: right;
	width: 50%;
	vertical-align: middle;
}

/* 共通テーブル */
.amount,
.amount-05,
.amount-06,
.amount-07,
.amount-08,
.amount-09,
.amount-10 {
	width: 100%;
	background: #fff;
}

/* 共通セル */
.amount-02 td,
.amount-03 td,
.amount-02 th,
.amount-03 th,
.amount-04 td,
.amount-04 th,
.amount-05 td,
.amount-05 th,
.amount-06 td,
.amount-06 th,
.amount-07 td,
.amount-07 th,
.amount-08 td,
.amount-08 th,
.amount-09 td,
.amount-09 th,
.amount-10 td,
.amount-10 th,
.amount-12 td,
.amount-12 th {
	border: 1px solid #ccc;
	padding: 10px;
	vertical-align: middle;
}

/* 見出し */
.amount-02 th,
.amount-03 th,
.amount-04 th,
.amount-05 th,
.amount-07 th,
.amount-08 th,
.amount-09 th,
.amount-10 th,
.amount-12 th {
	background-color: #f3fdc1;
	text-align: center;
	vertical-align: middle;
}

/* 金額表 */
.amount-02 tr td:nth-of-type(3) {
	text-align: right;
	width: 28%;
	vertical-align: middle;
}

.amount-04 tr td:nth-of-type(3) {
	text-align: right;
	width: 30%;
	vertical-align: middle;
}

.amount-07 tr td:nth-of-type(1) {
	text-align: center;
}

.amount-07 tr td:nth-of-type(3) {
	width: 35%;
	vertical-align: middle;
}

.amount-07 tr td:nth-of-type(4) {
	width: 25%;
	vertical-align: middle;
	text-align: right;
}

.amount-08 tr td:nth-of-type(1) {
	width: 60%;
}

.amount-08 tr td:nth-of-type(2) {
	width: 40%;
	text-align: right;
}

.amount-09 tr td:nth-of-type(1) {
	width: 30%;
	text-align: center;
}

.amount-09 tr td:nth-of-type(2) {
	width: 30%;
}

.amount-09 tr td:nth-of-type(3) {
	width: 40%;
}

.amount-10 tr td:nth-of-type(1) {
	width: 35%;
}

.amount-10 p {
	padding: 15px 5px !important;
	margin: 0px;
}

.amount-03 tr td:nth-of-type(1),
.amount-03 tr td:nth-of-type(2),
.amount-03 tr td:nth-of-type(3),
.amount-12 tr td {
	text-align: center;
	vertical-align: middle;
}

.amount-03 tr td:nth-of-type(4) {
	text-align: right;
	width: 30%;
	vertical-align: middle;
}

.amount-02,
.amount-03,
.amount-04,
.amount-12 {
	width: 100%;
}

.amount-04 {
	margin: 40px 0 0;
}

.amount-02 div {
	width: 50%;
	display: inherit;
	padding: 5px;
}

.amount-04 th {
	background-color: #f3fdc1;
	text-align: center;
	font-size: 120%;
	font-weight: bold;
}

.amount-05 tr td:nth-of-type(1) {
	width: 50%;
	vertical-align: middle;
}

.amount-06 th:nth-of-type(2),
.amount-06 th:nth-of-type(3) {
	text-align: center;
	vertical-align: middle;
	width: 38%;
}

.amount-06 tr td:nth-of-type(1),
.amount-06 th:nth-of-type(1) {
	background-color: #f3fdc1;
}

.amount-11 {
	width: 100%;
	text-align: center;
}

.amount-11 td,
.amount-11 th {
	padding: 7px 2px;
	vertical-align: middle;
	width: 10%;
	border: 1px #bbb solid;
}

.amount-12 tr td:nth-of-type(4),
.amount-12 tr td:nth-of-type(5),
.amount-12 tr td:nth-of-type(6),
.amount-12 tr td:nth-of-type(7) {
	width: 15%;
}

/*td.ta2 a {
  padding: 0px 20px 0 0;
}*/

/*-----------------------------------------------------
  フロー・レイアウト
-----------------------------------------------------*/
/* 矢印付きフロー */
.box-21 div.arrow-s {
	width: 10%;
}

/* フロー全体 */
.box-21 {
	display: flex;
	width: 70%;
	margin: 20px auto;
}

/*-----------------------------------------------------
  POINT表示
-----------------------------------------------------*/
/* 赤色POINTボックス */
.red-04 {
	position: relative;
	padding: 1rem 2rem;
	text-align: center;
	color: #ac0707;
	border-radius: 0 10px 10px 10px;
	background: #ffe5e5;
	line-height: normal;
	margin: 50px 10px;
	font-weight: bold;
	font-size: 1.5em;
}

/* POINTラベル */
.red-04:before {
	font-family: 'Font Awesome 5 Free';
	font-size: 1.2rem;
	position: absolute;
	top: -24px;
	left: 0;
	height: 24px;
	padding: 0 1em;
	content: 'POINT';
	color: #fff;
	border-radius: 10px 10px 0 0;
	background: #ac0707;
}

/* 注意表示 */
.bx-alert {
	display: block ruby;
	text-align: center;
	font-size: 1.7em;
	color: #ff6000;
	font-weight: bold;
	padding-top: 20px;
}

/*-----------------------------------------------------
  ボックス
-----------------------------------------------------*/
/* 横並びボックス */
.box-22 {
	display: flex;
	border-bottom: 1px solid #ccc;
	padding: 0 0 20px 0;
}

/* 中央揃え */
.box-22 p.text {
	text-align: center;
}

.box-22 p {
	padding: 0 !important;
}

/* 強調ボックス */
.box-23 {
	font-size: 120%;
	display: flex;
	font-weight: bold;
	margin: 0 auto;
	width: 40%;
}

/* オレンジラベル */
p.orange-01 {
	background-color: #ea5413;
	color: #fff;
	border-radius: 5px;
}

/* 横並び */
.box-24,
.box-25 {
	display: flex;
}

/* 下線付きボックス */
.box-24 {
	border-bottom: solid 2px #d7d7d7;
	padding: 15px 0;
}

.box-24 div {
	width: 100%;
}

/* 太字 */
.weight {
	font-weight: bold;
	font-size: 120%;
}

/* 大文字 */
.box-25-big {
	font-size: 2.3em;
}

.box-25 {
	text-align: right;
	align-items: center;
}

.box-25 p {
	width: 50%;
	padding: 0 !important;
}

/*-----------------------------------------------------
  線・装飾
-----------------------------------------------------*/
/* 赤二重線 */
.border-red {
	border-bottom: double 5px #ff0000;
	display: inline-flex;
	line-height: 0.9;
}

/* 取り消し線風 */
.border-red-02 {
	position: relative;
}

.border-red-02::after {
	content: '';
	width: 100%;
	border-top: 3px solid #f00;
	position: absolute;
	top: 45%;
	left: 0;
	transform: rotate(-6deg);
}

/*-----------------------------------------------------
  アコーディオン
-----------------------------------------------------*/
/* 基本 */
.accordion-001 {
	background-color: #f2f2f2;
	border-bottom: 3px solid #ddd;
	margin: 20px 0;
}

/* 閉じた状態 */
.accordion-001:not([open]) {
	margin-bottom: 7px;
}

/* タイトル */
.accordion-001 summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: 0.8em 1.5em;
	border-radius: 5px;
	background-color: #0094d6;
	color: #fff;
	font-weight: 600;
	cursor: pointer;
}

/* 標準マーカー非表示 */
.accordion-001 summary::-webkit-details-marker {
	display: none;
}

/* 開閉アイコン */
.accordion-001 summary::after {
	transform: translateY(-25%) rotate(45deg);
	width: 12px;
	height: 12px;
	margin-left: 10px;
	border-bottom: 3px solid #fff;
	border-right: 3px solid #fff;
	content: '';
	transition: transform .3s;
}

/* 開いた状態 */
.accordion-001[open] summary::after {
	transform: rotate(225deg);
}

/* 内容 */
.accordion-001 p {
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 1em 2em 2em 2em;
	color: #333333;
	transition: transform .5s, opacity .5s;
}

.accordion-001[open] p {
	transform: none;
	opacity: 1;
}

/*-----------------------------------------------------
  アコーディオン内テーブル
-----------------------------------------------------*/
/* 横幅 */
.accordion-002 table {
	margin: 0 auto;
	width: 100%;
}

/* 2列目タイプ */
.accordion-002 tr td:nth-of-type(1) {
	width: 80%;
	padding: 5px 20px;
}

.accordion-002 tr td:nth-of-type(2) {
	width: 18%;
}

/* 3列タイプ */
.accordion-003 table {
	margin: 0 auto;
	width: 100%;
}

.accordion-003 tr td:nth-of-type(1) {
	width: 38%;
	padding: 5px 20px;
}

.accordion-003 tr td:nth-of-type(2) {
	width: 40%;
}

.accordion-003 tr td:nth-of-type(3) {
	text-align: right;
	padding: 5px 20px 5px 0;
	width: 20%;
}

.accordion-004 table {
	margin: 0 auto;
	width: 100%;
}

/* 2列目タイプ */
.accordion-004 tr td:nth-of-type(1) {
	width: 80%;
	padding: 5px 20px;
	vertical-align: middle;
}

/* 右寄せ価格 */
.accordion-004 tr td:nth-of-type(2) {
	text-align: right;
}

/* アコーディオン5 */
.accordion-005 table {
	margin: 0 10px;
}

.accordion-005 tr td:nth-of-type(1) {
	width: 67.5%;
	padding: 5px;
	vertical-align: middle;
}

/* 右寄せ価格 */
.accordion-005 tr td:nth-of-type(2) {
	text-align: right;
}

/*-----------------------------------------------------
  色・ボタン
-----------------------------------------------------*/
/* 表線 */
tr {
	border-bottom: 1px solid #ccc;
}

/* 赤NEWラベル */
.red-05 {
	background: #F00;
	color: #FFF;
	font-size: 50%;
	line-height: 1.5;
	padding: 2px 5px;
	border-radius: 2px;
	margin: 0px 5px;
	vertical-align: text-top;
}

/* 赤背景 */
.red-06 {
	background-color: #BB0000 !important;
}

.red-07 {
	background-color: #FFE7E7 !important;
}

/* ボタン */
.button_b2_m_ib {
	width: 90%;
	margin: 0 auto;
	display: block;
	text-align: center;
}

/*-----------------------------------------------------
  ボックスレイアウト
-----------------------------------------------------*/
.box-26 {
	margin: 0;
}

/* 2列 */
.box-27 div {
	width: 41.5%;
	display: table-cell;
	padding: 0 5px;
}

.box-28 div.box-27 {
	padding: 0px 2px;
	text-align: center;
}

/* 区切り線 */
.line-02 {
	border-right: 1px solid #ccc;
}

.line-03 {
	border-bottom: 2px solid #ccc;
}

.line-04 {
	border-top: 1px solid #ccc;
}

/* 横並び */
.box-28 {
	border-bottom: 1px solid #ccc;
	display: flex;
}

/* 中央 */
.box-29 {
	text-align: center;
	width: 50%;
}

/* 余白 */
.box-30 {
	margin: 0 auto;
	padding: 20px 20px;
}

/*-----------------------------------------------------
  注意・案内ボックス
-----------------------------------------------------*/
.box-31 {
	position: relative;
	margin: 3em auto 3em;
	padding: 0 1.5em;
	border: 3px solid #d02525;
	border-radius: 3px;
	width: 100%;
}

.box-31 span {
	position: absolute;
	top: -2.5em;
	left: -0.2em;
	padding: 0.5em 0;
	border-radius: 5px 5px 0 0;
	background-color: #d02525;
	color: #ffe44e;
	font-weight: bold;
	width: 100.8%;
	text-align: center;
}

.box-31 ul li {
	margin-left: 0;
	padding-top: 0;
	list-style: none;
}

/*-----------------------------------------------------
  各種ボックス
-----------------------------------------------------*/
.box-32 {
	display: flex;
	border-bottom: solid 2px #d7d7d7;
	padding: 15px 0;
}

.box-33 {
	border: double 4px #006400;
	border-radius: 10px;
	padding: 1em;
	width: 92%;
	margin: 20px auto;
}

.box-34 {
	border: double 4px #ff0000;
	border-radius: 10px;
	padding: 1em;
	width: 92%;
	margin: 20px auto;
}

.box-35 {
	display: flex;
}

.box-35 div {
	margin: 0 auto;
	padding: 20px 0 20px 0;
}

/* グリッド */
.box-36 {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	text-align: center;
}

/* 背景ボックス */
.box-37 {
	border: 1px solid #ccc;
	margin: 0 20px;
	background-color: #f3fdc1;
}

/* 中央配置 */
.box-38 {
	width: 100%;
	align-items: center;
	justify-content: center;
	display: flex;
}

.box-38 div {
	width: 100%;
}

/*-----------------------------------------------------
  ナビゲーション
-----------------------------------------------------*/
.box-39 {
	margin: 0 10px;
	padding: 5px 0;
}

.box-39 ul {
	width: 100%;
	display: flex;
	background-color: #6b9cd3;
}

.box-39 ul li {
	list-style-type: none;
	font-size: 80%;
	text-align: center;
}

.box-39 ul li a {
	color: #fff;
}

/*-----------------------------------------------------
  その他
-----------------------------------------------------*/
.box-40 {
	width: 100%;
	margin: 0 auto;
}

.box-40 div {
	padding: 20px;
	text-align: center;
}

/* リストマークなし */
.list-none li {
	list-style-type: none;
}

/*-----------------------------------------------------
  施工事例カテゴリー一覧
-----------------------------------------------------*/
/* カテゴリー一覧（横並び・折り返し） */
.work-cat-list {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	list-style: none;
	padding: 0;
	margin: 0;
}

/* カテゴリー項目 */
.work-cat-item {
	width: calc(33.333% - 20px);
	box-sizing: border-box;
	transition: box-shadow 0.3s;
	list-style: none;
	margin: 0 auto;
}

/* マウスホバー時の影 */
.work-cat-item:hover {
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
}

/* サムネイル画像 */
.work-cat-item .thumb img {
	width: 100%;
	height: auto;
	display: block;
}

/* タイトル */
.work-cat-item .title {
	font-size: 1em;
	margin-top: 10px;
}

/* 日付表示 */
.excerpt-day {
	padding: 0 !important;
	margin: 10px 0;
	text-align: end;
}

.work-cat-item .date {
	font-size: 0.85em;
	color: #666;
}

/* 抜粋文章 */
.post-excerpt {
	text-align: left;
	margin-left: 40px;
}

/*-----------------------------------------------------
  ボックス内文章調整
-----------------------------------------------------*/
.box-12 p {
	text-align: right;
	padding: 0 !important;
}

/*-----------------------------------------------------
  Before / After 表示
-----------------------------------------------------*/
/* Before After 横並び */
.before-after-set {
	display: flex;
	padding: 0px 25px;
}

/* 画像余白 */
.thumbnail-before,
.thumbnail-after {
	padding: 0 5px;
}

/* Before After画像枠 */
.before-img,
.after-img,
.before-img-02,
.after-img-02,
.before-after-item {
	position: relative;
	margin: 5px 0;
}

/* Beforeラベル */
.before-img p,
.after-img p,
.before-img-02 p,
.after-img-02 p {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	background: #163f8b;
	color: #fff;
	font-size: 18px;
	line-height: 1;
	padding: 10px 10px;
	margin-left: 5px;
}

/* Afterラベル */
.after-img p,
.after-img-02 p {
	background: #ea5413;
}

/* Before / After 共通ラベル */
.before p,
.after p {
	background: #163f8b;
	color: #fff;
	font-size: 18px;
	line-height: 1;
	padding: 10px 10px;
	text-align: center;
}

/* Afterカラー */
.after p {
	background: #ea5413;
}

/* 本文余白 */
p.text {
	padding: 0 20px 20px 30px !important;
}

/* Before After画像 */
.before_image,
.after_image {
	padding: 0 5px;
}

/* 投稿画像サイズ */
.post-images-02 {
	width: 47%;
	margin: 0 auto;
}

/*-----------------------------------------------------
  文字装飾
-----------------------------------------------------*/
/* 太字 */
.bold-02 {
	font-weight: bold;
}

/* 中央揃え */
.center-02 {
	text-align: center !important;
	vertical-align: middle !important;
}

.center-03 {
	align-content: center;
}

/* 中央表示 */
.center-04 {
	display: block ruby;
	text-align: center;
}

/*-----------------------------------------------------
  矢印アイコン
-----------------------------------------------------*/
.arrow-02 {
	position: relative;
	display: inline-block;
	padding: 0 0 0 30px !important;
	color: #000;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
}

/* 矢印共通 */
.arrow-02::before,
.arrow-02::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}

/* 矢印線 */
.arrow-02::before {
	left: -1px;
	width: 16px;
	height: 4px;
	background: #f00;
}

/* 矢印先端 */
.arrow-02::after {
	left: 0px;
	width: 16px;
	height: 16px;
	border-top: 3px solid #f00;
	border-right: 3px solid #f00;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

/*-----------------------------------------------------
  ラベルリスト
-----------------------------------------------------*/
/* ラベル横並び */
.frame-ul-01 {
	display: table-cell;
}

/* オレンジラベル */
.frame-ul-01 li {
	display: inline flow-root list-item;
	list-style: none;
	background-color: #ea5413;
	color: #fff;
	width: 155px;
	font-size: 80%;
	padding: 5px;
	border-radius: 5px;
	text-align: center;
	margin: 2px;
	align-items: center;
}

/* 青ラベル */
.frame-ul-02 {
	display: flex;
	gap: 5px;
}

.frame-ul-02 li {
	display: flex;
	list-style: none;
	background-color: #0041c0;
	color: #fff;
	width: 130px;
	padding: 10px;
	align-items: center;
	justify-content: center;
	text-align: center;
	border-radius: 30px;
	font-size: 80%;
	border-radius: 5px;
	margin: 0px 10px;
}

/* リスト装飾なし */
.list-01 li {
	list-style: none;
	padding: 0 0 0 10px;
}

/*-----------------------------------------------------
  ボタン
-----------------------------------------------------*/
.button_01 {
	display: flex;
}

.button_01 p {
	padding: 0 !important;
	margin: 10px auto;
	width: 50%;
}

/* .sl-image {
  width: 100% !important;
  left: 0 !important;
} */

/*-----------------------------------------------------
  線・余白
-----------------------------------------------------*/
/* 青下線 */
.border-blue {
	border-bottom: solid 3px #0168b3;
	margin-bottom: 20px;
}

/* パディング */
.padding-01 {
	padding: 20px 30px;
	margin: 0 20px 0 0;
}

.padding-02 {
	padding: 20px 30px;
	margin: 0 43px 0 0;
}

/*-----------------------------------------------------
  メール表示
-----------------------------------------------------*/
.mail-01 {
	font-size: 80%;
	border: solid 2px #d7d7d7;
}

/*-----------------------------------------------------
  色設定
-----------------------------------------------------*/
.gray {
	background-color: #d7d7d7;
}

.gray-02 {
	color: #9d9d9d;
}

.gray-03 {
	color: #ccc;
}

/*-----------------------------------------------------
  幅指定
-----------------------------------------------------*/
.auto {
	width: auto !important;
}

.w100 {
	width: 100% !important;
}

.w80 {
	width: 80% !important;
}

.w50 {
	width: 50% !important;
}

.w30 {
	width: 30% !important;
}

.w20 {
	width: 20% !important;
	margin: 0 60px;
}

.w15 {
	width: 15% !important;
}

/* 矢印位置調整 */
.arrow-s-03 {
	background-position: center center !important;
}

/*-----------------------------------------------------
  施工事例表示
-----------------------------------------------------*/
/* 画像付き説明枠 */
.example {
	width: 50%;
	margin: 20px;
	position: relative;
}

/* 横並び */
.example_02 {
	display: flex;
	border-bottom: solid 2px #d7d7d7;
	margin: 0 0 30px 0;
}

/* 画像ラベル */
.example p {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	background: #163f8b;
	color: white;
	font-size: 18px;
	line-height: 1;
	padding: 5px 10px;
}

/*-----------------------------------------------------
  Before / After
-----------------------------------------------------*/
/* Afterラベル */
p.after {
	background: #ea5413;
}

/*-----------------------------------------------------
  リボンデザイン
-----------------------------------------------------*/
/* リボン全体 */
.ribbon01-wrapper {
	display: block;
	position: relative;
	margin: 15px auto;
	padding: 10px 0;
	background: #f1f1f1;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.14);
	box-sizing: border-box;
}

/* 右上リボン */
.ribbon01-content {
	position: absolute;
	top: -6px;
	right: -6px;
	width: 89px;
	height: 91px;
	overflow: hidden;
}

/* 左上リボン */
.ribbon01-content-02 {
	width: 131px;
	height: 138px;
	overflow: hidden;
	position: absolute;
	top: -5px;
	left: -6px;
}

/* リボン本体 */
.ribbon01,
.ribbon02 {
	display: inline-block;
	position: absolute;
	padding: 6px 0;
	left: -30px;
	top: 23px;
	width: 170px;
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	background: #F00;
	color: #fff;
	letter-spacing: 0.05em;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
	font-weight: bold;
}

/* 左上リボン */
.ribbon02 {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	left: -40px;
	top: 31px;
}

/* リボン折り返し */
.ribbon01:before,
.ribbon01:after,
.ribbon02:before,
.ribbon02:after {
	position: absolute;
	content: "";
	border-top: 4px solid #b80404;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	bottom: -4px;
}

.ribbon01:before {
	left: 20px;
}

.ribbon02:before {
	left: 6px;
}

.ribbon01:after {
	right: 22px;
}

.ribbon02:after {
	right: 6px;
}

/*-----------------------------------------------------
  共通レイアウト
-----------------------------------------------------*/
/* 配管画像 */
.plumbing {
	width: 25%;
	display: inline-block;
	padding: 5px;
	text-align: center;
}

/* 線なし */
.line-no {
	border-bottom: none;
}

.line-no-02 {
	border-top: none;
}

.line-no-03 {
	border: none;
}

/* 幅指定 */
.w60 {
	width: 60%;
}

/*-----------------------------------------------------
  強調文字
-----------------------------------------------------*/
/* 縁取り文字 */
.emphasis_design {
	position: relative;
	color: #4d9bc1;
	-webkit-text-stroke: 5px #4d9bc1;
}

.emphasis_design::before {
	content: attr(data-text);
	position: absolute;
	color: #4d9bc1;
	-webkit-text-stroke: 1px #fff;
}

/*-----------------------------------------------------
  吹き出し
-----------------------------------------------------*/
/* 丸吹き出し */
.balloon-01 {
	position: relative;
	padding: 10px;
	width: 80px !important;
	height: 80px;
	line-height: 1;
	border-radius: 50%;
	text-align: center;
	color: #ffffff;
	font-size: 12px;
	background-color: #f00;
	left: 300px;
	font-weight: bold;
	letter-spacing: -0.2em;
}

/* 吹き出ししっぽ */
.balloon-01::before {
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: -1px;
	bottom: -3px;
	border-right: 20px solid #f00;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	transform: rotate(-45deg);
}

/*-----------------------------------------------------
  ボタン
-----------------------------------------------------*/
/* 赤ボタン */
.btn-square-pop {
	position: relative;
	display: inline-block;
	padding: 0.5em;
	text-decoration: none;
	color: #FFF;
	background: #df0101;
	border-bottom: solid 2px #a00;
	border-radius: 4px;
	box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
	font-weight: bold;
	font-size: 30px;
	width: 100%;
}

/* 押下時 */
.btn-square-pop:active {
	border-bottom: solid 2px #a00000;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

/* ホバー */
.btn-square-pop:hover {
	background-color: #b70000;
}

/* 白ボタン */
.btn-square-pop-02 {
	position: relative;
	display: inline-block;
	padding: 0.5em;
	text-decoration: none;
	color: #df0101;
	background: #fff;
	border: solid 1px #df0101;
	border-radius: 4px;
	box-shadow: inset 0 2px 0 rgba(255, 255, 255, 0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
	font-weight: bold;
	font-size: 20px;
	width: 85%;
}

.btn-square-pop-02:active {
	border-bottom: solid 2px #a00000;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

.btn-square-pop-02:hover {
	background-color: #df0101;
	color: #fff;
}

/*-----------------------------------------------------
  Q&Aアコーディオン
-----------------------------------------------------*/
/* 全体 */
.cp_qa03 .cp_actab {
	position: relative;
	width: 100%;
	margin: 0 0 1em 0;
	color: #0168b3;
}

/* チェックボックス非表示 */
.cp_qa03 .cp_actab input {
	display: none;
}

/* 質問 */
.cp_qa03 .cp_actab label {
	font-weight: bold;
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0 0 0 0;
	padding: 1em 2em 1em 3.5em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background: rgba(27, 37, 56, 0.1);
}

/* Qアイコン */
.cp_qa03 .cp_actab label::before {
	content: 'Q';
	font-family: "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, sans-serif;
	;
	font-size: 1.5em;
	margin-left: -1em;
	padding-right: 0.5em;
}

.cp_qa03 .cp_actab label:hover {
	color: #0168b3;
	transition: all 0.3s;
}

/* +アイコン */
.cp_qa03 .cp_actab label::after {
	position: absolute;
	top: 0;
	right: 0;
	content: '+';
	font-size: 1.7em;
	font-weight: bold;
	line-height: 2em;
	display: inline-block;
	width: 2em;
	height: 2em;
	transition: transform 0.3s;
}

/* 回答 */
.cp_qa03 .cp_actab .cp_actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 2.5em;
	border-radius: 0 0 0.5em 0.5em;
	transition: max-height 0.2s;
}

/* Aアイコン */
.cp_qa03 .cp_actab .cp_actab-content::before {
	position: absolute;
	content: 'A';
	font-family: "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, sans-serif;
	;
	font-size: 1.5em;
	margin: 1.2em 0 0 0;
	padding: 0;
}

/* 回答文 */
.cp_qa03 .cp_actab .cp_actab-content p {
	margin: 1em 1em 1em 1em;
}

/* 開いた状態 */
.cp_qa03 .cp_actab input:checked~.cp_actab-content {
	max-height: 40em;
	border: 10px solid rgba(27, 37, 56, 0.1);
}

/* 質問をクリックした時のアイコンの動き */
.cp_qa03 .cp_actab input:checked~label {
	color: #0168b3;
	border-radius: 0.5em 0.5em 0 0;
}

/* 質問をクリックした時の+の動き */
.cp_qa03 .cp_actab input[type=checkbox]:checked+label::after {
	transform: rotateZ(45deg);
	transform-origin: 50% 50%;
}

/*-----------------------------------------------------
  IH比較表
-----------------------------------------------------*/
/* 左カラム */
.left_02 {
	float: left;
	width: 50%;
}

/* テーブル */
.ih_table {
	background: #f5f5dc;
}

.ih_table p {
	background: #bdb76b;
	padding: 0 !important;
}

.ih_table ul {
	display: grid;
	font-size: 11px;
	grid-template-columns: repeat(4, 1fr);
	margin: 0;
}

.ih_table ul li {
	list-style-type: none;
	line-height: initial;
	text-align: center;
	margin: 0;
	padding: 5px;
}

.ih_table_02 img {
	max-height: 120px;
	width: auto;
	text-align: center;
}

.ih_table_02 {
	display: flex;
	align-items: center;
	gap: 16px;
	text-align: center;
	padding: 10px;
}

/*------------------------------------------
        料金バナー
------------------------------------------*/
.price-banner {
	display: inline-block;
	position: relative;
	background: #ffe600;
	padding: 10px 20px;
	text-align: center;
	margin: 10px 0 20px 0;
	border-radius: 20px;
}

/* 下の三角部分 */
.price-banner::after {
	content: "";
	position: absolute;
	bottom: -20px;
	left: 50%;
	transform: translateX(-50%);
	border-width: 20px 30px 0 30px;
	border-style: solid;
	border-color: #ffe600 transparent transparent transparent;
}

.banner-inner {
	transform: skewX(-10deg);
}

.banner-inner p {
	transform: skewX(10deg);
	margin: 5px 0;
}

.main-text {
	font-size: 28px;
	font-weight: bold;
	color: #ff0000;
}

.sub-text {
	font-size: 20px;
	font-weight: bold;
	color: #ff0000;
}

/*------------------------------------------
        dlレイアウト
------------------------------------------*/
.dl_block {
	display: block;
}

.dl_block dt {
	padding: 0 0 0 30px
}

.dl_block dd {
	padding: 0 45px;
}

/*------------------------------------------
        グリッドレイアウト
------------------------------------------*/
.grid-container {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	max-width: 1200px;
	margin: 0 auto;
}

.grid-container2 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 5px;
	max-width: 1200px;
	margin: 0 auto;
}

.grid-container {
	grid-template-columns: repeat(2, 1fr);
}

/*------------------------------------------
        プロフィールカード
------------------------------------------*/
.profile-card {
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	padding: 15px;
	display: flex;
	flex-direction: column;
	line-height: 150%;
	border: 1px solid #ddd;
}

.profile-card2 {
	background: #f4ffff;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	padding: 15px;
	display: flex;
	flex-direction: column;
	line-height: 150%;
	border: 1px solid #ddd;
}

.profile-card3 {
	background: #fff9fc;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	padding: 15px;
	display: flex;
	flex-direction: column;
	line-height: 150%;
	border: 1px solid #ddd;
}

.profile-card4 {
	background: #fffff4;
	border-radius: 10px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	padding: 15px;
	display: flex;
	flex-direction: column;
	line-height: 150%;
	border: 1px solid #ddd;
}

/*------------------------------------------
        プロフィールヘッダー
------------------------------------------*/
.profile-header {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}

.profile-header img {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	object-fit: cover;
	margin-right: 15px;
}

.profile-info h2 {
	margin: 0;
	font-size: 1.1em;
}

.profile-info p {
	margin: 5px 0 0;
	color: #666;
	font-size: 0.95em;
}

.profile-comment {
	font-size: 0.9em;
	color: #444;
	margin-top: 10px;
}

/*------------------------------------------
        小プロフィール
------------------------------------------*/
.profile-header2 {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}

.profile-header2 img {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	object-fit: cover;
	margin-right: 15px;
}

.profile-comment {
	font-size: 0.9em;
	color: #444;
	margin-top: 10px;
}

/*------------------------------------------
        矢印デザイン
------------------------------------------*/
.arrow-wrapper {
	position: relative;
	width: 100px;
	height: 100px;
}

.arrow-group {
	display: flex;
	gap: 12px;
	padding: 20px;
}

.kunoji-arrow {
	width: 20px;
	height: 20px;
	border-right: 3px solid black;
	border-bottom: 3px solid black;
	transform: rotate(45deg) skew(20deg, 20deg);
}

/*------------------------------------------
        ページタイトル
------------------------------------------*/
.page-title {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 30px;
}

.page-title img {
	width: 40px;
	height: 40px;
	margin-right: 15px;
}

.page-title h1 {
	margin: 0;
	font-size: 1.8em;
}

.page-title h2 {
	font-size: 1.8em;
}

/*------------------------------------------
        画像グリッド
------------------------------------------*/
.image-grid {
	display: grid;
	gap: 20px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 10px;
	grid-template-columns: repeat(2, 1fr);
}

.image-grid img {
	width: 100%;
	height: auto;
	border-radius: 10px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

/*------------------------------------------
        採用ページ
------------------------------------------*/
.job-section {
	max-width: 1200px;
	margin: 50px auto 0;
	padding: 0 10px;
}

.job-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	margin-bottom: 30px;
}

.job-buttons a {
	flex: 1 1 calc(25% - 15px);
	min-width: 120px;
	text-align: center;
	background-color: #0073e6;
	color: #fff;
	padding: 12px 3px 12px 1px;
	border-radius: 8px;
	text-decoration: none !important;
	font-size: 1em;
	transition: background 0.2s;
	display: flex;
	justify-content: center;
	align-items: center;
}

.job-buttons a:hover {
	background-color: #005bb5;
}

.flow-image img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.flow-image {
	background-color: #fff;
}

/*------------------------------------------
        ヒーローイメージ
------------------------------------------*/
.hero-section {
	position: relative;
	width: 100%;
	height: 320px;
	overflow: hidden;
}

.hero-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-text {
	position: absolute;
	top: 15%;
	left: 0;
	bottom: 0;
	right: 0;
	color: #fff;
	text-align: center;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
}

.hero-text h1 {
	font-size: 2em;
	margin: 0;
}

.hero-text p {
	font-size: 1em;
	margin-top: 10px;
}

/*------------------------------------------
        ポイント紹介
------------------------------------------*/
.points-section {
	padding: 60px 20px;
	text-align: center;
}

.points-section h2 {
	font-size: 1.8em;
	color: #333;
}

.points-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 30px;
	max-width: 1000px;
	margin: 0 auto;
	position: relative;
}

.point-card {
	background: #f9f9f9;
	padding: 20px 5px;
	;
	border-radius: 16px;
	position: relative;
	overflow: hidden;
	z-index: 1;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	border: 1px solid #ddd;
}

.point-card h3 {
	font-size: 1.2em;
	color: #0073e6;
	border-bottom: none;
	box-shadow: none;
	padding: 0;
	margin: 0 0 10px 0;
}

h3::after {
	display: none;
}

.point-card p {
	font-size: 0.95em;
	color: #555;
}

.circle-bg {
	position: absolute;
	top: -40px;
	left: -40px;
	width: 200px;
	height: 200px;
	background: radial-gradient(circle, rgba(0, 115, 230, 0.2) 0%, transparent 70%);
	border-radius: 50%;
	z-index: -1;
	filter: blur(10px);
}

/*------------------------------------------
        横スクロール画像
------------------------------------------*/
.marquee-container {
	overflow: hidden;
	width: 100%;
	background: #f7f7f7;
	padding: 20px 0;
}

.marquee-track {
	display: flex;
	animation: scroll-left 40s linear infinite;
	gap: 20px;
	width: max-content;
}

.marquee-track img {
	width: 180px;
	height: auto;
	flex-shrink: 0;
	object-fit: contain;
	border-radius: 10px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

@keyframes scroll-left {
	0% {
		transform: translateX(0%);
	}

	100% {
		transform: translateX(-50%);
	}
}

/*------------------------------------------
        採用お問い合わせ
------------------------------------------*/
.recruit-contact {
	text-align: center;
	background-color: #f1f1f1;
	color: #333;
	padding: 30px 15px;
	font-size: 1.3em;
	font-weight: bold;
	margin-top: 60px;
	line-height: 1.8;
	border-top: 2px solid #ccc;
}

.recruit-contact .tel-link {
	color: #0073e6;
	font-size: 1.4em;
	text-decoration: none;
}

.recruit-contact .tel-link:hover {
	text-decoration: underline;
}

/*------------------------------------------
        インタビューボタン
------------------------------------------*/
.interview-button {
	text-align: center;
	margin: 60px auto 40px;
}

.orange-button {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 500px;
	width: 90%;
	height: 150px;
	margin: 0 auto;
	background-color: #ff7f27;
	border-radius: 15px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
	transition: background 0.3s, transform 0.2s;
	text-decoration:none !important;
}

.orange-button:hover {
	background-color: #e56700;
	transform: scale(1.02);
}

.interview-text {
	color: #fff;
	font-size: 1.4em;
	font-weight: bold;
	text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
	text-align: center;
	padding: 0 10px;
}

/*------------------------------------------
        タイムライン
------------------------------------------*/
.timeline {
	max-width: 800px;
	margin: auto;
	position: relative;
}

.timeline::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 2px;
	background-color: #007bff;
	transform: translateX(-50%);
	z-index: 0;
}

.timeline-event {
	display: flex;
	justify-content: -between;
	align-items: center;
	margin: 40px 0;
	position: relative;
	z-index: 1;
}

.event-left,
.event-right {
	width: 45%;
}

.event-center {
	width: 10%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 2;
}

.event-center img {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 50%;
	background: white;
	padding: 2px;
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}

.event-content {
	display: flex;
	align-items: center;
	gap: 10px;
	background: white;
	padding: 12px;
	border-radius: 10px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.event-content .time {
	font-weight: bold;
	color: #007bff;
	margin-bottom: 4px;
}

.event-content-text {
	flex: 1;
}

.event-content img.content-image {
	width: 140px;
	height: auto;
	border-radius: 6px;
	flex-shrink: 0;
}

/*------------------------------------------
        Q&A
------------------------------------------*/
.qa-section {
	max-width: 800px;
	margin: 60px auto;
	padding: 20px;
	background-color: #fff;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.qa-section h2 {
	text-align: center;
	margin-bottom: 30px;
	color: #007bff;
}

.qa {
	display: flex;
	align-items: flex-start;
	margin-bottom: 24px;
}

.qa-left {
	flex-direction: row;
}

.qa-right {
	flex-direction: row-reverse;
}

.qa-avatar {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	object-fit: cover;
	margin: 0 12px;
	flex-shrink: 0;
}

.qa-bubble {
	background: #f8f9fa;
	padding: 12px 16px;
	border-radius: 10px;
	border: 1px solid #ddd;
	max-width: 600px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.qa-bubble p {
	margin: 0 0 6px;
}

/*------------------------------------------
        共通装飾
------------------------------------------*/
.white {
	color: #fff;
}

.num,
.plus {
	display: inline-block;
	vertical-align: middle;
}

/*------------------------------------------
        地図エリア
------------------------------------------*/
.map-section h2 {
	border-left: 5px solid #004b87;
	padding-left: 12px;
	margin-top: 40px;
}

.map-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 20px;
}

/*------------------------------------------
        Panasonicページ 共通
------------------------------------------*/
.pana-hero {
	background: linear-gradient(135deg, #eef6ff 0%, #ffffff 55%, #f7fbff 100%);
	border: 1px solid #d8e8f7;
	border-radius: 12px;
	padding: 28px 30px;
	margin-bottom: 28px;
	position: relative;
	overflow: hidden;
}

.pana-hero::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 8px;
	height: 100%;
	background: #005bac;
}

/*------------------------------------------
        Panasonic ラベル
------------------------------------------*/
.pana-label {
	display: inline-block;
	background: #005bac;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	padding: 4px 12px;
	border-radius: 999px;
	margin-bottom: 12px;
}

/*------------------------------------------
        Panasonic ヒーロー見出し
------------------------------------------*/
.pana-hero h2 {
	font-size: 25px;
	line-height: 1.5;
	color: #003f7d;
	margin: 0 0 14px;
}

.pana-hero p {
	margin: 0;
}

/*------------------------------------------
        Panasonic セクション
------------------------------------------*/
.pana-section {
	margin-bottom: 32px;
}

.pana-section h3 {
	font-size: 21px;
	color: #003f7d;
	border-left: 6px solid #005bac;
	border-bottom: 1px solid #d7e4f0;
	padding: 7px 0 7px 12px;
	margin: 0 0 16px;
}

.pana-section p {
	margin: 0 0 14px;
}

/*------------------------------------------
        Panasonic 注意書き
------------------------------------------*/
.pana-note {
	background: #fffaf0;
	border: 1px solid #f1d8a8;
	border-radius: 8px;
	padding: 16px 18px;
	margin: 20px 0;
	font-size: 14px;
}

.pana-note strong {
	color: #9a6400;
}

/*------------------------------------------
        Panasonic メイン画像
------------------------------------------*/
.pana-photo-main {
	margin: 20px 0 26px;
	text-align: center;
}

.pana-photo-main img {
	width: 100%;
	max-width: 700px;
	height: auto;
	border-radius: 10px;
	border: 1px solid #ddd;
	display: block;
	margin: 0 auto;
}

.pana-photo-main figcaption {
	font-size: 13px;
	color: #666;
	margin-top: 8px;
	line-height: 1.6;
}

/*------------------------------------------
        Panasonic 画像一覧
------------------------------------------*/
.pana-photo-grid {
	display: flex;
	gap: 16px;
	margin: 20px 0 26px;
}

.pana-photo-card {
	width: 50%;
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 10px;
	overflow: hidden;
}

.pana-photo-card img {
	width: 100%;
	height: 210px;
	object-fit: cover;
	display: block;
}

.pana-photo-card .caption {
	padding: 10px 12px;
	font-size: 13px;
	color: #555;
	line-height: 1.6;
	background: #fafafa;
}

/*------------------------------------------
        Panasonic ポイント一覧
------------------------------------------*/
.pana-point-list {
	margin: 18px 0 0;
	padding: 0;
	list-style: none;
}

.pana-point-list li {
	background: #f7fbff;
	border: 1px solid #d8e8f7;
	border-radius: 8px;
	padding: 12px 14px 12px 42px;
	margin-bottom: 10px;
	position: relative;
	list-style: none;
	margin: 10px 0;
}

.pana-point-list li::before {
	content: "✓";
	position: absolute;
	left: 15px;
	top: 12px;
	color: #005bac;
	font-weight: bold;
	font-size: 18px;
}

/*------------------------------------------
        Panasonic サービス案内
------------------------------------------*/
.pana-service-box {
	background: #f8f8f8;
	border-radius: 10px;
	padding: 20px;
	border: 1px solid #e0e0e0;
}

.pana-service-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 16px;
}

.pana-service-links a {
	display: inline-block;
	background: #fff;
	border: 1px solid #005bac;
	color: #005bac;
	text-decoration: none;
	border-radius: 999px;
	padding: 7px 14px;
	font-size: 14px;
	font-weight: bold;
}

.pana-service-links a:hover {
	background: #005bac;
	color: #fff;
}

/*------------------------------------------
        Panasonic メッセージ
------------------------------------------*/
.pana-message {
	background: #005bac;
	color: #fff;
	border-radius: 12px;
	padding: 24px 26px;
	margin: 30px 0 10px;
}

.pana-message h3 {
	color: #fff;
	border-left: 6px solid #fff;
	border-bottom: 1px solid rgba(255, 255, 255, 0.35);
	margin-bottom: 14px;
}

.pana-message p {
	margin-bottom: 0;
}

.pana-small {
	font-size: 13px;
	color: #666;
}

/*------------------------------------------
        Panasonic ヒーロー画像レイアウト
------------------------------------------*/
.pana-hero-wrap {
	padding: 28px 30px;
	overflow: hidden;
}

.pana-hero-logo-wrap {
	float: left;
	width: 150px;
	height: auto;
	margin: 0 22px 12px 0;
	border: none;
}

.pana-hero-wrap .pana-label {
	margin-top: 2px;
}

.pana-hero-wrap h2 {
	margin-top: 8px;
	margin-bottom: 14px;
}

.pana-hero-wrap p {
	margin: 0 0 12px;
}

.pana-hero-wrap p:last-child {
	margin-bottom: 0;
}

/*------------------------------------------
        Panasonic 見出し装飾リセット
------------------------------------------*/
.pana-expert-article .pana-section h3::before,
.pana-expert-article .pana-section h3::after,
.pana-expert-article .pana-message h3::before,
.pana-expert-article .pana-message h3::after {
	content: none !important;
	display: none !important;
}

.pana-expert-article .pana-section h3 {
	position: relative;
	background-image: none !important;
	padding: 7px 0 7px 12px !important;
	margin: 0 0 16px !important;
	line-height: 1.6;
}

.pana-expert-article .pana-message h3 {
	position: relative;
	background-image: none !important;
	padding: 7px 0 7px 12px !important;
	margin: 0 0 14px !important;
	line-height: 1.6;
}

/*------------------------------------------
        お問い合わせ一覧（青）
------------------------------------------*/
.contact-list {
	max-width: 1200px;
	margin: 50px auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 28px 40px;
}

.contact-list .contact-card {
	border: 2px solid #999;
	min-height: 135px;
	display: flex;
	align-items: center;
	padding: 25px 20px;
	text-decoration: none;
	color: #222;
	transition: .3s;
}

.contact-list .contact-card:hover {
	background: #e1ebfa;
	border-color: #0068b7;
}

.contact-list .icon {
	flex-shrink: 0;
	display: flex;
	justify-content: center;
}

.contact-list .icon img {
	height: auto;
}

.contact-list .text {
	flex: 1;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
}

.contact-list .arrow {
	font-size: 60px;
	color: #0068b7;
	font-weight: 300;
}

/*------------------------------------------
        お問い合わせ一覧（オレンジ）
------------------------------------------*/
.contact-list_02 {
	max-width: 1200px;
	margin: 50px auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 28px 40px;
}

.contact-list_02 .contact-card {
	border: 2px solid #999;
	min-height: 135px;
	display: flex;
	align-items: center;
	padding: 25px 20px;
	text-decoration: none;
	color: #222;
	transition: .3s;
}

.contact-list_02 .contact-card:hover {
	background: #f9f0ee;
	border-color: #ea5413;
}

.contact-list_02 .icon {
	flex-shrink: 0;
	display: flex;
	justify-content: center;
}

.contact-list_02 .icon img {
	height: auto;
}

.contact-list_02 .text {
	flex: 1;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
}

.contact-list_02 .arrow {
	font-size: 60px;
	color: #ea5413;
	font-weight: 300;
}

.decorationnone {
  text-decoration: none !important;
}

.amount-02 .price {
    clear: both;
    display: block;
}
