@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');



:root {
	--color-normal: #333;
	--color-main: #27984D;
	--color-main-rgb: 39, 152, 77;
	--color-orange: #F77F1E;
	--color-yellow: #FCEE21;
	
	--ff-oswald: "Oswald", sans-serif;
	--transition: all 0.1s linear;
}


/*================================================
 *  一般・共通設定
 ================================================*/

html {
	font-size: 10px;
}

@media screen and (max-width: 1600px) {
	html {
		font-size: calc(100vw / 1600 * 10);
	}
}


body {
	color: #333;
	font-size: 1.6rem;
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 400;
	text-align: justify;
	text-justify: inter-ideograph;
}

a,.linearAnime {
	color: inherit;
	text-decoration: none;
	transition: all 0.1s linear;
}
a.underline {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.15em;
}
/*a:hover {
	opacity: 0.7;
}*/
a.underline:hover {
	opacity: 1;
	text-decoration: none;
}
@media screen and (min-width:800.1px) {
	a[href^="tel"] {
		pointer-events: none;
	}
}

img,svg {
	vertical-align: bottom;
}

/*色*/
.color_main {
	color: #27984D;
}
.color_normal {
	color: #333;
}
.color_red {
	color: #bf0000;
}
.color_white {
	color: #fff;
}
.color_orange {
	color: #F77F1E;
}
.color_yellow {
	color: #FCEE21;
}
.color_link,
.color_partner {
	color: #0071BC;
}


/*背景*/
.bg_main {
	background-color: #27984D;
}
.bg_white {
	background-color: #fff;
}
.bg_orange {
	background-color: #F77F1E;
}
.bg_yellow {
	background-color: #FCEE21;
}
.bg_partner {
	background-color: #0071BC;
}


/* position */
.relative{
	position: relative;
}
.absolute{
	position: absolute;
}

/* sp/pcの切替 */
.sp,.sp_inline {
	display: none;
}
.d_block {
	display: block;
}
.d_iblock {
	display: inline-block;
}

/*文字揃え*/
.ta-l {
	text-align: justify;
	text-justify: inter-ideograph;
}
.ta-r {
	text-align: right;
}
.ta-c {
	text-align: center;
}
.pcspText { /*PC：中央揃え・SP左揃え用*/
	text-align: center;
}


/*文字種類*/
.ff_oswald {
	font-family: "Oswald", sans-serif;
}



/*文字太さ*/
.fontThin {
	font-weight: 100;
}
.fontExLight {
	font-weight: 200;
}
.fontLight {
	font-weight: 300;
}
.fontRegular {
	font-weight: 400;
}
.fontMedium {
	font-weight: 500;
}
.fontSemiBold {
	font-weight: 600;
}
.fontBold {
	font-weight: 700;
}
.fontExBold {
	font-weight: 800;
}
.fontBlack {
	font-weight: 900;
}

/*文字スタイル*/
.fs_italic {
	font-style: italic;
}

/*Text Crop*/
[class*="textcrop"] {
	display: block;
}
[class*="textcrop"]::before,
[class*="textcrop"]::after {
	content: '';
	display: block;
	height: 0;
	width: 0;
}
[class*="textcrop"]::before { /* Oswald合わせ */
	margin-bottom: -0.13em;
}
[class*="textcrop"]::after {
	margin-top: -0.03em;
}




.textcrop_notosans {
	display: inline-block;
}
.textcrop_notosans::before {
	margin-bottom: -0.09em;
}
.textcrop_notosans::after {
	margin-top: 0;
}


/*文字詰め*/
.ffs_palt {
	-webkit-font-feature-settings: 'palt' 1;
	font-feature-settings: 'palt' 1; /*プロポーショナルメトリクス*/
}
.ffs_halt {
	-webkit-font-feature-settings: 'halt' 1;
	font-feature-settings: 'halt' 1; /*字幅半角メトリクス*/
}

/*文字間隔*/
.ltsg02em {
	letter-spacing: 0.2em!important;
}
.ltsg02em_indent {
	display: inline-block;
	letter-spacing: 0.2em!important;
	text-indent: 0.2em!important;
}
.ltsg05em {
	letter-spacing: 0.5em!important;
}
.ltsg05em_indent {
	display: inline-block;
	letter-spacing: 0.5em!important;
	text-indent: 0.5em!important;
}
.ltsg1em {
	letter-spacing: 1em!important;
}
.ltsg1em_indent {
	display: inline-block;
	letter-spacing: 1em!important;
	text-indent: 1em!important;
}

/*上付き文字*/
.sup {
	font-size: 60%;
	vertical-align: super;
}



