@charset "UTF-8";

:root {
	/****************width/height*******************/
	--base-width: 100%;
	--base-height: 100%;
	--cont-width: 1200px;

	/****************color*******************/
	--base-color: #27272a;
	--blue: #1878da;
	--white: #FFFFFF;
	--contens-color: #f5f2ed;
	--orange: #ed910d;
	--green: #1ca480;
	--section-color: #faf9e4;

	/****************potision*******************/
	--center: center;
	--left: left;
	--right: right;
	--base-potision: relative;
	--child-potision: absolute;
	--fixed-potision: fixed;
	--inline: inline-block;
	--block: block;
	--table: table;
	--base-margin: 0 auto;
	--base-padding: 0;

	/****************flex*******************/
	--flex: flex;
	--wrap: wrap;

	/****************font*******************/
	--base-line: 2em;
	--font-size-xs: 0.75rem;
	--font-size-sm: 0.8rem;
	--font-size-md: 1rem;
	--font-size-lg: 1.125rem;
	--font-size-xl: 1.3125rem;
	--font-size-2xl: 1.5rem;
	--font-size-3xl: 2rem;
	--font-size-4xl: 2.652rem;
	--font-size-5xl: 4rem;
	--weight100: 100;
	--weight200: 200;
	--weight300: 300;
	--weight400: 400;
	--weight500: 500;
	--weight600: 600;
	--weight700: 700;
	--weight800: 800;
	--weight900: 900;
}

#footer__column {
	width: var(--base-width);
	background-color: var(--section-color);
	padding: 20px 0;
	z-index: 1;
}

body {
	background-color: var(--white);
}

#contents {
	width: var(--base-width);
	max-width: var(--cont-width);
	height: var(--base-height);
	margin: var(--base-margin);
}

#center {
	text-align: var(--center);
	margin: var(--base-margin);
}

.center {
	text-align: var(--center);
}

/********************************************header/top関連********************************************************/
#top-wrapper {
	background: url(../images/top_bg.jpg) center center/cover no-repeat;
	/*margin: 5px 0;*/
	margin: 0 0;
	padding: 100px 0 0 0;
}

.top-flex {
	margin: var(--base-margin);
	width: var(--base-width);
	max-width: var(--cont-width);
	display: var(--flex);
	flex-wrap: var(--wrap);
	justify-content: space-between;
	align-items: stretch;
}

.top-flex>div {
	width: 50%;
	position: var(--base-potision);
}

.top-flex>div img.photo {
	position: var(--child-potision);
	bottom: 0;
	right: 0;
	z-index: 1;
}

.top-flex>div>.first-title {
	background-color: var(--white);
	padding: 0 20px;
	display: var(--inline);
}

.top-flex>div>.first-title p {
	font-size: 3rem;
	font-weight: var(--weight900);
	color: var(--green);
}

.top-flex>div>.top-text-box {
	margin: 20px 0;
}

.top-flex>div>.top-text-box p {
	font-size: var(--font-size-2xl);
	font-weight: var(--weight500);
	color: var(--white);
}

.top-flex>div>.site-name {
	background-color: var(--green);
	padding: 0 20px;
	display: var(--inline);
}

.top-flex>div>.site-name p {
	font-size: 3rem;
	font-weight: var(--weight900);
	color: var(--white);
}

.top-flex>div>.reason-box {
	text-align: var(--center);
	width: 90%;
	padding-top: 30px;
}

.top-flex>div>.reason-box>.reson-title {
	display: var(--inline);
	background-color: var(--white);
	border-radius: 50px;
	padding: 0 50px;
}

.top-flex>div>.reason-box>.reson-title>p {
	font-size: var(--font-size-2xl);
	font-weight: var(--weight700);
	line-height: var(--base-line);
	position: var(--base-potision);
}

.top-flex>div>.reason-box>.reson-title>p span {
	font-size: var(--font-size-4xl);
	font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
	color: var(--green);
	position: var(--base-potision);
	top: 5px;
}

.top-flex>div>.reason-box>.reson-flex {
	margin: 30px auto 0;
	padding-bottom: 50px;
	width: var(--base-width);
	display: var(--flex);
	flex-wrap: var(--wrap);
	justify-content: space-between;
}

.top-flex>div>.reason-box>.reson-flex>div {
	width: 30%;
}

.top-flex>div>.reason-box>.reson-flex>div>.circle {
	display: inline-grid;
	color: var(--white);
	background-color: var(--orange);
	width: 180px;
	height: 180px;
	border-radius: 50%;
	text-align: var(--center);
	align-content: var(--center);
}

