@charset "UTF-8";


#hero {
	background:url(../../img/service/bg.jpg) no-repeat center center;
	background-size:cover;
	padding:50px 0 70px;
}

#hero .innr {
	position:relative;
	width:750px;
	margin:0 auto;
}

#hero .ill {
	margin-top:50px;
}



#hero h2 {
	font-size:32px;
}


#hero .flexbox {
	justify-content:center;
	margin-top:30px;
}

#hero .item {
	width:30%;
	margin-top:20px;
}

#hero .item.i04,
#hero .item.i05 {
	width:40%;
}

#hero .item p {
	font-size:13px;
	margin-top:.5em;
	color:#333;
	white-space:nowrap;
}

.section {
	padding:100px 0;
}

.section .innr {
	position:relative;
	width:850px;
	margin:0 auto;
}

.section h1 {
	display:inline-block;
	font-size:36px;
	background-color:#9e8473;
	border-radius:999px;
	padding:.4em 1em;
	line-height:1em;
	color:#fff;
}

.section .logo {
	margin:20px auto;
	margin-top:70px;
	display:block;
	box-sizing:border-box;
	padding-top:20px;
	width:265px;
	height:265px;
	border-radius:50%;
	background-color:#fff;
	text-align:center;
}

.section .logo img {
	width:70%;
	margin-left:10px;
}

#manmaru.section .logo {
	padding-top:30px;
	margin-top:0;
}

#manmaru.section .logo img {
	margin-left:20px;
}

.section .cpy {
	font-size:18px;
	margin-top:2em;
	line-height:1.8em;
}

.section .cpy span {
	background:linear-gradient(transparent 60%, #befcfc 30%);
	display:inline;
	padding:0 1px 0px;
}

#manmaru .cpy span {
	background:linear-gradient(transparent 60%, #d3fcc3 30%);
}

.section .active {
	margin-top:100px;
}

.section .active dl {
	display:flex;
	justify-content:space-between;
}

.section .active dl dt {
	display:flex;
	align-items:center;
	font-size:34px;
}

.section .active dl dd {
	font-size:15px;
	text-align:left;
	line-height:2em;
	width:79%;
}

.section hr {
	position:relative;
	background:none;
	border:none;
	margin-top:40px;
}

.section hr::after {
	content:"";
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	height:3px;
	background-image:radial-gradient(circle, #9e8473 25%, transparent 25%);
	background-size:10px 3px;
}

.section .flow {
	position:relative;
	border:20px solid #d2eabe;
	border-radius:70px;
	background-color:#fff;
	padding:60px 0;
	margin-top:100px;
}

#manmaru .flow {
	margin-top:50px;
}

.section .flow h2 {
	color:#5ebc57;
	font-size:34px;
}

.section .flow dl {
}

.section .flow dl::after {
	display:block;
	margin:20px auto;
	content:"";
	background:url(../../img/mrk_down.svg) no-repeat;
	background-size:100% auto;
	width:45px;
	height:30px;
}

.section .flow dl.last::after {
	display:none;
}

.section .flow dl dt {
	font-size:20px;
	background-color:#9e8473;
	color:#fff;
	border-radius:999px;
	line-height:1em;
	padding:.4em 0;
	max-width:400px;
	margin:0 auto;
}

.section .flow dl dd {
	color:#333;
	font-size:16px;
	margin-top:1em;
	line-height:1.8em;
}

#manmaru .flow dl dd.mrk {
	margin-top:30px;
}

.section .contact {
	display:inline-block;
	background-color:#e2f2f7;
	color:#3fa9f5;
	border:5px solid #91d4f4;
	border-radius:999px;
	padding:1.5em 2em;
	margin-top:30px;
}

#tanemaru .contact,
#manmaru .contact {
	background-color:#f9e8f9;
	color:#db86f7;
	border:5px solid #f2b7f7;
}

.section .flow .img {
	position:absolute;
	top:-100px;
	left:-150px;
}

