@charset "utf-8";

/*===============================================
●共通
===============================================*/

/* contents01
---------------------------------------- */
#contents01 section {
	background-color:#fff;
}
#contents01 section header p {
	color:#ffff00;
	text-align:center;
	background-color:#954f19;
	font-family: "RocknRoll One", sans-serif;
	font-weight: 400;
	letter-spacing: 0.01em;
}
#contents01 section header p span {
	font-size:1.5em;
	display:inline-block;
	margin-left:0.3em;
}
#contents01 section header h3 {
	color:#5c272e;
	text-align:center;
	background-color:#e8e2de;
	font-family: "RocknRoll One", sans-serif;
	font-weight: 400;
	letter-spacing: 0.01em;
}
#contents01 section .text {
	padding:0.85em;
}

/* contents02
---------------------------------------- */
#contents02 section {
	background-color:#fff;
}
#contents02 section h3 {
	position:relative;
	color:#5c272e;
	line-height:1.2em;
	padding:0.7em 0 0.7em 1.7em;
	margin-bottom:0.5em;
	border-bottom:#e8e2de 2px solid;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 500;
}
#contents02 section h3:before {
	display:block;
	content:"";
	width:1em;
	height:1em;
	position:absolute;
	top:50%;
	left:0;
	color:#e8e2de;
	margin-top:-0.5em;
}
#contents02 #box01 h3:before {background:url(../../images/service/no1.gif) no-repeat center center / contain;}
#contents02 #box02 h3:before {background:url(../../images/service/no2.gif) no-repeat center center / contain;}
#contents02 #box03 h3:before {background:url(../../images/service/no3.gif) no-repeat center center / contain;}
#contents02 #box04 h3:before {background:url(../../images/service/no4.gif) no-repeat center center / contain;}
#contents02 #box05 h3:before {background:url(../../images/service/no5.gif) no-repeat center center / contain;}
#contents02 #box06 h3:before {background:url(../../images/service/no6.gif) no-repeat center center / contain;}
#contents02 #box07 h3:before {background:url(../../images/service/no7.gif) no-repeat center center / contain;}

/* contents03
---------------------------------------- */
#contents03 section article:last-child {
	padding-bottom:0;
	margin-bottom:0;
	border-bottom:none;
}
#contents03 h4 {
	color:#5c272e;
	padding-left:2em;
	font-family: "M PLUS Rounded 1c", sans-serif;
	font-weight: 500;
}
#contents03 h4 span {
	display:inline-block;
	width:1.5em;
	line-height:1.25em;
	color:#fff;
	text-align:center;
	padding-bottom:0.25em;
	margin:0 0.5em 0 -2em;
	background-color:#71bc68;
	border-radius:100%;
	-webkit-border-radius:100%;
	-moz-border-radius:100%;
	vertical-align:middle;
	font-family: "RocknRoll One", sans-serif;
	font-weight: 400;
	letter-spacing: 0.01em;
}

/*===============================================
●画面の横幅が729px以下(スマホのみ)
===============================================*/
@media screen and (max-width: 729px){
	
	/* contents
	---------------------------------------- */
	#contents {
		padding:1.5em 1em 0!important;
	}
	
	/* contents01
	---------------------------------------- */
	#contents01 {
		margin-bottom:3em;
	}
	#contents01 section {
		margin-bottom:1.5em;
	}
	#contents01 section header p {
		font-size:1.28em;
		line-height:1.5em;
	}
	#contents01 section header h3 {
		font-size:2em;
		line-height:1.2em;
		padding:0.3em;
	}
	
	/* contents02
	---------------------------------------- */
	#contents02 {
		margin-bottom:3.5em;
	}
	#contents02 section {
		padding:0.2em 1em 0.8em;
		margin-bottom:1.3em;
	}
	#contents02 section h3 {
		font-size:1.28em;
		border-bottom:#e8e2de 2px solid;
	}
	#contents02 section h3:before {
		font-size:1.5em;
	}
	#contents02 #box08 {
		display:none;
	}
	
	/* contents03
	---------------------------------------- */
	#contents03 {
		padding-bottom:1.5em;
	}
	#contents03 section {
		margin-bottom:2.3em;
	}
	#contents03 section article {
		padding-bottom:1em;
		margin-bottom:1em;
		border-bottom:#e8e2de 1px solid;
	}
	#contents03 section h4 {
		line-height:1em;
		margin-bottom:0.7em;
	}
	#contents03 section .btn01 {
		margin-top:0.7em;
	}
	
	/* contents04
	---------------------------------------- */
	#contents04 ul {
		margin-bottom:0.5em;
	}
	#contents04 ul li {
		width:50%;
		float:left;
	}
	#contents04 ul li.karin {
		display:none;
	}
}

