section {
	margin: 0 auto;
	padding: 0 0 1rem 0;
}
section h3 {
	font-family: 'Shin Go Light';
	line-height: 1.4;
}
section h3 small {
	display: block;
	font-size: 60%;
}

@media all and (max-width: 640px) {
	section h3 {
		font-size: 180%;
	}
}

@media all and (min-width: 641px) {
	section {
		width: 49rem;
	}
	section h3 {
		font-size: 220%;
	}
}

/*==================== スクール ====================*/

#school > h4,
#personal h4 {
	border-top: 1px solid #ccc;
	padding-top: 1em;
	line-height: 1.1;
}
#school > h4 small,
#personal h4 small {
	display: inline-block;
	font-size: 70%;
}
#school > h4 span {
	font-size: 80%;
}

/*---------- 比較 ----------*/

#type {
	display: table;
	table-layout: fixed;
	width: 100%;
	border-spacing: 1em;
	background: #ffb9be;
}

#type > div {
	background: white;
}
#type h4 {
	margin: 0;
	padding: 1em;
	background: #e60012;
	color: white;
	font-size: 130%;
	font-family: 'Shin Go Regular';
	line-height: 1;
}
#type h4 small {
	font-size: 70%;
}
#type img {
	display: inline-block;
	margin: 1em 0 0;
}
#type ul {
	margin: 0;
	padding: 1em;
	list-style-type: none;
	font-weight: bold;
	text-align: left;
}
#type li {
	position: relative;
	padding-left: 1.75em;
	line-height: 1.3;
}
#type li:nth-of-type(n+2) {
	margin-top: 0.75em;
}
#type li::before {
	content: 'check';
	position: absolute;
	left: 0;
	top: 0;
	-webkit-transform: translate(0, -20%);
	transform: translate(0, -20%);
	color: #f59300;
	font-family: 'Material Icons';
	font-size: 140%;
}

@media all and (max-width: 640px) {
	#type > div:nth-of-type(n+2) {
		display: table-row-group;
	}
	#type img {
		width: 70%;
	}
	#type + .link {
		margin-top: 1em;
	}
}

@media all and (min-width: 641px) {
	#type {
	}
	#type > div {
		display: table-cell;
		vertical-align: top;
	}
	#type img {
		width: 70%;
	}
	#type ul {
		font-size: 90%;
	}
	#type + .link {
		margin-top: 1.5em;
		font-size: 110%;
	}
}

/*---------- schoolList ----------*/

#schoolList a {
	color: inherit;
	text-decoration: none;
}

#schoolList .circuit .head {background-color: rgba(189,79,255,0.2);}
#schoolList .condition .head {background-color: rgba(255,91,92,0.2);}
#schoolList .eatdiet .head {background-color: rgba(255,137,197,0.2);}
#schoolList .exercise .head {background-color: rgba(255,134,17,0.2);}
#schoolList .swimming .head {background-color: rgba(16,139,255,0.2);}
#schoolList .running .head {background-color: rgba(22,177,0,0.2);}
#schoolList .culture .head {background-color: rgba(91,141,176,0.2);}
#schoolList .arke .head {background-color: rgba(0,186,199,0.2);}
#schoolList .vipr .head {background-color: rgba(232,97,0,0.2);}

#schoolList .head {
	line-height: 1;
}
#schoolList h5,
#schoolList .head h6 {
	font-family: 'Shin Go Regular';
	line-height: 1;
}

#schoolList h5 {
	color: white;
}
#schoolList h5 small {
	font-size: 70%;
	display: inline-block;
	vertical-align: middle;
}
#schoolList .circuit h5 {background-color: rgba(189,79,255,1);}
#schoolList .condition h5 {background-color: rgba(255,91,92,1);}
#schoolList .eatdiet h5 {background-color: rgba(255,137,197,1);}
#schoolList .exercise h5 {background-color: rgba(255,134,17,1);}
#schoolList .swimming h5 {background-color: rgba(16,139,255,1);}
#schoolList .running h5 {background-color: rgba(22,177,0,1);}
#schoolList .culture h5 {background-color: rgba(91,141,176,1);}
#schoolList .arke h5 {background-color: rgba(0,186,199,1);}
#schoolList .vipr h5 {background-color: rgba(232,97,0,1);}

#schoolList .circuit .head h6 {color: rgba(189,79,255,1);}
#schoolList .condition .head h6 {color: rgba(255,91,92,1);}
#schoolList .eatdiet .head h6 {color: rgba(255,137,197,1);}
#schoolList .exercise .head h6 {color: rgba(255,134,17,1);}
#schoolList .swimming .head h6 {color: rgba(16,139,255,1);}
#schoolList .running .head h6 {color: rgba(22,177,0,1);}
#schoolList .culture .head h6 {color: rgba(91,141,176,1);}
#schoolList .arke .head h6 {color: rgba(0,186,199,1);}
#schoolList .vipr .head h6 {color: rgba(232,97,0,1);}