.top-flex>div>.reason-box>.reson-flex>div>.circle>div {
	font-size: var(--font-size-xl);
	font-weight: var(--weight700);
}

.top-flex>div>.reason-box>.reson-flex>div>.circle>div span {
	font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
	font-weight: bold;
	font-size: var(--font-size-3xl);
}

.top-flex>div>.top-right-wrapper {
	width: var(--base-width);
	position: var(--child-potision);
	padding: 0 10px;
	right: 0;
	bottom: 50px;
	box-sizing: border-box;
	z-index: 2;
}

.top-flex>div>.top-right-wrapper>.top-right-box {
	background-color: rgba(255, 255, 255, .7);
	border-radius: 15px;
	padding: 20px;
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex {
	width: var(--base-width);
	display: var(--flex);
	flex-wrap: var(--wrap);
	justify-content: space-between;
	align-items: var(--center);
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.left {
	width: 25%;
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.left img {
	width: var(--base-width);
	max-width: 170px;
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right {
	width: 75%;
	padding-left: 10px;
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right p.text-one {
	font-size: 2.45rem;
	font-weight: var(--weight800);
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right p.text-two {
	font-size: 2.9rem;
	font-weight: var(--weight800);
	line-height: 1em;
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right p.text-two span {
	color: var(--green);
}

.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right p.text-three {
	font-size: var(--font-size-lg);
}

/********************************************obi**************************************************************/
#obi,
#form-title {
	background: var(--green);
	padding: 20px 0;
}

#obi>.obi-box {
	width: var(--cont-width);
	margin: var(--base-margin);
	position: var(--base-potision);
}

#obi>.obi-box::before {
	content: "";
	background: url(../images/obi_photo.png);
	width: 170px;
	height: 265px;
	display: var(--block);
	position: var(--child-potision);
	left: 0;
	bottom: -21px;
}

#obi>.obi-box>.obi-title {
	margin: 0 0 0 180px;
	font-size: 1.8rem;
	font-weight: bold;
	color: var(--white);
}

#obi>.obi-box>.obi-flex {
	margin: 20px 250px 0 180px;
	display: var(--flex);
	justify-content: space-between;
}

#obi>.obi-box>.obi-flex>.obi-tel-time {
	padding: 0 0 0 85px;
	position: var(--base-potision);
}

#obi>.obi-box>.obi-flex>.obi-tel-time::before {
	content: "";
	background: url(../images/tel_icon.svg);
	-webkit-background-size: auto 100%;
	-moz-background-size: auto 100%;
	background-size: auto 100%;
	width: 70px;
	height: 70px;
	display: var(--inline);
	margin: auto;
	position: var(--child-potision);
	top: 0;
	bottom: 0;
	left: 0;
	fill: #42AFE3;
}

#obi>.obi-box>.obi-flex>.obi-tel-time>.obi-tel-number {
	color: var(--white);
	font-size: 3rem;
	font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
	font-weight: bold;
	letter-spacing: 0.05em;
}

#obi>.obi-box>.obi-flex>.obi-tel-time>.obi-tel-number a {
	color: var(--white);
}

#obi>.obi-box>.obi-flex>.obi-tel-time>.obi-time {
	font-size: var(--font-size-xl);
	letter-spacing: 0.05em;
	color: var(--white);
}

#obi>.obi-box>.obi-flex>.cta-btn {
	width: 350px;
	position: var(--base-potision);
	vertical-align: middle;
}

#obi>.obi-box>.obi-flex>.cta-btn img {
	width: 350px;
	vertical-align: middle;
}

#obi>.obi-box>.obi-flex>.cta-btn a {
	display: var(--block);
	line-height: 100px;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	transition: all .3s ease-out;
}

#obi>.obi-box>.obi-flex>.cta-btn a:hover {
	opacity: 0.6;
}

#obi>.obi-box>.obi-circle {
	background: var(--white);
	width: 210px;
	height: 210px;
	display: table;
	border-radius: 50%;
	position: var(--child-potision);
	bottom: 0;
	right: 0;
	border: var(--green) solid 4px;
	z-index: 10;
}

#obi>.obi-box>.obi-circle>.obi-circle-box {
	display: table-cell;
	vertical-align: middle;
	color: #000000;
	text-align: var(--center);
}

#obi>.obi-box>.obi-circle>.obi-circle-box>.obi-circle-title {
	font-size: 1.2rem;
	font-weight: bold;
}

