/* search */
#search h3 {
	font-size: 18px;
    line-height: 1.4em;
    margin-bottom: 20px;
    color: #FFFFFF;
    font-weight: bold;
    letter-spacing: 1px;
	background: #5EBFB4;
	padding: 5px 15px;
}
h5.card-title {
	font-size: 1.1em;
	font-weight: bold;
	margin-bottom: 5px;
}
#search .card {
	margin-bottom: 15px;
}
#search .card-header {
	color: #19a78e;
}
#search .card-header:first-child {
	border-top: none;
}
#search .card-body {
	line-height: 1.8em;
	font-weight: normal;
}
#search .card-title {
	line-height: 1.6em;
}
#search .border-danger {
	color: #dc3545;
}
#search .an_qa {
	border-bottom: 1px dotted #CCC;
	padding: 12px 10px 5px 10px;
	width: 100%;	
}
#search .an_qa.danger {
	background: #f8d7da;
}
#search .an_qa:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}
#search .custom-control {
	margin: 5px 10px;
	line-height: 2em;
}

/* shaoho */
.shaoho .card dl.edit {
	border-bottom: 1px solid #CCC;
	padding-bottom: 10px;
	padding-top: 10px;
}
.shaoho .card dl.edit dt {
	width: 9em;
}
.shaoho .card dl.edit dd {
	margin-left: 9em;
}
.shaoho .card dl.edit:last-child {
	border-bottom: none;
}
.shaoho .card .btn-area .btn {
	margin: 0 2px;
	width: 4.5em;
}


/* gaiyao */
.area {
	padding: 50px;
}
/* login */
#login header {
	border-bottom: none;
}
.login-box {
	max-width: 500px;
	margin: 100px auto 0;
	padding:70px;
	background: #FFFFFF;
	border-radius: 5px;
	position: relative;
}
.icon_lock {	
	color: #565656;
	width: 110px;
	height: 110px;
	padding: 20px;
	text-align: center;
	border: 4px solid #B4E0DB;
	background: #FFFFFF;
	border-radius: 100px;
	position: absolute;
	top: -55px;
	left: 200px;
	text-align: center;
}
.login-box span {
	margin-bottom: 5px;
	display: inline-block;
}
.login-box a {
	color: #565656;
}
.login-box a:link 		{ text-decoration:underline;}
.login-box a:visited 		{ text-decoration:underline;}
.login-box a:hover		{ text-decoration: none;}
.login-box a:active 		{ text-decoration: none;}

/* #index */
.user {
	background: #F3FAFD;
}
.user p {
	text-align: center;
	margin: 10px auto;
}
.topics h2 {
	font-size: 21px;
	color: #FFF;
	border-bottom: 2px solid #FFF;
	margin-top: 0;
	text-align: center;
}
.topics .details {
	border-left: 1px dotted #FFFFFF;
	padding-left: 50px;
}
.topics dl.edit {
	margin: 0;
}
body#index .topics .details a:link		{ color: #FFFFFF; text-decoration:underline; }
body#index .topics .details a:visited 	{ color: #FFFFFF; text-decoration:underline; }
body#index .topics .details a:hover 		{ color: #FFFFFF; text-decoration: none; }
body#index .topics .details a:active 	{ color: #FFFFFF; text-decoration: none; }

body.sub .topics a:link 		{ text-decoration:underline;}
body.sub .topics a:visited 		{ text-decoration:underline;}
body.sub .topics a:hover		{ text-decoration: none;}
body.sub .topics a:active 		{ text-decoration: none;}

.video h2 {
	font-size: 21px;
	border: none;
	margin-bottom: 0;
}
.video p {
	text-align: left;
}
.online .col-lg-4 {
	padding: 0 5px;
	margin-bottom: 10px;
}
.online .subject {
	font-size: 22px;
	line-height: 1.4em;
	margin-bottom: 0;
	color: #19a78e;
	font-weight: bold;
	letter-spacing: 1px;
}
.online i.fas fa-check-square {
	color: #3C0;
}
.online .card-header {
	border: none;
	background: #FFFFFF;
	padding-bottom: 0;
}
#index .online .card-body {
	padding: 1.5em;
	padding-top: 0.5em;
}
.online .button-group.card-footer {
	padding-left: 1rem;
	padding-right: 1rem;
	background: #FFF;
}
.online .button-group .btn {
	font-weight: bold;
	font-size: 0.9em;
	width: 110px;
	margin: 3px 0;
}
.online #online_01 .category,
.online #online_02 .category {
	padding-top: 0;
}
.modal-title {
	color: #19a78e;
	font-weight:bold;
}
.modal-body .subject {
	font-size: 1.5em;
}
.modal-body .gaiyao {
	font-size: 1.1em;
	border-left: 1px solid #CCC;	
	line-height: 1.8em;
}

/* subページ */
body.sub .online p.subject {
	font-size: 28px;
}
.question {
	font-size: 1.2em;
	font-weight: normal;
}
.question .card {
	margin-bottom: 15px;
}
.custom-control {
	min-height: 2rem;
}

.custom-control label {
	padding-left: 5px;	
	cursor:	pointer;
}
.custom-control label:before {
	width: 20px;
	height: 20px;
	margin-top: 2px;
	
}
.custom-control-label::after {
    width: 1.5rem;
    height: 1.5rem;
}
#grade {
	text-align: center;
	font-weight: bold;
	max-width: 300px;
	text-align: center;
	margin: auto;
}
#grade .card-header {
	font-size: 1.5em;
	background: #FFFFFF;
	color: #333333;
	padding: 15px 15px 10px 15px;
}
#grade .card.pass {
	border: 5px solid #dc3545;
}
#grade .card.failure {
	border: 5px solid #6c757d;
}
#grade .card-header span {
	font-size: 1.8em;
	color: #dc3545;
}
#grade .card-body {
	font-size: 3em;
	padding-bottom: 10px;
}
.register {
	font-size: 1.1rem;
}
.register h3 {
	margin: 1rem 0;
}
.register h4 {
	font-size: 1.2rem;
	color: #333;
}
.register .card-body {
	color: #565656;
}
.register .edit.btn {
	width: 80px;
}
.register .input-group label {
	width: 6em;
}
.register p.subtitle {
	background: #EEEEEE;
	padding: 1px 5px;
	margin-bottom: 5px;
	font-size:0.9em;
}
.register p.subtitle .badge {
	font-size: 0.9em;
}
#contact .card {
	font-size: 1.1em;
	font-weight: normal;
}
#contact .card h4 {
	font-size: 1em;
	font-weight: bold;
}
.con_tel {
	font-size: 3em;	
	color: #565656;
}
.con_tel .icon_tel {
	width: 95px;
	height: 95px;
	padding: 15px;
	text-align: center;
	border: 4px solid #565656;
	border-radius: 100px;
}
.con_time .left {
	text-align: right;
}

#privacy h3 {
	font-size: 1.5em;
	border-bottom: 4px solid #DDDDDD;
	padding-bottom: 0.5em;
	margin-bottom: 15px;
}
#privacy .card {
	margin-bottom: 15px;
}
<!-- shaoho -->
.shaoho .card-body {
	background: #333;
	
}
.form-row.is-invalid .invalid-feedback,
.form-group.is-invalid .invalid-feedback{
    display: block;
}