#schoolList .time i {
	font-size: 110%;
	margin-right: 0.2em;
	-webkit-transform: translate(0, -10%);
	transform: translate(0, -10%);
}

#schoolList .circuit .time i {color: rgba(189,79,255,1);}
#schoolList .condition .time i {color: rgba(255,91,92,1);}
#schoolList .eatdiet .time i {color: rgba(255,137,197,1);}
#schoolList .exercise .time i {color: rgba(255,134,17,1);}
#schoolList .swimming .time i {color: rgba(16,139,255,1);}
#schoolList .running .time i {color: rgba(22,177,0,1);}
#schoolList .culture .time i {color: rgba(91,141,176,1);}
#schoolList .arke .time i {color: rgba(0,186,199,1);}
#schoolList .vipr .time i {color: rgba(232,97,0,1);}

#schoolList .text {
	text-align: justify;
}
#schoolList .category dl {
	position: relative;
	display: table;
	width: 100%;
	border-collapse: collapse;
	text-align: center;
}
#schoolList .category dt,
#schoolList .category dd {
	display: table-cell;
	width: calc(100% / 6);
}
#schoolList .category dt {
	position: absolute;
	top: 0;
	padding: 0.5em 0 0;
	font-family: 'Shin Go Regular';
}
#schoolList .category dt[data-id="0"] {
	color: #999;
	font-family: 'Shin Go Light';
}
#schoolList .category dd {
	border: solid #ccc;
	border-width: 0 1px;
}
#schoolList .category dd:nth-of-type(n+2) {
	border-left: none;
}
#schoolList .category dd img {
	width: 1em;
	vertical-align: middle;
}

/* イベントリンク */
#eventLink {
	margin: 4em 0;
	color: #005fb3;
	font-family: 'Shin Go Regular';
}
#eventLink a {
	border: 2px solid #005fb3;
	margin: 1em auto 0;
	padding: 1em 2em;
	color: inherit;
	line-height: 1;
	text-decoration: none;
}
#eventLink a i {
	-webkit-transform: translate(0, -10%);
	transform: translate(0, -10%);
}

@media all and (max-width: 640px) {
	#eventLink p {
		text-align: justify;
	}
	#eventLink p br:nth-of-type(1) {
		display: none;
	}
	#eventLink a {
		display: block;
		box-sizing: border-box;
		width: 80%;
		font-size: 120%;
		text-align: center;
	}
}
@media all and (min-width: 641px) {
	#eventLink a {
		display: inline-block;
		font-size: 140%;
	}
}

/* パーソナル */
#personal > div {
	cursor: pointer;
	transition: filter 0.2s ease;
}
#personal > div:hover {
	filter: brightness(115%);
}

@media all and (max-width: 640px) {
	#school {
		padding: 0 1rem;
	}
	#school h4 span {
		display: block;
		margin-top: 1em;
	}
	#school > p,
	#personal > p {
		text-align: justify;
	}
	#school > p br,
	#personal > p br {
		display: none;
	}

	#schoolList > div {
		position: relative;
		margin: 2rem 0 0;
	}
	#schoolList .head {
		text-align: left;
	}
	#schoolList .head::after {
		content: '';
		display: block;
		clear: both;
		height: 0;
	}
	#schoolList h5,
	#schoolList .head h6 {
		margin: 0;
	}
	#schoolList h5 {
		padding: 0.6em;
		font-size: 125%;
	}
	#schoolList .head h6,
	#schoolList .time {
		display: inline-block;
		vertical-align: middle;
		box-sizing: border-box;
		padding: 0.75rem;
		white-space: nowrap;
		line-height: 1rem;
	}

	#schoolList .head h6 {
		float: left;
		width: 70%;
		font-size: 90%;
	}
	#schoolList .time {
		float: right;
		width: 30%;
		font-size: 110%;
		text-align: right;
	}

	#schoolList .head .info dt:first-child {
		margin-left: 0;
	}
	#schoolList .pic {
		margin: 1.5em auto;
		width: 80%;
	}
	#schoolList .pic img {
		vertical-align: bottom;
	}
	#schoolList .body h6 {
		margin: 0;
		font-size: 110%;
	}
	#schoolList .text p {
		margin: 0.5em 0 0;
	}
	#schoolList .category dt {
		font-size: 60%;
	}
	#schoolList .category dd {
		padding: 1.5em 0 0.5em;
	}
	#personal .pics img {
		display: inline-block;
		vertical-align: top;
		margin: 2%;
		width: 45%;
	}
}