#manmaru .flow .img {
	position:absolute;
	top:auto;
	left:auto;
	bottom:-80px;
	right:-180px;
}


#consultation {
	background-color:#fffaea;
}

#tanemaru {
	background-color:#edf9d7;
}

#manmaru {
	background-color:#fbf0fc;
}

.txtbox {
	position:relative;
	z-index:2;
}

.ill {
	display:block;
}

#hero .innr::before,
#hero .innr::after,
.section .innr::before,
.section .innr::after,
.section .ill::before,
.section .ill::after {
	content:"";
	display:block;
	position:absolute;
	background-size:100% auto;
}

#hero .innr::before {
	top:-130px;
	left:-200px;
	background-image:url(../../img/service/dot_01.svg);
	width:375px;
	height:560px;
}

#hero .innr::after {
	top:150px;
	right:-200px;
	background-image:url(../../img/service/dot_02.svg);
	width:362px;
	height:330px;
}


#consultation .innr::before {
	top:300px;
	left:-220px;
	background-image:url(../../img/service/dot_03.svg);
	width:243px;
	height:221px;
}

#consultation .innr::after {
	top:200px;
	right:-200px;
	background-image:url(../../img/service/dot_01.svg);
	width:375px;
	height:560px;
}

#tanemaru .innr::before {
	top:370px;
	left:-200px;
	background-image:url(../../img/service/dot_03.svg);
	width:243px;
	height:221px;
}

#tanemaru .innr::after {
	top:350px;
	right:-200px;
	background-image:url(../../img/service/dot_01.svg);
	width:375px;
	height:560px;
}

#tanemaru .i01::before {
	top:750px;
	right:-460px;
	background-image:url(../../img/service/dot_05.svg);
	width:645px;
	height:1102px;
}

#tanemaru .i01::after {
	top:1760px;
	right:-122px;
	background-image:url(../../img/service/dot_04.svg);
	width:176px;
	height:290px;
}

#tanemaru .i02::before {
	top:2000px;
	left:-250px;
	background-image:url(../../img/service/dot_01.svg);
	width:375px;
	height:560px;
}

#manmaru .innr::before {
	top:250px;
	left:-150px;
	background-image:url(../../img/service/dot_03.svg);
	width:243px;
	height:221px;
}

#manmaru .innr::after {
	top:270px;
	right:-200px;
	background-image:url(../../img/service/dot_01.svg);
	width:375px;
	height:560px;
}

#manmaru .i01::before {
	top:1700px;
	right:-170px;
	background-image:url(../../img/service/dot_03.svg);
	width:243px;
	height:221px;
}


#manmaru .i01::after {
	top:2000px;
	left:-250px;
	background-image:url(../../img/service/dot_01.svg);
	width:375px;
	height:560px;
}



