@charset "utf-8";

/*------------------------------------------
    リンク設定
------------------------------------------*/
a {
	text-decoration: underline !important;
}

a:hover {
	text-decoration: none;
}

/*------------------------------------------
    パンくずリスト
------------------------------------------*/
#breadcrumb {
	overflow-x: scroll;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	padding: 0.5rem;
	color: #333;
	font-size: 0.8rem;
	vertical-align: middle;
	line-height: 120%;
}

#breadcrumb ul li {
	display: inline;
	padding-left: 0px;
	padding-right: 0px;
}

#breadcrumb ul li+li::before {
	content: ">";
	margin: 0 12px;
}

#breadcrumb a {
	background-size: auto 20%;
	color: #364e96;
	text-decoration: underline;
}

/*------------------------------------------
    段落・リスト共通
------------------------------------------*/
.margin p {
	padding: 10px 10px;
	line-height: 150%;
	font-size:90%;
}

ol {
	counter-reset: number;
}

ul {
	margin 20px 0 20px 20px;
}

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

ol li {
	position: relative;
	margin-left: 15px;
	padding-right: 5px;
	padding-top: 10px;
}


ol li::before {
	counter-increment: number;
	content: '（' counter(number) '）';
}

/*------------------------------------------
    横並びボックス
------------------------------------------*/
.box-2 {
	width: 100%;
	margin: 0 auto;
}

.box-2 div {
	padding: 8px;
	text-align: center;
}

/*------------------------------------------
    見出し h2
------------------------------------------*/
h2.title-04 {
	color: #364e96;
	margin: 0 0.5em 20px 0.25em;
	padding: 0.5em 5px;
	border-top: solid 3px #364e96;
	border-bottom: solid 3px #364e96;
	font-size: 1.5rem;
}

/*------------------------------------------
    見出し h3（タイトル05）
------------------------------------------*/
h3.title-05 {
	clear: both;
	color: #000;
	padding: 0.5em 0.5em 0.5em 1.2em;
	width: 99%;
	/*    margin: 0 1.0em 10px 5px; */
	font-size: 1.3em;
	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: 2px;
	width: 5px;
	height: 80%;
	text-align: center;
}

h3.title-05::after {
	background-color: #D3EDFB;
	border-radius: 5px;
	content: '';
	position: absolute;
	top: 5px;
	left: 10px;
	width: 5px;
	height: 80%;
	background-image: none;
	transform: none;
}

/*------------------------------------------
    見出し h3（タイトル06）
------------------------------------------*/
h3.title-06 {
	color: #000;
	padding: 20px;
	width: 90%;
	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（タイトル03）
------------------------------------------*/
h4.title-03 {
	padding: 0.5em 0.3em;
	background: #CCECFB;
	border-left: 12px double #0094d6;
	font-size: 1.2em;
	margin: 0.5em;
	padding: 0 !important;
}

/*------------------------------------------
    見出し h4（タイトル02）
------------------------------------------*/
h4.title-02 {
	padding: 0.5em 0.3em;
	background: #CCECFB;
	border-left: 12px double #0094d6;
	font-size: 1.2em;
	margin: 0.5em;
	width: auto;
}

/*------------------------------------------
    見出し h4（タイトル01）
------------------------------------------*/
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.2em;
	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);
}

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

ul.service li {
	padding: 0;
}

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

.table_design01 td {
	border: 1px solid #ddd;
	background-color: #fff;
	padding: 0.5em;
}

.table_design01 th {
	border: 1px solid #ddd;
	background-color: #fff;
	padding: 0.5em 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: 25%;
}

.table_design01 td li {
	margin-left: 15px !important;
}

/*------------------------------------------
    会社案内ナビ（3列・2列共通）
------------------------------------------*/
.company_navi,
.company_navi-02 {
	display: flex;
	flex-wrap: wrap;
	border-bottom: solid 1px #c8c8c8;
	border-right: solid 1px #c8c8c8;
}

/*------------------------------------------
    会社案内ナビ（3列）
------------------------------------------*/
.company_navi-03 {
	display: flex;
	border-bottom: solid 1px #c8c8c8;
	border-right: solid 1px #c8c8c8;
}

.company_navi-02,
.company_navi-03 {
	margin: 20px 0;
}

/*------------------------------------------
    会社案内ナビ（3分割）
------------------------------------------*/
.company_navi li {
	width: 33.3%;
	margin: 0;
	background-color: #fafafa;
	font-size: 0.8em;
	padding: 15px 0;
	text-align: center;
	border-top: solid 1px #c8c8c8;
	border-left: solid 1px #c8c8c8;
}

/*------------------------------------------
    会社案内ナビ（2分割）
------------------------------------------*/
.company_navi-02 li {
	width: 50%;
	margin: 0;
	background-color: #fafafa;
	font-size: 0.8em;
	padding: 15px 0;
	text-align: center;
	border-top: solid 1px #c8c8c8;
	border-left: solid 1px #c8c8c8;
	list-style: none;
	display: flex;
	justify-content: center;
	align-items: center;
}

/*------------------------------------------
    会社案内ナビ（3分割・中央揃え）
------------------------------------------*/
.company_navi-03 li {
	width: 33%;
	margin: 0;
	background-color: #fafafa;
	font-size: 0.8em;
	padding: 15px 0;
	text-align: center;
	border-top: solid 1px #c8c8c8;
	border-left: solid 1px #c8c8c8;
	list-style: none;
	display: flex;
	justify-content: center;
	align-items: center;
}

/*------------------------------------------
    ナビゲーションリスト
------------------------------------------*/
.nav__lIst li {
	list-style: none;
	margin: 0;
}

/*------------------------------------------
    水色背景段落
------------------------------------------*/
p.aliceblue {
	background: aliceblue;
	margin: 10px 0;
}

/*------------------------------------------
    サイドメニュー
------------------------------------------*/
.menu-item5 {
	margin: 0;
	padding-right: 0 !important;
}

/*------------------------------------------
    左寄せ画像
------------------------------------------*/
.left_box img {
	width: 150px;
}

.left_box {
	float: left;
}

.left {
	text-align: left;
}

.left_02 {
	float: left;
	width: 50%;
}

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

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

ol.cjk-ideographic ::before {
	display: none;
}

/*------------------------------------------
    GOODアイコン一覧
------------------------------------------*/
ul.good li {
	list-style-type: none !important;
	margin: 0;
	padding: 0;
}

ul.good {
	position: relative;
}

ul.good p {
	margin: 5px 0px 5px 55px;
}

.area_01 a {
	padding: 0 10px 0 0;
}

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;
}

/*------------------------------------------
    画像サイズ指定
------------------------------------------*/
p.img_30 {
	width: 80%;
}