@media all and (min-width: 641px) {
	#schoolList > div {
		position: relative;
		margin-top: 2rem;
	}
	#schoolList .head {
		position: relative;
		text-align: left;
	}
	#schoolList h5,
	#schoolList .head h6 {
		display: inline-block;
		vertical-align: middle;
	}

	#schoolList h5 {
		position: relative;
		margin: 0;
		padding: 0.6em 1em;
		font-size: 150%;
	}
	#schoolList h5::before {
		content: '';
		display: block;
		position: absolute;
		left: 100%;
		top: 0;
		width: 1em;
		height: 100%;
		background: inherit;
		transform-origin: 0 0;
		transform: skewX(-20deg);
	}
	#schoolList .head h6 {
		margin: 0 0 0 1.5em;
		font-size: 115%;
	}
	#schoolList .time {
		position: absolute;
		right: 1em;
		top: 50%;
		-webkit-transform: translate(0, -50%);
		transform: translate(0, -50%);
		font-size: 120%;
	}
	#schoolList .body {
		margin-top: 1rem;
	}
	#schoolList .pic {
		float: left;
		width: 18rem;
	}
	#schoolList .pic_b {
		margin: 0 auto;
		width: 40rem;
		text-align: left;
	}
	#schoolList .text {
		float: right;
		width: 29.5rem;
		padding-bottom: 5em;
	}
	#schoolList .text_b {
		margin: 0 auto;
		width: 40rem;
		text-align: left;
	}
	#schoolList .body::after {
		content: '';
		clear: both;
		display: block;
	}
	#schoolList .body h6 {
		margin: 0.5em 0;
		font-size: 105%;
	}
	#schoolList .body h6 br {
		display: none;
	}
	#schoolList .category {
		position: absolute;
		bottom: 0;
		right: 0;
		width: 29.5rem;
	}
	#schoolList .category dt {
		font-size: 80%;
	}
	#schoolList .category dd {
		padding: 2em 0 0.5em;
	}
	#personal .pics img {
		display: inline-block;
		margin: 2%;
		width: 28%;
	}
}

/*==================== フリープログラム ====================*/
#freeTables {
	background: #ffccd0;
}
#freeTables table {
	border-spacing: 0 0.2rem;
}
#freeTables table:nth-of-type(n+2) {
	margin-top: 0.5rem;
}
#freeTables caption {
	padding: 0.5em;
	color: #000;
	font-family: 'Shin Go Regular';
	text-align: left;
}
#freeTables thead th {
	color: #999;
	font-weight: normal;
}
#freeTables th,
#freeTables td {
	box-sizing: border-box;
	padding: 0.75em;
}
#freeTables tbody .name,
#freeTables tbody .text {
	text-align: left;
}
#freeTables tbody .name {
	position: relative;
	padding-left: 2.4em;
}
#freeTables .beginner {
	position: absolute;
	left: 0.75em;
	display: block;
	width: 1.2em;
}
#freeTables .beginner img {
	vertical-align: middle;
}
#freeTables .level {
	width: 8em;
}
#freeTables img[src*="level"] {
	width: 6em;
}
#freeTables .time {
	width: 7em;
}
#freeTables .time span::after {
	content: '分';
}
#freeTables .text {
	color: #666;
	font-size: 90%;
}

@media all and (max-width: 640px) {
	#free {
		margin-top: 2rem;
	}
	#free > p {
		padding: 0 1rem;
		text-align: justify;
	}
	#free > p br {
		display: none;
	}
	#free .link {
		margin: 1em 0;
	}
	#freeTables {
		margin-top: 2rem;
		padding: 1rem;
		font-size: 90%;
	}
	#freeTables table {
		display: block;
	}
	#freeTables caption {
		font-size: 150%;
	}
	#freeTables caption small {
		display: block;
		margin-top: 0.25em;
		font-size: 55%;
	}
	#freeTables thead th:nth-last-of-type(1) {
		display: none;
	}
	#freeTables tr {
		background: white;
	}
	#freeTables th,
	#freeTables td {
		display: block;
		float: left;
	}
	#freeTables .name {
		clear: left;
		width: calc(100% - 8em - 7em);
	}
	#freeTables .text:empty {
		display: none;
	}
	#freeTables .text {
		width: 100%;
		padding-top: 0;
		padding-left: 2.4em;
	}
}

@media all and (min-width: 641px) {
	#free .link {
		margin: 1.5em 0;
	}
	#freeTables {
		box-sizing: border-box;
		width: 49rem;
		margin: 2rem auto;
		padding: 1rem;
		font-size: 90%;
	}
	#freeTables caption {
		font-size: 150%;
	}
	#freeTables caption small {
		display: inline-block;
		margin-left: 1.5em;
		font-size: 65%;
	}
	#freeTables th,
	#freeTables td {
		background: white;
	}
	#freeTables .name {
		width: 18em;
		font-size: 110%;
		white-space: nowrap;
	}
}
