@charset "UTF-8";

/* ---------------------------
00.Web Font
01.全般的な設定 & リセット
02.ヘッダ
03.ナビ
04.コンテンツ
05.フッター
06.ポップアップ
07.フォント
08.テーブル
09.clearfix
10.ContactForm7 上書き
--------------------------- */

/* ##############################################################################

    共通 - common

############################################################################## */

	@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300');

	html{
		height: 100%;
	}
	img{
		max-width : 100%;  /* フルードイメージ */
		height: auto;
		vertical-align: bottom;
	}
	p{
		line-height: 150%;
		text-align:justify;
		text-justify:inter-ideograph;
	}
	li{
		list-style: none;
	}

	/* WordPress 記事内の画像レイアウト */
	img.alignright { display: block; margin: 0 0 0 auto; }
	img.alignleft { display: block; margin: 0 auto 0 0; }
	img.aligncenter { display: block; margin: 0 auto; }

	a{
		outline:none;  /* フォーカス時の点線を消す */
		text-decoration: none;
	}
	*:focus {
		outline: none; /* chromeで青い線が入るのを防ぐ */
	}
	a:link { color: #000; }
	a:visited { color: #000; }
	a:hover { color: #e10000; }
	a:active { color: #000; }

	.txt-c{ text-align: center !important; }
	.txt-r{ text-align: right !important; }
	.txt-l{ text-align: left !important; }
	.tbl-c{
		display: table;
		margin-left: auto;
		margin-right: auto;
	}

	/* PC用の改行を無効に */
	.br-pc {
		display: none;
	}
	/* スマホ時 非表示テキスト */
	.hide-sp {
		display: none;
	}
	.sp-show {
		display: none;
	}
	/* PCのみ表示 */
	.pc-show{
		display: none;
	}

	/* マージン */
	.mg-b0  { margin-bottom:  0px !important; }
	.mg-b20 { margin-bottom: 10px !important; }
	.mg-b25 { margin-bottom: 12px !important; }
	.mg-b30 { margin-bottom: 15px !important; }
	.mg-b40 { margin-bottom: 20px !important; }
	.mg-b50 { margin-bottom: 25px !important; }
	.mg-b100{ margin-bottom: 50px !important; }
	.mg-t25 { margin-top: 12px !important; }
	.mg-t50 { margin-top: 25px !important; }
	.mg-t100{ margin-top: 50px !important; }
	.mg-t-head{ margin-top: 30px !important; }
	.pd-t0  { padding-top:  0px !important; }
	.pd-b0  { padding-bottom:  0px !important; }

	.full-wrapper{
		box-sizing: border-box;
		padding: 0 3%;
	}

	.main-wrapper{
		box-sizing: border-box;
		margin: 0 auto;
		padding: 0 3%;
	}
	/* 白背景 */
	.white-wrapper{
		padding: 0 0 50px 0;
		background-color: #fff;
	}
	/* グレー背景１ */
	.gray-wrapper1{
		padding: 50px 0;
		background-color: #fff;
	}
	/* グレー背景２ */
	.gray-wrapper2{
		padding: 50px 0;
		background-color: #fafafa;
	}

	#container{
		margin-top: 0;
	}

	/* ローディング */
	#container{
		opaicty: 0;
	}
	#container.disp{
		opaicty: 1;
	}
	#loading{
		width: 100%;
		height: 100%;
		background: #fff;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1000;
	}
	.loader{
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
	}
	.loader img{
		width: 233px;
		height: 85px;
	}

	/* 影装飾 */
	.shadow-gray,
	.shadow-red{
		position: relative;
	}
	.shadow-gray:after,
	.shadow-red:after{
		content: "";
		position: absolute;
		z-index: -1;
		top: 5px;
		left: 5px;
		width: 100%;
		height: 100%;
		border-radius: 5px;
	}
	.shadow-gray:after{ background-image: url('../img/shadow-gray.png'); }
	.shadow-red:after{ background-image: url('../img/shadow-red.png'); }

	/* h2 */
	.h2title{
		position: relative;
		margin-bottom: 50px;
		padding: 0 0 30px 0;
		text-align: center;
		font-size: 18px;
		font-weight: normal;
		letter-spacing: 1px;
		line-height: 1.5;
	}
	.h2title::before {
		content: none;
	}
	.h2title span{
		display: block;
		position: absolute;
		margin: auto;
		bottom: 0;
		left: 0;
		right: 0;
		font-size: 12px;
	}
	.h2title::after{
		position: absolute;
		display: block;
		content: "";
		margin: auto;
		bottom: -25px;
		left: 0;
		right: 0;
		max-width: 345px;
		height: 13px;
		background-size: 345px 13px;
		background-image: url('../img/h2line.svg');
		background-position: center;
	}

	/* 折りたたみボタン */
	/*.reed-more:before{
		position: absolute;
		content: "";
		width: 20px;
		height: 20px;
		margin: auto;
		top: auto;
		top: inherit;
		bottom: -60px;
		left: 0;
		right: 0;
		background-image: url('../img/lp-plusbtn.svg');
		background-size: contain;
		background-repeat: no-repeat;
		vertical-align:middle;
	}
	.reed-more-click:before{
		position: absolute;
		content: "";
		width: 20px;
		height: 20px;
		margin: auto;
		left: 0;
		right: 0;
		bottom: -60px;
		background-image: url('../img/lp-minusbtn.svg');
		background-size: contain;
		background-repeat: no-repeat;
		vertical-align:middle;
	}*/
	/* アコーディオン非表示 */
	/*#lp01-ac,
	#lp02-ac,
	#lp03-ac,
	#lp04-ac,
	#lp05-ac,
	#lp06-ac,
	#lp07-ac,
	#lp08-ac{
		padding-top: 30px;
		display:none;
	}*/

	/* カーソル変更 */
	/*#lp01,
	#lp02,
	#lp03,
	#lp04,
	#lp05,
	#lp06,
	#lp07,
	#lp08{
		cursor : pointer;
	}*/

	/* リードテキスト */
	.reed-txt{
		margin-bottom: 20px;
		line-height: 180%;
		font-size: 14px;
	}

	/* bdr_box_list */
	.bdr_box_list {
		column-gap: 12px;
		row-gap: 24px;
	}
	.bdr_box_list--item {
		-webkit-box-flex: 1;
		-ms-flex: 1 1 100%;
		flex: 1;
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 16px;
		padding-right: 16px;
		border: 1px solid #e6e6e6;
	}
	.bdr_box_list--item .logo {
		row-gap: 12px;
	}
	.bdr_box_list--item .logo .type {
		font-size: 120%;
		letter-spacing: .5em;
	}
	.bdr_box_list--item .txt {
		line-height: 2em;
	}

	/* スマホ時スクロール */
	.scroll{
		overflow: auto; /*tableをスクロールさせる*/
		white-space: nowrap; /*tableのセル内にある文字の折り返しを禁止*/
	}
	.scroll::-webkit-scrollbar{ /*tableにスクロールバーを追加*/
		height: 3px;
	}
	.scroll::-webkit-scrollbar-track{ /*tableにスクロールバーを追加*/
		background: #fcfcfc;
	}
	.scroll::-webkit-scrollbar-thumb { /*tableにスクロールバーを追加*/
		background: #e0e0e0;
	}

	@media (max-width: 899px){
		/* SP非表示 */
		.sp-hide{
			display: none !important;
		}
	}
	@media (min-width: 900px) {
		body {
			font-size: 15px;
			min-width: 1100px;
		}
		/* PCのみ隠す */
		.pc-hide{
			display: none !important;
		}
		/* スマホ時 非表示テキスト */
		.hide-sp {
			display: inherit;
		}
		/* マージン */
		.mg-b20 { margin-bottom: 20px !important; }
		.mg-b25 { margin-bottom: 25px !important; }
		.mg-b30 { margin-bottom: 30px !important; }
		.mg-b40 { margin-bottom: 40px !important; }
		.mg-b50 { margin-bottom: 50px !important; }
		.mg-b100{ margin-bottom: 100px !important; }
		.mg-t25 { margin-top: 25px !important; }
		.mg-t50 { margin-top: 50px !important; }
		.mg-t100{ margin-top: 100px !important; }
		.mg-t-head{ margin-top: 100px !important; }
		/* PC用の改行を有効に */
		.br-pc {
			display: inline;
		}
		/* スマホ用の改行を無効に */
		.br-sp {
			display: none;
		}
		.pc-center{
			text-align: center;
		}
		.flt-l{ float: left; }
		.flt-r{ float: right; }
		/* toggle開閉 */
		/*.reed-more:before,
		.reed-more-click:before{
			content: none;
		}*/
		/* アコーディオン非表示 */
		/*#lp01-ac,
		#lp02-ac,
		#lp03-ac,
		#lp04-ac,
		#lp05-ac,
		#lp06-ac,
		#lp07-ac,
		#lp08-ac{
			display: block;
			margin-bottom: 0;
			padding: 0;
		}*/
		/* カーソル変更 */
		/*#lp01,
		#lp02,
		#lp03,
		#lp04,
		#lp05,
		#lp06,
		#lp07,
		#lp08{
			cursor : inherit;
		}*/
		/* ■共通
		-----------------------------------*/
		.full-wrapper{
			box-sizing: border-box;
			width: 100%;
			padding: 0 30px;
		}
		.main-wrapper {
			width: 1100px;
			padding: 0;
		}
		/* 白背景 */
		.white-wrapper{
			padding: 0;
		}
		/* グレー背景 */
		.gray-wrapper1,
		.gray-wrapper2{
			margin: 0 30px;
			padding: 100px 0;
		}

		/* h2 */
		.h2title{
			padding: 0 0 28px 0;
			font-size: 18px;
			margin-bottom: 80px;
		}
		.h2title span{
			font-size: 14px;
			color: #000;
		}
		.h2title::after{
			bottom: -35px;
			width: 500px;
			height: 16px;
			background-size: 500px 16px;
		}
		/* リードテキスト */
		.reed-txt{
			text-align: center;
			margin-bottom: 30px;
			font-size: 20px;
		}
		/* bdr_box_list */
		.bdr_box_list {
			column-gap: 32px;
			row-gap: 24px;
		}
		.bdr_box_list--item {
			padding-top: 32px;
			padding-bottom: 32px;
			padding-left: 24px;
			padding-right: 24px;
		}
	}
	@media (max-width: 560px) {
		.sp-show {
			display: block;
		}
		.bdr_box_list {
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
		}
		.bdr_box_list--item .logo img {
			width: 180px;
		}
		.bdr_box_list--item .logo .type {
			font-size: 116%;
		}
	}