#obi>.obi-box>.obi-circle>.obi-circle-box>.obi-circle-year {
	margin: 0;
	font-weight: bold;
}

#obi>.obi-box>.obi-circle>.obi-circle-box>.obi-circle-year strong {
	font-size: 2.4rem;
	font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
	color: var(--green);
}

#obi>.obi-box>.obi-circle>.obi-circle-box>.obi-circle-results {
	margin: 0;
	font-size: 10px;
	font-weight: bold;
}


/********************************************コンテンツ**************************************************************/
#cont-title {
	margin: var(--base-margin);
	text-align: var(--center);
	display: var(--table);
}

#cont-title>p {
	font-size: 2.85rem;
	font-weight: var(--weight500);
	color: var(--white);
	display: table-cell;
}

#cont-title>p span {
	background-color: var(--green);
	border: 1px solid var(--white);
	margin: 0;
	padding: 8px 10px;
}

#cont-text {
	margin: 30px 0;
	text-align: var(--center);
}

#cont-text2 {
	margin: 10px 0;
	text-align: var(--center);
}

#cont-text p,
#cont-text2 p {
	font-size: var(--font-size-xl);
	line-height: var(--base-line);
}

#flex-title {
	text-align: var(--center);
	margin-bottom: 50px;
}

#flex-title>p {
	font-size: var(--font-size-3xl);
	font-weight: var(--weight700);
}

#flex-title>p span {
	font-size: var(--font-size-4xl);
	font-weight: var(--weight700);
}

.banner {
	text-align: var(--center);
}

.banner img {
	width: var(--base-width);
}

#charm-text-box {
	background-color: #f1f1f1;
	padding: 20px;
}

#charm-text-box p {
	line-height: 1.65em;
}

#qa-box {
	margin: 50px 0;
}

#qa-box>.qa {
	border-bottom: .5px dotted #999999;
	margin-bottom: 20px;
}

#qa-box>.qa:last-child {
	margin-bottom: 0;
}

#qa-box>.qa>p.q-text {
	font-size: var(--font-size-2xl);
	position: var(--base-potision);
	margin-bottom: 20px;
	padding-left: 50px;
	color: red;
}

#qa-box>.qa>p.q-text:before {
	content: 'Q';
	color: var(--white);
	background: var(--green);
	width: 40px;
	height: 40px;
	display: var(--table);
	border-radius: 50%;
	font-size: var(--font-size-2xl);
	text-align: var(--center);
	position: var(--child-potision);
	top: 0;
	left: 0;
}

#qa-box>.qa>p.a-text {
	font-size: var(--font-size-md);
	position: var(--base-potision);
	margin-bottom: 20px;
	padding-left: 50px;
}

#qa-box>.qa>p.a-text:before {
	content: 'A';
	color: var(--white);
	background: var(--orange);
	width: 40px;
	height: 40px;
	display: var(--table);
	border-radius: 50%;
	font-size: var(--font-size-2xl);
	text-align: var(--center);
	position: var(--child-potision);
	top: 0;
	left: 0;
}

/********************************************flex**************************************************************/
#main-flex {
	display: var(--flex);
	flex-wrap: var(--wrap);
	justify-content: space-between;
	align-items: stretch;
}

#main-flex>div {
	width: 30%;
	position: var(--base-potision);
	background-color: var(--white);
	border-radius: 5px;
	border: 2px solid var(--green);
	margin-bottom: 50px;
	padding: 30px;
	text-align: var(--center);
}

#main-flex>div>span img {
	width: var(--base-width);
	max-width: 400px;
}

#main-flex>div>p {
	font-size: var(--font-size-2xl);
	font-weight: var(--weight600);
	margin-top: 5px;
}

#main-flex>div>.flex-number {
	position: var(--child-potision);
	top: -15px;
	left: -15px;
	display: inline-grid;
	color: var(--white);
	background-color: var(--green);
	width: 60px;
	height: 60px;
	border-radius: 50%;
	text-align: var(--center);
	align-content: var(--center);
}

#main-flex>div>.flex-number>div {
	font-size: var(--font-size-3xl);
	font-weight: var(--weight700);
	font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
}


#charm-flex {
	display: var(--flex);
	flex-wrap: var(--wrap);
	justify-content: flex-start;
	align-items: var(--center);
}

#charm-flex>div {
	width: auto;
}

#charm-flex>.item1 {
	width: 200px;
}

#charm-flex>.item2 {
	width: auto;
	margin-left: 20px;
}

#charm-flex>.item3 {
	margin-left: auto;
}