/*幅*/
.wrap,
.wrap_rem,
.wrap_wide,
.wrap_wide_rem {
	margin: 0 auto;
}
.wrap {
	max-width: 940px;
	width: 100%;
}
.wrap_rem {
	width: 94rem;
}
.wrap_wide {
	max-width: 1100px;
	width: 100%;
}
.wrap_wide_rem {
	width: 110rem;
}
/*.wrap_big_rem {
	width: 126rem;
}
.wrap_large_rem {
	width: 140rem;
}*/
.wrap_max {
	max-width: 190rem;
	width: 100%;
}
.wid100 {
	width: 100%;
	height: auto;
}
@media screen and (min-width: 800.1px) {
	.pdg_lr {
		padding-right: 5rem;
		padding-left: 5rem;
	}
}



/*高さ*/
.h100vh {
	height: 100vh;
	height: calc((var(--vh, 1vh) * 100));
}
.minh100vh {
	min-height: 100vh;
	min-height: calc((var(--vh, 1vh) * 100));
}

.lazyload {
	opacity: 0;
}

/*******object-fit*******/
[class*="object-fit"] {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center center;
	font-family: 'object-fit: cover; object-position: center center;';
}
.object-fit-ct {
	object-fit: contain;
	font-family: 'object-fit: contain; object-position: center center;';
}
.object-fit-p-tc {
	object-position: top center;
}
.object-fit-p-tr {
	object-position: top right;
}
.object-fit-p-tl {
	object-position: top left;
}
.object-fit-p-bc {
	object-position: bottom center;
}
.object-fit-p-br {
	object-position: bottom right;
}
.object-fit-p-bl {
	object-position: bottom left;
}
.object-fit-p-cl {
	object-position: center left;
}
.object-fit-p-cr {
	object-position: center right;
}


/*******flexbox*******/
[class*="flex_start"] {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
[class*="flex_end"] {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: end;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
[class*="flex_between"] {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
[class*="flex_center"] {
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	width: 100%;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
[class*="flex_inline"] {
	display: -webkit-inline-box;
	display: inline-flex;
}
.nowrap {
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
}
.shrink0 {
	flex-shrink: 0;
}
.align_items_start {
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
}
.align_items_center {
	-webkit-box-align: center;
	-webkit-align-items: center;
	align-items: center;
}
.align_items_end {
	-webkit-box-align: end;
	-webkit-align-items: flex-end;
	align-items: flex-end;
}
.direction_column {
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	flex-direction: column;
}
.row_reverse {
	-webkit-box-direction: reverse;
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
}




/*================================================
 *  アイコンフォント
 ================================================*/
/*中の矢印を白色にする用*/
[class*="icon-arrow"].inr_white { 
	position: relative;
}
[class*="icon-arrow"].inr_white:before {
	position: relative;
	z-index: 1;
}
[class*="icon-arrow"].inr_white::after {
	position: absolute;
	content: '';
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	border-radius: 50%;
	width: 50%;
	height: 50%;
	background-color: #fff;
	z-index: 0;
}



/*================================================
 *  ホバー
 ================================================*/
/*半透明*/
.hover_opa_translucent:hover,
.hover_list_opa_translucent a:hover {
	opacity: 0.7;
}



/*色だけ*/
.hover_color_main:hover,
.hover_list_main a:hover {
	color: var(--color-main);
}


/*通常：線有+背景色付　ホバー：線有+背景白*/
.hover_main_bd {
	border: 2px solid;
	background-color: var(--color-main)!important;
	color: var(--color-main)!important;
}
.hover_main_bd:hover {
	background-color: #fff!important;
}
.hover_main_bd:not(:hover) > * {
	color: #fff!important;
}
.hover_main_bd:hover > * {
	color: var(--color-main)!important;
}




/*******画像ホバー拡大*******/
.hover_img_scale {
	overflow: hidden;
}
.hover_img_scale img {
	transition: all 0.6s ease;
}
a:hover .hover_img_scale img {
	transform: scale(1.05);
}



/*================================================
 *  ボタン
 ================================================*/

/*******角丸＋矢印付*******/
[class*="btn_arrow"] {
	background-color: #fff;
	border: 2px solid;
	border-radius: 100vh;
	color: var(--color-main);
	display: flex;
	justify-content: flex-end;
	align-items: center;
	font-size: 2rem;
	font-weight: 700;
	padding-left: 2em;
	transition: var(--transition);
}
[class*="btn_arrow"] > em {
	flex-grow: 1;
	color: var(--color-normal);
}
[class*="btn_arrow"] > [class*="icon-"] {
	font-size: 3.6rem;
	font-weight: normal;
	margin: 1.5rem;
}
[class*="btn_arrow"]:hover,
.hover_parent:hover [class*="btn_arrow"] {
	background-color: currentColor;
}
[class*="btn_arrow"]:hover > *,
.hover_parent:hover [class*="btn_arrow"] > * {
	color: #fff;
}

.btn_arrow_center em {
	text-align: center;
}
.btn_arrow_center > [class*="icon-"] {
	margin-left: 0;
}





/*================================================
 *  ヘッダー
 ================================================*/
header {
	position: relative;
	z-index: 100;
	width: 100%;
}
#index header {
	position: absolute;
	top: 0;
	left: 0;
}

header .inner {
	height: 15rem;
	padding-right: 46rem;
}
.pc_fixed_none header .inner {
	padding-right: 2rem;
}
header .inner .logo {
	margin: 2.5rem 0 0 6rem;
}
header .inner .logo img {
	width: 26rem;
	height: auto;
}
header .inner .logo img.logo_white,
#index header .inner .logo img.logo_normal {
	display: none;
}
#index header .inner .logo img.logo_white {
	display: block;
}

header .inner nav {
	align-self: center;
	padding: 0 5rem 0 0;
	font-size: 2rem;
	font-weight: 700;
}

#index header .inner nav {
	color: #fff;
}
header .inner nav .nav_list > li {
	position: relative;
}
header .inner nav .nav_list > li + li {
	margin-left: 1em;
}
header .inner nav .nav_list > li > a,
header .inner nav .nav_list > li > div {
	cursor: pointer;
	display: block;
	padding: 1em 0;
}
header .inner nav .nav_list > li > a:hover,
header .inner nav .nav_list > li > a.active,
header .inner nav .nav_list > li > div.active {
	color: var(--color-main);
}
header .inner nav .nav_list > li ul {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%,0);
	transition: .3s ease-in-out;
	visibility: hidden;
	opacity: 0;
	z-index: 100;
	min-width: 20rem;
	color: var(--color-main);
	border: 2px solid;
}
header .inner nav .nav_list > li:hover ul  {
	opacity: 1;
	visibility: visible;
}
header .inner nav .nav_list > li ul li + li {
	border-top: 2px solid;
}
header .inner nav .nav_list > li ul li a {
	background-color: #fff;
	display: block;
	line-height: 1.25;
	padding: 0.63em 0.45em;
	text-align: center;
	white-space: nowrap;
}
header .inner nav .nav_list > li ul li a:hover {
	background-color: var(--color-main);
	color: #fff;
}