@media screen and (max-width: 767px) {
	#hero {
		padding:10vw 0 15vw;
	}

	#hero .innr {
		width:96%;
	}

	#hero .ill {
		margin-top:10vw;
	}

	#hero h2 {
		font-size:6.4vw;
	}

	#hero .flexbox {
		margin-top:0;
		gap:5%;
	}

	#hero .item {
		width:42%;
		margin-top:5vw;
	}

	#hero .item h3 img {
		height:30vw;
	}

	#hero .item.i04,
	#hero .item.i05 {
		width:42%;
	}

	#hero .item p {
		font-size:3vw;
		white-space:inherit;
		text-align:left;
	}

	.section {
		padding:15vw 0;
	}

	.section .innr {
		width:90%;
	}

	.section h1 {
		font-size:7.5vw;
	}

	.section .logo {
		margin-top:15vw;
		padding-top:6vw;
		width:65vw;
		height:65vw;
	}

	.section .logo img {
		width:70%;
		margin-left:2vw;
	}

	#manmaru.section .logo {
		padding-top:10vw;
	}

	#manmaru.section .logo img {
		margin-left:5vw;
	}

	.section .cpy {
		font-size:4vw;
		text-align:left;
	}

	.section .active {
		margin-top:25vw;
	}

	.section .active dl {
		display:block;
	}

	.section .active dl dt {
		display:block;
		text-align:center;
		font-size:6vw;
		width:100%;
	}

	.section .active dl dd {
		font-size:3.6vw;
		line-height:1.8em;
		margin-left:0;
		margin-top:1em;
		width:100%;
	}

	.section hr {
		margin-top:10vw;
	}


	.section .flow {
		border:15px solid #d2eabe;
		border-radius:50px;
		padding:10vw 0;
		margin-top:20vw;
	}

	.section .flow h2 {
		font-size:6vw;
	}

	.section .flow dl::after {
		margin:5vw auto;
		background-size:100% auto;
		width:calc(45vw * .2);
		height:calc(30vw * .2);
	}

	.section .flow dl dt {
		font-size:5vw;
		max-width:84%;
	}

	.section .flow dl dd {
		font-size:3.6vw;
		margin-left:2em;
		margin-right:2em;
		text-align:left;
	}

	.section .flow dl dd.mrk {
		text-align:center;
	}

	#manmaru .flow dl dd.mrk {
		margin-top:5vw;
	}

	.section .contact {
		padding:1.5em 2em;
		margin-top:5vw;
		font-size:3, 6vw;
	}

	.section .flow .img {
		width:35vw;
		height:35vw;
		top:-15vw;
		left:-15vw;
	}

	#manmaru .flow .img {
		top:auto;
		left:auto;
		bottom:-25vw;
		right:-15vw;
	}

	#manmaru {
		padding-bottom:30vw;
	}

	#manmaru .flow {
		margin-top:10vw;
	}
}


#flow {
	background:url(../../img/service/bg_flow.jpg) no-repeat;
	background-size:cover;
}

#flow .flexbox {
	width:1100px;
	justify-content:space-between;
	margin-left:auto;
	margin-right:auto;
}

#flow .box {
	width:30%;
}

#flow .headline {
	min-height:80px;
}

#flow h3 {
	font-size:28px;
	color:#ed9027;
}

#flow h4 {
	font-size:18px;
	letter-spacing:2px;
	margin-top:1em;
}

#flow h4.mgt {
	margin-top:40px;
}

#flow .item {
	display:flex;
	text-align:left;
	font-size:18px;
	background-color:#87af54;
	padding:.3em 1.5em;
	padding-right:.5em;
	color:#fff;
	margin-top:30px;
	border-radius:20px;
}

#flow .item.ione {
	display:block;
	text-align:center;
	padding-right:1.5em;
}

#flow .bsc .item {
	background-color:#ed9027;
}

#flow .item span {
	margin-right:20px;
}

#flow .item strong {
}

#flow .item small {
	font-size:14px;
}


#flow .item.idbl span {
	line-height:2.7em;
}

#flow .item.idbl strong {
	line-height:3em;
}

@media screen and (max-width: 767px) {
	#flow {
		padding-bottom:0vw;
	}

	#flow .flexbox {
		width:80%;
	}

	#flow .box {
		width:100%;
		padding-bottom:20vw;
	}

	#flow .headline {
		min-height:auto;
	}

	#flow h3 {
		font-size:8vw;
	}

	#flow h3 img {
		height:8vw;
	}

	#flow h4 {
		font-size:5vw;
		margin-top:7vw;
	}

	#flow h4.mgt {
		margin-top:7vw;
	}

	#flow .item {
		font-size:4.4vw;
		margin-top:5vw;
		border-radius:4.5vw;
	}

	#flow .item span {
		margin-right:5vw;
	}

	#flow .item small {
		font-size:3.4vw;
	}

	#flow .item.idbl {
		padding-top:.5em;
		padding-bottom:.5em;
	}

	#flow .item.idbl span {
		line-height:1.8em;
	}

	#flow .item.idbl strong {
		line-height:1.8em;
	}
}