@charset "utf-8";

/*
 * Common Contet use flex
 */

section .inner > h2 { text-align: center; }

article .inner > h2,
article .inner > h3 { 
	border-top: 1px #ccc solid;
	border-bottom: 1px #ccc solid;
	font-weight: bold;
	padding: .5em 0 .5em 1.5em;
	position: relative; 
}

article .inner > h2::before,
article .inner > h3::before {
	content: "";
	display: block;
	width: .75em;
	height: 1.75em;
	background: #333;
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

@media (max-width:768px) {

	article {
		padding: 44px 0;
	}
	section .inner,
	article .inner { padding: 0 1em; }

	article .inner > h2,
	article .inner > h3 {
		font-size: 1.6rem;
		line-height: 1.4;
		margin: 0 0 2em;
	}

}
/* end sd */

@media (min-width:769px) {
	
	article {
		padding: 3em 0;
	}
	section .inner,
	article .inner {
		max-width: 1040px;
		padding : 0 20px;
		margin: 0 auto;
	}
	
	article .inner > h2,
	article .inner > h3 {
		font-size: 2.0rem;
		line-height: 1.8;
		margin: 0 0 2.5em;
	}

}
/* end pc */

/* ---------------------------------------- inside */

@media (max-width: 599px) {

	.inside + .inside { margin: 2em 0 0; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	.inside + .inside { margin: 2em 0 0; }

} /* end 600-959 */

@media (min-width: 960px) {

	.inside + .inside { margin: 2em 0 0; }

} /* 960- */


/* ---------------------------------------- .fields.flexs */

.fields.flexs .imgwrap figure { text-align: center; }
.fields.flexs .imgwrap figure + figure {
	margin: 1em 0 0;
}

@media (max-width: 599px) {

	.fields.flexs .txtwrap {
		margin: 2em 0 0;
	}

} /* end -599 */

@media (min-width: 600px)  {

	.fields.flexs.row .txtwrap,
	.fields.flexs.row-reverse .txtwrap {
		width: 60%;
	}
	.fields.flexs.row .imgwrap,
	.fields.flexs.row-reverse .imgwrap {
		width: 36%;
	}

} /* 960- */

.fields.flexs.column .txtwrap,
.fields.flexs.column-reverse .imgwrap {
	margin: 2em 0 0;
}

/* ---------------------------------------- linkbutton */

.linkbutton {
	text-align: center;
	margin: 2em 0 0;
}
.linkbutton a {
	display: inline-block;	
	min-width: 40%;
	color: #fff;
	font-weight: bold;
	line-height: 1;
	padding: 1em 1.5em;
	-webkit-border-radius: 40px;
	border-radius: 40px;
}
main section.backimg .linkbutton a {
	border: 1px #fff solid;
}
.linkbutton a:hover {
	color: #333;
	background: none;
	border: 1px #333 solid;
}

@media (max-width: 599px) {

	.linkbutton a { font-size: 1.4rem; }

} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {

	.linkbutton a { font-size: 1.5rem; }

} /* end 600-959 */

@media (min-width: 960px) {

	.linkbutton a { font-size: 1.6rem; }

} /* 960- */