div.line {
	border-bottom: 1px solid #CCC;
	clear: both;
}

/*------------------------------------------
    プロフィールレイアウト
------------------------------------------*/
.box_left {
	width: 50%;
	text-align: center;
	margin: 30px auto;
}

.box_right {
	margin: 25px 10px;
}

.box_left img {
	width: 65%
}

/*------------------------------------------
    プロフィール（dl）
------------------------------------------*/
dl.profile {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	border: none;
}

dl.profile dt {
	width: 40%;
	text-align: right;
	padding: 0;
	font-weight: bold;
}

dl.profile dd {
	width: 60%;
	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;
	/*アイコン色*/
}

/*------------------------------------------
    左余白
------------------------------------------*/
span.space {
	padding: 0 0 0 20px;
}

/*------------------------------------------
    文字色（赤）
------------------------------------------*/
.red {
	color: #ff2617;
	font-weight: bold;
}

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

.red-03 {
	color: #ff2617;
}

.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.3em;
}

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

.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;
}

/*------------------------------------------
    文字色（緑）
------------------------------------------*/
.green {
	color: #048c5a;
}

.green-02 {
	color: #006400;
	font-size: 150%;
	text-decoration: underline;
	font-weight: bold;
}

.green-03 {
	color: #006400;
	font-size: 120%;
	font-weight: bold;
}

.green-04 {
	background-color: #afd262;
}

.green-05 {
	background-color: #f0fdd2;
}

/*------------------------------------------
    文字色（青）
------------------------------------------*/
.blue {
	color: #0545f5;
}

.blue-02 {
	color: #004bb6;
	font-weight: bold;
}

.blue-03 {
	color: #0168b3;
	font-weight: bold;
}

.blue-04 {
	background-color: #7ec8ff;
}

.blue-05 {
	background-color: #8bcdee;
}

.blue-06 {
	background-color: #cfefff;
}

.blue-07 {
	background-color: #8bcdee !important;
}

/*------------------------------------------
    下線
------------------------------------------*/
.underline {
	text-decoration: underline;
}

/*------------------------------------------
    協力会社表示
------------------------------------------*/
.cooperation {
	font-size: 120%;
	font-weight: bold;
	color: #2c2c2f;
}

.cooperation li {
	list-style-type: none;
	padding: 5px 10px;
	margin: 0;
}

/*------------------------------------------
    共通見出し
------------------------------------------*/
h3 {
	margin: 20px 0;
}


/*------------------------------------------
    STEPフロー
------------------------------------------*/
.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;
}

.stepflow>li::before {
	left: -15px !important;
}

.stepflow li {
	padding: 0;
}

.stepflow_label::before {
	left: -20px;
	top: 14px;
}

.stepflow_label {
	padding: 15px 0px 8px 0px;
}

/*------------------------------------------
    右寄せ
------------------------------------------*/
.right {
	width: 100%;
	text-align: -webkit-right !important;
	text-align: right;
	margin: 0px !important;
	padding: 10px !important;
}

.right-02 {
	text-align: -webkit-right !important;
	text-align: right !important;
}

/*------------------------------------------
    ボックス01
------------------------------------------*/
.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;
}

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

/*------------------------------------------
    青ボタン
------------------------------------------*/
.button_bl_m_ib {
	height: 70%;
	width: 90%;
	padding: 15px;
	margin: 0;
}

.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;
}

/*------------------------------------------
    エリアテーブル
------------------------------------------*/
.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;
}

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

/*------------------------------------------
    文字サイズ
------------------------------------------*/
.small_02 {
	font-size: 70% !important;
}

.small-03 {
	font-size: 80%;
}

.small-04 {
	font-size: 70%;
}

.line_01 {
	line-height: normal !important;
}

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

.big_01 {
	font-size: 1.0em;
	font-weight: bold;
}

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

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

/*------------------------------------------
    マーカー風ハイライト
------------------------------------------*/
.highlight {
	text-decoration: underline;
	text-underline-offset: -0.2em;
	text-decoration-thickness: 0.5em;
	text-decoration-color: rgba(255, 228, 0, 0.4);
	text-decoration-skip-ink: none;
}

.line-05 {
	border-bottom: 2px solid #ccc;
	padding-bottom: 10px;
	margin-bottom: 20px;
}

ul.list_flow li {
	color: #556b2f !important;
	padding: 0 !important;
	margin: 0 0 0 40px !important;
	list-style: disc !important;
}

.padding_10 {
	padding-left: 10px;
}

.box-03 {
	padding: 10px 0 15px;
	margin: 2em 1em;
	color: #2c2c2f;
	background: #f0fdec;
	border-top: solid 5px #409b17;
	border-bottom: solid 5px #409b17;
}

.button-03 {
	display: flex;
	justify-content: left;
	align-items: center;
	margin: 10px auto;
	padding: 15px 8px;
	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: 100%;
	border: 1px solid #ccc;
	text-align: left;
	line-height: 100%;
}

.button-03::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 8px 0 0;
    border: 2px solid #e60012;
    border-radius: 50%;
    box-sizing: border-box;
    position: relative;
    background: #e60012;
}

/* 丸の中の矢印 */
.button-03 {
    position: relative;
}

.button-03::after {
    content: '';
    position: absolute;
    left: 15px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: translateY(-50%) rotate(45deg);
}

.button-03:hover {
	background-color: #1d4293;
	color: #fff;
}

.button-03:hover::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 8px 0 0;
    border: 2px solid #e60012;
    border-radius: 50%;
    box-sizing: border-box;
    position: relative;
    background: #e60012;
}


.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;
}

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

.box-04 span {
	position: absolute;
	top: -1.7em;
	left: -2px;
	padding: .3em 0.5em;
	border-radius: 5px 5px 0 0;
	background-color: #2589d0;
	color: #fff;
}

.box-04 ul {
	padding: 10px 0;
}

/*------------------------------------------
    採用ページ（右カラム）
------------------------------------------*/
.recruit-02.center {
	width: 45%;
	float: right;
	padding: 15px;
}

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

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

/*------------------------------------------
    WordPress ブロック見出し
------------------------------------------*/
h4.wp-block-heading {
	padding: 0 10px 0 10px;
	border: none;
	background: none;
	font-size: 120%;
	clear: both;
	line-height: 140%;
}

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

/*------------------------------------------
    ボックス05（画像右寄せ）
------------------------------------------*/
.box-05 img {
	width: 20%;
	float: right;
}

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

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

.box-05 span.bold {
	padding: 10px 20px 20px 20px;
	font-weight: bold;
}

/*------------------------------------------
    ボックス06
------------------------------------------*/
.box-06 {
	float: right;
	width: 80%;
}

