@charset "utf-8";
:root{
	--wide: 1275px;
	/*Primary*/
	--Red1:#fa000f;
	--Red2:#cc0000;
	--White:#ffffff;
	--Gray1:#f4f4f4;
	--Gray2:#d9d9d9;
	--Gray3:#b3b3b3;
	--Gray4:#737373;
	--Gray5:#4d4d4d;
	--Gray6:#222222;
	--Black:#0c0c0c;
	/*Secondary*/
	--Orange1: #fdc796;
	--Orange2: #fa6900;
	--Orange3: #c85400;
	--Yellow1: #fdec96;
	--Yellow2: #fad200;
	--Yellow3: #967e00;
	--Pink1: #fd96d4;
	--Pink2: #fa00a5;
	--Pink3: #96005a;
	--Purple1: #d096fd;
	--Purple2: #9b00fa;
	--Purple3: #540096;
	--Blue1: #96c5fd;
	--Blue2: #0064fa;
	--Blue3: #004596;
	--Teal1: #96f0fd;
	--Teal2: #00dcfa;
	--Teal3: #008496;
	--Green1: #96fdcc;
	--Green2: #00fa82;
	--Green3: #00964e;
	--Red1_20_Tint: #ffcbce;
	--Red1_40_Tint: #ff979d;
	--Red1_60_Tint: #ff636c;
	--Red1_20_Dark: #bb000b;
	--Red1_40_Dark: #7d0008;
}
.Section,
.Section * {
	box-sizing: border-box;
}
div.Section.Gray {
	background: var(--Gray1);
}
div.Section:before {
	content: "";
	display: block;
	clear: both;
	float: none;
}
div.Section {
	width: 100%;
	padding: 1.5em 0;
}
.Inner {
width: var(--wide);
margin: auto;
padding: 2em 0;
word-break: break-word;
}
.Section a {
	word-break: break-all;
}
.TextStyle1 {
	margin: 0;
	font-size: 1em;
}
.Inner .TextStyle1 {
	font-size: 18px;
	margin-bottom: 2em;
	line-height: 1.8;
}
.Solution .Inner .TextStyle1 {
	font-size: .95em;
}
.Section h3 {
	margin: 0;
}
.PageTitleStyle3 {
	background: url(/-/media/ind/fukushinomori/costmg/image/bg_image.svg) no-repeat 102% 0% / 550px, transparent linear-gradient(104deg, #F5FCAC 0%, #0FBEB8 100%) 0% 0% no-repeat padding-box;
	height: 390px;
	margin-bottom: 0;
}
.PageTitleStyle3 .Inner h1 {
	background: none;
}
.PageTitleStyle3 h1 {
	width: var(--wide);
	font-size: 2.2em;
	font-weight: bold;
	line-height: 1.2;
	margin: 0 auto;
	padding: .25em 0;
	text-shadow: 0 0 5px rgba(255, 255, 255, .8);
}
.PageTitleStyle3 .Lead {
	font-size: 1.2em;
	font-weight: bold;
}
.PageTitleStyle3 .Inner {
	display: flex;
	max-width: var(--wide);
	margin: auto;
	height: 100%;
	gap: 1em;
	padding: 0;
}
.PageTitleStyle3 .Inner .Row {
	max-width: 50%;
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: center;
	gap: 1em;
	flex: 3;
}
.Flexbox {
	display: flex;
	gap: 1em;
	margin: 1em auto;
}
.Column {
	flex-direction: column;
	flex: 1;
}
.Between {
	justify-content: space-between;
}
.JcCenter {
	justify-content: center;
}
.Start {
	align-items: start;
}
.End {
	align-items: end;
}
.Stch {
	align-items: stretch;
}
.Flexbox li {
	display: flex;
	gap: 1em;
}
.Three {
	flex-wrap: wrap;
}
.Three li {
	display: block;
	flex: 1 0 auto;
	width: min-content;
	/*max-width: min-content;*/
	background: #fff;
}
.Three .Flexbox {
	margin: 0;
	gap: 0;
}
.Three .Flexbox li {
	width: auto;
	font-weight: bold;
}
.Three .Top {
	padding: 1em;
	background: #2CB9AF;
	flex: auto;
}
.Three .Top h3 {
	color: #1A6762;
	background: #fff;
    max-width: 10em;
    min-height: 5em;
    align-items: center;
    padding: 1em;
    display: flex;
    border-radius: 20px 20px 20px 0;
    padding: 1em 1.5em;
    text-align: left;
    margin: 0 0 0 auto;
	position: relative;
	z-index: 0;
}
.Three .Bottom {
	padding: 1em;
	max-width: 13em;
	margin: 0 0 0 auto;
	background: #fff;
	display: flex;
	align-items: center;
}
.Three .Bottom a:link,
.Three .Bottom a:visited {
	background-image: none!important;
	text-decoration: none;
	color: #000;
}
.Three li ul.Flexbox.Column {
	min-height: 260px;
}
.Three li ul.Flexbox.Column:before {
	content: "";
    display: block;
    position: absolute;
    margin: .5em 5em;
	z-index: 0;
}
.Three li:nth-of-type(1) ul.Flexbox.Column:before{
    content: url(/-/media/ind/fukushinomori/costmg/image/icon_people01.svg);
	width: 80px;
	text-align: center;
}
.Three li:nth-of-type(2) ul.Flexbox.Column:before{
    content: url(/-/media/ind/fukushinomori/costmg/image/icon_people02.svg);
}
.Three li:nth-of-type(3) ul.Flexbox.Column:before{
    content: url(/-/media/ind/fukushinomori/costmg/image/icon_people03.svg);
	width: 80px;
	text-align: center;
}
.Button a[data-target],
.Button a:link,
.Button a:visited {
	display: flex;
	font-size: 1.1em;
	padding: .8em;
	color: #000;
	font-weight: bold;
	max-width: 330px;
	background: #2CB9AF;
	transition: .08s ease-in;
	margin: auto;
	justify-content: center;
	text-decoration: none;
	border-radius: 5px;
	/*box-shadow: 0 0 10px rgba(0,0,0,.3);*/
	box-sizing: border-box;
}
.Contact.Button a:link,
.Contact.Button a:visited {
	color: #fff;
	text-shadow: 1px 1px #125a55, -1px -1px #125A55;
}
.Button a:hover,
.Button a:active {
	background: #37e2d6;
}
.Solution .Button a[data-target],
.Solution .Button a:link,
.Solution .Button a:visited {
	display: flex;
	align-items: center;
	gap: 1em;
	background: #fff;
	border: 3px solid #2CB9AF;
	min-width: 330px;
}
.Solution .Button a[data-target]:hover,
.Solution .Button a:hover,
.Solution .Button a:active {
	background: #ccfaf7;
	cursor: pointer;
}
.Solution .Button a::after {
	content: "";
	background: url(/-/media/ind/fukushinomori/costmg/image/icon_link_arrow.svg) no-repeat center;
	height: 33px;
	width: 23px;
}
.Solution .Button a[data-target]::after {
	background: url(/-/media/ind/fukushinomori/costmg/image/icon_modal.svg) no-repeat center;
	height: 33px;
	width: 33px;
}
.Grid4 .Section.Solution .Inner {
	border: 1px solid #ccc;
	padding: 1em;
	border-radius: 10px;
}
.Section.Solution .Row {
    flex: 0 1 auto;
}
.Section.Solution .Row+.Row {
	flex: 1;
}
.Section>.Inner h2 {
	text-align: left;
	font-weight: bold;
	font-size: 1.8em;
	background: none;
	display: flex;
	align-items: center;
	margin: 0;
}
.Section>.Inner h2 span::before {
	content: "";
	background: url(/-/media/ind/fukushinomori/costmg/image/icon_h2.svg) no-repeat center;
	min-width: 54px;
	width: 54px;
	height: 80px;
	display: block;
	margin: 0;
}
.Section>.Inner h2 span {
	background: transparent;
	/*font-weight: normal;*/
	color: #000;
	padding: 0;
	font-size: .8em;
	/*display: contents;*/
	display: flex;
	align-items: center;
}
.Section>.Inner h2 img {
    margin: 0 0 0 auto;
	max-width: 200px;
}
.Point {
    background: #FCFEEE;
    border-radius: 10px;
    padding: 1em;
    display: flex;
    flex-direction: column;
    gap: 1em;
    margin: 0 0 1em;
}
.Gray .Point {
    background: #fff;
}
.Point li {
    list-style: disc inside;
    font-size: 1em;
    font-weight: bold;
    color: #333;
	display: flex;
	gap: 1em;
}
.Point li::before {
    content: "ポイント！";
    background: #E34A4A;
    font-size: .5em;
    min-width: 80px;
    border-radius: 14px;
    text-align: center;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.Costcut .Solution h3 {
	background: transparent;
	color: #1A6762;
	text-align: left;
	padding: .5em 0;
}
.Section.Contact>.Inner h2 {
	display: block;
}
.Section.Contact>.Inner h2,
.Section.Contact .Inner {
	text-align: center;
}

/*=====================================================
Modal Window Setting
=====================================================*/

.modal-content .Flexbox.Column {
	flex-direction: column;
}
.modal-content .TextStyle1 {
	font-size: 1.2em;
	font-weight: bold;
	background: #FFE9CC;
	border-radius: 10px;
	padding: 1em;
}
.modal-content img {
	width: 100%;
	height: auto;
}


@media screen and (max-width: 994px) {
	.JS #Contents,
	.JS .GridSet,
	.JS .Grid4 {
		padding:0;
		margin: 0;
		width: auto;
	}
	.JS .Inner {
		padding: 1em;
		width: auto;
	}
	.JS .Flexbox.Three {
		flex-direction: column;
		width: 80%;
	}
	.JS .Three li {
		max-width: inherit;
		width: auto;
	}
	.JS .Three li.Bottom {
		max-width: 13em;
	}
	.JS .Grid4 .Section .Three .Top h3 {
		max-width: 80%;
	}
	.JS .Three li ul.Flexbox.Column:before {
    margin: .5em;
	}
	.JS .Three li:nth-of-type(1) ul.Flexbox.Column:before {
		width: 15%;
	}
	.JS .Three li:nth-of-type(3) ul.Flexbox.Column:before {
		width: 15%;
	}
	.JS .Three .Bottom {
		margin: 0 0 0 20%
	}
	.JS .Section.Solution {
		padding: 1em;
	}
	.JS .Section.Solution .Row+.Row {
		flex: 1 1 auto;
	}
}
@media screen and (max-width: 767px) {
	.JS br.PC {
		display: none;
	}
	.JS .PageTitleStyle3 {
		height: auto;
		background: url(/-/media/ind/fukushinomori/costmg/image/bg_image.svg) no-repeat 104% 120px / 380px, transparent linear-gradient(104deg, #F5FCAC 0%, #0FBEB8 100%) 0% 0% no-repeat padding-box;
	}
	.JS .PageTitleStyle3 .Inner {
		flex-wrap: wrap;
		flex-direction: column;
	}
	.JS .PageTitleStyle3 h1 {
		margin: 0;
		padding: 0;
		width: auto;
	}
	.JS .Flexbox {
		flex-direction: column;
	}
	.JS .Button a:link, .JS .Button a:visited {
		width: calc((100vw / 2) - 2em);
	}
	.JS .PageTitleStyle3 .Inner .Row+.Row {
		flex-direction: row;
		min-height: 200px;
	}
	.PageTitleStyle3 .Inner .Row {
		width: 100%;
		max-width: inherit;
	}
	.JS .Flexbox.Column li {
		flex-wrap: wrap;
	}
	.JS .Flexbox.Column .DotList li {
		flex-wrap: nowrap;
	}
	.JS .Flexbox.Column {
		flex-direction: column;
	}
	.JS .Flexbox.Column .Row {
		flex: auto;
	}
	.JS .Flexbox.Column .Row+.Row {
		text-align: center;
	}
	.JS .Section.Bg .modal-content .Flexbox li {
		flex-wrap: wrap;
	}
	.JS .Three li {
		width: auto;
		display: flex;
		flex-direction: column;
	}
	.JS .Overflow {
		width: 100%;
	}
	.JS .Section>.Inner h2 {
		flex-direction: column;
	}
	.JS .Section>.Inner h2 img {
		margin: auto;
	}
	.JS .Grid4 .Section h3 {
        margin: 1em 0;
	}
	.JS .Grid4 .Section .Three .Top h3 {
		margin: 0 0 0 20%;
	}
}
@media screen and (max-width: 579px) {
	.JS .PageTitleStyle3 {
		background: url(/-/media/ind/fukushinomori/costmg/image/bg_image.svg) no-repeat 104% 225px / 380px, transparent linear-gradient(104deg, #F5FCAC 0%, #0FBEB8 100%) 0% 0% no-repeat padding-box;
	}
	JS .Flexbox.Three {
        flex-direction: column;
        width: auto;
	}
}
.BoxPatternC {
	border-radius: 10px;
	padding: 1.5em;
	box-sizing: border-box;
	border: none;
	}
	.BoxPatternC.Gray {
	background: transparent;
	}
	.BoxPatternC.Gray .Inner {
	background: #F0F0F0;
	border: none;
	border-radius: 5px;
	padding: 1em 1.5em;;
	display: flex;
	flex-flow: column;
	justify-content: space-between;
	}
	.BoxPatternC.Gray .Inner div {
	background: #fff;
	border-radius: 5px;
	padding: 1em;
	margin: 0 0 1em
	}
	#Contents .BoxPatternC.Gray .Inner h5 {
	background: transparent;
	margin: 0;
	justify-content: center;
	font-size: 1em;
	}
	#Contents .BoxPatternC.Gray .Inner .Contact a:link,
	#Contents .BoxPatternC.Gray .Inner .Contact a:visited {
	width: 10em;
	padding: .5em 1em;
	transition: .08s ease-in;
	}
	#Contents .BoxPatternC.Gray .Inner .Contact a:hover {
	mix-blend-mode:luminosity;
	}
	.BoxPatternC.Gray span {
	color: #000;
	font-size: 1em;
	border: none;
	border-radius: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
	width: 1.5em;
	height: 1.5em;
	padding: .15em;
	padding: .5em;
	margin: 0 0 0 auto;
	cursor: pointer;
	transition: .08s ease-in;
	background: rgba(255,255,255,.2);
	}
	.BoxPatternC.Gray span:hover {
	background: rgba(255,255,255,.5);
	}
	.BoxPatternC.Gray span a:link,
	.BoxPatternC.Gray span a:hover,
	.BoxPatternC.Gray span a:visited {
	text-decoration: none;
	color: #157EBF;
	}
	.modal-open {
	display: block;
	cursor: pointer;
	}
	.modal-content {
	width: 100vw;
	height: 100vh;
	position: fixed;
	display: none;
	background: transparent;
	border: none;
	z-index: 10;
	box-sizing: border-box;
	align-items: center;
	justify-content: center;
	}
	.modal-content .Inner {
	max-width: var(--wide);
	display: flex;
	box-shadow: 0 5px 20px 0 rgba(0,0,0,0.5);
	z-index: 10;
	box-sizing: border-box;
	}
	.modal-overlay {
	z-index: 2;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 120%;
	background-color: rgba(0,0,0,0.75);
	backdrop-filter: blur(5px);
	}