/* ##############################################################################

    ヘッダー

############################################################################## */
	header{
		box-sizing: border-box;
		width: 100%;
		height: 40px;
		position: fixed;
		top: 0;
		background-color: #fff;
		z-index: 200;
	}
	#sp-head{
		box-sizing: border-box;
		width: 100%;
		height: 40px;
		position: relative;
		line-height: 1.0em;
	}
	#header-logo{
		position: absolute;
		width: 54px;
		height: 20px;
		top: 10px;
		left: 10px;
		margin: auto;
	}
	#header-logo img{
		position: absolute;
		width: 54px;
		height: 20px;
		opacity: 0;
	}
	#header-logo img.show{
		opacity: 1;
	}
	#header-logo2{
		position: absolute;
		width: 170px;
		height: 24px;
		top: 9px;
		left: 0;
		right: 0;
		margin: auto;
	}
	#header-logo2 img{
		position: absolute;
		width: 170px;
		height: 24px;
	}
	/* ハンバーガーメニュー */
	#header-navbtn{
		box-sizing: border-box;
		padding: 6px 0 0 0;
		width: 33px;
		height: 34px;
		position: absolute;
		right: 20px;
		top: 0;
		z-index: 100;
	}
	.hamburger-label{
		display: none;
	}
	/* FCボタン */
	#header-btn1,
	#header-btn2{
		display: none;
	}
	.btn-flat a {
		height: 40px;
		padding-left: 12px;
		padding-right: 12px;
	}
	/* SNS */
	#header-sns{
		display: none;
	}

	@media (min-width: 900px) {
		header{
			min-width: 1100px;
			height: 60px;
			background-color: rgba(255,255,255,0.9);
			transition: 0.3s ease-in-out;
		}
		#sp-head{
			height: 60px;
		}
		#header-logo{
			width: 109px;
			height: 40px;
			top: 10px;
			left: 30px;
		}
		#header-logo img{
			width: 109px;
			height: 40px;
		}
		#header-logo2{
			width: 300px;
			height: 28px;
			top: 16px;
		}
		#header-logo2 img{
			width: 300px;
			height: 28px;
		}
		#header-sns{
			display: flex;
			justify-content: space-between;
			position: absolute;
			right: 182px;
			width: 60px;
			height: 60px;
		}
		#header-sns img{
			right: 60px;
			width: 60px;
		}
		/* ハンバーガーメニュー */
		#header-navbtn{
			box-sizing: border-box;
			padding: 0;
			/*width: 180px;
			height: 60px;*/
			width: 200px;
			height: 60px;
			position: absolute;
			right: 0;
			top: 0;
			background-color: #000;
		}
		.hamburger {
			width: 100%;
			height: 100%;
		}
		.hamburger-label{
			display: block;
			width: 64px;
			margin-top: 0;
			float: left;
			line-height: 1;
			font-size: 15px;
			color: #fff;
			text-align: left;
			letter-spacing: 2px;
		}
		.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
			width: 35px;
			height: 2px;
			background-color: #fff;
		}
		.hamburger-box{
			width: 40px;
		}
		.hamburger-inner::before {
			top: -8px;
		}
		.hamburger-inner::after {
			bottom: -8px;
		}
	}
	@media (min-width: 1300px) {
		#header-btn1,
		#header-btn2{
			display: block;
			position: absolute;
			top: 0;
			width: 200px;
			height: 60px;
		}
		#header-btn1{
			right: 408px;
		}
		#header-btn2{
			right: 204px;
		}
		#header-btn1 a,
		#header-btn2 a {
			height: 100%;
			font-size: 13px;
			color: #fff;
			column-gap: 6px;
			letter-spacing: .05em;
		}
	}
	@media (max-width: 1600px) and (min-width: 900px)  {
		#header-navbtn,
		#header-btn1,
		#header-btn2 {
			width: 160px;
		}
		#header-btn1 {
			right: 324px;
		}
		#header-btn2 {
			right: 162px;
		}
		#header-btn1 a,
		#header-btn2 a {
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
			row-gap: 6px;
		}
	}