/*------------------------------------------
    ボタン05
------------------------------------------*/
.button-05 {
	width: 100%;
	height: 85px;
}

/*------------------------------------------
    文字サイズ
------------------------------------------*/
.samll_03 {
	font-size: 90%;
	line-height: normal;
}

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

/*------------------------------------------
    黄色系装飾
------------------------------------------*/
.yellow {
	background: yellow;
	margin: 0 20px 0 0;
	line-height: 120%;
}

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

.yellow-04 {
	color: yellow;
	font-size: 270%;
}

.yellow-05 {
	background-color: yellow;
}

.yellow-06 {
	background-color: #bba842;
}

/*------------------------------------------
    白色系装飾
------------------------------------------*/
.white {
	background-color: #fff;
}

/*------------------------------------------
    ボタン06
------------------------------------------*/
.button-06 {
	width: 90%;
	height: 60px;
	margin: 10px auto 30px;
}


/*------------------------------------------
    ボックス07～09
------------------------------------------*/
.box-07 {
	width: 100%;
	margin: 0 auto;
}

.box-08 {
	display:flex;
	gap:8px;
}

.box-09 {
	background-color: #f5f5f5;
	padding: 0 0 20px;
}

.box-09 h3::after {
	width: 0;
}

.box-09 h3 {
	padding: 20px;
}

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

/*------------------------------------------
    h3共通
------------------------------------------*/
h3 {
	padding: 20px !important;
}

h3::after {
	width: 0;
}

/*------------------------------------------
    コード表示用
------------------------------------------*/
.lineno {
	border: none !important;
	box-shadow: none !important;
}

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

.contact_01 {
	height: 2900px;
}

.contact_02 {
	height: 2500px;
}

.contact_03 {
	height: 3000px;
}

.contact_04 {
	height: 3000px;
}

.contact_05 {
	height: 2700px;
}

.contact_06 {
	height: 3300px;
}

.contact_07 {
	height: 2000px;
}

/*------------------------------------------
    文字サイズ
------------------------------------------*/
.small_03 {
	font-size: 90%;
}

/*------------------------------------------
    リンク装飾解除
------------------------------------------*/
p.banner3 a,
.space1 a,
.decorationnone {
	text-decoration: none !important;
}

/*------------------------------------------
    余白
------------------------------------------*/
.margin-02 {
	margin: 30px 0;
}

/*------------------------------------------
    h5見出し
------------------------------------------*/
h5 {
	margin: 10px 15px 0 15px;
	font-size: 100%;
	background-color: #fff;
}

/*------------------------------------------
    吹き出し（黄色）
------------------------------------------*/
.balloon-001 {
	display: flex;
	justify-content: left;
	position: relative;
	margin: 15px 10px;
	padding: 15px 0 25px 0;
	border-radius: 25px;
	background-color: #fff7c2;
	color: #000000;
}

.balloon-001::before {
	position: absolute;
	bottom: -15px;
	width: 30px;
	height: 15px;
	background-color: #fff7c2;
	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;
}

/*------------------------------------------
    Contact Form レイアウト
------------------------------------------*/
.box-11 .comform-row .itemTitle,
.box-11 .comform-row .itemInput {
	display: block !important;
	width: 100% !important;
	padding: 6px !important;
}

/*------------------------------------------
    横スクロール
------------------------------------------*/
.mobile-scroll {
	width: 100%;
	overflow-x: scroll;
}

/*------------------------------------------
    横幅指定
------------------------------------------*/
.width160 {
	width: 160%;
	max-width: 160% !important;
}

.width200 {
	width: 200%;
	max-width: 200% !important;
}

/*------------------------------------------
    対応エリア・料金表
------------------------------------------*/
/* エリア一覧テーブル共通 */
table.area_list_02,
table.area_list_03,
table.area_list_04 {
	width: 100%;
}

/* テーブルセル共通 */
.area_list_02 td,
.area_list_03 td,
.area_list_04 td {
	border: 1px solid #979797;
	padding: 3px 10px;
}

/* エリアテーブルの配置 */
.area_02 div {
	margin: 0 10px;
	caption-side: top;
}

/* 左余白調整 */
.margin30 {
	margin-left: 0px;
}

.margin40 {
	margin-right: 40px;
}

/* 黄色背景 */
.yellow-02 {
	background-color: #f0e68c;
}

/* 料金列を右寄せ */
.area_list_02 td:nth-of-type(3),
.area_list_03 td:nth-of-type(3) {
	text-align: right;
}

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

/* 市区町村番号列 */
.area_list_02 td:nth-of-type(1),
.area_list_03 td:nth-of-type(1) {
	background-color: #ccf9d3;
	width: 20px;
}

/* エリア表04のセル */
.area_list_04 td {
	padding: 7px;
}

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

/* エリア表04 見出し */
.area_list_04 th {
	background-color: #ccf9d3;
	border: 1px solid #979797;
	padding: 7px;
}

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

/*------------------------------------------
    注意事項ボックス
------------------------------------------*/
/* 注意ボックス */
.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 li {
	padding-bottom: 10px;
	padding-top: 0px;
}

/*------------------------------------------
    見出し・記事共通
------------------------------------------*/
/* h4見出し */
h4 {
	padding: 5px;
	width: 100%;
	font-size: 130%;
	line-height: normal;
}

/* 見出し装飾を無効化 */
h4::after {
	display: none;
}

/* 投稿日 */
.day {
	padding: 5px 0 15px;
}

/* 記事一覧 */
#main .list {
	border: none;
	box-shadow: none;
	width: 95%;
	padding: 3px;
	margin: 10px auto;
	border-bottom: 2px solid #ddd;
}

/* 記事画像 */
.post-images img {
	padding: 5px 0;
}

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

/*------------------------------------------
    リボンデザイン
------------------------------------------*/
/* オレンジリボン */
.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);
}

/*------------------------------------------
    余白調整
------------------------------------------*/
.margin-30 {
	margin: 30px 0 15px 0;
}

/*------------------------------------------
    ページネーション
------------------------------------------*/
/* ページ送り全体 */
.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 8px;
	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;
}

/*------------------------------------------
    カテゴリー一覧
------------------------------------------*/
/* サムネイル */
.post-thumbnail img {
	margin: 5px;
	height: auto;
}

/* カテゴリー見出し */
.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: 45%;
	margin: 5px;
}

.box-12 {
	width: 100%;
}

/* 見出し装飾削除 */
.list_category h4::after {
	display: none;
}

/* サムネイル */
.list_category .post-thumbnail {
	width: auto;
}

/* 抜粋 */
.post-excerpt {
	padding: 10px 10px 30px 10px;
	clear:both;
}

