@charset 'utf-8';


#guide {
	margin-bottom: 5em;
}

#tuitionblock {
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	font-size: .65rem;
}

.course-tuition:not(:last-child) {
	margin-bottom: 40px;
	padding-bottom: 40px;
	border-bottom: 1px solid;
}

.course-tuition > h3 {
	margin-bottom: 1em;
	padding-bottom: .5em;
	border-bottom: 1px solid #ccc;
	font-size: 2em;
	text-align: center;
}

.course-tuition .btnarea {
	border-top: 1px solid #ccc;
	margin-top: 40px;
	padding-top: 20px;
}

.tuitionlist {
	font-size: 1.4em;
	line-height: 1.6;
	position: relative;
}

.tuitionlist:not(:last-child) {
	margin-bottom: 2em;
}

.tuitionlist + .caution {
	font-size: 1.2em;
}


.tuitionrow {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	position: relative;
}

.tuitionrow:not(:last-child) {
	margin-bottom: 2em;
}

.tuitionrow .head {
	width: 100%;
	margin-bottom: .7em;
	position: relative;
}

.tuitionrow .head h2 {
	font-size: 1em;
}

.tuitionrow .head h2 > span {
	display: inline-block;
	width: 100%;
	padding: .3em .6em;
	background: #c0c0c0;
	color: #000;
	position: relative;
}

.tuitionrow .item {
	width: 100%;
	position: relative;
}

.tuitionrow .item .brick {
	background: #fff;
}

.tuitionrow .item .brick:not(:last-child) {
	margin-bottom: 1em;
}

.tuitionrow .item .price {
	font-weight: 700;
}

.tuitionrow .item .price strong {
	margin-right: .3em;
	font-size: 1.3em;
}

.tuitionrow .item .caution {
	font-size: .85em;
}

@media only screen and (min-width: 541px) {

	.tuitionlist {
		font-size: 1.6em;
	}

	.tuitionrow {
		flex-direction: row;
	}

	.tuitionrow .head {
		width: 10em;
		margin: 0;
	}

	.tuitionrow .head h2 > span {
		padding: .5em 1em;
	}

	.tuitionrow .item {
		flex-grow: 1;
		width: calc(100% - 10em);
		padding-left: 1.5em;
	}

	.tuitionrow.priceline .item {
		border-bottom: 1px solid #c0c0c0;
	}

	.tuitionrow .item .brick {
	}
}

@media only screen and (min-width: 1001px) {

	.tuitionrow.priceline .item > .brick {
		display: flex;
		align-items: baseline;
	}

	.tuitionrow.priceline .item .price {
		min-width: 8em;
	}
}

.tuitionrow h3 {
	width: 100%;
	margin-bottom: .5em;
	font-size: 1em;
	text-align: center;
}

.tuitionrow h4 {
	width: 100%;
	margin-bottom: .5em;
	border-bottom: 1px solid #ccc;
	font-size: 1.1em;
	text-align: center;
}

.tuitionrow .feetable:not(:last-child) {
	margin-bottom: 1em;
}

.tuitionrow .spec {
	width: 100%;
	padding: 10px;
	font-size: .9em;
	text-align: left;
}

.tuitionrow .spec h5 {
	width: 100%;
	margin-bottom: .5em;
	padding: .3em .7em;
	background: #c0c0c0;
	font-size: 1em;
	text-align: center;
}

.tuitionrow .spec p {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-end;
	margin: 0;
	padding-bottom: .4em;
	line-height: 1.5;
}

.tuitionrow .spec p {
	border-bottom: 1px dotted #ccc;
}

.tuitionrow .spec p:not(:last-child) {
	margin-bottom: .3em;
}

.tuitionrow .spec p span {
	display: block;
}

.tuitionrow .spec p span.head {
	width: auto;
	margin: 0;
	padding: 0 .5em;
	font-weight: 700;
	position: relative;
}

.tuitionrow .spec p.line span.head {
	align-self: start;
}

.tuitionrow .spec p span.data {
	text-align: right;
	flex-grow: 1;
	padding: 0 .5em;
}

/* 
.tuitionrow .spec p span.data:not(.tilde) {
	padding-right: 1.5em;
}

.tuitionrow .spec p span.data.tilde:after {
	display: inline-block;
	content: '〜';
	width: 1em;
}
 */

.tuitionrow .spec p span.row {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}

.tuitionrow .spec p span.row .lineitem {
	flex-grow: 1;
}

@media only screen and (min-width: 1001px) {

	.tuitionrow .feetable.column {
		display: flex;
		flex-direction: row;
	}

	.tuitionrow .feetable.column .spec {
		padding: 5px 15px;
	}

	.tuitionrow .feetable.column .spec:not(:last-child) {
		border-right: 1px solid #ccc;
	}
}


.tuitionrow .center:not(.columns) {
	text-align: center;
}

.tuitionrow .left:not(.columns) {
	text-align: left;
}

.tuitionrow .right:not(.columns) {
	text-align: right;
}