/* ##############################################################################

    ナビ

############################################################################## */
	#gnav{
		opacity: 0;
		visibility: hidden;
		z-index: -1;
		position: fixed;
		box-sizing: border-box;
		margin-top: 40px;
		padding: 25px 25px 30px;
		width: 100%;
		min-height: calc(100% - 40px);
		background-color: #FFF;
		transition: all 300ms 0s ease;
		top: 0;
		bottom: 0;
		overflow-y: auto;
	}
	#gnav.active{
		opacity: 100;
		visibility: visible;
	}
	#gnav .logo {
		position: relative;
		z-index: 1;
	}
	#gnav .nav_list--item {
		border-bottom: 1px solid #ccc;
	}
	#gnav .nav_list--item:first-child {
		border-top: 1px solid #ccc;
	}
	#gnav .nav_list--item a {
		height: 60px;
		padding-left: 40px;
		padding-right: 40px;
		column-gap: 30px;
	}
	#gnav .nav_list--item .ico {
		width: 55px;
		height: 25px;
	}
	@media (min-width: 900px) {
		#gnav{
			display: flex;
			align-items: center;
			margin: 0;
			padding: 0;
			z-index: 1;
		}
		#pcnav-wrapper{
			-webkit-flex-direction: row;
			-ms-flex-direction: row;
			flex-direction: row;
			width: 100%;
			height: 100%;
			gap: 0;
		}
		#pcnav-wrapper>* {
			width: 50%;
			height: 100%;
		}
	}
	@media (max-width: 1480px) {
		#pcnav-wrapper .img_area {
			width: 30%;
			box-sizing: border-box;
			padding-left: 24px;
			padding-right: 24px;
		}
		#pcnav-wrapper .nav_area {
			width: 70%;
		}
	}
	@media (max-width: 899px) {
		#gnav {
			padding-bottom: 0;
		}
		#pcnav-wrapper {
			-webkit-flex-direction: column-reverse;
			-ms-flex-direction: column-reverse;
			flex-direction: column-reverse;
		}
		#pcnav-wrapper .img_area,
		#pcnav-wrapper .nav_area {
			width: 100%;
		}
		#pcnav-wrapper .img_area {
			position: relative;
			left: 50%;
			translate: -50% 0;
			width: 100vw;
			height: 62vw;
		}
		#pcnav-wrapper .img_area .logo img {
			width: 58%;
			display: block;
			margin-left: auto;
			margin-right: auto;
		}
		#pcnav-wrapper .nav_area {
			margin-bottom: 48px;
		}
	}
	@media (max-width: 560px) {
		#gnav .nav_list--item a {
			padding-left: 0px;
			padding-right: 0px;
			column-gap: 2px;
			height: 50px;
		}
		#gnav .nav_list--item .ico {
			scale: .7;
			margin-left: -6px;
		}
	}