/* .post-body {
  padding: 5px 10px;
} */

/* SP非表示 */
.imgclass hidden-sp {
	display: none;
}

/*------------------------------------------
    ビフォーアフター
------------------------------------------*/
/* ボックス */
.box-13 {
	border-style: solid;
	border-width: 7px 0 0 0;
	border-color: #0074bf;
	margin: 10px;
	box-shadow: 0 0 7px rgba(0, 0, 0, 0.2);
}

/* 本文 */
.box-13-text {
	margin: 0;
	padding: 15px 0 0 0;
}

/* 大見出し */
.box-13-big {
	font-size: 1.8em;
}

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

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

.box-13-photo {
	padding: 10px 0 0 0;
}

/*------------------------------------------
    施工比較レイアウト
------------------------------------------*/
.box-14 div.old-s,
.box-14 div.new-s {
	display: flex;
	align-items: center;
}

/* 新しい設備 */
.box-20 div.new-s {
	align-items: center;
	border-bottom: 1px solid #ccc;
}

/* セクション */
.box-14 {
	margin: 40px 0px;
	border-bottom: 1px solid #ccc;
	padding: 0 0 20px 0;
}

/* 共通レイアウト */
.box-14 div,
.box-20 div {
	width: 100%;
	margin:0 auto;
}

.box-20 div{
	width: calc(50% - 5px);
}

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

/* テキスト */
.new-s p {
	text-align: right;
	width: 75%;
}

/*------------------------------------------
    施工比較レイアウト
------------------------------------------*/
.box-20 .new-s p {
	width: 100% !important;
}

.box-20 .new-s img {
	width: 80% !important;
}

.box-20.img-big {
	text-align: center;
	display:flex;
	flex-wrap:wrap;
}

/*------------------------------------------
    矢印デザイン
------------------------------------------*/
/* 矢印 */
.arrow-s {
	content: "";
	background-image: url("../images/denki/yajirushi1.png");
	background-repeat: no-repeat;
	background-position: center;
	padding: 40px;
	transform: rotate(90deg);
}

/* 矢印スペース */
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(90deg);
}

/* 比較ボックス本文 */
.box-14 p,
.box-20 p {
	padding: 0 5px !important;
	text-align: center;
	font-size: 0.9em;
	line-height: 160%;
}

.box-14-big {
	font-size: 1.8em;
}

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

/*------------------------------------------
    余白調整クラス
------------------------------------------*/
.space_03 {
	margin: 0 !important;
	padding: 0 !important;
}

.space_04 {
	margin: 20px 0;
}

.space_06 {
	margin: 0 !important;
}

.space_07 {
	padding-left: 1.5em !important;
}

.space_08 {
	margin: 0 !important;
}

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

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

.space_12 {
	margin: 10px !important;
}

.space_13 {
	padding: 10px !important;
}

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

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

.space_17 {
	margin: 0 !important;
}

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

.space_19 {
	padding: 0 !important;
}

.space_20 {
	padding: 0 20px 10px 20px;
}

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

.space_24 {
	gap: 0px !important;
}

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


/*------------------------------------------
    ボックスデザイン
------------------------------------------*/
/* 下線付きボックス */
.box-15 {
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

.box-17 {
	border: 1px solid #ccc;
	margin: 25px 0 0 0;
	background-color: #f3fdc1;
}

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

.box-15-text-s {
	font-size: 0.9em;
	line-height: 100%;
}

.photo01 img {
	padding: 20px;
}

.text01 {
	padding: 0 0 5px 0;
}

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

.photo01 {
	width: 50%;
	margin: auto;
}

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

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

.box-16 p {
	margin: 0;
	line-height: 130%;
}

/* 区切り */
.box-18 {
	border-top: 1px solid #ccc;
	background-color: #fff;
}

.text-01 {
	border-top: 1px solid #ccc;
}

.text-02 {
	border: 1px solid #ccc;
	width: 90%;
	margin: 10px auto;
	line-height: 100%;
}

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

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

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

/* 左寄せ写真 */
.photo-left {
	width: 80%;
	margin: auto;
}

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

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

/* 見出し */
.big-03 {
	font-size: 1.5em;
	text-align: center;
}

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

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

/* ボックス */
.box-19 {
	border: 1px solid #ccc;
	margin: 0 0 15px 0;
}

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

.box-19 img {
	padding: 0 20px;
}

.line_marker_bl {
	line-height: normal;
	font-size: 1.2em;
}

.img-big img {
	width: 35% !important;
}

/*------------------------------------------
    料金表・価格表
------------------------------------------*/
/* 共通テーブル */
.amount td,
.amount th {
	border: 1px solid #ccc;
	padding: 10px;
}

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

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

.amount-02,
.amount-03,
.amount-04,
.amount-07,
.amount-08,
.amount-09,
.amount-10,
.amount-12 {
	width: 600px;
	background-color: #fff;
}

.amount-12 {
	table-layout: fixed;
}

.amount-05 {
	width: 100%;
}

.amount-02 div,
.amount-03 div,
.amount-07 div,
.amount-08 div,
.amount-09 div,
.amount-10 div,
.amount-12 div {
	padding: 5px;
	display: inherit;
	width: 50%;
}

.amount-02 td,
.amount-02 th,
.amount-03 td,
.amount-03 th,
.amount-04 td,
.amount-04 th,
.amount-05 td,
.amount-05 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;
	text-align: center;
	line-height: 150%;
}

.amount-06 td,
.amount-06 th {
	vertical-align: middle;
	text-align: center;
	line-height: 150%;
}

.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;
}

/* 以下は各料金表ごとの列幅・配置調整 */
.amount-02 tr td:nth-of-type(1) {
	width: 30%;
}

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

.amount-02 tr td:nth-of-type(3) {
	text-align: right;
	width: 25%;
}

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

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

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

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

.amount-04 tr td:nth-of-type(2) {
	text-align: left;
}

.amount-04 tr td:nth-of-type(3) {
	text-align: right;
}

.amount-05 tr td:nth-of-type(2) {
	width: 50%;
	text-align: left;
	padding-bottom: 10px;
}

table.amount-06 td {
	display: block;
	width: 100%;
}

table.amount-06 th {
	display: none;
}

.amount-06 tr td:nth-of-type(2):before,
.amount-06 tr td:nth-of-type(3):before {
	content: attr(data-label);
	font-weight: bold;
	display: block;
	background-color: #ffbfbf;
	padding: 10px;
}

.amount-06 tr td:nth-of-type(3):before {
	background-color: #7ec8ff;
}

.amount-06 tr td:nth-of-type(1) {
	background-color: #f3fdc1;
	font-weight: bold;
	padding: 10px;
}