/*===============================================
●画面の横幅が730px以上(PCのみ)
===============================================*/
@media screen and (min-width: 730px){
	
	/* contents
	---------------------------------------- */
	#contents {
		width:100%;
		max-width:960px;
		overflow:hidden;
		padding:3em 10px 5em!important;
		margin:0 auto;
		box-sizing:border-box;
	}
	
	/* contents01
	---------------------------------------- */
	#contents01 {
		margin-bottom:5.5em;
	}
	#contents01 #contents01Box {
		display:table;
		margin:0 -1em;
		border-collapse:separate;
		border-spacing:1em 0;
	}
	#contents01 section {
		display:table-cell;
		width:25%;
		box-sizing:border-box;
	}
	#contents01 section header p {
		font-size:1.7em;
		line-height:1.5em;
	}
	#contents01 section header h3 {
		font-size:2.6em;
		line-height:1.2em;
		padding:0.7em;
	}
	
	/* contents02
	---------------------------------------- */
	#contents02 {
		margin-bottom:5.5em;
	}
	#contents02 .boxWrapper {
		display:table;
		border-collapse:separate;
		border-spacing:1.5em 0;
		margin:0 -1.5em 1.5em;
	}
	#contents02 section {
		display:table-cell;
		width:50%;
		padding:0 1.5em 1.5em;
		vertical-align:top;
		background-size:15% auto;
		background-position:97% bottom;
		background-repeat:no-repeat;
		background-color:#fff;
	}
	#contents02 #box08 {
		background:none;
	}
	#contents02 section h3 {
		font-size:1.7em;
		height:3.74em;
		display:flex;
		flex-wrap:wrap;
		padding:0 0 0 1.7em;
		line-height:1.1em;
	}
	#contents02 section h3 span {
		display:flex;
		align-items:center;
	}
	#contents02 section h3:before {
		font-size:1.7em;
		left:-0.2em;
	}
	#contents02 section p {
		padding-right:16%;
	}
	#contents02 #box01 { background-image:url(../../images/about/image01.jpg);}
	#contents02 #box02 { background-image:url(../../images/about/image02.jpg);}
	#contents02 #box03 { background-image:url(../../images/about/image03.jpg);}
	#contents02 #box04 { background-image:url(../../images/about/image04.jpg);}
	#contents02 #box05 { background-image:url(../../images/about/image05.jpg);}
	#contents02 #box06 { background-image:url(../../images/about/image06.jpg);}
	#contents02 #box07 { background-image:url(../../images/about/image07.jpg);}
	
	/* contents03
	---------------------------------------- */
	#contents03 {
		padding-bottom:2.5em;
	}
	#contents03 section {
		margin-bottom:3.5em;
	}
	#contents03 section article {
		padding-bottom:1.5em;
		margin-bottom:1.5em;
		border-bottom:#e8e2de 1px solid;
	}
	#contents03 h4 {
		font-size:1.7em;
		margin-bottom:0.6em;
	}
	#contents03 .btn01 {
		margin:1em 0 0;
	}
	
	/* contents04
	---------------------------------------- */
	#contents04 ul {
		margin-bottom:1em;
	}
	#contents04 ul li {
		width:33.333%;
		float:left;
		margin-bottom:0.5em;
	}
}

/*===============================================
●画面の横幅が860px以上(PCのみ)
===============================================*/
@media screen and (min-width: 860px){
	
	/* 全般
	---------------------------------------- */
}