/* ##############################################################################

    LP

############################################################################## */

/* hero
*************************************************** */
	#hero {
		position: relative;
		width: 100%;
		height: 46.88vw;
		position: relative;
		overflow: hidden;
	}
	#hero picture img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	@media (max-width: 560px) {
		#hero {
			height: 70vw;
		}
	}

/* scr_imgs
*************************************************** */
	@keyframes scr_imgs {
		0% {
			background-position: 0 0;
		}
		100% {
			background-position: -4400px 0; /* 画像のマイナス幅 */
		}
	}
	.scr_imgs {
		position: relative;
		z-index: 0;
		width: 100%;
		height: 300px;
	}
	.scr_imgs .bg_img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-image: url(../img/fc-scr_imgs-pc.jpg);
		background-repeat: repeat-x;
		background-size: auto 300px;
		animation-duration: 200s;
		animation-timing-function: linear;
		animation-iteration-count: infinite;
		animation-fill-mode: forwards;
		animation-name: scr_imgs;
	}
	@media (max-width: 1280px) {
		.scr_imgs {
			height: 200px;
		}
		.scr_imgs .bg_img {
			background-size: auto 200px;
		}
	}
	@media (max-width: 899px) {
		.scr_imgs {
			height: 150px;
		}
		.scr_imgs .bg_img {
			background-size: auto 150px;
		}
	}
	@media (max-width: 560px) {
		.scr_imgs {
			height: 100px;
		}
		.scr_imgs .bg_img {
			background-size: auto 100px;
		}
	}