/*================================================
 *  追従（お問合せ・無料相談）
 ================================================*/
#fixed_consult_list,
#index #main_area .consult_box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 0 2.2rem;
	height: 20.5rem;
	width: 46rem;
}
#fixed_consult_list {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 1000;
}
.pc_fixed_none #fixed_consult_list {
	display: none!important;
}

#fixed_consult_list .img_txt,
#index #main_area .consult_box .img_txt {
	display: block;
	width: 39.9rem;
	margin: 0 auto;
}
#fixed_consult_list .btn_list,
#index #main_area .consult_box .btn_list {
	margin-top: 1.8rem;
	width: 100%;
}
#fixed_consult_list .btn_list li,
#index #main_area .consult_box .btn_list li {
	width: calc((100% - 1rem) / 2);
}
#fixed_consult_list .btn_list li a,
#index #main_area .consult_box .btn_list li a {
	border: 2px solid var(--color-yellow);
	border-radius: 100vh;
	display: grid; 
	grid-template-columns: 1fr auto; 
	align-items: center; 
	height: 6rem;
	font-size: 2.6rem;
	font-weight: 700;
	padding: 0 1.4rem 0 0.5rem;
}
#fixed_consult_list .btn_list li a:not(:hover),
#index #main_area .consult_box .btn_list li a:not(:hover) {
	background-color: var(--color-yellow);
}
#fixed_consult_list .btn_list li a:hover > *,
#index #main_area .consult_box .btn_list li a:hover > * {
	color: var(--color-yellow);
}
#fixed_consult_list .btn_list li a em,
#index #main_area .consult_box .btn_list li a em {
	text-align: center;
}
#fixed_consult_list .btn_list li a [class*="icon-"],
#index #main_area .consult_box .btn_list li a [class*="icon-"] {
	font-size: 2.4rem;
}




/*================================================
 *  ページタイトル
 ================================================*/
#pageTitle {
	padding: 5rem 0 8rem;
	position: relative;
}

#pageTitle h1 > em::before,
#pageTitle h1 > em::after
#pageTitle h1 > span::before,
#pageTitle h1 > span::after {
	content: '';
	display: block;
	height: 0;
	width: 0;
}
#pageTitle h1 {
	width: 120rem;
	margin: 0 auto;
}
#pageTitle h1 > em {
	display: block;
	font-size: 2.6rem;
	font-weight: 800;
	margin: 0 0 2.5rem 5rem;
}
#pageTitle h1 > em::before {
	margin-bottom: -0.09em;
}
#pageTitle h1 > span {
	color: var(--color-main);
	display: inline-block;
	font-size: 10.8rem;
	font-family: var(--ff-oswald);
	font-weight: 600;
	letter-spacing: 0.1em;
	transform: skewX(-15deg);
	transform-origin: left bottom;
}
#pageTitle h1 > span::before,
#pageTitle h1 > span::after {
	content: '';
	display: block;
	height: 0;
	width: 0;
}
#pageTitle h1 > span::before {
	margin-bottom: -0.13em;
}
#pageTitle h1 > span::after {
	margin-top: -0.03em;
}

