@charset "utf-8";
/*
 * commons css 
 * pc width 1000px fixed
 */

@media (max-width: 599px) {
} /* end -599 */

@media (min-width: 600px) and (max-width:959px) {
} /* end 600-959 */

@media (min-width: 960px) {
} /* 960- */

/* ---------------------------------------- common */

body { color: #333; }

hr {
    display: block;
    height: 1px;
    border: 0;   
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

ul.disc {
	list-style: outside disc;
	text-align: left;
	margin: 0 0 0 1.5em;
}
.org { color: #e67b00; }
.size-large { font-size: 125%; }

.align-left { text-align: left; }
.align-center { text-align: center; }
.align-right { text-align: right; }

/* ---------------------------------------- title */
/* h2 */
.bluett {
	color: #392d23;  /* #237acf */
	background: #dbd3c8;  /* #d9f2f5 */
	border: 7px #fff solid;
	position: relative;
}
.bluett::before {
	content: "";
	display: block;
	width: 1em;
	height: 1em;
	border-bottom: 1px #392d23 solid;  /* #72c2cf */
	border-left: 1px #392d23 solid;  /* #72c2cf */
	position: absolute;
	left: -6px;
	bottom: -6px;
	z-index: 999;
}
.bluett::after {
	content: "";
	display: block;
	width: 1em;
	height: 1em;
	border-top: 1px #392d23 solid;  /* #72c2cf */
	border-right: 1px #392d23 solid;  /* #72c2cf */
	position: absolute;
	top: -6px;
	right: -6px;
}

.brackets {
	color: #4c94d7;
	text-align: center;
	padding: .3em;
	position: relative;
}
.brackets::before {
	content: "";
	display: block;
	width: 1em;
	height: 100%;
	border-top: 2px #4c94d7 solid;
	border-left: 2px #4c94d7 solid;
	border-bottom: 2px #4c94d7 solid;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 999;
}
.brackets::after {
	content: "";
	display: block;
	width: 1em;
	height: 100%;
	border-top: 2px #4c94d7 solid;
	border-right: 2px #4c94d7 solid;
	border-bottom: 2px #4c94d7 solid;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 999;
}

/* h3 */
.underlinett {
	color: #237acf;
	border-bottom: 2px #237acf solid;
}

.hdlinett {
	border-left: 4px #7893a8 solid; /* #237acf */
	line-height: 1.4;
	padding: 0 0 0 .75em;
}

@media (max-width: 599px) {

	.bluett {
		font-size: 1.6rem;
		padding: .5em .75em;
		margin: 0 0 1.4em;
	}
	.underlinett, .hdlinett {
		font-size: 1.5rem;
		margin: 0 0 1.4em;
	}
	.brackets {
		font-size: 1.5rem;
		margin: 0 0 1.4em;
	}

} /* end -599 */

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

	.bluett {
		font-size: 2.0rem;
		padding: .5em .75em;
		margin: 0 0 1.4em;
	}
	.underlinett, .hdlinett {
		font-size: 1.8rem;
		margin: 0 0 1.4em;
	}
	.brackets {
		font-size: 2.0rem;
		margin: 0 0 1.4em;
	}

} /* end 600-959 */

@media (min-width: 960px) {

	.bluett {
		font-size: 2.8rem;
		padding: 5px .75em;
		margin: 0 0 1.4em;
	}
	.underlinett, .hdlinett {
		font-size: 2.4rem;
		margin: 0 0 1.4em;
	}
	.brackets {
		font-size: 2.6rem;
		margin: 0 0 1.4em;
	}

} /* 960- */

/* ---------------------------------------- common flex selectors */

@media (max-width: 599px) {

	.flexs {
		/* no setting */
	}

} /* end -599 */

@media (min-width: 600px) {

	.flexs {
		display: -webkit-box;
		display: -webkit-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
	}

	.flexs.wrap {
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	
	.flexs.nowrap {
		-webkit-flex-wrap: nowrap;
		-ms-flex-wrap: nowrap;
		flex-wrap: nowrap;
	}
	
	.flexs.justify {
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	
	.flexs.justify-center {
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
	}
	
	.flexs.align-center {
		-webkit-align-items: center;
		-ms-align-items: center;
		align-items: center;
	}
	
	.flexs.hz-reverse {
		-webkit-flex-direction: row-reverse;
		-ms-flex-direction: row-reverse;
		flex-direction:row-reverse;
	}

} /* over 600 */

/* ---------------------------------------- fielde (for flex items) */
/* img 420x314 */

article .fielde + .fielde { margin:2em 0 0; }

@media (max-width: 599px) {

	.fielde.flexs > figure {
		text-align: center;
	}
	.fielde.flexs > figure + div,
	.fielde.flexs > div + figure {
		margin: 2em 0 0;
	}
	
	article .fielde h3 {
		font-size: 1.4rem;
		line-height: 1.6;
		margin: 0 0 1em;
	}

} /* end -599 */

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

	.fielde.flexs > figure {
		width: 42%;
	}
	.fielde.flexs > div {
		width: 54%;
	}
	
	article .fielde h3 {
		font-size: 1.6rem;
		line-height: 1.6;
		margin: 0 0 1em;
	}

} /* end 600-959 */

@media (min-width: 960px) {

	.fielde.flexs > figure {
		width: 420px;
	}
	.fielde.flexs > div {
		width: 540px;
	}

	article .fielde h3 {
		font-size: 1.8rem;
		line-height: 1.6;
		margin: 0 0 1em;
	}

} /* 960- */

/* ---------------------------------------- table */

table { width: 100%; }
th, td { 
	border-top: 1px #e5e5e5 solid;
	border-bottom: 1px #e5e5e5 solid;
	text-align: left;
	vertical-align: middle;
	padding: .75em 1em;
}
th { background: #f9f9f9; }

@media (max-width: 599px) {

	table { border-bottom: 1px #e5e5e5 solid; }
	th, td { 
		display: block; 
		border-bottom: none;
	}

} /* end -599 */

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

	th { width: 30%; }

} /* end 600-959 */

@media (min-width: 960px) {

	th { width: 220px; }

} /* 960- */