/* lead
*************************************************** */
	#fc-lead .fc-lead_txts .ttl,
	#fc-lead .fc-lead_txts .txt {
		line-height: 1em;
	}
	#fc-lead .fc-lead_txts .ttl {
		font-size: 253%;
		font-weight: normal;
	}
	#fc-lead .fc-lead_txts .txt {
		font-size: 160%;
	}
	#fc-lead .fc-lead_txts .num_area {
		margin-left: auto;
		margin-right: auto;
		padding: 14px 36px;
		background-color: #e6e6e6;
		column-gap: 16px;
	}
	@media (max-width: 899px) {
		#fc-lead .logo img {
			width: 400px;
			height: 40px;
		}
		#fc-lead .fc-lead_txts .ttl,
		#fc-lead .fc-lead_txts .txt {
			line-height: 1.6em;
		}
		#fc-lead .fc-lead_txts .ttl {
			font-size: 183%;
		}
		#fc-lead .fc-lead_txts .txt {
			font-size: 128%;
		}
		#fc-lead .fc-lead_txts .num_area {
			padding: 4px 24px;
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
		}
	}
	@media (max-width: 560px) {
		#fc-lead .logo img {
			width: 300px;
			height: 30px;
		}
		#fc-lead .fc-lead_txts .ttl {
			font-size: 150%;
		}
		#fc-lead .fc-lead_txts .txt {
			font-size: 108%;
		}
		#fc-lead .fc-lead_txts .num_area {
			padding: 4px 16px;
			font-size: 10px;
		}
	}