#charm-flex>div.charm-logo img {
	width: var(--base-width);
	max-width: 200px;
}

#charm-flex>div.charm-text {
	font-size: var(--font-size-5xl);
	font-weight: var(--weight800);
}

#charm-flex>div.charm-text span {
	font-size: 5rem;
}

#charm-flex>div.charm-img img {
	width: var(--base-width);
	max-width: 240px;
	vertical-align: bottom;
}

#case-flex {
	display: var(--flex);
	flex-wrap: var(--wrap);
	justify-content: space-between;
	align-items: stretch;
	margin: 50px 0;
}

#case-flex>div {
	width: 23%;
}

#case-flex>div>span img {
	width: var(--base-width);
}

#case-flex>div>.case-number {
	font-size: var(--font-size-2xl);
	font-weight: var(--weight700);
	letter-spacing: .2em;
}

#case-flex>div>.case-number span {
	font-size: var(--font-size-4xl);
	font-family: Bahnschrift, 'DIN Alternate', 'Franklin Gothic Medium', 'Nimbus Sans Narrow', sans-serif-condensed, sans-serif;
	color: var(--green);
	letter-spacing: 0;
}

#case-flex>div>p {
	position: var(--base-potision);
	font-size: var(--font-size-2xl);
	font-weight: var(--weight600);
	margin-top: 10px;
}

#case-flex>div>p:after {
	content: '▶';
	position: var(--child-potision);
	color: var(--green);
	font-size: var(--font-size-xs);
	bottom: 0;
	right: 0;
}


/******************************footer*********************************/
.footer-flex {
	width: var(--base-width);
	max-width: var(--cont-width);
	margin: 0 auto 50px;
	display: var(--flex);
	flex-wrap: var(--wrap);
	justify-content: flex-end;
	align-items: top;
}

.footer-flex>div {
	width: auto;
}

.footer-flex>div:first-child {
	margin-right: auto;
}

.footer-flex>div img {
	width: var(--base-width);
	max-width: 200px;
}

.footer-flex>div>ul {
	margin: 0 15px;
	text-align: var(--left);
}

.footer-flex>div>ul>li {
	font-size: var(--font-size-sm);
	line-height: var(--base-line);
	padding-left: 1em;
	text-indent: -1em;
}

.footer-flex>div>ul>li:before {
	content: '・';
}

.footer-flex>div>ul>li a {
	color: black;
}

.footer-flex>div>ul>li a:hover {
	color: #999999;
}

#fkiyaku {
	text-align: var(--center);
}

#fkiyaku>ul>li {
	font-size: .4rem;
}

#fkiyaku>ul>li img {
	width: var(--base-width);
	max-width: 200px;
}