#pageTitle h1 > br.sp + span {
	margin-top: 3vw;
}

/*news + お役立ち情報*/
#news #pageTitle h1 > em,
#topics #pageTitle h1 > em{
	font-size: 4.6rem;
	margin: 0;
}


/*404*/
#notfound #pageTitle h1 > span {
	font-size: 8.8rem;
}



/*******パンくずリスト*******/
ol.breadcrumb {
	position: absolute;
	top: 7.5rem;
	right: 3rem;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	color: #999;
	font-size: 1.6rem;
	z-index: 1;	
}
ol.breadcrumb li {
	position: relative;
}
ol.breadcrumb li + li {
	padding-left: 1.1em;
	margin-left: 0.5em;
}
ol.breadcrumb li + li:before {
	position: absolute;
	content: '';
	top: 50%;
	left: 0;
	width: 0.5em;
	height: 0.5em;
	border-top: 1px solid;
	border-right: 1px solid;
	transform: translateY(-50%) rotate(45deg);
}
ol.breadcrumb li a {
	text-decoration: underline;
}
ol.breadcrumb li a:hover {
	opacity: 1;
	text-decoration: none;
}







/*================================================
 *  コンテンツ
 ================================================*/
main {
	/*overflow: hidden;*/
	overflow-x: clip;
}
.contents {
	padding-bottom: 15rem;
}

/*******見出し*******/


/*******箇条書きリスト*******/
.indent_list > li {
	list-style-position:inside;
	padding-left: 1em;
	text-indent: -1em;
}
.kome_list > li,
.disc_list > li,
.circle_list > li,
.circle_list_small > li,
.square_list > li,
.number_list > li,
.decimal_list > li,
.indentflex_list > li {
	display: flex;
	align-items: flex-start;
}
.disc_list > li::before,
.circle_list > li::before,
.circle_list_small > li::before,
.square_list > li::before,
.number_list > li::before,
.decimal_list > li::before {
	font-weight: normal!important;
	width: 1em;
	flex-shrink: 0;
}

.circle_list > li::before,
.circle_list_small > li::before,
.square_list > li::before {
	display: flex;
	align-items: start;
	font-size: 80%;
	width: 1.4em;
	padding-top: 0.25em;
}

/*※箇条書き*/
.kome_list > li::before {
	content: "\203b";
}
/*・箇条書き*/
.disc_list > li::before {
	content: "\30fb";
}
/*●箇条書き*/
.circle_list > li::before {
	content: "\25CF";
}
.circle_list_small > li::before {
	content: "\25CF";
	font-size: 50%;
	width: 1.5em;
}

/*■箇条書き*/
.square_list > li::before {
	content: "\25A0";
}
/*()数字*/
.number_list {
	counter-reset: cnt 0;
}
.number_list > li{
	counter-increment: cnt;
}
.number_list > li::before {
	content: "（" counter(cnt) "）";
	margin-left: -0.5em;
	width: 2em;
}
/*数字.*/
.decimal_list {
	counter-reset: dcnt 0;
}
.decimal_list > li{
	counter-increment: dcnt;
}
.decimal_list > li::before {
	width: 1.4em;
	content: counter(dcnt) ".";
}

/*色変更用*/
.before_color_main > li::before {
	color: var(--color-main);
}


/*インデントflex版*/
.indentflex_list > li > span:first-child {
	flex-shrink: 0;
}





/*******ページナビゲーション（テキスト版）*******/
#pagenav_txt ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0 2rem;
}
#pagenav_txt ul li {
	width: calc((100% - 2rem * 3) / 4);
}
#pagenav_txt ul li a {
	border-bottom: 2px solid;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 2.2rem;
	line-height: 1.25;
	min-height: 9rem;
	height: 100%;
	padding: 1rem;
}
#pagenav_txt ul li a:not(:hover):not(.active) {
	border-color: #E6E6E6;
}
#pagenav_txt ul li a em {
	font-weight: 600;
	margin-top: -0.09em;
}
#pagenav_txt ul li a [class*="icon-"] {
	font-size: 3rem;
}
#pagenav_txt ul li a.active,
#pagenav_txt ul li a:hover,
#pagenav_txt ul li a [class*="icon-"] {
	color: var(--color-main);
}
#pagenav_txt ul li a.active em,
#pagenav_txt ul li a:hover em {
	font-weight: 800;
}