/* netis
*************************************************** */
	@media (max-width: 1740px) {
		.netis.gray-wrapper1 {
			margin-left: 0;
			margin-right: 0;
		}
	}

/* 認定施工店・販売店の魅力 - charm
*************************************************** */
	.feature-list{
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-justify-content: space-between;
		-ms-flex-pack: justify;
		justify-content: space-between;
		column-gap: 8px;
		margin-bottom: 30px;
	}
	.feature-list li{
		margin: 0 auto;
		-webkit-box-flex: 1;
		-ms-flex: 1 1 100%;
		flex: 1;
		background-color: #e10000;
		padding: 10px 0;
		text-align: center;
		color: #fff;
		font-size: 14px;
		line-height: 1.4em;
	}

	/* 左右ボックス2（比率固定） */
	.box2{
		margin-bottom: 30px;
	}
	.box2-photo{
		text-align: center;
	}
	.box2-photo img{
		width: 100%;
	}
	.box2-txt{
		box-sizing: border-box;
		padding: 30px 3%;
		background-color: #fafafa;
	}
	.about-no{
		margin-bottom: 25px;
		font-size: 35px;
		text-align: center;
		line-height: 1;
		color: #e10000;
	}
	.about-title{
		text-align: center;
		line-height: 1;
		margin-bottom: 20px;
		padding-bottom: 20px;
		border-bottom: 1px solid #e10000;
		letter-spacing: 0;
		font-size: 16px;
		width: 500px;
		max-width: 100%;
	}
	.about-txt {
		line-height: 1.8em;
	}
	.adjust-box2{
		width: 100%;
	}
	.charm_bloc:nth-of-type(even) {
		-webkit-flex-direction: row-reverse;
		-ms-flex-direction: row-reverse;
		flex-direction: row-reverse;
	}
	.charm_bloc > * {
		width: 50%;
	}
	.charm_bloc .img_area {
		overflow: hidden;
	}
	.charm_bloc .txt_area {
		background-color: #fafafa;
		min-height: 500px;
		padding-left: 80px;
		padding-right: 80px;
		box-sizing: border-box;
	}
	.charm_bloc .txt_area .about-no {
		font-family: "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	@media (min-width: 900px) {
		.feature-list{
			margin: 0 auto 80px;
			width: 1100px;
			column-gap: 30px;
		}
		.feature-list li{
			padding: 15px 0;
			font-size: 18px;
		}
		.feature-list li:not(:last-child){
			margin-bottom: 0;
		}
	}
	@media (min-width: 1300px) {
		.box2-innner{
			padding: 0 65px;
		}
		.box2{
			margin-bottom: 0;
		}
		.adjust-box2{
			position: relative;
			width: 50%;
		}
		.box2-innner{
			box-sizing: border-box;
			padding: 0 65px;
		}
		.adjust-box2:before{
			content: '';
			display: block;
			padding-top: 43.01%; /* 画像比率で固定 ⇒ 高さ÷幅×100 */
		}
		.adjust-inner2{
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			width: 100%;
			height: 100%;
			overflow: hidden;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.box2-txt{
			padding: 0;
		}
		.box2-inner{
			position: relative;
			padding: 0 65px;
		}
		.about-no{
			margin-bottom: 20px
		}
		.about-title{
			margin-bottom: 35px;
			font-size: 18px;
		}
		.about-txt{
			font-size: 14px;
			font-size: inherit;
		}
	}
	@media (max-width: 1600px) {
		.charm_bloc .txt_area {
			height: 32vw;
			padding-left: 56px;
			padding-right: 56px;
		}
	}
	@media (max-width: 899px) {
		.charm_bloc {
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
		}
		.charm_bloc > * {
			width: 100%;
		}
		.charm_bloc .txt_area {
			height: auto;
			min-height: auto;
			padding-top: 48px;
			padding-bottom: 48px;
		}
	}
	@media (max-width: 768px) {
		.charm_bloc .txt_area {
			padding-top: 32px;
			padding-bottom: 32px;
			padding-left: 24px;
			padding-right: 24px;
		}
	}
	@media (max-width: 560px) {
		.feature-list {
			column-gap: 2px;
		}
		.feature-list li {
			font-size: 12px;
			letter-spacing: .05em;
		}
		.about-no {
			font-size: 24px;
			margin-bottom: 12px;
		}
		.about-title {
			line-height: 1.6em;
			padding-bottom: 16px;
		}
		.charm_bloc .txt_area {
			padding-top: 24px;
			padding-bottom: 24px;
			padding-left: 16px;
			padding-right: 16px;
		}
	}
	@media (max-width: 413px) {
		.feature-list {
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;
			row-gap: 8px;
		}
		.feature-list li {
			width: 100%;
		}
		.feature-list li .br-sp {
			display: none;
		}
	}


/* 認定施工店・販売店　加盟初期費用 - cost
*************************************************** */
	.initial1{
		display: flex;
		justify-content: center;
		align-items: center;
		box-sizing: border-box;
		margin-bottom: 20px;
		height: 150px;
		background-color: #fafafa;
	}
	.initial1 img{
		width: 160px;
		height: 112px;
	}
	.initial2 p{
		margin-bottom: 10px;
		text-align: center;
		font-size: 14px;
		line-height: 1.7;
	}
	.initial2 p span{
		font-size: 18px;
	}
	.initial2 p span span{
		font-size: 12px;
	}
	.initial2 table{
		margin-bottom: 10px;
		width: 100%;
	}
	.initial2 table th,
	.initial2 table td{
		display: block;
		padding: 7px 0;
		background-color: #fff;
		text-align: center;
		border-top: 1px solid #989898;
		border-left: 1px solid #989898;
		border-right: 1px solid #989898;
		font-weight: normal;
	}
	.initial2 table tr:last-child td{
		border-bottom: 1px solid #989898;
	}
	.initial2 ul li{
		box-sizing: border-box;
	}

	.initial2a{
		margin-bottom: 50px;
	}
	.promo{
		font-size: 10px;
	}
	@media (min-width: 900px) {
		.initial-box{
			display: flex;
			justify-content: space-between;
			align-items: start;
			margin-bottom: 50px;
		}
		.initial1{
			margin: 0 30px 0 0;
			width: 250px;
			height: 250px;
		}
		.initial1 img{
			width: 202px;
			height: 166px;
		}
		.initial2{
			width: 820px;
			display: flex;
			flex-wrap: wrap;
			align-content: space-between;
			margin-bottom: 0;
			height: 196px;
		}
		.initial2a{
			height: 250px;
		}
		.initial2 p{
			margin: 0;
			text-align: left;
			font-size: 18px;
			line-height: 1;
		}
		.initial2 p span.txt-red{
			display: inline-block;
			font-size: 32px;
			width: 264px;
			translate: 0 1px;
			text-align: right;
		}
		.initial2 p span span{
			font-size: 14px;
		}
		.initial2 table{
			margin-bottom: 0;
			width: 100%;
		}
		.initial2 table th,
		.initial2 table td{
			font-size: 15px;
			display: table-cell;
			padding: 20px 15px;
			line-height: 1;
			background-color: #fff;
			border: 1px solid #989898;
		}
		.initial2 table th{
			width: 175px;
			text-align: center;
			text-align-last: justify;
		}
		.initial2 table td{
			text-align: left;
			letter-spacing: 0;
		}
		.initial2 ul li{
			display: inline-block;
			font-size: 12px;
			line-height:1;
		}
		.promo{
			font-size: inherit;
		}
		span.price1{
			display: inline-block;
			width: 96px;
			text-align: right;
		}
	}

/* 月額固定ロイヤリティ - royalty
*************************************************** */
	.royalty .bdr_box_list--item {
		border-color: #989898;
	}
	.royalty .bdr_box_list--item .price_txt .num {
		font-size: 24px;
	}
	.royality1{
		margin-bottom: 30px;
	}
	@media (min-width: 900px) {
		.royality1{
			margin-bottom: 10px;
		}
		#lp04-ac table th,
		#lp04-ac table td{
			font-size: 15px;
			display: table-cell;
			padding: 20px 15px;
			line-height: 1;
			background-color: #fff;
			border: 1px solid #989898;
		}
		#lp04-ac table th{
			width: 400px;
			text-align: center;
		}
		#lp04-ac table td{
			text-align: left;
			letter-spacing: 0;
			vertical-align: middle;
		}
		span.price2{
			display: inline-block;
			width: 178px;
			text-align: right;
		}
	}

