@charset "utf-8";

/* 목록 */
.fab.fa-youtube { position: relative; top: 2px; color: #d90000; margin-right: 2px;}
.fas.fa-external-link-alt { position: relative; top: 1px; color: #616fa7; }
table.vertic-table tbody tr td a.link { color: #1f5eb3; }
table.vertic-table tbody tr td a.link:hover { text-decoration: underline; }

.teacher-list ul li { float: left; width: -webkit-calc(50% - 10px); width: calc(50% - 10px); margin-right: 20px; margin-bottom: 20px; border-bottom: 1px solid #dee3eb;}
.teacher-list ul li:nth-child(2n) { margin-right: 0; }
.teacher-list ul li .profile-table table.vertic-table { table-layout: fixed; margin-top: 0; border-top: 1px solid #333;}
.teacher-list ul li .profile-table table.vertic-table tbody tr th.img-area img { max-width: 200px; max-height: 250px; width: 100%; }
.teacher-list ul li .profile-table table.vertic-table tbody tr th.img-area { position: relative; width: 230px; height: 100%; background: #fff; border-right: 1px solid #dee3eb; cursor: pointer; overflow: hidden; }
.teacher-list ul li .profile-table table.vertic-table tbody tr th.img-area .hover-box { position: absolute; bottom: 0; left: 0; text-align: center; width: 100%; height: 30px; line-height: 33px; background: rgba(0,0,0,0.5); color: #fff; -webkit-transition: bottom 0.3s; -o-transition: bottom 0.3s; transition: bottom 0.3s; }
.teacher-list ul li .profile-table table.vertic-table tbody tr td { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.teacher-list ul li .profile-table table.vertic-table tbody tr td.history .ellipsis { vertical-align: top; line-height: 1.5; white-space: normal; display: -webkit-box; height: 108px; -webkit-box-orient: vertical; -webkit-line-clamp: 5; white-space: pre-wrap;}
.no-one-alert { text-align: center; width: 100%; font-size: 20px; }

.search-wrap02.search-wrap { margin-bottom: 15px; }
.search-wrap02.search-wrap .result-area { margin-top: 18px; float: left; }
.search-wrap02.search-wrap .result-area span.notice { font-size: 1.3rem; color: #b81010; margin-top: 0; font-weight: 500; display: inline-block; margin-left: 10px; }
.search-wrap02.search-wrap .btn-wrap { float: right; margin-top: 0; }

.search-wrap01.search-wrap .category-area { float: left; display: table; width: 100%; margin-top: 20px; font-size: 1.4rem; }
.search-wrap01.search-wrap .category-area .title {  text-align: center; display: table-cell; vertical-align: middle; background: #21537f; padding: 13px 0 ; color: #fff; font-weight: 600; min-width: 75px;}
.search-wrap01.search-wrap .category-area ul { display: table-cell; vertical-align: middle; background: #e5ecf4; padding: 0 25px; }
.search-wrap01.search-wrap .category-area ul li { display: inline-block; }
.search-wrap01.search-wrap .category-area ul li a { position: relative; display: block; padding: 15px 0; margin: 0 10px; }
.search-wrap01.search-wrap .category-area ul li a:after { width: 0; content: ''; position: absolute; bottom: 15px; left: -5px; height: 5px; border-radius: 10px; background: rgba(0,107,214,0.2); -webkit-transition: width .3s; -o-transition: width .3s; transition: width .3s; }
.search-wrap01.search-wrap .category-area ul li:hover,
.search-wrap01.search-wrap .category-area ul li.select a { font-weight: 600; color: #023c6f; }
.search-wrap01.search-wrap .category-area ul li:hover a:after,
.search-wrap01.search-wrap .category-area ul li.select a:after { width: -webkit-calc(100% + 10px); width: calc(100% + 10px); }


/* 상세페이지 */
.detail-cont-area .textarea { padding: 15px; background: #f2f2f2; min-height: 200px; font-size: 1.3rem; line-height: 1.7; white-space: pre-wrap;}
.teacher-detail.teacher-list ul li { float: none; width: 100%; margin: 0; }
.teacher-detail.teacher-list ul li .profile-table table.vertic-table tbody tr .row-history { display: none; }
.teacher-detail.teacher-list ul li .profile-table table.vertic-table tbody tr th.img-area { height: 100%; cursor: unset; }
.teacher-detail.teacher-list ul li .profile-table table.vertic-table tbody tr th.img-area img{max-width: 200px;max-height: 250px;width: 100%;}
.teacher-detail.teacher-list ul li .profile-table table.vertic-table tbody tr td { text-overflow: unset; white-space: normal; }

.comment-wrap { position: relative; }
.comment-wrap .box { position: relative; padding: 20px; background: #f2f2f2; margin-bottom: 20px; }
.comment-wrap .box .top { padding-bottom: 12px; margin-bottom: 15px; border-bottom: 1px dashed #b6b6b6; }
.comment-wrap .box .top .name { font-size: 1.5rem; margin-right: 10px; font-weight: 600; }
.comment-wrap .box .top .star i { font-size: 1.5rem; color: #ffbd17; }
.comment-wrap .box .top .star i.emp { color: #bfbfbf; }
.comment-wrap .box .top .star .total { font-size: 1.2rem; color: #999; margin-left: 5px; }
.comment-wrap .box .comment-area { line-height: 1.8; white-space: pre-wrap;}
.comment-wrap .remove-btn {float:right; margin-right: 20px; font-size: 1.5rem; text-decoration: underline;}


/* 코멘트등록 레이어 팝업 */
.layer-pop-wrap .layer-box .body { text-align: center; }
.layer-pop-wrap .layer-box .body .tit { display: block; margin-bottom: 20px; font-size: 1.3rem; color: #777; }
.layer-pop-wrap .layer-box .body .star i { font-size: 4rem; color: #ffbd17; cursor: pointer; margin: 0 3px; }
.layer-pop-wrap .layer-box .body .star i.emp { color: #bfbfbf; }
.layer-pop-wrap .layer-box .body .star .total { display: block; margin-top: 20px; font-size: 1.7rem; color: #333; }


/* 강사 신청 */
.apply-cont-title .title .btn-wrap { position: absolute; top: -10px; right: 0; margin-top: 0; }
table.apply-table tbody tr td .text-btn-input .phone-wrap span.unit { position: relative; top: 5px; margin: 0 5px; }
table.apply-table tbody tr td .email-wrap { display: inline-block; position: relative; padding-left: 17px; }
table.apply-table tbody tr td .email-wrap:after { content: '@'; position: absolute; top: 6px; left: 0; }
table.apply-table tbody tr td .email-wrap .select-box { margin-right: 5px; float: none; }
table.apply-table tbody tr td .email-wrap .select-box select { border-radius: 5px; }
.terms-wrap { padding: 15px; border-radius: 10px; background: #f8f8f8; margin-top: 20px; }
.terms-wrap .check-input-wrap { position: relative; }
.terms-wrap .check-input-wrap .check-input .more { position: absolute; top: 11px; right: 0; text-decoration: underline; color: #999; }



@media all and (max-width: 1024px) {
	.teacher-list ul li .profile-table table.vertic-table tbody tr th.img-area { width: 150px; }
}
@media all and (max-width: 870px) {
	table.apply-table tbody tr td input[type="text"].text-input.email-input { width: 150px; }
}
@media all and (max-width: 768px) {
	.search-wrap01.search-wrap .category-area ul { padding: 0 15px; }
	.search-wrap02.search-wrap .btn-wrap { margin-top: 0; float: right; }
	.search-wrap02.search-wrap .result-area span.notice { margin-left: 0; }
	.teacher-list ul li { margin-right: 0; width: 100%; }

	
	table.apply-table input[type="text"].text-input.etc-input { width: 100%; margin-top: 10px; }
}
@media all and (max-width: 600px) {
	table.apply-table tbody tr td input[type="text"].m-width,
	table.apply-table tbody tr td input[type="text"].calendar-input { width: 100%; }
	table.apply-table tbody tr td .file-input { width: 100%; }
	.apply-cont-title .title .btn-wrap { top: -3px; }
	.apply-cont-title .title .btn-wrap button { height: 28px; }
}
@media all and (max-width: 475px) {
	.search-wrap01.search-wrap .category-area ul { padding: 5px 10px; }
	.search-wrap01.search-wrap .category-area ul li a { padding: 10px 0; }
	.search-wrap01.search-wrap .category-area ul li a:after { bottom: 10px; }
	.teacher-list ul li .profile-table table.vertic-table tbody tr th { width: 60px; }
	.teacher-list ul li .profile-table table.vertic-table tbody tr th.img-area { width: 110px; }
	.teacher-list ul li .profile-table table.vertic-table tbody tr td { padding: 7px; }
	.comment-wrap .box { padding: 15px; }
	.layer-pop-wrap table.vertic-table tbody tr th { width: 65px; }

	table.apply-table tbody tr td input[type="text"].text-input.email-input { width: 100%; margin-bottom: 10px; }
	table.apply-table tbody tr td .email-wrap { padding: 0; width: 100%; }
	table.apply-table tbody tr td .email-wrap .select-box { width: 100%; }
	table.apply-table tbody tr td .email-wrap:after { display: none; }
}
@media all and (max-width:330px) {
	.layer-pop-wrap .layer-box .body .star i { font-size: 3rem; }
	table.apply-table tbody tr td input[type="text"].text-input { width: auto; }
}


/* intro-banner */
.intro-banner .tit { background-size: 150px 25px; }