/*******共通grid*******/
@media screen and (min-width: 800.1px) {
	dl.common_grid_list {
		display: grid;
		grid-template-columns: 200px 1fr;
	}
	dl.common_grid_list dt {
		border-top: 1px solid;
		display: flex;
		align-items: center;
	}
	dl.common_grid_list dt:last-of-type {
		border-bottom: 1px solid;
	}
	dl.common_grid_list dd {
		border-top: 1px solid #ccc;
	}
	dl.common_grid_list dd:last-of-type {
		border-bottom: 1px solid #ccc;
	}
}
dl.common_grid_list {
	font-size: 20px;
	line-height: 1.75;
}
dl.common_grid_list dt {
	font-weight: 600;
	padding: 1.35em 0 1.35em 1em;
}
dl.common_grid_list dd {
	padding: 1.35em 0 1.35em 1.45em;
	text-align: left;
}












/*================================================
 *  導入の流れ（共通）
 ================================================*/

section#flow_area .flow_list::after {
	position: absolute;
	content: '';
	top: 50%;
	left: 6.3rem;
	transform: translateY(-50%);
	width: 0.4rem;
	height: calc(100% - 13rem);
	background-color: var(--color-main);
	z-index: -1;
}
section#flow_area .flow_list dl {
	position: relative;
}
section#flow_area .flow_list dl + dl {
	margin-top: 3rem;
}
section#flow_area .flow_list dl dt {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	background-color: #fff;
	border: 0.4rem solid;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	text-align: center;
	font-size: 2.6rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	height: 13rem;
	width: 13rem;
	z-index: 2;
}
section#flow_area .flow_list dl dt span {
	font-size: 5.2rem;
	letter-spacing: 0;
}
section#flow_area .flow_list dl dd {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: calc(100% - 11rem);
	margin-left: auto;
	padding: 3.5rem 4rem;
}
section#flow_area .flow_list dl dd h4 {
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.5;
}
section#flow_area .flow_list dl dd .inr {
	width: 65rem;
}

/*STEP01*/
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box {
	margin-top: 2rem;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .unit_tel .tel [class*="icon-"] {
	font-size: 3.1rem;
	width: 3.5rem;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .unit_tel .tel span:not([class*="icon-"]) {
	font-size: 3.8rem;
	font-weight: 600;
	letter-spacing: 0.04em;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .unit_tel p {
	margin: 1rem 0 0 3.7rem;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .btn_form {
	border: 2px solid var(--color-yellow);
	border-radius: 100vh;
	font-size: 2rem;
	font-weight: 700;
	height: 7rem;
	width: 30rem;
	margin-left: 3rem;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .btn_form [class*="icon-"] {
	font-size: 2.4rem;
	margin-right: 0.5em;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .btn_form:hover {
	background-color: transparent;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .btn_form:hover > * {
	color: var(--color-yellow);
}




/*================================================
 *  ご相談・お見積り（共通）
 ================================================*/
section.consult_area {
	margin-top: 14rem;
}
section.consult_area h2 {
	text-align: center;
	margin-bottom: -0.8rem;
}
section.consult_area h2 img {
	width: 110.4rem;
}
section.consult_area .outer {
	padding: 7rem 0 8rem;
}
section.consult_area .outer h3 {
	display: block;
	font-size: 5.6rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	margin-bottom: 6rem;
	text-align: center;
}
section.consult_area .outer .inner .unit_txt .list_feature {
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.5;
}
section.consult_area .outer .inner .unit_txt .list_feature li {
	border: 4px solid;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	height: 26rem;
	width: 26rem;
	position: relative;
}
section.consult_area .outer .inner .unit_txt .list_feature li + li {
	margin-left: -2rem;
}
section.consult_area .outer .inner .unit_txt p {
	font-size: 2.6rem;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0.04em;
	margin-top: 0.8em;
}

section.consult_area .outer .inner .contact_btn_list {
	width: 54rem;
}
section.consult_area .outer .inner .contact_btn_list li + li {
	margin-top: 2rem;
}
section.consult_area .outer .inner .contact_btn_list li a {
	border: 2px solid #fff;
	background-color: #fff;
	display: flex;
	align-items: center;
	height: 18rem;
	padding-left: 3.5rem;
}
section.consult_area .outer .inner .contact_btn_list li a:hover {
	background-color: transparent;
}
section.consult_area .outer .inner .contact_btn_list li a:hover * {
	color: #fff!important;
}

section.consult_area .outer .inner .contact_btn_list li a [class*="icon-"] {
	font-size: 4.4rem;
	width: 7.2rem;
}
section.consult_area .outer .inner .contact_btn_list li.btn_tel a .tel span:not([class*="icon-"]) {
	font-size: 5.2rem;
	font-weight: 600;
	letter-spacing: 0.04em;
}
section.consult_area .outer .inner .contact_btn_list li.btn_tel a p {
	font-size: 1.8rem;
	line-height: 1.25;
	padding: 1.2rem 0 0 7.5rem;
	margin-block: 0 -0.125em;
}

section.consult_area .outer .inner .contact_btn_list li.btn_form a {
	font-size: 4.2rem;
	font-weight: 700;
}




/*================================================
 *  フッター
 ================================================*/
footer {
	background-color: #F2F2F2;
}

/*******フッター用ナビゲーション*******/
footer #footer_nav_area {
	background-color: #F2F2F2;
	padding-top: 6rem;
}
footer #footer_nav_area .info_box .logo img {
	width: 33rem;
}

/*住所*/
footer #footer_nav_area .info_box .add_list {
	display: grid; 
	grid-template-columns: 11rem 1fr; 
	gap: 3rem 2rem;
	margin-top: 4rem;
}
footer #footer_nav_area .info_box .add_list dt {
	border: 1px solid;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-size: 1.8rem;
	font-weight: 600;
	line-height: 1.25;
}
footer #footer_nav_area .info_box .add_list dd {
	font-size: 2rem;
	line-height: 1.75;
}

/*ナビゲーション*/
footer #footer_nav_area nav {
	width: 35rem;
	margin-top: 4rem;
}


/*******フッター最下部*******/
footer #footer_bottom_area {
	font-size: 1.8rem;
	padding: 10rem 0 5rem;
}
footer #footer_bottom_area .copyright {
	font-size: 1.6rem;
}