.amount-06 tr td:nth-of-type(2) {
	width: 50%;
	float: left;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	margin-left: -1px;
}

.amount-06 tr td:nth-of-type(3) {
	width: 50%;
	float: left;
	border-left: 1px solid #ccc;
	margin-left: -1px;
}

.amount-06 tr {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

/* 各料金表の列幅調整 */
/*.amount-07 tr td:nth-of-type(1) {
	width: 5%;
}

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

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

.amount-07 tr td:nth-of-type(4) {
	text-align: right;
	width: 35%;
}
*/

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

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

.amount-09 tr td:nth-of-type(2) {
	/*	text-align:left; */
	width: 35%;
}

.amount-09 tr td:nth-of-type(3) {
	/*	text-align:left; */
	width: 35%;
	line-height:normal;
}

.amount-10 tr td:nth-of-type(1) {
	text-align: left;
	background-color:#e5f5fe;
	color:#09377e;
	font-weight: bold;
}

.amount-10 tr td:nth-of-type(2) {
	text-align: left;
	width: 60%;
}

.amount-11 {
	text-align: center;
	width: max-content;
}

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

.amount-12 tr td:nth-of-type(2),
.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%;
}

/*------------------------------------------
    共通配置・横幅設定
------------------------------------------*/
.center {
	text-align: center !important;
	margin:0 auto;
}

.center-03 {
	align-content: center;
	margin: 0 auto;
	text-align: center;
}

.auto {
	width: auto;
}

.box-21 div.arrow-s {
	width: 10%;
	margin: auto;
}

.w80 {
	width: 80%;
}

.w80_sp {
	width: 80% !important;
}

.w60 {
	width: 60% !important;
}

.w70_sp {
	width: 70% !important;
}

.w50 {
	width: 50% !important;
}

.w50_sp {
	width: 50% !important;
}

.w20 {
	width: 50%;
	margin: 0 auto;
}

/*------------------------------------------
    罫線調整
------------------------------------------*/
.line-no-02 {
	border-top: none;
}

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

/*------------------------------------------
    ボックス21
------------------------------------------*/
.box-21 {
	display: block;
	width: 70%;
	margin: 20px auto;
}

/*------------------------------------------
    注意メッセージ
------------------------------------------*/
.bx-alert {
	display: block;
	text-align: center;
	font-size: 1.3em;
	color: #ff6000;
	font-weight: bold;
	padding-top: 20px;
}

/*------------------------------------------
    ボックス22（画像＋説明）
------------------------------------------*/
.box-22 div {
	display: flex;
	align-items: center;
	border-bottom: 1px solid #ccc;
}

.box-22 div p.img {
	width: 40%;
}

.box-22 div p.text {
	width: 60%;
}

p.orange-01 {
	background-color: #ea5413;
	color: #fff;
	border-radius: 5px;
}

/*------------------------------------------
    ボックス23
------------------------------------------*/
.box-23 {
	width: 50%;
	margin: auto;
	text-align: center;
}

/*------------------------------------------
    ボックス24
------------------------------------------*/
.box-24 div {
	width: 100%;
	margin: 0 auto;
	padding: 0;
}

.box-24 {
	border-bottom: solid 2px #d7d7d7;
}

.box-24 p{
	letter-spacing: -0.5px;
	padding:5px 2px;
}
/*------------------------------------------
    文字装飾
------------------------------------------*/
.weight {
	font-weight: bold;
	font-size: 120%;
}

.box-25-big {
	font-size: 2.3em;
}