/* 加盟までの流れ - flow
*************************************************** */
	#flow-list{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#flow-list li{
		position: relative;
		padding: 8px 0 8px 8px;
		width: 100%;
		border: 1px solid #989898;
		background-color: #fff;
		letter-spacing: 0;
	}
	#flow-list li.f-blue{
		background-color: #BAE2F8;
	}
	#flow-list li.f-yellow{
		background-color: #FFF697;
	}
	#flow-list li.f-red{
		background-color: #e10000;
		color: #fff;
	}
	#flow-list li:not(:last-child)::after{
		position: absolute;
		bottom: -18px;
		left: 0;
		right: 0;
		margin: auto;
		content: "";
		width: 15px;
		height: 5px;
		background-size: 15px 5px;
		background-image: url('../img/flow-arrow1.svg');
	}
	@media (min-width: 900px) {
		#flow-list{
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			gap: 30px;
		}
		#flow-list li{
			position: relative;
			padding: 8px 0 8px 8px;
			width: 335px;
			font-size: 14px;
		}
		#flow-list li:not(:last-child)::after{
			position: absolute;
			bottom: 15px;
			right: -20px;
			left: inherit;
			content: "";
			width: 5px;
			height: 10px;
			background-size: 5px 10px;
			background-image: url('../img/flow-arrow2.svg');
		}
		#flow-list li:nth-child(3n)::after{
			display: none;
		}
	}
	@media (max-width: 899px) {
		#flow-list li:not(:first-child) {
			margin-top: -1px;
		}
	}