/*================================================================================================
 *  スマートフォン向けデザイン
 ================================================================================================*/
@media screen and (max-width:800px) {

html,
body {
	font-size: 4vw;
}	

img {
	max-width: 100%;
}



/*文字揃え*/
.pcspText { /*PC：中央揃え・SP左揃え用*/
	text-align: justify;
	text-justify: inter-ideograph;
}

/* sp/pcの切替 */
.sp {
	display: block;
}
.sp_inline {
	display: inline;
}
.pc,.sp_none {
	display: none;
}

/*幅*/
.wrap,
.wrap_wide {
	max-width: inherit;
	width: 90vw;
}
.wrap_rem,
.wrap_wide_rem,
.wrap_max {
	max-width: inherit;
	width: 100%;
}
.wrap_sp {
	width: 90vw!important;
	margin-left: auto!important;
	margin-right: auto!important;
}
.wrap_sp_small {
	width: 80vw!important;
	margin-left: auto!important;
	margin-right: auto!important;
}
.wrap_sp_medium {
	width: 86vw!important;
	margin-left: auto!important;
	margin-right: auto!important;
}


.sp_wid100 {
	width: 100%!important;
}

.sp_wid100 {
	width: 100%!important;
}



/*******flexbox*******/
.flex_start_spblock,
.flex_end_spblock,
.flex_between_spblock,
.flex_center_spblock,
.flex_inline_spblock {
	display: block;
}






/*================================================
 *  ボタン
 ================================================*/

/*******角丸＋矢印付*******/
[class*="btn_arrow"] {
	font-size: 4vw;
	padding-left: 1.8em;
}
[class*="btn_arrow"] > [class*="icon-"] {
	font-size: 7.2vw;
	margin: 0.5em;
}





/*================================================
 *  ヘッダー
 ================================================*/
header .inner,
#drawer .drawer_head {
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	align-items: flex-start;
	height: 18.6vw;
	padding: 3vw 0 0 5vw;
}
header .inner .logo {
	margin: 0;
}
header .inner .logo img,
#drawer .drawer_head img {
	width: 42vw;
}



/*================================================
 *  追従（お問合せ・無料相談）
 ================================================*/


#fixed_consult_list {
	top: auto;
	bottom: 0;
	right: 50%;
	transform: translateX(50%);
	width: 86vw	;
	height: 26vw;
	padding: 1vw 4.6vw 0;
	opacity: 0;
	visibility: hidden;
}
.sp_fixed_none #fixed_consult_list {
	display: none!important;
}
#index #main_area .consult_box {
	position: absolute;
	bottom: 4vw;
	left: 50%;
	transform: translateX(-50%);
	height: 38vw;
	width: 90vw;
	padding: 1vw 3vw 0;
	z-index: 10;
}
#fixed_consult_list .img_txt {
	width: 66vw;
}
#index #main_area .consult_box .img_txt {
	width: 80vw;
}
#fixed_consult_list .btn_list,
#index #main_area .consult_box .btn_list {
	margin-top: 2.5vw;
}
#fixed_consult_list .btn_list li,
#index #main_area .consult_box .btn_list li {
	width: calc((100% - 2.5vw) / 2);
}
#fixed_consult_list .btn_list li a {
	height: 10.6vw;
	font-size: 4.5vw;
	padding: 0 2.4vw 0 2.4vw;
}
#index #main_area .consult_box .btn_list li a {
	height: 10.6vw;
	font-size: 4.5vw;
	padding: 0 2.4vw 0 2.4vw;
}
#fixed_consult_list .btn_list li a [class*="icon-"],
#index #main_area .consult_box .btn_list li a [class*="icon-"] {
	font-size: 4.2vw;
}



/*================================================
 *  ナビゲーション
 ================================================*/