@media only screen and (min-width: 300px) and (max-width: 767px) {
	#contents {
		padding: 0 10px;
	}

	/********************************************header/top関連********************************************************/
	#top-wrapper {
		margin: 5px 0;
		padding: 100px 10px 0;
	}

	.top-flex {
		margin: var(--base-margin);
		width: var(--base-width);
		max-width: var(--cont-width);
		display: var(--flex);
		flex-wrap: var(--wrap);
		justify-content: space-between;
		align-items: stretch;
	}

	.top-flex>div {
		width: var(--base-width);
		position: var(--base-potision);
	}

	.top-flex>div img.photo {
		width: 300px;
		position: var(--base-potision);
		vertical-align: bottom;
		bottom: 0;
		right: 0;
		z-index: 1;
		text-align: var(--right);
	}

	.top-flex>div>.first-title {
		padding: 0 10px;
	}

	.top-flex>div>.first-title p {
		font-size: var(--font-size-2xl);
	}

	.top-flex>div>.top-text-box {
		margin: 10px 0;
	}

	.top-flex>div>.top-text-box p {
		font-size: var(--font-size-md);
	}

	.top-flex>div>.site-name {
		margin: 0 auto;
		padding: 5px 0;
		display: var(--block);
		text-align: var(--center);
	}

	.top-flex>div>.site-name p {
		font-size: var(--font-size-2xl);
	}

	.top-flex>div>.reason-box {
		width: var(--base-width);
		padding-top: 10px;
		position: var(--base-potision);
	}

	.top-flex>div>.reason-box>.reson-title {
		border-radius: 25px;
		padding: 0 30px;
		position: var(--base-potision);
	}

	.top-flex>div>.reason-box>.reson-title>p {
		font-size: var(--font-size-xl);
	}

	.top-flex>div>.reason-box>.reson-title>p span {
		font-size: var(--font-size-3xl);
		position: var(--base-potision);
		top: 3px;
	}

	.top-flex>div>.reason-box>.reson-flex {
		margin: 10px auto 0;
		padding-bottom: 10px;
	}

	.top-flex>div>.reason-box>.reson-flex>div {
		width: calc(100%/3);
	}

	.top-flex>div>.reason-box>.reson-flex>div>.circle {
		display: inline-grid;
		color: var(--white);
		background-color: var(--orange);
		width: 110px;
		height: 110px;
		border-radius: 50%;
		text-align: var(--center);
		align-content: var(--center);
	}

	.top-flex>div>.reason-box>.reson-flex>div>.circle>div {
		font-size: var(--font-size-sm);
		font-weight: var(--weight300);
	}

	.top-flex>div>.top-right-wrapper {
		padding: 0;
		bottom: 10px;
		text-align: var(--center);
	}

	.top-flex>div>.top-right-wrapper>.top-right-box {
		padding: 10px;
	}

	.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex {
		width: var(--base-width);
		display: var(--flex);
		flex-wrap: var(--wrap);
		justify-content: space-between;
		align-items: var(--center);
	}

	.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.left {
		width: var(--base-width);
		text-align: var(--center);
	}

	.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.left img {
		width: var(--base-width);
		max-width: 70px;
	}

	.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right {
		width: var(--base-width);
		padding-left: 0;
	}

	.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right p.text-one {
		font-size: var(--font-size-xl);
	}

	.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right p.text-two {
		font-size: var(--font-size-3xl);
		font-weight: var(--weight800);
		line-height: 1em;
	}

	.top-flex>div>.top-right-wrapper>.top-right-box>.top-right-flex>.right p.text-three {
		font-size: var(--font-size-xs);
	}

	/********************************************obi**************************************************************/
	#obi,
	#form-title {
		background: var(--green);
		padding: 10px;
	}

	#obi>.obi-box {
		width: var(--base-width);
		margin: var(--base-margin);
		position: var(--base-potision);
	}

	#obi>.obi-box::before {
		background: none;
	}

	#obi>.obi-box>.obi-title {
		margin: 0;
		font-size: var(--font-size-md);
		font-weight: var(--weight400);
	}

	#obi>.obi-box>.obi-flex {
		margin: 0;
		display: var(--block);
		text-align: var(--center);
	}

	#obi>.obi-box>.obi-flex>.obi-tel-time {
		padding: 0;
		position: var(--base-potision);
		text-align: var(--center);
	}

	#obi>.obi-box>.obi-flex>.obi-tel-time::before {
		content: "";
		background: url(../images/tel_icon.svg);
		-webkit-background-size: auto 100%;
		-moz-background-size: auto 100%;
		background-size: auto 100%;
		width: 40px;
		height: 40px;
		display: var(--inline);
		margin: auto;
		position: var(--child-potision);
		top: 0;
		left: 0;
		fill: #42AFE3;
	}

	#obi>.obi-box>.obi-flex>.obi-tel-time>.obi-tel-number {
		font-size: var(--font-size-4xl);
		font-weight: var(--weight500);
		letter-spacing: 0.01em;
	}

	#obi>.obi-box>.obi-flex>.obi-tel-time>.obi-tel-number a {
		color: var(--white);
	}

	#obi>.obi-box>.obi-flex>.obi-tel-time>.obi-time {
		font-size: var(--font-size-md);
		letter-spacing: 0.01em;
	}

	#obi>.obi-box>.obi-flex>.cta-btn {
		width: var(--base-width);
		position: var(--base-potision);
		vertical-align: bottom;
	}

	#obi>.obi-box>.obi-flex>.cta-btn img {
		width: var(--base-width);
		vertical-align: middle;
	}

	#obi>.obi-box>.obi-flex>.cta-btn a {
		line-height: 80px;
	}

	#obi>.obi-box>.obi-flex>.cta-btn a:hover {
		opacity: 0.6;
	}

	#obi>.obi-box>.obi-circle {
		display: none;
	}


	/********************************************コンテンツ**************************************************************/
	#cont-title>p {
		font-size: var(--font-size-xl);
	}

	#cont-title>p span {
		padding: 5px 6px;
	}

	#cont-text {
		margin: 15px 0;
	}

	#cont-text2 {
		margin: 3px 0;
	}

	#cont-text p {
		font-size: var(--font-size-md);
		line-height: 1.4em;
		text-align: var(--left);
	}

	#cont-text2 p {
		font-size: var(--font-size-xs);
		font-weight: var(--weight200);
		line-height: 1em;
		text-align: var(--left);
	}

	#flex-title {
		text-align: var(--center);
		margin-bottom: 20px;
	}

	#flex-title>p {
		font-size: var(--font-size-xl);
	}

	#flex-title>p span {
		font-size: var(--font-size-2xl);
	}

	#charm-text-box {
		padding: 10px;
	}

	#charm-text-box p {
		font-size: var(--font-size-sm);
		line-height: 1.45em;
	}

	#qa-box {
		margin: 20px 0;
	}

	#qa-box>.qa {
		margin-bottom: 10px;
	}

	#qa-box>.qa>p.q-text {
		font-size: var(--font-size-md);
		margin-bottom: 20px;
		padding-left: 40px;
	}

	#qa-box>.qa>p.q-text:before {
		width: 28px;
		height: 28px;
		font-size: var(--font-size-md);
	}

	#qa-box>.qa>p.a-text {
		font-size: var(--font-size-xs);
		margin-bottom: 20px;
		padding-left: 40px;
		text-align: justify;
	}

	#qa-box>.qa>p.a-text:before {
		width: 28px;
		height: 28px;
		font-size: var(--font-size-md);
	}

	/********************************************flex**************************************************************/
	#main-flex>div {
		/*width: 48%;*/
		width: var(--base-width);
		border: 1px solid var(--green);
		margin-bottom: 20px;
		padding: 20px 10px 10px;
	}

	#main-flex>div>p {
		font-size: var(--font-size-md);
		font-weight: var(--weight300);
		margin-top: 10px;
	}

	#main-flex>div>.flex-number {
		position: var(--child-potision);
		top: -15px;
		left: -5px;
		display: inline-grid;
		color: var(--white);
		background-color: var(--green);
		width: 30px;
		height: 30px;
		border-radius: 50%;
		text-align: var(--center);
		align-content: var(--center);
	}

	#main-flex>div>.flex-number>div {
		font-size: var(--font-size-xl);
		font-weight: var(--weight700);
	}


	#charm-flex {
		display: var(--block);
	}

	#charm-flex>div {
		width: auto;
		text-align: var(--center);
	}

	#charm-flex>.item1 {
		width: var(--base-width);
	}

	#charm-flex>.item2 {
		width: var(--base-width);
		margin-left: 0;
	}

	#charm-flex>.item3 {
		margin-left: auto;
	}

	#charm-flex>div.charm-logo img {
		width: var(--base-width);
		max-width: 100px;
	}

	#charm-flex>div.charm-text {
		font-size: var(--font-size-xl);
		font-weight: var(--weight800);
	}

	#charm-flex>div.charm-text span {
		font-size: var(--font-size-3xl);
	}

	#charm-flex>div.charm-img img {
		width: var(--base-width);
		max-width: 200px;
		vertical-align: bottom;
	}

	#case-flex {
		margin: 20px 0;
	}

	#case-flex>div {
		width: 48%;
		margin-bottom: 20px;
	}

	#case-flex>div>span img {
		width: var(--base-width);
	}

	#case-flex>div>.case-number {
		font-size: var(--font-size-2xl);
		font-weight: var(--weight700);
		letter-spacing: .1em;
	}

	#case-flex>div>.case-number span {
		font-size: var(--font-size-3xl);
	}

	#case-flex>div>p {
		font-size: var(--font-size-md);
		font-weight: var(--weight400);
		margin-top: 0;
	}

	#case-flex>div>p:after {
		font-size: .6rem;
	}


	/******************************footer*********************************/
	.footer-flex {
		margin: 0 auto 20px;
		padding: 0 10px;
		display: var(--block);
	}

	.footer-flex>div {
		text-align: var(--left);
	}

	.footer-flex>div:first-child {
		margin-right: auto;
	}

	.footer-flex>div img {
		width: var(--base-width);
		max-width: 100px;
	}

	.footer-flex>div>ul {
		margin: 0;
		text-align: var(--left);
	}

	.footer-flex>div>ul>li {
		font-size: var(--font-size-sm);
		line-height: var(--base-line);
		padding-left: 1em;
		text-indent: -1em;
	}

	.footer-flex>div>ul>li:before {
		content: '・';
	}

	#fkiyaku {
		text-align: var(--center);
	}

	#fkiyaku>ul>li {
		font-size: .4rem;
	}

	#fkiyaku>ul>li img {
		width: var(--base-width);
		max-width: 200px;
	}
}