/* よくある質問 - qa
*************************************************** */
	#qa-list li::before,
	#qa-list li:last-child::after {
		content: none;
	}
	#qa-list li {
		border-top: 1px solid #989898;
	}
	#qa-list li:last-child {
		border-bottom: 1px solid #989898;
	}
	.question{
		font-weight: normal;
	}
	.question,
	.answer{
		box-sizing: border-box;
		position: relative;
		margin: 15px 0;
		padding-left: 30px;
		line-height: 20px;
	}
	.question::before,
	.answer::before{
		position: absolute;
		content: "";
		top: 0;
		left: 0;
		width: 20px;
		height: 20px;
		background-size: 20px 20px;
	}
	.question::before{ background-image: url('../img/qa-icon-1.svg'); }
	.answer::before  { background-image: url('../img/qa-icon-2.svg'); }
	@media (min-width: 900px) {
		#qa-list li {
			padding-left: 48px;
			padding-right: 48px;
		}
		.question,
		.answer{
			padding-left: 40px;
			margin: 30px 0;
		}
	}

/* 加盟資料請求・加盟説明会　お申し込み - contact
*************************************************** */
	.reed-txt2{
		margin-bottom: 30px;
	}
	span.wpcf7-list-item {
		display: block;
	}
	/* 入力エラー内容 */
	.wpcf7-not-valid-tip{
		padding: 2px 0 10px 0;
		color: #c80000;
	}
	/* 入力エラーメッセージ */
	div.wpcf7-validation-errors{
		border: 0 ;
		background: #c80000;
		color: #fff;
		padding: 10px;
		text-align: center;
		font-weight: bold;
	}
	/* 送信成功メッセージ */
	.wpcf7-mail-sent-ok{
		margin: 40px 0 100px !important;
		border: 0 !important;
		background: #aaaaaa;
		padding: 10px !important;
		text-align: center;
		font-weight: bold;
	}
	/* 送信完了後非表示に */
	.sent .contact-input-area{
		display: none;
	}

	@media (min-width: 900px) {
		.reed-txt2{
			letter-spacing: 0;
			text-align: center;
		}
	}

/* reCAPTCHA
*************************************************** */
	.recaptcha_txt {
		display: block;
		margin-top: 4px;
	}
	.recaptcha_txt a {
		color: #fff;
	}
	.grecaptcha-badge {
		visibility: hidden;
	}