#drawer_control {
	position: fixed;
	top: 0;
	right: 0;
	height: 18.6vw;
	z-index: 1000;
}
#drawer_control .btn_tel,
#drawer_control #btn_drawer {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	font-size: 2.6vw;
	font-weight: 800;
	letter-spacing: 0.04em;
	width: 18.6vw;
	padding: 4.5vw 0 4vw;
}
#drawer_control .btn_tel [class*="icon-"] {
	font-size: 5.3vw;
}	
#drawer_control #btn_drawer	.hamburger-icon {
	position: relative;
	display: block;
	height: 3.4vw;
	width: 6.6vw;
	margin-top: 0.5vw;
}
#drawer_control #btn_drawer .hamburger-icon::before,
#drawer_control #btn_drawer .hamburger-icon::after {
	width: 100%;
	height: 0.8vw;
	border-radius: 1vw;
	transition: all .3s cubic-bezier(0.190, 1.000, 0.220, 1.000);
	background-color: #fff;
}
#drawer_control #btn_drawer .hamburger-icon::before,
#drawer_control #btn_drawer .hamburger-icon::after {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
}
#drawer_control #btn_drawer .hamburger-icon:after {
	top: auto;
	bottom: 0;
}
#drawer_control #btn_drawer.active .hamburger-icon::before,
#drawer_control #btn_drawer.active .hamburger-icon::after {
	top: 50%;
	bottom: auto;
}
#drawer_control #btn_drawer.active .hamburger-icon::before {
	transform: rotate(30deg);
}
#drawer_control #btn_drawer.active .hamburger-icon::after {
	transform: rotate(-30deg);
}
	


/*******ドロワー*******/
#drawer {
	display: block;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	transition: all 0.5s ease-in-out;
	z-index: 999;
	transform: translate3d(100%, 0, 0);
	visibility: hidden;
	opacity: 0;
	overflow-y: auto;
	height: 100%;
	width: 100%;
	background-color: #1E8C46;
}
#drawer.active {
	visibility: visible;
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

#drawer nav {
	width: 74vw;
	margin: 0 auto;
	padding: 4vw 0 30vw;
}
#drawer nav .nav_list > li > a,
#drawer nav .nav_list > li > div {
	border-bottom: 1px solid;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 4vw 5vw 4vw 3.5vw;
	font-size: 4.8vw;
	font-weight: 700;
}
#drawer nav .nav_list > li > a [class*="icon-"] {
	font-size: 7.2vw;
}
#drawer nav .nav_list > li > div [class*="icon-"] {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 7.2vw;
	width: 1em;
	height: 1em;
}
#drawer nav .nav_list > li > div [class*="icon-"]::before {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 5.6vw;
}
#drawer nav .nav_list > li > div.active .icon-drawer-plus,
#drawer nav .nav_list > li > div:not(.active) .icon-drawer-minus {
	display: none;
}
#drawer nav .nav_list > li > ul {
	display: none;
	font-size: 3.7vw;
	line-height: 2.5;
	padding: 5vw 5vw 4vw;
}
#drawer nav .nav_list > li > ul li a {
	display: flex;
	align-items: center;
}
#drawer nav .nav_list > li > ul li a::before {
	content: '';
	width: 4vw;
	border-bottom: 1px solid;
	margin-right: 0.8em;
}
	
	

/*================================================
 *  ページタイトル
 ================================================*/
#pageTitle {
	padding: 5vw 0 10vw 2.5vw;
}
#pageTitle h1 {
	width: 100%;
}
#pageTitle h1 > em {
	font-size: 4.2vw;
	margin: 0 0 4vw 7vw;
}
#pageTitle h1 > span {
	font-size: 13vw;
}


/*news + お役立ち情報*/
#news #pageTitle,
#topics #pageTitle {
	padding: 9vw 0 10vw 6vw;
}
#news #pageTitle h1 > em,
#topics #pageTitle h1 > em{
	font-size: 6.1vw;
}
	
/*404*/
#notfound #pageTitle h1 > span {
	font-size: 13vw;
}



/*******パンくずリスト*******/
ol.breadcrumb {
	display: none;
}


/*================================================
 *  コンテンツ
 ================================================*/
.contents {
	padding-bottom: 20vw;
}

/*******見出し*******/


	
	
	
	
	
	
	
	
	
	
	
/*******ページナビゲーション（テキスト版）*******/
#pagenav_txt ul {
	justify-content: space-between;
	gap: 3.5vw 0;
}
#pagenav_txt ul li {
	width: calc((100% - 5vw) / 2);
}
#pagenav_txt ul li a {
	font-size: 4.2vw;
	min-height: 16vw;
	padding: 1.3vw;
}
#pagenav_txt ul li a [class*="icon-"] {
	font-size: 5.3vw;
}




/*******共通grid*******/
dl.common_grid_list {
	font-size: 4vw;
	border-top: 1px solid var(--color-main);
}
dl.common_grid_list dt {
	padding: 5vw 4vw 1.5vw;
}
dl.common_grid_list dd {
	padding: 0 4vw 6vw;
	border-bottom: 1px solid var(--color-main);
}