.box-25 {
	text-align: right;
	display:flex;
	align-items:end;
	justify-content:center;
	gap:12px;
	margin-top:8px !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,
.accordion-006{
	background-color: #f2f2f2;
	border-bottom: 3px solid #ddd;
	margin: 20px 0;
}

.accordion-006{
	padding:10px !important;
}

.accordion-007{
	background-color: #f2f2f2;
	border-bottom: 3px solid #ddd;
}

.accordion-001 td,
.accordion-006 td{
	padding: 5px;
}

.accordion-001:not([open]),
.accordion-006:not([open]){
	margin-bottom: 7px;
}

.accordion-001 summary,
.accordion-006 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,
.accordion-006 summary::-webkit-details-marker{
	display: none;
}

.accordion-001 summary::after,
.accordion-006 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,
.accordion-006[open] summary::after{
	transform: rotate(225deg);
}

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

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

/*------------------------------------------
    アコーディオン内テーブル（パターン2）
------------------------------------------
.accordion-002 table {
	margin: 0 auto;
}

.accordion-002 tr td:nth-of-type(1) {
	padding: 5px 20px;
}

/*------------------------------------------
    アコーディオン内テーブル（パターン3）
------------------------------------------
.accordion-003 table {
	margin: 0 auto;
}

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

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

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

/*------------------------------------------
    アコーディオン内テーブル（パターン4・5）
------------------------------------------*/
.accordion-004 {
	margin: 0 auto;
}

.accordion-004 tr td:nth-of-type(1),
.accordion-005 tr td:nth-of-type(1) {
	width: 50%;
}

.accordion-004 tr td:nth-of-type(2),
.accordion-005 tr td:nth-of-type(2) {
	text-align: right;
}

/*------------------------------------------
    テーブル共通
------------------------------------------*/
tr {
	border-bottom: 1px solid #ccc;
}

/*------------------------------------------
    横スクロール
------------------------------------------*/
.overflow {
	width: 100%;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}

div.overflow::-webkit-scrollbar {
	height: 10px;
}

div.overflow::-webkit-scrollbar-thumb {
	background: #aaa;
	border-radius: 7px;
	border: none;
}

div.overflow::-webkit-scrollbar-track {
	background: #ddd;
}

div.overflow::-webkit-scrollbar-thumb:hover {
	background: #999;
}

/*------------------------------------------
    ボックス26（2カラム）
------------------------------------------*/
.box-26 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

.box-26 .new-s img {
	width: 100% !important;
	object-fit: cover;
}

/*------------------------------------------
    ボックス27
------------------------------------------*/
.box-27 div {
	display: inline-block;
	width: 49%;
	padding: 3px;
}

/*------------------------------------------
    ボックス29
------------------------------------------*/
.box-29 {
	text-align: center;
	border-bottom: 1px solid #ccc;
}

/*------------------------------------------
    ボックス30
------------------------------------------*/
.box-30 {
	padding: 20px 0;
	width: max-content;
	margin: auto;
}

/*------------------------------------------
    ボックス31（タイトル付き枠）
------------------------------------------*/
.box-31 {
	position: relative;
	margin: 3em auto 3em;
	padding: 0 0.5em;
	border: 3px solid #d02525;
	border-radius: 3px;
	width: 100%;
}

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

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

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

/*------------------------------------------
    ボックス33（緑枠）
------------------------------------------*/
.box-33 {
	border: double 4px #006400;
	border-radius: 10px;
	padding: 0.3em;
	width: 92%;
	margin: 20px auto;
}

/*------------------------------------------
    ボックス34（赤枠）
------------------------------------------*/
.box-34 {
	border: double 4px #ff0000;
	border-radius: 10px;
	padding: 0.3em;
	width: 92%;
	margin: 20px auto;
}

/*------------------------------------------
    ボックス35
------------------------------------------*/
.box-35 div {
	padding: 10px;
}

/*------------------------------------------
    ボックス36（2カラム）
------------------------------------------*/
.box-36 {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
	text-align: center;
}

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

/*------------------------------------------
    ボックス39（リンク一覧）
------------------------------------------*/
.box-39 {
	background-color: #6b9cd3;
	margin: 0 10px;
	padding: 10px 0;
}

.box-39 ul li {
	display: inline-flex;
	padding: 0;
	text-align: center;
	font-size: 70%;
	margin: 0;
}

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

.box-39 ul li img {
	width: 80%;
}

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

/*------------------------------------------
    ボタン（横幅90%・中央配置）
------------------------------------------*/
.button_b2_m_ib {
	width: 90%;
	margin: 0 auto;
	display: block;
	text-align: center;
	padding: 8px 0;
}

/*------------------------------------------
    施工事例カテゴリ一覧
------------------------------------------*/
.work-cat-list {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.work-cat-item {
	width: 47% !important;
	box-sizing: border-box;
	transition: box-shadow 0.3s;
	list-style: none;
	margin: 0 auto;
	padding-right: 0;
}

.work-cat-item:hover {
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
}

.work-cat-item .thumb img {
	width: 100% !important;
	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;
	font-size: 80%;
}

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

/*------------------------------------------
    Before・After画像
------------------------------------------*/
.thumbnail-before,
.thumbnail-after {
	padding: 0 5px;
}

.before-img,
.before-img-02,
.after-img,
.after-img-02,
.before-after-item {
	position: relative;
	margin: 5px 0;
}

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

.after-img p,
.after-img-02 p {
	background: #ea5413;
}

.before p,
.after p {
	background: #163f8b;
	color: #fff;
	font-size: 18px;
	line-height: 1;
	padding: 10px 10px;
	text-align: center;
}

.post-images-02 .thumbnail-before {
	padding: 0;
}

.after p {
	background: #ea5413;
}

/*------------------------------------------
    テキスト装飾
------------------------------------------*/
.bold-02 {
	font-weight: bold;
}

.center-02 {
	text-align: center;
	vertical-align: middle;
}

.hidden-sp {
	display: none !important;
}

/*------------------------------------------
    赤矢印アイコン
------------------------------------------*/
.arrow-02 {
	position: relative;
	padding: 0 0 0 16px;
	color: #000;
	vertical-align: middle;
	text-decoration: none;
}

.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: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: 1fr;
}

.frame-ul-01 li {
	display: grid;
	list-style: none;
	background-color: #ea5413;
	color: #fff;
	font-size: 80%;
	padding: 3px;
	border-radius: 5px;
	text-align: center;
	margin: 2px;
	align-items: center;
	overflow: hidden;
}

.frame-ul-02 {
	display: flex;
	gap: 5px;
}

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

/*------------------------------------------
    リスト
------------------------------------------*/
.list-01 li {
	list-style: none;
	padding: 0 15px 0 0;
}

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

.sl-caption.pos-bottom {
	width: 100% !important;
	position: initial !important;
}

.sl-wrapper .sl-navigation button {
	margin-top: 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 46px 0 0;
}

/*------------------------------------------
    グレー系
------------------------------------------*/
.mail-01 {
	font-size: 80%;
	border: solid 2px #d7d7d7;
}

.gray {
	background-color: #d7d7d7;
}

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

.gray-03 {
	color: #ccc;
}

.gray-04 {
	color: #666;
}
.word-break {
	word-break: break-all;
}

/*------------------------------------------
    サンプル画像
------------------------------------------*/
.example {
	margin: 20px;
	position: relative;
}

.example_02 {
	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;
}

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: 50%;
	float: left;
	padding: 10px;
}

.block {
	display: block !important;
}

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

.balloon-01::before {
	content: '';
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	left: -1px;
	bottom: -5px;
	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: 120%;
	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 3em 1em 3.5em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background: rgba(27, 37, 56, 0.1);
}

.cp_qa03 .cp_actab label::before {
	content: 'Q';
	font-family: "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, sans-serif;
	;
	font-size: 1.5em;
	margin-left: -2em;
	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 1.2em;
	border-radius: 0 0 0.5em 0.5em;
	transition: max-height 0.2s;
}

.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比較テーブル
------------------------------------------*/
.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: 110px;
	text-align: center;
	width: auto;
}

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

/*------------------------------------------
    横スクロール
------------------------------------------*/
.line_04 {
	width: 100% !important;
	margin: 0 auto !important;
}

/*------------------------------------------
    価格バナー
------------------------------------------*/
.price-banner {
	display: inline-block;
	position: relative;
	background: #ffe600;
	text-align: center;
	margin: 10px 0 20px 0 !important;
	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;
}

/*------------------------------------------
    画像横幅100%
------------------------------------------*/
.w100 img {
	width: 100% !important;
}

/*------------------------------------------
    説明リスト（dl）
------------------------------------------*/
.dl_block dt {
	font-size: 100%;
}

.dl_block dd {
	padding: 5px 18px;
}

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

/* 3列グリッド */
.grid-container2 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 5px;
	max-width: 1200px;
	margin: 0 auto;
}

.grid-container {
	grid-template-columns: 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;
}

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

.job-buttons {
	flex-direction: column;
}

.job-buttons a {
	flex: none;
	width: 100%;
}

/*------------------------------------------
    フロー画像
------------------------------------------*/
.image-grid {
	grid-template-columns: none;
}

.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 {
	grid-template-columns: repeat(2, 1fr);
}

.points-grid {
	display: grid;
	grid-template-columns: repeat(2, 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;
	line-height: 100%;
}

.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;
	text-decoration: none !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
	transition: background 0.3s, transform 0.2s;
}

.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: space-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;
}

/*------------------------------------------
    タイムライン スマホ表示
------------------------------------------*/
.timeline-event {
	flex-direction: column;
	align-items: center;
	margin: 0;
}

.event-left,
.event-right,
.event-center {
	width: 100%;
	margin-bottom: 6px;
}

/* 中央線非表示 */
.timeline::before {
	display: none;
}

.event-center {
	display: none;
}

.event-content {
	flex-direction: row;
}