/*================================================
 *  導入の流れ（共通）
 ================================================*/

section#flow_area .flow_list::after {
	top: 5vw;
	left: 50%;
	transform: translateX(-50%);
	width: 1vw;
	height: calc(100% - 10vw);
}
section#flow_area .flow_list dl + dl {
	margin-top: 5vw;
}
section#flow_area .flow_list dl dt {
	top: 4vw;
	left: -5.5vw;
	transform: none;
	border-width: 0.7vw;
	font-size: 3.4vw;
	height: 17.3vw;
	width: 17.3vw;
}
section#flow_area .flow_list dl dt span {
	font-size: 6.9vw;
}
section#flow_area .flow_list dl dd {
	display: block;
	width: 100%;
	padding: 8vw 10vw;
}
section#flow_area .flow_list dl dd h4 {
	font-size: 7.2vw;
	text-align: center;
	margin-bottom: 0.5em;
}
section#flow_area .flow_list dl dd .inr {
	width: 100%;
}

/*STEP01*/
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box {
	margin-top: 3vw;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .unit_tel .tel {
	margin-right: -3vw;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .unit_tel .tel [class*="icon-"] {
	font-size: 8.6vw;
	width: 10.1vw;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .unit_tel .tel span:not([class*="icon-"]) {
	font-size: 9.8vw;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .unit_tel p {
	margin: 2vw 0 0 11vw;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .btn_form {
	font-size: 4vw;
	height: 14.6vw;
	width: 62vw;
	margin: 5vw auto 0;
}
section#flow_area .flow_list dl.flow_step01 dd .inr .contact_box .btn_form [class*="icon-"] {
	font-size: 4.8vw;
}







/*================================================
 *  ご相談・お見積り（共通）
 ================================================*/
section.consult_area {
	margin-top: 18vw;
}
section.consult_area h2 {
	margin-bottom: -1.3vw;
}
section.consult_area h2 img {
	width: 82.6vw;
}
section.consult_area .outer {
	padding: 10vw 0;
}
section.consult_area .outer h3 {
	font-size: 7.7vw;
	margin-bottom: 6.5vw;
}
section.consult_area .outer .inner .unit_txt .list_feature {
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	font-size: 4vw;
}
section.consult_area .outer .inner .unit_txt .list_feature li {
	border-width: 2px;
	height: 31.4vw;
	width: 31.4vw;
}
section.consult_area .outer .inner .unit_txt .list_feature li + li {
	margin-left: -2.5vw;
}
section.consult_area .outer .inner .unit_txt p {
	font-size: 4vw;
	margin-top: 0.8em;
	text-align: center;
}

section.consult_area .outer .inner .contact_btn_list {
	margin-top: 6vw;
}
section.consult_area .outer .inner .contact_btn_list li + li {
	margin-top: 2.6vw;
}
section.consult_area .outer .inner .contact_btn_list li a {
	height: 29vw;
	padding-left: 5vw;
}

section.consult_area .outer .inner .contact_btn_list li a [class*="icon-"] {
	font-size: 7.2vw;
	width: 11.5vw;
}
section.consult_area .outer .inner .contact_btn_list li.btn_tel a .tel span:not([class*="icon-"]) {
	font-size: 9.3vw;
}
section.consult_area .outer .inner .contact_btn_list li.btn_tel a p {
	font-size: 3.4vw;
	padding: 2vw 0 0 12vw;
}

section.consult_area .outer .inner .contact_btn_list li.btn_form a {
	font-size: 6.6vw;
}


/*================================================
 *  フッター
 ================================================*/
body:not(.sp_fixed_none) footer {
	padding-bottom: 26vw;
}

/*******フッター用ナビゲーション*******/
footer #footer_nav_area {
	padding-top: 8vw;
}
footer #footer_nav_area .info_box .logo img {
	display: block;
	margin: 0 auto;
	width: 57vw;
}

/*住所*/
footer #footer_nav_area .info_box .add_list {
	grid-template-columns: 15vw 1fr; 
	gap: 2.5vw 2.5vw;
	margin-top: 7vw;
}
footer #footer_nav_area .info_box .add_list dt {
	font-size: 3.4vw;
}
footer #footer_nav_area .info_box .add_list dd {
	font-size: 3.7vw;
	line-height: 1.5;
	padding: 0.25em 0;
}

/*ナビゲーション*/
footer #footer_nav_area nav {
	font-size: 3.4vw;
	line-height: 2.5;
	margin: 7vw auto 0;
	width: 60vw;
}


/*******フッター最下部*******/
footer #footer_bottom_area {
	font-size: 3.4vw;
	padding: 7vw 0 10vw;
	text-align: center;
}
footer #footer_bottom_area .copyright {
	font-size: 3.4vw;
	margin-top: 10vw;
}





}