.event-content img.content-image {
	width: 120px;
}

/*------------------------------------------
    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);
}

/* Q&Aタイトル */
.qa-section h2 {
	text-align: center;
	margin-bottom: 30px;
	color: #007bff;
}

/* Q&A項目 */
.qa {
	display: flex;
	align-items: flex-start;
	margin-bottom: 24px;
}

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

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

/*------------------------------------------
    Q&A アイコン画像
------------------------------------------*/
.qa-avatar {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	object-fit: cover;
	margin: 0 12px;
	flex-shrink: 0;
}

/*------------------------------------------
    Q&A吹き出し
------------------------------------------*/
.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;
}

.qa {
	flex-direction: row !important;
	align-items: flex-start;
	justify-content: flex-start;
	text-align: left;
	margin-bottom: 16px;
	gap: 10px;
}

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

.qa-bubble {
	max-width: calc(100% - 70px);
	word-break: break-word;
}

.qa-left,
.qa-right {
	flex-direction: row !important;
	/* 両方統一方向に */
}

.white {
	color: #fff;
}

/*------------------------------------------
    Lightbox調整
------------------------------------------*/
.sl-wrapper .sl-image img {
	transform: none !important;
}

.sl-wrapper {
	padding: 0 !important;
}

/*------------------------------------------
    ページ内リンク位置調整
------------------------------------------*/
#\30 1,
#\30 2,
#\30 3,
#\30 4,
#\30 5,
#\30 6 {
	scroll-margin-top: 80px;
}

/*------------------------------------------
    お問い合わせカード一覧
------------------------------------------*/
.contact-list {
	max-width: 1200px;
	margin: 50px auto;
	display: grid;
	gap: 28px 40px;
}

.contact-list .contact-card {
	border: 2px solid #999;
	min-height: 100px;
	display: flex;
	align-items: center;
	padding: 10px 15px;
	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;
	gap: 28px 40px;
}

.contact-list_02 .contact-card {
	border: 2px solid #999;
	min-height: 100px;
	display: flex;
	align-items: center;
	padding: 10px 15px;
	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;
}

/*------------------------------------------
    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: flex;
	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;
}

/* Panasonic本文 */
.pana-hero p {
	margin: 0;
}

.pana-section {
	margin-bottom: 32px;
}

/*------------------------------------------
    Panasonic記事：見出し
------------------------------------------*/
.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;
}

/* Panasonic本文 */
.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 20px;
	overflow: hidden;
}

/*------------------------------------------
    Panasonicロゴ表示エリア
------------------------------------------*/
.pana-hero-logo-wrap {
	float: left;
	width: 150px;
	height: auto;
	margin: 0 22px 12px 10px;
	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: 10px 0px 10px 5px;
}

/* 最後の文章余白削除 */
.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;
}

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

/*------------------------------------------
  文字中央寄せ
------------------------------------------*/
.lineheight{
	line-height: 110%;
	vertical-align: middle;
	writing-mode: vertical-rl;
	text-align: center;
}

.lineheight_02{
	line-height: 1.2 !important;
	margin:0 0 15px 0;
}
.small_04{
	font-size:80%;
	line-height:1.3;
	display:inline-block;
}

.notice-list{
	list-style: none;
	padding:0 0 15px 0;
}

.notice-list li::before {
    content: "※";
}

.notice-list li{
	padding: 0;
	margin: 0 10px 0 10px;
}

/*------------------------------------------
  表レイアウト
------------------------------------------*/
/* 表 */
.accordion-002 table,
.accordion-003 table,
.accordion-004 table{
    width: 100% !important;
    table-layout: fixed;
    border-collapse: collapse;
}

/* 行 */
.accordion-002 tbody tr,
.accordion-003 tbody tr,
.accordion-004 tbody tr{
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    margin: 0 0 10px;
    padding: 12px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
}

/* セル */
.accordion-002 tbody td,
.accordion-003 tbody td,
.accordion-004 tbody td{
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    padding: 0 !important;
    border: none !important;
}

/* 項目名 */
.accordion-003 tbody td:nth-child(1) {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.4;
    color: #174a9c;
    margin-bottom: 5px;
}

/* 作業内容 */
.accordion-002 tbody td:nth-child(1),
.accordion-003 tbody td:nth-child(2),
.accordion-004 tbody td:nth-child(1),{
    font-size: 14px;
    line-height: 1.5;
    color: #333;
    margin-bottom: 10px;
}

/* 金額 */
.accordion-002 tbody td:nth-child(2),
.accordion-003 tbody td:nth-child(3),
.accordion-004 tbody td:nth-child(2){
    width: 100% !important;
    text-align: right;
    background: #eef8fd;
    border-radius: 6px;
    padding: 8px 10px !important;
    font-size: 21px;
    font-weight: bold;
    line-height: 1.3;
    color: #174a9c;
	clear:bold;
}

/* 枠 */
.border_sp {
  border: 1px solid #c5c5c5;
  padding: 10px;
  margin: 20px 0;
}


.amount-07 {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 15px 0 25px;
}

.amount-07 thead {
    display: none;
}

.amount-07 tbody,
.amount-07 tr,
.amount-07 td {
    display: block;
    width: 100%;
    box-sizing: border-box;
}

.amount-07 tr {
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 6px;
    overflow: hidden;
    background: #fff;
}

/* 工事種類 */
.amount-07 td:nth-child(1) {
    display: none;
}

.amount-07 td:nth-child(2) {
    padding: 12px 12px 8px;
    	background: #e5f5fe;
    font-weight: bold;
    font-size: 16px;
    border-bottom: 1px solid #ddd;
	color:#09377e;
}

/* 内容 */
.amount-07 td:nth-child(3) {
    padding: 10px 12px 5px;
    font-size: 80%;
    line-height: 1.6;
}

/* 価格 */
.amount-07 td:nth-child(4) {
    padding: 5px 12px 12px;
    text-align: right;
    font-weight: bold;
}

.amount-07 td:nth-child(4) br {
    display: inline;
}

/* 内容 */
.amount-07 td:nth-child(3) {
    position: relative;
    padding-left: 65px;
	text-align:left;
}

.amount-07 td:nth-child(3)::before {
    content: "内容";
    position: absolute;
    left: 10px;
    top: 10px;
    font-weight: bold;
	background-color: #006ec2;
	padding: 3px 10px;
	border-radius:5px;
	color:#ffffff;
}

/* 価格 */
.amount-07 td:nth-child(4) {
    position: relative;
    padding-left: 55px;
}

.amount-07 td:nth-child(4)::before {
    content: "価格";
    position: absolute;
    left: 10px;
    top: 5px;
    font-weight: bold;
	background-color: #006ec2;
	font-size: 80%;
	padding: 3px 10px;
	border-radius:5px;
	color:#ffffff;
}

.amount-07 td,
.amount-07 th{
	border: none;
}

/* テーブルレイアウト */
.amount-10 {
    width: 100%;
    border-collapse: collapse;
    font-size: 100%;
	table-layout: fixed;
	box-sizing: border-box;
}

.amount-10 thead {
    display: none;
}

.amount-10 tr {
    display: block;
    margin-bottom: 15px;
}

.amount-10 th,
.amount-10 td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
}

/* 見出し */
.amount-10 th {
    padding: 10px 8px;
    text-align: center;
    font-weight: bold;
}

/* 症状 */
.amount-10 td:first-child {
    padding: 15px 10px;
    line-height: 1.7;
}

/* 原因・対処法 */
.amount-10 td:last-child {
    padding: 10px;
    line-height: 1.7;
}

/* テーブルレイアウト */
.amount-09 {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed;
}

.amount-09 th,
.amount-09 td {
    box-sizing: border-box;
    word-break: break-word;
    overflow-wrap: anywhere;
}

/* ヘッダー */
.amount-09 thead {
    display: none;
}

/* 1行を縦並びに */
.amount-09 tr {
    display: block;
    margin-bottom: 15px;
    border: 1px solid #ccc;
}

.amount-09 td:nth-child(1) {
	background: #e5f5fe;
	color: #09377e;
	font-size: 110%;
}

.amount-09 td {
    display: block;
    width: 100% !important;
    border: none;
    border-bottom: 1px solid #ddd;
    padding: 12px 10px;
    line-height: 1.6;
}

.amount-09 td:last-child {
    border-bottom: none;
}

/* メッセージ */
.amount-09 td:nth-child(2) {
    padding: 10px 5px 5px;
    font-size: 80%;
    line-height: 1.6;
}

/* 状態・対策 */
.amount-09 td:nth-child(3) {
    padding: 5px 12px 12px;
    text-align: left;
    font-weight: bold;
}

.amount-09 td:nth-child(3) br {
    display: inline;
}

/* メッセージ */
.amount-09 td:nth-child(2) {
    position: relative;
    padding-left: 106px;
	text-align:left;
	border: none;
}

.amount-09 td:nth-child(2)::before {
    content: "メッセージ";
    position: absolute;
    left: 10px;
    top: 10px;
    font-weight: bold;
	background-color: #006ec2;
	padding: 3px 10px;
	border-radius:5px;
	color:#ffffff;
}

/* 状態・対策 */
.amount-09 td:nth-child(3) {
    position: relative;
    padding-left: 105px;
}

.amount-09 td:nth-child(3)::before {
    content: "状態・対策";
    position: absolute;
    left: 10px;
    top: 5px;
    font-weight: bold;
	background-color: #006ec2;
	font-size: 80%;
	padding: 3px 10px;
	border-radius:5px;
	color:#ffffff;
}

/* テーブルレイアウト */
.amount-08 {
    width: 100%;
    border-collapse: collapse;
    font-size: 100%;
    table-layout: fixed;
    box-sizing: border-box;
}

.amount-08 thead {
    display: none;
}

.amount-08 tr {
    display: block;
    margin-bottom: 15px;
}

.amount-08 th,
.amount-08 td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
}

/* 価格 */
.amount-08 td:last-child {
    padding: 10px;
}

/* 価格 */
.amount-08 td:nth-child(2) {
    position: relative;
    padding-left: 55px;
}

.amount-08 td:nth-child(2)::before {
    content: "価格";
    position: absolute;
    left: 10px;
    top: 5px;
    font-weight: bold;
	background-color: #006ec2;
	font-size: 80%;
	padding: 3px 10px;
	border-radius:5px;
	color:#ffffff;
}

.amount-08 td:nth-child(1) {
	background: #e5f5fe;
}

.amount-02 thead{
	display:none;
}

.amount-02 td:nth-child(1),
.amount-02 td:nth-child(2){
	text-align:left;
}

.amount-02 p{
	font-size:100%;
	line-height:100%;
}

.amount-02 td:nth-child(2) {
    display: block !important;
}

/* 商品を囲む要素 */
.amount-02 td:nth-child(2) > div {
    display: inline-block !important;
    vertical-align: top;
    width: 48% !important;
    float: none !important;
    box-sizing: border-box;
}

/* 表 */
.amount-02 {
    width: 100% !important;
    table-layout: fixed;
    border-collapse: collapse;
}

/* 行 */
.amount-02 tbody tr {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    margin: 0 0 10px;
    padding: 12px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
}

/* セル */
.amount-02 tbody td {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    padding: 0 !important;
    border: none !important;
}

/* 項目名 */
.amount-02 tbody td:nth-child(1) {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.4;
    color: #174a9c;
    margin-bottom: 5px;
}

/* 作業内容 */
.amount-02 tbody td:nth-child(2) {
    font-size: 14px;
    line-height: 1.5;
    color: #333;
    margin-bottom: 10px;
}

/* 金額 */
.amount-02 tbody td:nth-child(3){
    width: 100% !important;
    text-align: right;
    background: #eef8fd;
    border-radius: 6px;
    padding: 8px 10px !important;
    font-size: 21px;
    font-weight: bold;
    line-height: 1.3;
    color: #174a9c;
	clear:bold;
}

.amount-04 {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.amount-04 thead tr:first-child {
    display: block;
    width: 100%;
}

.amount-04 thead tr:first-child td {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    padding: 10px;
}


.amount-04 tr {
    display: grid;
    grid-template-columns: 60px 1fr;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #ccc;
    border-bottom: none;
    background: #fff;
}

/* 工事内容 */
.amount-04 td:nth-child(1) {
    grid-column: 1 / -1;
    padding: 10px;
    border: none;
    line-height: 1.6;
}

/* 数量・単位 */
.amount-04 td:nth-child(2) {
    grid-column: 1;
    padding: 8px;
    border: none;
    text-align: center;
    color: #555;
    font-size: 13px;
}

/* 価格 */
.amount-04 td:nth-child(3) {
    grid-column: 2;
    padding: 5px 2px;
    border: none;
    text-align: right;
    font-size: 19px;
    font-weight: bold;
}

/* 最後の合計行 */
.amount-04 tr:last-child {
    background: #ffd9dc;
}

.amount-04 tr:last-child td:nth-child(1) {
    grid-column: 1 / -1;
    font-size: 12px;
}

.amount-04 tr:last-child td:nth-child(2) {
    grid-column: 1;
    font-weight: bold;
}

.amount-04 tr:last-child td:nth-child(3) {
    grid-column: 2;
    font-size: 21px;
}