@charset "UTF-8";
/* page dashboard */
.nc-t-card.card-dashboard-1 {
	position: relative;
	box-shadow: 0 0 6px rgba(0,0,0,.2);
}
.nc-t-card.card-dashboard-1 .text-1 {
	display: inline-block;
	font-size: 1.8rem;
	color: #777;
}
.nc-t-card.card-dashboard-1 .text-2 {
	font-size: 4.2rem;
	font-weight: 600;
	line-height: 1.1;

}
.nc-t-card.card-dashboard-1 .text-2 .text-2-1 {
	font-size: 3rem;
}
.nc-t-card.card-dashboard-1 .text-3 {
	font-size: 1.8rem;
}
.nc-t-card.card-dashboard-1 .top-area {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.nc-t-card.card-dashboard-1 .main-number {
	position: relative;
}
.nc-t-card.card-dashboard-1 .main-number > [class^="text-"] {
	position: relative;
	z-index: 1;
}
.nc-t-card.card-dashboard-1 .main-number > .icon-1 {
	position: absolute;
	z-index: 0;
	width: 4rem;
	top: 0rem;
	right: 0;
}
.nc-t-card.card-dashboard-1 + .dashboard-detail-box-1{
	margin-top: 16px;
}
.dashboard-target-income-list > li {
	text-align: center;
}
.dashboard-target-income-list > li:first-child {
	text-align: left;
}
.dashboard-target-income-list > li + li {
	border-left: 1px solid #E4E6E9;
}
.dashboard-target-income-list > li > .item-inner {
	display: inline-block;
	text-align: left;
}
.dashboard-target-income-list .text-1 {
	font-size: 1.8rem;
	color: #777;
}
.dashboard-target-income-list .text-2 {
	font-size: 4.2rem;
	font-weight: 600;
	line-height: 1.2;
}
.dashboard-target-income-list .text-2 .text-2-1 {
	font-size: 3rem;
}
.dashboard-target-income-list .text-3 {
	font-size: 1.8rem;
}
.dashboard-target-income-list .progress{
	background: #DCDCDC;
	border-radius: 4px;
	overflow: hidden;
	height: 8px;
}
.dashboard-target-income-list .progress .progress-bar{
	background: linear-gradient(to right, #3582CF, #31D18E);
	border-radius: 4px;
}
.nc-t-tooltip.tooltip-rating-detail {
	width: 35rem;
	max-width: unset;
	min-width: unset;
	padding: 1.5rem;
	z-index: 2000;
	box-shadow: 0 0 11px rgba(0,0,0, .29);
}
/* page open space common */
.open-space-profile {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.open-space-profile .profile-text {
	padding-left: 2rem;
}
.open-space-profile .user-name {
	font-size: 1.6rem;
	color: #404040;
}
.open-space-profile .post-time {
	font-size: 1.4rem;
	color: #949494;
}
/* page open space home */
.open-space-q-list-1 {

}
.open-space-q-list-1 > li + li {
	border-top: 1px solid #ddd;
}
.open-space-q-list-1 .q-box {
	padding: 2rem 0 2.5rem;
}
.open-space-q-list-1 .q-title {
	font-size: 2.4rem;
	font-weight: 600;
	line-height: 1.4;
}
.open-space-q-list-1 .q-title > a {
	color: #404040;
	transition: color .2s ease-in;
}
.open-space-q-list-1 .q-title > a:hover {
	color: #1DABBB;
}
.open-space-q-list-1 .q-info {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 1rem;
}
.open-space-q-list-1 .q-number {

}
.open-space-q-list-1 .q-number .number-value {
	display: inline-block;
	font-size: 1.6rem;
	font-weight: normal;
	line-height: 2.5rem;
	padding-left: 2.5rem;
	background-image: url(../images/icon/thumbs-up.svg);
	background-repeat: no-repeat;
	background-size: 2rem auto;
	background-position: left 0 top 50%;
}
.open-space-q-list-1 .q-number .number-value.thumb {
	background-position: left 0 top calc(50% - .2rem);
}
.open-space-q-list-1 .q-number .number-value.comment {
	background-image: url(../images/icon/comment-2-grey.svg);
}
.open-space-q-list-1 .q-number .number-value + .number-value {
	margin-left: 1rem;
}
.open-space-q-list-1 .q-preview {
	font-size: 1.6rem;
	color: #949494;
	margin-top: 1rem;
}
.open-space-q-list-1 .q-tag {
	margin-top: 1rem;
}
.open-space-q-list-2 {
	font-size: 1.6rem;
	line-height: 1.4;
	padding-left: 1.3rem;
}
.open-space-q-list-2 > li {
	position: relative;
}
.open-space-q-list-2 > li:before {
	content: "";
	display: block;
	position: absolute;
	width: .6rem;
	height: .6rem;
	border-radius: .3rem;
	background-color: #1DABBB;
	top: .5em;
	left: -1.3rem;
}
.open-space-q-list-2 > li + li {
	margin-top: 1rem;
}
.open-space-q-list-2 > li > a {
	color: #949494;
	transition: color .2 ease-in;
}
.open-space-q-list-2 > li > a:hover {
	color: #1DABBB;
}
/* page open space detail */
.open-space-author-box .q-title {
	font-size: 2.4rem;
	font-weight: 600;
	line-height: 1.4;
	color: #404040;
	margin-bottom: 1rem;
}
.open-space-author-box .q-detail {
	margin: 1rem 0;
}
.open-space-author-box .q-detail > p + p {
	margin-top: .5rem;
}
.open-space-input-box {

}
.open-space-input-box input.nc-t-form-control {
	height: 4.8rem;
}
.open-space-input-box .input-area {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.open-space-input-box .input-area > .user-img {
	flex-shrink: 0;
}
.open-space-input-box .input-area > .user-input {
	flex: 1;
	padding-left: 1rem;
}
.open-space-input-box .btn-area {
	display: none;
	margin-top: 1.2rem;
	text-align: right;
	font-size: 0;
}
.open-space-input-box .btn-area > .nc-t-btn + .nc-t-btn {
	margin-left: 1.2rem;
}
.open-space-comment-list {

}
.open-space-comment-list.reply-list {
	padding: 0 0 0 6rem;
}
.open-space-comment-list > li {
	padding: 2rem 0;
}
.open-space-comment-list > li + li {
	border-top: 1px solid #ddd;
}
.open-space-comment-list .comment-box {
	
}
.open-space-comment-list .comment-detail,
.open-space-comment-list .action-area {
	margin-top: 1rem;
}
.open-space-comment-success {
	display: block;
	position: fixed;
	background-color: rgba(0,0,0,.8);
	max-width: calc(100vw - 4rem);
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	text-align: center;
	font-size: 1.6rem;
	line-height: 1.6;
	padding: 1.5rem 3rem;
	border-radius: .8rem;
}
/*-- open space rules --*/
.article-open-space-rules .icon-1 {
	max-width: 5.8rem;
	margin: 2rem auto;
}
/*-- page contents --*/
.page-contents .contents-desc{
	font-size: 1.5rem;
	line-height: 1.5;
	padding: 0 0 10px;
	margin-bottom: 15px;
	color: #999;
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.page-contents .contents-desc .instruction-wrap{
	top: 0;
	right: 0;
	color: #8E8E8E;
}
.page-contents .contents-desc .instruction-wrap + .instruction-wrap{
	margin-top: 1.2rem;
}
.page-contents .sort-select-message-list{
	display: flex;
	align-items: center;
}
.sort-select{
	border: #E4E6E9 1px solid;
}
.period-select{
	border: #E4E6E9 1px solid;
}
/*-- instruction video --*/
.instruction-wrap{
	color: #333;
	border-radius: 5px;
	font-weight: normal;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.instruction-wrap .video-item-wrap{
	display: inline-block;
	white-space: nowrap;
	margin-left: 5px;
}
.instruction-wrap .video-item-wrap > a > img{
	vertical-align: middle;
}
.instruction-wrap .video-item-wrap > a[target="_blank"]:after{
	content: none;
}
.instruction-wrap .fa-youtube-play{
	color: #4C4C4C;
	font-size: 20px;
	font-size: 2rem;
	vertical-align: middle;
	padding: 0 0 2px;
}
/* dashboard progress circle */
.dashboard_wrap .box_achieved .circle_achieved{
	position: relative;
}
.dashboard_wrap .box_achieved .circle_achieved .num_progress{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	font-size: 5.4rem;
	font-weight: 600;
}
/* page sub */
.page-contents{
	padding: 3.6rem 4rem;
}
.page-contents .page-ttl{
	font-size: 3rem;
	font-weight: 600;
	color: #404040;
}
/*-----------------------------------------*/
/* search-data
/*-----------------------------------------*/
.search-data{
	background: #f5f5f5;
	padding: 10px;
	border-radius: 4px;
	overflow: hidden;
}
.sec_lesson_log .search-data{
	overflow-x: auto;
}
.search-data table{
	margin: 0 auto;
}
.search-data table th{
	padding-right: 15px;
	white-space: nowrap;
}
.search-data table td{
	padding-right: 15px;
	white-space: nowrap;
}
.search-data table td input{
	display: inline-block;
	background: #fff;
}
/*----------------------------------------*/
/* data table
/*----------------------------------------*/
.data-table table{
	width: 100%;
	table-layout: fixed;
	text-align: center;
	background: #fff;
	font-size: 12px;
}
.data-table table thead tr th{
	background: #f5f5f5;
	color: #999;
	border: #ccc solid 1px;
	height: 100px;
    /*vertical-align: text-bottom;*/
    width: 80px;
	text-align: center;
	line-height: 1.5;
}
.data-table table tbody tr td{
	padding: 10px 10px;
	border: #ccc solid 1px;
	line-height: 1.5;
	/*word-break: break-all;*/
	word-wrap: break-word;
}
.data-table .status-lesson-end--ok{
}
.data-table .status-lesson-end--ng{
	font-weight: bold;
	color: #f00;
}
.data-table .red{
	color: #f00;
}
.li-table {
 	width: 1135px;
    display: block;
}
/* request setting */
.single-line {
	display: flex;
	align-items: center;
}
.single-line .form-group {
	display: flex;
    align-items: center;
    gap: 5px;
    margin-left: 10px;
}
.time-from, .time-to {
	min-width: 180px;
    height: 36px;
}
#page_contents--request_setting .contents_inner {
	width: fit-content;
	text-align: center;
}
#page_contents--request_setting .contents_inner .btn_add{
	background: #F28A10;
    min-width: 100px;
    font-size: 18px;
    font-weight: normal;
    line-height: 1.5;
    padding: 2px;
    height: auto;
	text-shadow: none;
}
#page_contents--request_setting .contents_inner .btn_del{
	background: grey;
    min-width: 100px;
    font-size: 18px;
    font-weight: normal;
    line-height: 1.5;
    padding: 2px;
    height: auto;
	margin-left: 20px;
	text-shadow: none;
}
 /* request */
.request-list .data-list-wrap .data-titles{
	margin-bottom: 2rem;
}
.request-list .data-list-wrap .data-titles > ul{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.request-list .data-list-wrap .data-contents + .data-contents{
	margin-top: 1.2rem;
}
.request-list .data-list-wrap .data-contents > ul{
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #FFF;
	border-radius: 4px;
	font-size: 1.4rem;
	padding: 1.5rem 0rem;
}
.request-list .data-list-wrap .data-titles > ul > li{
	display: inline-block;
	font-size: 1.4rem;
	font-weight: 600;
	color: #8E8E8E;
}
.request-list .data-list-wrap .data-titles > ul > li.title-student,
.request-list .data-list-wrap .data-contents > ul > li.data-student{
	width: 14%;
	padding-left: 4rem;
}
.request-list .data-list-wrap .data-titles > ul > li.title-tab-category,
.request-list .data-list-wrap .data-contents > ul > li.data-tb-category{
	width: 10%;
}
.request-list .data-list-wrap .data-titles > ul > li.title-chapter,
.request-list .data-list-wrap .data-contents > ul > li.data-chapter{
	width: 14%;
}
.request-list .data-list-wrap .data-titles > ul > li.title-created-time,
.request-list .data-list-wrap .data-contents > ul > li.data-created-time{
	width: 15%;
}
.request-list .data-list-wrap .data-titles > ul > li.title-time,
.request-list .data-list-wrap .data-contents > ul > li.data-time{
	width: 15%;
}
.request-list .data-list-wrap .data-titles > ul > li.title-status,
.request-list .data-list-wrap .data-contents > ul > li.data-status{
	width: 18%;
}
.request-list .data-list-wrap .data-titles > ul > li.title-lesson-request,
.request-list .data-list-wrap .data-contents > ul > li.data-lesson-request{
    width: 15%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.4rem;
}
.request-list .data-list-wrap .data-contents > ul > li.data-lesson-request.accepted{
	justify-content: center;
}
.request-list .data-list-wrap .data-contents > ul > li.data-lesson-request .btn-cancel {
    background: #ccc;
    width: 100px;
    height: 37px;
	border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.request-list .data-list-wrap .data-contents > ul > li.data-lesson-request .btn-accept {
	color: white;
	background: #FF1C1C;
    width: 100px;
    height: 37px;
	border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.request-list .data-list-wrap .data-titles > ul > li.title-ncc,
.request-list .data-list-wrap .data-contents > ul > li.data-ncc{
	width: 10%;
}
.request-list .data-list-wrap .data-contents > ul > li.data-status{
	display: flex;
	align-items: center;
}
.request-list .data-list-wrap .data-contents > ul > li.data-status:before{
	content: "";
	width: 1rem;
	height: 1rem;
	display: block;
	background: #ccc;
	border-radius: 50%;
	margin-right: .8rem;
}
.request-list .data-list-wrap .data-contents > ul > .data-student{
	display: flex;
	align-items: center;
}
.request-list .data-list-wrap .data-contents > ul > .data-student .img-wrap{
	width: 100%;
	height: 70px;
	max-width: 70px;
	max-height: 70px;
	border-radius: 50%;
	box-shadow: 0 1px 8px rgb(0 0 0 / 16%);
	overflow: hidden;
	margin-right: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.request-list .data-list-wrap .data-contents > ul > .data-student .img-wrap > img{
	width: 100%;
}
.request-list .data-list-wrap .data-contents > ul > .data-chapter{
	color: #F1890E;
	/* margin-right: 9.1rem; */
}
.request-list .data-list-wrap .data-contents > ul > li a{
	color: #F1890E;
	word-break: break-word;
}
.request-list .data-list-wrap .data-contents > ul > li a:hover{
	opacity: .6;
}

/*reservation list table */
.lesson-history th,
.reservation-list th {
	padding: 15px;
}

.lesson-history td,
.reservation-list td{
	text-align: center;
	padding:15px;
}

.lesson-history table,
.reservation-list table{
	border-collapse: separate !important;
  	border-spacing: 0px 15px !important;
}

.lesson-history tr,
.reservation-list tr{
	border-radius: 4px;

}

.reservation-list .lsn-content-row{
	background: #FFF;
	padding: 15px 0px !important;
}


.lesson-history .lsn-table .lsn-title,
.reservation-list .lsn-table .lsn-title{
	font-size: 1.4rem !important;
	font-weight: 600 !important;
	color: #8E8E8E !important;
}

.lesson-history .lsn-table .lsn-contents,
.reservation-list .lsn-table .lsn-contents{
	font-size: 1.8rem;
	color: #404040;
	line-height: 1.6;
}


.lesson-history .sticky-wrap,
.reservation-list  .sticky-wrap{
	overflow-x: auto;
	overflow-y: hidden;
	left:0;
	right: 0;
	position:relative;display: block;
	max-width: 1590px !important;    
	margin-bottom: 20px;
	margin:auto;
}


.lesson-history .sticky-wrap .sticky-table-top-left-1,
.reservation-list .sticky-wrap .sticky-table-top-left-1{
    position: sticky;
    left: 0;
   	top: 0;
   	z-index: 1;
}


.lesson-history .sticky-wrap .sticky-table-top-right,
.reservation-list .sticky-wrap .sticky-table-top-right{
	position: sticky;
	right: 0;
	top: 0;
	z-index: 1;
}


.lesson-history  .data-name,
.reservation-list  .data-name-row {
	display: flex !important;
	align-items: center !important;
}

.lesson-history .lsn-contents .img-wrap > img ,
.reservation-list .lsn-contents .img-wrap > img {
	width: 100%;
	text-align: left !important;
}


/* reservation */
.page-contents--reservation{
	padding: 3.6rem 4rem;
}
.page-contents--reservation .page-ttl{
	font-size: 3rem;
	font-weight: 600;
	color: #404040;
}
.reservation-list .data-list-wrap .data-titles {
	margin-bottom: 2rem;
}
.reservation-list .data-list-wrap .data-titles > ul{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.reservation-list .data-list-wrap .data-contents + .data-contents{
	margin-top: 1.2rem;
}
.reservation-list .data-list-wrap .data-contents > ul{
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #FFF;
	border-radius: 4px;
	font-size: 1.8rem;
	padding: 1.5rem 0rem;
}
.reservation-list .data-list-wrap .data-titles > ul > li{
	display: inline-block;
	font-size: 1.4rem;
	font-weight: 600;
	color: #8E8E8E;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-id,
.reservation-list .data-list-wrap .data-contents > ul > li.data-id,
.reservation-list .lsn-table td.title-id,
.reservation-list .lsn-table td.data-id{
	width: 14%;
	padding-left: 4rem;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-name,
.reservation-list .data-list-wrap .data-contents > ul > li.data-name,
.reservation-list .lsn-table td.title-name,
.reservation-list .lsn-table td.data-name{
	width: 10%;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-tb-category,
.reservation-list .data-list-wrap .data-contents > ul > li.data-tb-category,
.reservation-list .lsn-table td.title-tb-category,
.reservation-list .lsn-table td.data-tb-category{
	width: 10%;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-chapter,
.reservation-list .data-list-wrap .data-contents > ul > li.data-chapter,
.reservation-list .lsn-table td.title-chapter,
.reservation-list .lsn-table td.data-chapter{
	width: 10%;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-created-time,
.reservation-list .data-list-wrap .data-contents > ul > li.data-created-time,
.reservation-list .lsn-table td.title-created-time,
.reservation-list .lsn-table td.data-created-time{
	width: 15%;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-time,
.reservation-list .data-list-wrap .data-contents > ul > li.data-time,
.reservation-list .lsn-table td.title-time,
.reservation-list .lsn-table td.data-time{
	width: 12%;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-status,
.reservation-list .data-list-wrap .data-contents > ul > li.data-status,
.reservation-list .lsn-table td.title-status,
.reservation-list .lsn-table td.data-status-wrap{
	width: 18%;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-lesson-type,
.reservation-list .data-list-wrap .data-contents > ul > li.data-lesson-type,
.reservation-list .lsn-table td.title-lesson-type,
.reservation-list .lsn-table td.data-lesson-type{
	width: 8%;
}
.reservation-list .data-list-wrap .data-titles > ul > li.title-ncc,
.reservation-list .data-list-wrap .data-contents > ul > li.data-ncc,
.reservation-list .lsn-table  td.title-ncc,
.reservation-list .lsn-table  td.data-ncc{
	/*width: 10%;*/
	width: 16%;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status,
.reservation-list .lsn-table .lsn-contents > div.data-status,
.lesson-history .lsn-table .lsn-contents > div.data-status{
	display: flex;
	align-items: center;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status:before,
.reservation-list .lsn-table .lsn-contents > div.data-status:before,
.lesson-history .lsn-table .lsn-contents > div.data-status:before{
	content: "";
	width: 1rem;
	height: 1rem;
	display: none;
	background: #ccc;
	border-radius: 50%;
	margin-right: .8rem;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status.status-cancel:before,
.reservation-list .lsn-table .lsn-contents > div.data-status.status-cancel:before,
.lesson-history .lsn-table .lsn-contents > div.data-status.status-cancel:before{
	background: #FF1C1C;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status.status-finish:before,
.reservation-list .lsn-table .lsn-contents > div.data-status.status-finish:before,
.lesson-history .lsn-table .lsn-contents > div.data-status.status-finish:before{
	background: #6E6BF8;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status .info-wrap,
.reservation-list .lsn-table .lsn-contents > div.data-status .info-wrap,
.lesson-history .lsn-table .lsn-contents > div.data-status .info-wrap{
	display: none;
	position: relative;
	cursor: pointer;
	transition: 0.2s all linear;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status .info-wrap .info-balloon,
.reservation-list .lsn-table .lsn-contents > div.data-status .info-wrap .info-balloon,
.lesson-history .lsn-table .lsn-contents > div.data-status .info-wrap .info-balloon{
	position: absolute;
	bottom: calc(100% + 1.5rem);
	right: -2rem;
	background: #707070;
	border-radius: 1rem;
	padding: 1rem 1.2rem;
	font-size: 1.6rem;
	color: #FFF;
	line-height: 1.7;
	width: max-content;
	max-width: 25rem;
	display: none;
	transition: 0.2s all linear;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status .info-wrap .info-balloon:after,
.reservation-list .lsn-table .lsn-contents > div.data-status .info-wrap .info-balloon:after,
.lesson-history .lsn-table .lsn-contents > div.data-status .info-wrap .info-balloon:after{
	content: "";
	width: 0;
	height: 0;
	border: 1rem solid transparent;
	border-top-width: 1.3rem;
	border-top-color: #707070;
	position: absolute;
	top: 100%;
	right: 2rem;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status .info-wrap:hover .info-balloon,
.reservation-list .lsn-table .lsn-contents > div.data-status .info-wrap:hover .info-balloon,
.lesson-history .lsn-table .lsn-contents > div.data-status .info-wrap:hover .info-balloon{
	display: block;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status .info-wrap > img,
.reservation-list .lsn-table .lsn-contents > div.data-status .info-wrap > img,
.lesson-history .lsn-table .lsn-contents > div.data-status .info-wrap > img{
	width: 1.8rem;
	margin-left: 1rem;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status > span,
.reservation-list .lsn-table .lsn-contents > div.data-status > span,
.lesson-history .lsn-table .lsn-contents > div.data-status > span{
	width: auto;
}
/* history */
.reservation-history .data-list-wrap .data-titles > ul > li.title-id,
.reservation-history .data-list-wrap .data-contents > ul > li.data-id,
.reservation-list .lsn-table  td.title-id,
.reservation-list .lsn-table  td.data-id{
	width: 15%;
	padding-left: 4rem;
}
.reservation-history .data-list-wrap .data-titles > ul > li.title-name,
.reservation-history .data-list-wrap .data-contents > ul > li.data-name,
.reservation-list .lsn-table  td.title-name{
	width: 14%;
}
.reservation-list .lsn-table  td.data-name{
	width:260px;
	margin-top:10%;
}
.reservation-history .data-list-wrap .data-titles > ul > li.title-tb-category,
.reservation-history .data-list-wrap .data-contents > ul > li.data-tb-category,
.reservation-list .lsn-table  td.title-tb-category,
.reservation-list .lsn-table  td.data-td-category{
	width: 14%;
}
.reservation-history .data-list-wrap .data-titles > ul > li.title-chapter,
.reservation-history .data-list-wrap .data-contents > ul > li.data-chapter,
.reservation-list .lsn-table  td.title-chapter,
.reservation-list .lsn-table  td.data-chapter{
	width: 16%;
}
.reservation-history .data-list-wrap .data-titles > ul > li.title-created-time,
.reservation-history .data-list-wrap .data-contents > ul > li.data-created-time,
.reservation-list .lsn-table  td.title-created-time,
.reservation-list .lsn-table  td.data-created-time{
	width: 16%;
}
.reservation-history .data-list-wrap .data-titles > ul > li.title-time,
.reservation-history .data-list-wrap .data-contents > ul > li.data-time,
.reservation-list .lsn-table  td.title-time,
.reservation-list .lsn-table  td.data-time{
	width: 14%;
}
.reservation-history .data-list-wrap .data-titles > ul > li.title-status,
.reservation-history .data-list-wrap .data-contents > ul > li.data-status{
	width: 16%;
}
.reservation-history .data-list-wrap .data-titles > ul > li.title-lesson-type,
.reservation-history .data-list-wrap .data-contents > ul > li.data-lesson-type,
.reservation-list .lsn-table  td.title-lesson-type,
.reservation-list .lsn-table  td.data-lesson-type{
	width: 16%;
}
.reservation-history .data-list-wrap .data-titles > ul > li.live-audience,
.reservation-history .data-list-wrap .data-contents > ul > li.live-audience,
.reservation-history .data-list-wrap .data-titles > ul > li.live-reward,
.reservation-history .data-list-wrap .data-contents > ul > li.live-reward{
	width: 14%;
}
.reservation-list .data-list-wrap .data-contents > ul > .data-name{
	display: flex;
	align-items: center;
	/* margin-right: 9.1rem; */
}
.reservation-list .data-list-wrap .data-contents > ul > .data-name .img-wrap,
.lesson-history .data-list-wrap .lsn-contents  .img-wrap,
.reservation-list .data-list-wrap .lsn-contents  .img-wrap{
	width: 100%;
	height: 100%;
	max-width: 78px;
	max-height: 78px;
	border-radius: 50%;
	box-shadow: 0 1px 8px rgb(0 0 0 / 16%);
	overflow: hidden;
	margin-right: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.reservation-list .data-list-wrap .data-contents > ul > .data-name .img-wrap > img,
.lesson-history .data-list-wrap .lsn-contents .img-wrap > img,
.reservation-list .data-list-wrap .lsn-contents .img-wrap > img{
	width: 100%;
}
.reservation-list .data-list-wrap .data-contents > ul > .data-tb-category{
	/* margin-right: 13.2rem; */
}
.reservation-list .data-list-wrap .data-contents > ul > .data-chapter{
	color: #F1890E;
	/* margin-right: 9.1rem; */
}
.reservation-list .data-list-wrap .data-contents > ul > li a{
	color: #F1890E;
	word-break: break-word;
}
.reservation-list .data-list-wrap .data-contents > ul > li a:hover{
	opacity: .6;
}
.reservation-list .data-list-wrap .data-contents > ul > .data-created-time{
	/* margin-right:9.6rem; */
}
/* page students info */
.page-students-info .data-tabs{
	position: relative;
}
.page-students-info .search-area{
	position: absolute;
	right: 0;
	bottom: 1.2rem;
}
.page-students-info .search-area .search-box{
	background: #FFF;
	border: #E4E6E9 solid 1px;
	border-radius: 5px;
	width: 28rem;
	height: 3.4rem;
}
.page-students-info .search-area .search-box input{
	border: none;
	padding: 1rem;
	width: 90%;
	height: 100%;
}
.page-students-info .search-area .search-box .icon{
	width: 1.46rem;
	height: 1.46rem;
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
}
.page-students-info .students-list-area > ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.page-students-info .students-list-area > ul > li{
	padding: 2rem;
	background: #FFF;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.1);
	width: 24%;
	min-width: 35rem;
	margin: 2rem 0;
}
.page-students-info .students-list-area > ul > li.is-empty {
	height: 0;
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 0;
	margin-bottom: 0;
}
.page-students-info .students-list-area > ul > li:last-child{
	margin-right: auto;
}
.page-students-info .students-list-area > ul > li .info-wrap{
	display: flex;
	border-bottom: #E4E6E9 solid 1px;
	padding-bottom: 2rem;
}
.page-students-info .students-list-area > ul > li .info-wrap .img-wrap > img{
	width: 12rem;
	margin-right: 2rem;
}
.page-students-info .students-list-area > ul > li .info-wrap .text-wrap{
	width: 100%;
}
.page-students-info .students-list-area > ul > li .info-wrap .text-wrap .text-name{
	font-size: 1.8rem;
	font-weight: 600;
	line-height: 1.7;
	padding: .8rem 0;
	border-bottom: 1px solid #E4E6E9;
	word-break: break-word;
}
.page-students-info .students-list-area > ul > li .info-wrap .text-wrap .text-lesson-data{
	padding-top: 1rem;
}
.page-students-info .students-list-area > ul > li .info-wrap .text-wrap .text-lesson-data .text-title{
	display: block;
	color: #8E8E8E;
	font-size: 1.2rem;
	margin-bottom: 1rem;
}
.page-students-info .students-list-area > ul > li .info-wrap .text-wrap .text-lesson-data .text-date{
	display: block;
	font-size: 1.4rem;
}
.page-students-info .students-list-area > ul > li .btn-wrap .btn-view-prof{
	display: block;
	border: #F1890E 1px solid;
	border-radius: 4px;
	color: #F1890E;
	font-weight: 600;
	text-align: center;
	padding: 1rem 0;
	margin-top: 2rem;
	cursor: pointer;
	transition: .2s all linear;
}
.passWordEditInfoContent input {
	display: block;
	margin-bottom: 8px;
	width: 40rem;
}
.passWordEditInfoContent input::placeholder {
	color: #AAAAAA;
}
.page-students-info .students-list-area > ul > li .btn-wrap .btn-view-prof:hover{
	opacity: .6;
}
.page-students-info .tab-blocked-list .students-list-area > ul > .list-item{
	position: relative;
}
.page-students-info .tab-blocked-list .students-list-area > ul > .list-item:before{
	content: "BLOCKED";
	position: absolute;
	right: 0;
	top: 1rem;
	display: block;
	width: 7rem;
	height: 2.4rem;
	line-height: 2.4rem;
	text-align: center;
	background-color: #FC1717;
	color: #FFF;
	border-radius: 1.2rem 0 0 1.2rem;
	font-size: 1.2rem;
	font-weight: 600;
}

/*-- student info detail --*/
.page-students-info-detail{
	max-width: 1265px;
	margin: auto;
}
.page-students-info-detail .student-info .col-wrap{
	display: flex;
}
.page-students-info-detail .student-info .col-wrap .col-left-area{
	margin-right: 4rem;
}
.page-students-info-detail .student-info .col-wrap .col-right-area{
	width: 100%;
}
.page-students-info-detail .student-info .student-data{
	min-width: 31.5rem;
	max-width: 35rem;
	/* background-color: #FFF;
	box-shadow: 0 2px 6px rgba(0,0,0,.16);
	padding: 4rem; */
}
.page-students-info-detail .student-info .student-data .thumb{
	width: 10rem;
	height: 10rem;
	border-radius: 50%;
	margin: 0 auto 1.5rem;
}
.page-students-info-detail .student-info .student-data .thumb > img{
	width: 100%;
	border-radius: 0.8rem;
}
.page-students-info-detail .student-info .student-data .name{
	font-size: 2.2rem;
	font-weight: 600;
	line-height: 1.7;
	margin-bottom: 2rem;
	text-align: center;
}
.page-students-info-detail .student-info .student-data .name-flg{
	margin-bottom: 1px;
}
.page-students-info-detail .student-info .student-data .btn-switch{
	display: flex;
	align-items: center;
	justify-content: center;
}
.page-students-info-detail .student-info .student-data .data {
	display: flex;
	flex-direction: column;
	gap: 0.8rem;
	margin-top: 1.6rem;
}

.page-students-info-detail .student-info .student-data .data > li{
	/* border-top: 1px solid #E4E6E9; */
	padding: 1.2rem;
	font-size: 1.6rem;
	position: relative;
	background: #FFFFFF;
    border-radius: 8px;
}
.page-students-info-detail .student-info .student-data .data > li.data-stairs {
	color: #4F4F4F;
}
/* .page-students-info-detail .student-info .student-data .data > li:before{
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 2.2rem;
	width: 2rem;
	height: 2rem;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.page-students-info-detail .student-info .student-data .data > li.data-id:before{
	background-image: url('../images/icon/data-id.svg');
}
.page-students-info-detail .student-info .student-data .data > li.data-gender:before{
	background-image: url('../images/icon/data-gender.svg');
}
.page-students-info-detail .student-info .student-data .data > li.data-birth:before{
	background-image: url('../images/icon/data-birth.svg');
}
.page-students-info-detail .student-info .student-data .data > li.data-nationality:before{
	background-image: url('../images/icon/data-nationality.svg');
}
.page-students-info-detail .student-info .student-data .data > li.data-residence:before{
	background-image: url('../images/icon/data-residence.svg');
}
.page-students-info-detail .student-info .student-data .data > li.data-language:before{
	background-image: url('../images/icon/data-lang.svg');
}
.page-students-info-detail .student-info .student-data .data > li.data-stairs:before{
	background-image: url('../images/icon/data-stairs.png');
} */
.page-students-info-detail .student-info .student-data .data > li .data-title{
	font-weight: 600;
	/* margin-bottom: 1rem; */
	color:  #777777;
	font-size: 1.6rem;
}
.page-students-info-detail .student-info .student-data .data > li.data-stairs .data-title {
	margin-bottom: 0;
}
.page-students-info-detail .student-info .area + .area{
	margin-top: 3rem;
}
.page-students-info-detail .student-info .area .title-wrap{
	padding: 0 0 2rem;
	margin: 0 0 2rem;
	border-bottom: 1px solid #D9DBDE;
}
.page-students-info-detail .student-info .area .title-wrap .item-ttl{
	font-size: 1.8rem;
	font-weight: 600;
}
.page-students-info-detail .student-info .area .content{
	border-radius: 4px;
	background: #FFF;
	padding: 3rem;
	box-shadow: 0 2px 6px rgba(0,0,0,.16);
}
.page-students-info-detail .student-info .data table{
	table-layout: fixed;
	background: #FFF;
}
.page-students-info-detail .student-info .data table th{
	font-size: 14px;
	font-size: 1.4rem;
	background: #F9F6EE;
	border-color: #fff;
	border-left-color: #eee;
	text-align: center;
}
.page-students-info-detail .student-info .data table tr:first-child th{
	border-top-color: #eee;
}
.page-students-info-detail .student-info .data table tr:last-child th{
	border-bottom-color: #eee;
}
.page-students-info-detail .student-info .data table th,
.page-students-info-detail .student-info .data table td {
	vertical-align: top;
	padding: 5px 10px;
	border: 1px solid #eee;
}
.page-students-info-detail .student-info .data dt{
	font-weight: bold;
	font-size: 14px;
	margin-top: 10px;
	text-align: left;
}
.page-students-info-detail .student-info .area-reservation-form .counseling_table th{
	width: 152px;
}
.page-students-info-detail .student-info .area .content-request .item{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.page-students-info-detail .student-info .area .content-request .item + .item{
	border-top: 1px solid #E4E6E9;
	padding-top: 2rem;
	margin-top: 2rem;
}
.page-students-info-detail .student-info .area .content-request .item-name{
	font-size: 1.8rem;
	font-weight: 600;
	line-height: 1.7;
	color: #8E8E8E;
}
.page-students-info-detail .student-info .area .content-request .item-3{
	display: block;
}
.page-students-info-detail .student-info .area .content-request .item-3 .item-select{
	background-color: #F5F6F8;
	padding: 2rem;
	font-size: 1.8rem;
	line-height: 1.5;
	margin-top: 2rem;
}
.page-students-info-detail .student-info .area .memo-tips{
	font-size: 1.8rem;
	color: #8E8E8E;
	margin-bottom: 2rem;
}
.page-students-info-detail .student-info .area .content-memo .item-date{
	font-size: 1.6rem;
	color: #8E8E8E;
	margin-bottom: 1.5rem;
}
.page-students-info-detail .student-info .area .content-memo .item + .item{
	border-top: solid 1px #E4E6E9;
	padding-top: 3rem;
	margin-top: 3rem;
}
.page-students-info-detail .student-info .area .content-memo .item-textarea{
	display: flex;
	align-items: center;
}
.page-students-info-detail .student-info .area .content-memo .item-textarea textarea{
	width: 100%;
	border-radius: 4px;
	height: 4.2rem;
	font-size: 1.8rem;
	line-height: 1.5;
	background-color: #F5F6F8;
	border: none;
	padding: 1rem 1.2rem;
	height: 120px !important;
}
.page-students-info-detail .student-info .area .content-memo .item-textarea textarea::placeholder{
	color: #AEAEAE;
}
.page-students-info-detail .student-info .area .content-memo .item-textarea .btn-memo{
	width: 13.3rem;
	height: 4.2rem;
	line-height: 4.2rem;
	border-radius: 5px;
	display: block;
	color: #FFF;
	background: #F1890E;
	font-size: 1.4rem;
	font-weight: 600;
	box-shadow: 0 3px 6px rgba(0,0,0,.16);
	margin-left: 1.6rem;
	text-align: center;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map{
	border-radius: 5px;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map table{
	text-align: center;
	table-layout: fixed;
	box-shadow: 0 0 2px rgba(0,0,0,.16);
}
.page-students-info-detail .student-info .area-callan-progress .progress-map th{
	background: #E1EEFE;
	font-size: 1.8rem;
	height: 7rem;
	vertical-align: middle;
	width: 25%;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map th + th{
	border-left: #E4E6E9 solid 1px;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td{
	height: 8.7rem;
	vertical-align: middle;
	padding: 0 1rem;
	position: relative;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td + td{
	border-left: #E4E6E9 solid 1px;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.progress-qna:before,
.page-students-info-detail .student-info .area-callan-progress .progress-map td.progress-reading:after{
	content: "";
	display: inline-block;
	width: 50%;
	height: .3rem;
	border-radius: 2px;
	position: absolute;
	bottom: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.progress-qna:before{
	background: linear-gradient(to right, #FF3A3A, #FF9E9E);
	left: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.progress-reading:after{
	background: linear-gradient(to right, #3582CF, #9FCEFF);
	right: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.new-work:before,
.page-students-info-detail .student-info .area-callan-progress .progress-map td.reading:before{
	content: "";
	display: inline-block;
	width: 100%;
	height: .3rem;
	border-radius: 2px;
	position: absolute;
	bottom: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.combine:before,
.page-students-info-detail .student-info .area-callan-progress .progress-map td.combine:after{
	content: "";
	display: inline-block;
	width: 50%;
	height: .3rem;
	border-radius: 2px;
	position: absolute;
	bottom: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.combine:before{
	background: linear-gradient(to right, #FF3A3A, #FF9E9E);
	left: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.combine:after{
	background: linear-gradient(to right, #3582CF, #9FCEFF);
	right: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.new-work:before{
	background: linear-gradient(to right, #FF3A3A, #FF9E9E);
	left: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map td.reading:before{
	background: linear-gradient(to right, #3582CF, #9FCEFF);
	right: 0;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map .progress-tips-wrap{
	display: flex;
	margin-top: 3rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map .progress-tips-wrap .tip + .tip{
	margin-left: 3rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map .progress-tips-wrap .tip{
	display: flex;
	align-items: center;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map .progress-tips-wrap .tip:before{
	content: "";
	display: inline-block;
	width: 2rem;
	height: .3rem;
	border-radius: 2px;
	margin-right: 1rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-map .progress-tips-wrap .tip.pin-red:before{
	background: linear-gradient(to right, #FF3A3A, #FF9E9E);
}
.page-students-info-detail .student-info .area-callan-progress .progress-map .progress-tips-wrap .tip.pin-blue:before{
	background: linear-gradient(to right, #3582CF, #9FCEFF);
}
.page-students-info-detail .student-info .area-callan-progress .progress-data{
	margin-top: 3rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-data .data-wrap{
	display: flex;
}
.page-students-info-detail .student-info .area-callan-progress .progress-data .data-wrap + .data-wrap{
	margin-top: 4rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-data .data-wrap .data{
	min-width: 25rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-data .data-wrap .data .data-title{
	color: #8E8E8E;
	font-weight: 600;
}
.page-students-info-detail .student-info .area-callan-progress .progress-data .data-wrap .data .data-content{
	margin-top: .5rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-data .data-wrap .data + data{
	margin-left: 5rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-note{
	margin-top: 4rem;
}
.page-students-info-detail .student-info .area-callan-progress .progress-note .title{
	color: #8E8E8E;
	font-size: 1.4rem;
	font-weight: 600;
}
.page-students-info-detail .student-info .area-callan-progress .progress-none{
	/*border: #3582CF 1px dotted;*/
	border-radius: 5px;
	background: #F9FAFE;
	width: 100%;
	height: 12rem;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #3582CF;
	font-size: 1.8rem;
	position: relative;
}
.page-students-info-detail .student-info .area-callan-progress .progress-none::before {
	content: "";
	background-image: linear-gradient(to right, #3582CF, #3582CF 15px, transparent 15px, transparent 20px),
	linear-gradient(to right, #3582CF, #3582CF 15px, transparent 15px, transparent 20px),
	linear-gradient(to bottom, #3582CF, #3582CF 15px, transparent 15px, transparent 20px),
	linear-gradient(to bottom, #3582CF, #3582CF 15px, transparent 15px, transparent 20px);
	background-size: 22px 1px, 22px 1px, 1px 22px, 1px 22px;
	background-position: left top, left bottom, left top, right top;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	pointer-events: none;
}
.page-students-info-detail .student-info .area-messages .title-wrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.page-students-info-detail .student-info .area-messages .message-list{
	margin: 0 0 5.5rem;
}
.page-students-info-detail .student-info .area-messages .msg {
	border-bottom: #E4E6E9 1px solid;
	padding: 0 0 4.4rem;
	margin: 0 0 4.4rem;
	position: relative;
}
.page-students-info-detail .student-info .area-messages .msg .lesson-data{
	display: flex;
	align-items: center;
}
.page-students-info-detail .student-info .area-messages .msg .lesson-data .message-info{
	margin-left: 1.2rem;
}
.page-students-info-detail .student-info .area-messages .msg .lesson-data .teacher-img{
	width: 6rem;
	height: 6rem;
	border-radius: 50%;
	box-shadow: 0 3px 6px rgba(0,0,0, .2);
}
.page-students-info-detail .student-info .area-messages .msg .lesson-data .teacher-name{
	font-size: 1.8rem;
	font-weight: 600;
}
.page-students-info-detail .student-info .area-messages .msg .lesson-data .date{
	color: #8E8E8E;
	font-size: 1.6rem;
}
.page-students-info-detail .student-info .area-messages .msg .contents{
	margin-top: 2rem;
	font-size: 1.8rem;
	overflow: hidden;
}
.page-students-info-detail .student-info .area-messages .msg .contents.limit-h{
	height: 160px;
}
.page-students-info-detail .student-info .area-messages .msg .contents .item {
	display: flex;
	align-items: center;
	transition: 0.2s all linear;
}
.page-students-info-detail .student-info .area-messages .msg .contents .item .item-title{
	color: #8E8E8E;
	font-weight: 600;
	margin-right: 1rem;
}
.page-students-info-detail .student-info .area-messages .msg .contents .item .item-content{
	word-break: break-all;
}
.page-students-info-detail .student-info .area-messages .msg .contents .item + .item{
	margin-top: 1.4rem;
}
.page-students-info-detail .student-info .area-messages .msg .contents .item.hide {
	display: none;
}
.page-students-info-detail .student-info .area-messages .msg .btn-more-wrap{
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -1.5rem;
	margin: auto;
}
.page-students-info-detail .student-info .area-messages .msg .btn-more{
	background: #E4E6EB;
	border-radius: 4px;
	font-size: 1.2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 17rem;
	height: 3rem;
	font-weight: 600;
	transition: 0.2s all linear;
	color: #404040;
	box-shadow: 0 3px 6px rgba(0,0,0, .2);
}
.page-students-info-detail .student-info .area-messages .msg .btn-more:hover{
	background-color: #edeeee;
}
.page-students-info-detail .back-btn-wrap{
	margin-bottom: 3rem;
}
.page-students-info-detail .btn-back{
	color: #949494;
	font-size: 1.6rem;
}
.page-students-info-detail .btn-back:before{
	content: url('../images/icon/ic-back.svg');
	display: inline-block;
	vertical-align: middle;
	margin-right: 1rem;
}
.page-students-info-detail .btn-block_wrap{
	position: absolute;
	top: 0;
	right: 0;
}
.page-students-info-detail .btn-block{
	border: #FC1717 2px solid;
	border-radius: 5px;
	color: #FC1717;
	padding: 1rem 2rem;
	font-size: 1.2rem;
	transition: 0.2s all linear;
	display: block;
    line-height: 1;
}
.page-students-info-detail .btn-block:hover{
	opacity: 0.6;
}
.page-students-info-detail .btn-block.requested:hover{
	opacity: 1;
}
.page-students-info-detail .col-right-area{
	position: relative;
}
.page-students-info-detail .col-right-area .notice_wrap{
	position: absolute;
	bottom: calc(100% + 2rem);
	border: #FFD6D6 1px solid;
	background: #FFEFEF;
	border-radius: 4px;
	padding: 0.2rem 0.8rem;
	color: #FC1717;
	font-size: 1.8rem;
	width: 100%;
}
/* lesson reviews */
.page-lesson-review .review-wrap{
	position: relative;
}
.page-lesson-review .review-wrap .data-tabs{
	position: relative;
}
.page-lesson-review .review-wrap .search-area{
	position: absolute;
	right: 0;
	top: 59px;
}
.page-lesson-review .review-wrap .search-area .search-wrap{
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.page-lesson-review .review-wrap .search-area .search-item{
	display: flex;
	align-items: center;
	margin-right: 1.6rem;
}
.page-lesson-review .review-wrap .search-area .search-item-title{
	color: #8E8E8E;
	font-size: 1.4rem;
}
.page-lesson-review .review-wrap .search-area .input-select, .page-lesson-review .review-wrap2 .search-area .input-select{
	margin-left: .7rem;
}
.page-lesson-review .review-wrap .search-area .input-select > select{
	border: #E4E6E9 1px solid;
}
.page-lesson-review .review-wrap .search-area .btn-orange{
	background: #F28A0F;
	color: #FFF;
	border: none;
	box-shadow: 0 3px 6px rgba(0,0,0,.16);
	font-weight: 600;
}
.page-lesson-review .review-wrap .ui-tab-contents{
	position: relative;
}
.page-lesson-review .review-wrap .ui-tab-contents .loading{
	top: 50%;
}
.lesson-review-list .data-list-wrap .data-titles {
	padding-top: 2rem;
	margin-bottom: 2rem;
}
.lesson-review-list .data-list-wrap .data-titles > ul{
	display: flex;
	align-items: center;
}
.lesson-review-list .data-list-wrap .data-contents + .data-contents{
	margin-top: 1.2rem;
}
.lesson-review-list .data-list-wrap .data-contents > ul{
	display: flex;
	align-items: center;
	background: #FFF;
	border-radius: 4px;
	font-size: 1.8rem;
	padding: 2.5rem 0rem;
}
.lesson-review-list .data-list-wrap .data-titles > ul > li{
	display: inline-block;
	font-size: 1.6rem;
	color: #999999;
}
.lesson-review-list .data-list-wrap .data-titles > ul > li:first-child,
.lesson-review-list .data-list-wrap .data-contents > ul > li:first-child{
	min-width: 20rem;
	padding-left: 4rem;
}
.lesson-review-list .data-list-wrap .data-titles > ul > li:nth-child(2),
.lesson-review-list .data-list-wrap .data-contents > ul > li:nth-child(2){
	width: 100%;
	padding: 0 3rem;
}
.lesson-review-list .data-list-wrap .data-titles > ul > li:nth-child(3),
.lesson-review-list .data-list-wrap .data-contents > ul > li:nth-child(3){
	min-width: 20rem;
}
/* stars */
.lesson-review-list .data-contents .data-rating {
	display: flex;
	align-items: center;
}
.lesson-review-list .data-contents .data-rating .rating-stars {
	display: flex;
	align-items: center;
	margin-left: 1rem;
}
.lesson-review-list .data-contents .data-rating .rating-stars .star-base{
	width: 2.4rem;
	height: 2.4rem;
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
	padding: .6rem;
	display: flex;
	align-items: center;
}
.lesson-review-list .data-contents .data-rating .rating-stars .star-base{
	position: relative;
}
.lesson-review-list .data-contents .data-rating .rating-stars .star-base:before{
	content: url('../images/icon/star-off.svg');
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}
.lesson-review-list .data-contents .data-rating .rating-stars .star-base .star{
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
}
.lesson-review-list .data-contents .data-rating .rating-stars .star-base .star:before{
	content: url('../images/icon/star-on.svg');
	position: absolute;
	top: 50%;
	left: 0;
	margin: auto;
	transform: translateX(0%) translateY(-50%);
}
.lesson-review-list .data-contents .data-rating .rating-stars .star.on:before{
	content: url('../images/icon/star-on.svg');
}
.lesson-review-list .data-contents .data-rating .rating-stars .star-base + .star-base{
	margin-left: .5rem;
}
.lesson-review-list .data-contents .btn-translate {
    color: #00ACEE;
    transition: 0.2s all linear;
    text-decoration: underline;
    font-size: 16px;
}
.lesson-review-list .data-contents .btn-translate:hover{
	opacity: 0.6;
}
.lesson-evaluation-list .data-list-wrap .data-titles > ul > li:first-child,
.lesson-evaluation-list .data-list-wrap .data-contents > ul > li:first-child{
	min-width: 48.4rem;
	padding-left: 4rem;
	font-size: 1.6rem;
}
.page-lesson-review .review-wrap .search-area.search-area-evaluation{
	display: none;
}
.page-lesson-review .review-wrap .search-area.search-area-evaluation .search-item{
	margin-right: 0;
}
.page-lesson-review .review-wrap .search-area .input-date{
	width: 17rem;
	height: 3.4rem;
	padding: 1rem;
	border: #E4E6E9 solid 1px;
	border-radius: .5rem;
	background: transparent;
	position: relative;
	z-index: 20;
}
.page-lesson-review .review-wrap .search-area .input-date-wrap{
	position: relative;
	background: #FFF;
}
.page-lesson-review .review-wrap .search-area .input-date-wrap:after{
	content: url('../images/icon/calendar.svg');
	position: absolute;
	top: 50%;
	right: 1rem;
	transform: translateY(-50%);
	z-index: 10;
}

/*-- lesson history --*/
.page-lesson-log .search-data{
	display: flex;
	align-items: center;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: #D9DBDE 1px solid;
}
.page-lesson-log .search-data .item{
	display: flex;
	align-items: center;
}
.page-lesson-log .search-data .item + .item{
	margin-left: 16px;
}
.page-lesson-log .search-data .item-title{
	font-size: 14px;
	margin-right: 8px;
}
.page-lesson-log .search-data .item-contents{
	display: flex;
	align-items: center;
}
.page-lesson-log .search-data .item-date .input-wrap{
	position: relative;
}
.page-lesson-log .search-data .item-date .input-wrap:after{
	content: "";
	width: 11px;
	height: 12px;
	display: block;
	background: url('../images/icon/calendar.svg') no-repeat center;
	position: absolute;
	top: 10px;
	right: 10px;
}
.page-lesson-log .search-data .item input{
	border: 1px solid #E4E6E9;
	background: #FFF;
	border-radius: 4px;
	min-width: 150px;
	height: 34px;
	display: flex;
	align-items: center;
}
.page-lesson-log .search-data .btn-search{
	width: 107px;
	height: 34px;
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
	display: flex;
	justify-content: center;
	align-items: center;
	background: #F28A0F;
	transition: .2s all linear;
	font-size: 12px;
	font-weight: 600;
	color: #FFF;
	border-radius: 4px;
}
.page-lesson-log .search-data .btn-search:hover{
	opacity: .6;
}
.lesson-history .data-list-wrap .data-titles > ul > li.title-id,
.lesson-history .data-list-wrap .data-contents > ul > li.data-id,
.lesson-history .lsn-table td.title-id,
.lesson-history .lsn-table td.data-id{
	width: 17%;
	padding-left: 4rem;
}
.lesson-history .data-list-wrap .data-titles > ul > li.title-chapter,
.lesson-history .data-list-wrap .data-contents > ul > li.data-chapter,
.lesson-history .lsn-table td.title-chapter,
.lesson-history .lsn-table td.data-chapter{
	width: 16%;
}
.lesson-history .data-list-wrap .data-titles > ul > li.title-lesson-start,
.lesson-history .data-list-wrap .data-contents > ul > li.data-lesson-start,
.lesson-history .lsn-table td.title-lesson-start,
.lesson-history .lsn-table td.data-lesson-start{
	width: 16%;
}
.lesson-history .data-list-wrap .data-titles > ul > li.title-lesson-finish,
.lesson-history .data-list-wrap .data-contents > ul > li.data-lesson-finish,
.lesson-history .lsn-table td.title-lesson-finish,
.lesson-history .lsn-table td.data-lesson-finish{
	width: 16%;

}
.lesson-history .data-list-wrap .data-titles > ul > li.title-lesson-time,
.lesson-history .data-list-wrap .data-contents > ul > li.data-lesson-time,
.lesson-history .lsn-table td.title-lesson-time,
.lesson-history .lsn-table td.data-lesson-time{
	width: 11%;
	text-align: center;
}
.lesson-history .data-list-wrap .data-titles > ul > li.title-earnings,
.lesson-history .data-list-wrap .data-contents > ul > li.data-earnings{
	width: 10%;
}
.lesson-history .data-list-wrap .data-titles > ul > li.title-name,
.lesson-history .data-list-wrap .data-contents > ul > li.data-name,
.lesson-history .lsn-table td.title-name{
	width: 14%;
}
.lesson-history .lsn-table td.data-name{
	width: 260px;
	margin-top:10.5%;
}
.lesson-history .data-list-wrap .data-titles > ul > li.title-status,
.lesson-history .data-list-wrap .data-contents > ul > li.data-status,
.lesson-history .lsn-table td.title-status,
.lesson-history .lsn-table td.data-status-wrap,
.lesson-history .lsn-table td.title-speaking-rate{
	width: 16%;
}
/*.lesson-history .data-list-wrap .data-titles > ul > li.title-live-audience,
.lesson-history .data-list-wrap .data-contents > ul > li.data-live-audience,
.lesson-history .data-list-wrap .data-titles > ul > li.title-live-reward,
.lesson-history .data-list-wrap .data-contents > ul > li.data-live-reward{
	width: 8%;
	text-align: center;
}*/

.lesson-history .data-list-wrap .data-titles > ul > li.title-booked-lesson,
.lesson-history .data-list-wrap .data-contents > ul > li.data-booked-lesson,
.lesson-history .data-list-wrap .data-titles > ul > li.title-sudden-lesson,
.lesson-history .data-list-wrap .data-contents > ul > li.data-sudden-lesson,
.lesson-history .lsn-table td.title-ncc,
.lesson-history .lsn-table td.data-ncc{
	width: 10%;
	text-align: center;
}

/*-- messages --*/
.page-message .instruction-wrap .sort-title{
	font-size: 1.4rem;
	color: #8E8E8E;
	margin-right: .8rem;
}
.tab-message-list .message-list .list-item{
	display: flex;
	/* align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap; */
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	background: #FFF;
	padding: 2rem;
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
}
.tab-message-list .message-list .list-item + .list-item{
	margin-top: 2rem;
}
.tab-message-list .message-list .list-item .col-left{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin: 0 auto 2rem;
}
.tab-message-list .message-list .list-item .col-left .img-wrap{
	width: 6rem;
	height: 6rem;
	overflow: hidden;
	border-radius: 50%;
	margin: auto;
}
.tab-message-list .message-list .list-item .col-left .img-wrap > img{
	width: 100%;
}
.tab-message-list .message-list .list-item .col-left .student-name{
	font-size: 1.8rem;
	line-height: 1.5;
	text-align: center;
	margin-top: 1.5rem;
	word-break: break-all;
}
.tab-message-list .message-list .list-item .col-center {
	padding: 0 1rem;
	order: 3;
}
.tab-message-list .message-list .list-item .col-center .data-list{
	/*width: 66rem;
	width: max(34.37vw, 66rem);*/
}
.tab-message-list .message-list .list-item .col-center .data-list .data{
	display: flex;
	align-items: flex-start;
	display: block;
}
.tab-message-list .message-list .list-item .col-center .data-list .data + .data{
	padding-top: 1rem;
	margin-top: 1rem;
	border-top: 1px #E4E6E9 solid;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-title{
	font-size: 1.4rem;
	font-weight: 600;
	color: #8E8E8E;
	min-width: 10rem;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents{
	font-size: 1.4rem;
	width: 100%;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .input-wrap{
	position: relative;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .input-wrap + .input-wrap{
	margin-top: 2rem;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .input-wrap.required:before{
	content: "*";
	position: absolute;
	color: #F1890E;
	font-size: 1.6rem;
	top: 0;
	left: -1rem;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .input-wrap input{
	background: #F5F6F8;
	height: 4.2rem;
	width: 100%;
	border-radius: 4px;
	border: #E4E6E9 1px solid;
	padding: 1rem;
	box-sizing: border-box;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .input-wrap input::placeholder{
	color: #8E8E8E;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .tips{
	margin-top: .5rem;
	font-size: 1.4rem;
	line-height: 1.5;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents textarea{
	background: #F5F6F8;
	height: 10rem;
	width: 100%;
	border-radius: 4px;
	border: #E4E6E9 1px solid;
	padding: 1rem;
	box-sizing: border-box;
}
.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents textarea.hide{
	display: none;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap{
	margin-top: 3rem;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap > ul{
	display: flex;
	align-items: center;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap > ul > li + li{
	margin-left: 2rem;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap .nc-t-btn{
	width: 12.8rem;
	height: 4.2rem;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap .nc-t-btn:hover{
	opacity: 0.6;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap .nc-t-btn.btn-orange{
	border: none;
	background: #F1890E;
	color: #FFF;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap .nc-t-btn.btn-border-orange{
	border-color: #F1890E;
	color: #F1890E;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap .ignore-wrap{
	display: flex;
	align-items: center;
}
.tab-message-list .message-list .list-item .col-center .btn-wrap .ignore-wrap .sw-text{
	font-size: 1.4rem;
	font-weight: 600;
}
.sw-style input[type="checkbox"]:checked + label:after{
	background-color: #FC1717;
}
.tab-message-list .message-list .list-item .col-right {
	flex-shrink: 0;
	order: 2;
}
.tab-message-list .message-list .list-item .col-right .btn-wrap > ul{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.tab-message-list .message-list .list-item .col-right .btn-wrap > ul > li + li{
	margin-top: 1.2rem;
}
.tab-message-list .message-list .list-item .col-right .btn-wrap > ul > li > a{
	transition: 0.2s all linear;
}
.tab-message-list .message-list .list-item .col-right .btn-wrap > ul > li > a:hover{
	opacity: 0.6;
}
.tab-message-list .message-list .list-item .col-right .btn-round{
	display: block;
	width: 11.5rem;
	height: 2.6rem;
	line-height: 2.6rem;
	text-align: center;
	font-size: 1.6rem;
	color: #FFF;
	background: #8695AF;
	border-radius: 1.5rem;
	font-weight: 600;
}
.tab-message-list .message-list .list-item .col-right .btn-drafts{
	color: #7B77F1;
	background: #EEEEFF;
}
.tab-message-list .message-list .list-item .col-right .btn-chat-log{
	display: block;
	width: 11.5rem;
	height: 3rem;
	line-height: 3rem;
	text-align: center;
	color: #FFF;
	background: #8695AF;
	border-radius: 4px;
	font-size: 1.2rem;
}
.tab-message-list .message-list .list-item .col-right .btn-edit{
	display: block;
	width: 11.5rem;
	height: 3rem;
	line-height: 3rem;
	text-align: center;
	color: #8695AF;
	background: #FFF;
	border: 1px solid #8695AF;
	border-radius: 4px;
	font-size: 1.2rem;
}
.tab-message-list .message-list .list-item .col-right .btn-edit.disable{
	pointer-events: none;
	cursor: initial;
	opacity: .4;
}
.tab-message-list .message-list .list-item .col-right button,
.tab-message-list .message-list .list-item .col-right a{
	transition: .2s all linear;
}
.tab-message-list .message-list .list-item .col-right button:hover,
.tab-message-list .message-list .list-item .col-right a:hover{
	opacity: .6;
}
/* progress wrap */
.tab-message-list .message-list .list-item .progress-map{
	margin-bottom: 20px;
	width: 100%;
}
.tab-message-list .message-list .list-item .progress-map table{
	width: 100%;
	border: 1px solid #000;
	margin-bottom: 15px
}
.tab-message-list .message-list .list-item .progress-map table tr th,
.tab-message-list .message-list .list-item .progress-map table tr td{
	border: 1px solid #000;
	text-align: center;
}
.tab-message-list .message-list .list-item .progress-map table tr th{
	padding: 10px 0;
	color: #fff;
	background: #3e75a7;
}
.tab-message-list .message-list .list-item .progress-map table tr td{
	position: relative;
	width: 6.6%;
	padding: 10px 0 35px;
}
.tab-message-list .message-list .list-item .progress-map table tr td.new-work:before,
.tab-message-list .message-list .list-item .progress-map table tr td.reading:before{
	content: "\f276";
	font-family: "FontAwesome";
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	margin: auto;
	font-size: 2.2rem;
}
.tab-message-list .message-list .list-item .progress-map table tr td.combine{
	color: #000;
}
.tab-message-list .message-list .list-item .progress-map table tr td.combine:before{
	content: "\f276";
	font-family: "FontAwesome";
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	right: 20%;
	margin: auto;
	font-size: 2.2rem;
	color: #f14444;
}
.tab-message-list .message-list .list-item .progress-map table tr td.combine:after{
	content: "\f276";
	font-family: "FontAwesome";
	display: block;
	position: absolute;
	top: 50%;
	left: 20%;
	right: 0;
	margin: auto;
	font-size: 2.2rem;
	color: #00acee;
}
.tab-message-list .message-list .list-item .progress-map table tr td.new-work,
.tab-message-list .message-list .list-item .progress-map table tr td.new-work:before{
	color: #f14444;
}
.tab-message-list .message-list .list-item .progress-map table tr td.reading,
.tab-message-list .message-list .list-item .progress-map table tr td.reading:before{
	color: #00acee;
}
.tab-message-list .message-list .list-item .progress-map .progress-tips-wrap .fa-map-pin.red{
	color: #f14444;
}
.tab-message-list .message-list .list-item .progress-map .progress-tips-wrap .fa-map-pin.blue{
	color: #00acee;
}
.tab-message-list .message-list .list-item .progress-map .progress-tips-wrap .tip{
	display: inline-block;
}
.tab-message-list .message-list .list-item .progress-map .progress-tips-wrap .tip + .tip{
	margin-left: 10px;
}
/* chat log */

.popup_wrap>.btn-user{
	width: inherit;
}

.popup-box {
	display: none;
	position: fixed !important;
	width: 62rem;
	height: 50rem;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	/* transform: translate(-50%, -50%); */
	z-index: 200;
	padding: 0 0rem;
	box-sizing: border-box;
	background: #fff;
	max-width: 960px;
	max-height: 90vh;
	min-width: 120px;
	min-height: 100px;
	box-shadow: 0 0 10px 0 rgb(0 0 0 / 20%);
	border-radius: 10px;
}
.popup-box .btn-close{
	position: absolute;
	top: -18px;
	right: -18px;
	display: block;
	width: 30px;
	height: 30px;
	background: url(../images/icon/modal-close.svg) no-repeat center;
	cursor: pointer;
	border: none;
	z-index: 1000;
	background-color: #FFF;
	border-radius: 50%;
	box-shadow: 0 3px 6px rgb(0 0 0 / 20%);
}
.popup-box .popup-box-inner {
	height: 100%;
}
.popup-box .popup-header {
	padding: 5px 10px;
	position: relative;
	width: 100%;
	box-sizing: border-box;
	white-space: nowrap;
}
.popup-box .popup-header:hover {
	cursor: move;
}
.popup-box .popup-header .popup_ttl {
	font-size: 1.8rem;
	font-weight: bold;
	overflow: hidden;
	height: 53px;
	line-height: 53px;
	text-align: center;
}
.popup-box .popup-header .popup_close {
	position: absolute;
	font-size: 0;
	width: 24px;
	height: 24px;
	background-image: url("../images/icon/icon_close_white.png");
	background-repeat: no-repeat;
	background-size: cover;
	color: #fff;
	font-weight: bold;
	line-height: 1;
	top: 50%;
	right: 8px;
	transform:translateY(-50%);
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.popup-box .popup-header .popup_close:hover {
	cursor: pointer;
}
.popup-box .popup-body {
	background-color: #fff;
	width: 100%;
	height: calc(100% - 62px);
	box-sizing: border-box;
	word-break: break-word;
}
.popup-box .popup-body::-webkit-scrollbar-track {
	background-color: #ccc;
}
.popup-box .popup-body::-webkit-scrollbar {
	width: 6px;
}
.popup-box .popup-body::-webkit-scrollbar-thumb {
	border-radius: 3px;
	background-color: rgba(255,255,255,.5);
}
.popup-box .popup-body .textchat-area-log > p{
	padding: 1rem;
	word-break: break-word;
}
.popup-box .popup-body .textchat-area-log > p:nth-last-child(odd){
	background: #fff;
}
.popup-box .popup-body .textchat-area-log > p:nth-last-child(even){
	background: #f4f4f4;
}
.popup-box .popup-body .textchat-area-log > p:last-child{
	color: #bbb;
}
.popup-box .popup-body .textchat-area-log{
	position: relative;
	text-align: left;
	margin: 0rem 0.2rem 0 0;
	border: none;
	width: auto;
}
.popup-box .popup-body .textchat-area-log::-webkit-scrollbar {
	-webkit-appearance: none;
	right: 2px;
	width: 7px;
}
.popup-box .popup-body .textchat-area-log::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: rgba(0,0,0,0.4);
	box-shadow: 0 0 1px rgba(255,255,255,0.5);
}
.popup-box > p,
.popup_box > p{
	width: 100%;
	padding: 1rem;
	box-sizing: border-box;
}
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .mistake:after,
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .correct:after{
	display: inline-block;
	vertical-align: middle;
	margin-left: 4px;
	line-height: 1;
}
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .mistake:after{
	content: url("../images/chat/ic-mistake.svg");
}
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .correct:after{
	content: url("../images/chat/ic-check-grn.svg");
}
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .mistake .focus,
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .correct .focus{
	text-decoration: underline;
}
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .mistake .focus{
	color: #FF4444;
}
.tab-message-list .message-list .list-item .col-right .popup-box .popup-body .correct .focus{
	color: #31C327;
}
.tab-message-list .message-list .list-item .col-right .popup-box > p,
.sec_message_list .tab-message-list .message-list .list-item .instructor_data .popup_box > p{
	width: 100%;
	padding: 1rem;
	box-sizing: border-box;
}
.popup-box .popup_footer{
    height: 52px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
/* close btn */
.popup-box .popup_close {
	display: inline-block;
	width: 2.5rem;
	height: 2.5rem;
	position: relative;
	border: none;
	cursor: pointer;
	background: #fff;
	border-radius: 2px;
}
.popup-box .popup_close .btn_batsu::before,
.popup-box .popup_close .btn_batsu::after {
	display: block;
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: 2rem;
	height: 0.2rem;
	margin: auto;
	background: #555;
}
.popup-box .popup_close .btn_batsu::before {
	transform: rotate(-45deg);
}
.popup-box .popup_close .btn_batsu::after {
	transform: rotate(45deg);
}
.sec_message_list .tab-message-list .message-list .list-item .col_right .item_data td textarea.input_comment{
	height: 100px !important;
	overflow-y: scroll !important;
}

.tab-message-list .message-list .list-item .col-right .btn-use-message-tmp{
	display: flex;
	align-items: flex-start;
	font-size: 1.4rem;
	color: #3582CF;
	font-weight: 600;
	cursor: pointer;
}
.tab-message-list .message-list .list-item .col-right .btn-use-message-tmp .ic-message-tmp{
	width: 1.6rem;
	margin-right: .7rem;
}
.tab-message-list .message-list .list-item .col-right .btn-sent{
	color: #36A46F;
	background: #D2FFE9;
}
.tab-message-list .message-list .list-item .col-right .btn-edit{
	display: block;
	width: 11.5rem;
	height: 3rem;
	line-height: 3rem;
	text-align: center;
	font-size: 1.2rem;
	color: #8695AF;
	border: 1px solid #8695AF;
	border-radius: .4rem;
	font-weight: 600;
}
.tab-message-list .message-list .list-item .col-center-edit{
	display: none;
}
/*-- Account --*/
.page-accounts .contents-desc .instruction-area{
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.page-accounts .contents-desc .sp-notice + .instruction-wrap{
	margin-left: 3rem;
}
.page-accounts .contents-desc .sp-notice{
	width: 65.5rem;
	padding: 1.2rem;
	border: #E4E6E9 1px solid;
	border-radius: 4px;
	background: #FFF;
	font-size: 1.4rem;
}
.page-accounts .contents-desc .sp-notice .notice-title{
	font-size: 1.2rem;
	font-weight: 600;
}
.page-accounts .sec-account .account-wrap{
	border-top: 1px solid #D9DBDE;
	display: flex;
	padding: 3rem 0;
}
.page-accounts .sec-account .account-wrap .account-img-area{
	padding-right: 4rem;
}
.page-accounts .sec-account .account-wrap .account-img-area .img-wrap{
	width: 20rem;
	height: 20rem;
	position: relative;
}
.page-accounts .sec-account .account-wrap .account-img-area .img-wrap > img{
	width: 100%;
}
.overlaytext{
	bottom: 8px;
	color: #fff;
	position: absolute;
	padding-block: 4.5px;
	width: 140px;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}

.overlaytext.waiting {
	background: #FDEFEB;
}

.overlaytext.approved {
	background: #EDF9F8;
}

.overlaytext.disapproved {
	background: #FFE8E8;
}

.overlaytext span{
	font-size: 12px;
	font-weight: 700;
	text-align: center;
}

.OverlayTextProfile{
	background-color: #000;
	bottom: 0;
	color: #fff;
	position: absolute;
	padding: 5px;
	opacity: 0.7;
	width: 190px;
	font-size: 12px;
	line-height: 1.5;
}
.page-accounts .sec-account .account-wrap .account-img-area .btn-wrap{
	margin: 2rem auto 0;
}
.page-accounts .sec-account .account-wrap .account-img-area .btn-wrap .btn-upload{
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.4rem;
	color: #CCC;
	transition: 0.2s all linear;
	cursor: pointer;
}
.page-accounts .sec-account .account-wrap .account-img-area .btn-wrap .btn-upload:hover{
	opacity: 0.6;
}
.page-accounts .sec-account .account-wrap .account-img-area .btn-wrap .ic-upload{
	width: 2.2rem;
	margin-right: .8rem;
}
.page-accounts .sec-account .account-wrap .account-img-area .tips-wrap{
	margin-top: 2rem;
	border-top: #E4E6E9 1px solid;
	padding: 2rem 0;
	font-size: 1.8rem;
	text-align: center;
}
.page-accounts .sec-account .account-wrap .account-img-area .tips-wrap .c-blue{
	color: #3582CF;
	cursor: pointer;
	transition: .2s all linear;
}
.page-accounts .sec-account .account-wrap .account-img-area .tips-wrap .c-blue:hover{
	opacity: .6;
}
.page-accounts .sec-account .account-wrap .profile-area{
	width: 100%;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.flex-wrap{
	display: flex;
	align-items: flex-start;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.flex-wrap .notice-area{
	margin-left: 4.3rem;
	max-width: 62.8rem;
	width: 45%;
	padding: 1rem;
	font-size: 1.4rem;
	background: #FFF;
	color: #8E8E8E;
	border-radius: 4px;
	border: #E4E6E9 1px solid;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .data-title{
	font-size: 1.8rem;
	font-weight: 600;
	position: relative;
	display: inline-block;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-gallery .data-title.required:before{
	content: "*";
	position: absolute;
	color: #F1890E;
	font-size: 1.6rem;
	top: 0;
	right: -.5rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data + .data{	
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: #D9DBDE 1px solid;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .working_hours {
	margin: 10px 0 30px;
  	font-size: 15px;
	line-height: 20.43px;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-wrap > input{
	width: 42.4rem;
	height: 4rem;
	line-height: 4rem;
	border: #E4E6E9 1px solid;
	border-radius: 4px;
	padding: 0 1rem;
	color: #404040;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-wrap > input::placeholder{
	color: #8E8E8E;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-wrap + .input-wrap{
	margin-top: 1.2rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .t-link-orange{
	color: #F1890E;
	transition: 0.2s all linear;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .t-link-orange:hover{
	opacity: 0.6;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .radio-wrap > ul{
	display: flex;
	align-items: center;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .radio-wrap > ul > li + li{
	margin-left: 1.3rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .radio-wrap input + label{
	margin-right: 1.3rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data label.custom-radio{
	padding-left: 2.6rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data label.custom-radio:before{
	width: 2rem;
	height: 2rem;
	background: transparent;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data input[type='radio']:checked + label.custom-radio:before{
	border: #F1890E solid 1px;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data label.custom-radio:after{
	width: 1rem;
	height: 1rem;
	left: .5rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .item-status{
	font-weight: 600;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .item-status > span {
	display: inline-block;
	width: 240px;
	padding-block: 8px;
	text-align: center;
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	font-weight: 700;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .item-status .Approved {
	color: #57D7CA;
	background: #EDF9F8;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .item-status [class~="Disapproved"] {
	color: #FC1717;
	background: #FFE8E8;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .item-status [class*="Waiting"] {
	color: #F3704B;
	background: #FDEFEB;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .btn-edit{
	display: flex;
	align-items: center;
	font-size: 1.4rem;
	font-weight: 600;
	color: #F1890E;
	transition: 0.2s all linear;
	background: transparent;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .btn-edit:before{
	content: url('../images/icon/edit.svg');
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .btn-edit:hover{
	opacity: 0.6;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap .btn-edit .ic-edit{
	width: 2rem;
	margin-right: .3rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .video-wrap .display-area{
	width: 41.2rem;
	height: 23rem;
	background: #FFF;
	border-radius: 4px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .video-wrap .display-area .ic-video{
	width: 10.6rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .video-wrap .display-area .display-area-text{
	margin-top: 2rem;
	font-size: 1.6rem;
	color: #8E8E8E;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .video_area .recorded_video{
	width: 41.2rem;
	height: 23rem;
	background: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: relative;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .video_area .recorded_video:before{
	content: url('../images/icon/video.svg');
	display: flex;
	align-items: center;
	justify-content: center;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .video_area .recorded_video:after{
	content: "Your video introduction will be\A displayed here.";
	display: block;
	text-align: center;
	white-space: pre;
	margin-top: 12px;
	font-size: 1.6rem;
	color: #8E8E8E;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .video_area .recorded_video .recorded{
	height:100%; width: 100%; position: absolute; left: 0px; top: 0px; z-index: 9;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .flex-wrap{
	display: flex;
	align-items: flex-start;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .video-wrap + .btn-wrap{
	margin-left: 2rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .btn-wrap > ul > li + li{
	margin-top: 1.2rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .btn-wrap .btn-style{
	display: block;
	width: 24rem;
	height: 3.4rem;
	border-radius: 4px;
	border: 1px solid #F1890E;
	color: #F1890E;
	font-size: 1.4rem;
	font-weight: 600;
	transition: 0.2s all linear;
	line-height: 3.4rem;
	text-align: center;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .btn-wrap a[target="_blank"].btn-style:after{
	content: none;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .btn-wrap .btn-style:hover{
	opacity: 0.6;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .btn-wrap .btn-style.btn-upload-video{
	border-color: #404040;
	color: #404040;
	margin-top: 12px;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .tips-wrap{
	margin-top: 16px;
	padding-top: 9px;
	border-top: 1px solid #D9DBDE;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .tips-wrap .c-blue{
	color: #3582CF;
	transition: .2s all linear;
	font-size: 18px;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-video .tips-wrap .c-blue:hover{
	opacity: .6;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-gallery .data-contents{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	column-gap: 40px;
}
.page-accounts .sec-account .data-gallery .data-contents .img-wrap{
	width: 20rem;
	height: 20rem;
	border-radius: 4px;
	position: relative;
	overflow: hidden;
}
.page-accounts .sec-account .data-gallery .data-contents .data-img{
	position: relative;
}


.page-accounts div.data:not(.data-gallery):not(.data-badge):not(.data-account-img):not(.dataOcupation):not(.selfIntro):not(.timeZoneEdit):not(.mailNotificationEdit):not(.data-invite){
	display: flex;
	column-gap: 2.4rem;
	align-items: center;
	position: relative;
}

.page-accounts div.data:not(.data-gallery):not(.data-badge):not(.data-account-img):not(.materialBdg):not(.data-payment):not(.data-invite) .data-title{
	width: 19rem;
}
.data-payment .form_wrap{
	font-weight: 700;
}
#paymentEditInfo .page-accounts .sec-account .account-wrap,
#materialBadgeEditInfo .page-accounts .sec-account .account-wrap,
#selfIntroEditInfo .page-accounts .sec-account .account-wrap,
#genderEditInfo .page-accounts .sec-account .account-wrap,
#mailNotification .page-accounts .sec-account .account-wrap{
	border-top: unset;
	display: flex;
	padding: unset;
}
#materialBadgeEditInfo .data-title{
	margin-bottom: 2.4rem;
}
#mailNotification .data-contents .data-content-mail .content-title{
	max-width: 23rem;
}
.page-accounts div.data:not(.data-gallery):not(.data-badge):not(.data-payment):not(.dataOcupation):not(.selfIntro) input, 
.page-accounts div.data:not(.data-gallery):not(.data-badge):not(.data-payment):not(.dataOcupation):not(.selfIntro) select, 
.page-accounts div.data:not(.data-gallery):not(.data-badge):not(.data-payment):not(.dataOcupation):not(.selfIntro) textarea{
	padding: 10px 0;
	border: 0;
	background: 0;
}

span#teacher_image_status {
	background: #EDF9F8;
	display: block;
	color: #57D7CA;
	padding: 8px 79px;
}

span#teacher_image_status.disapproved{
	background: #FFE8E8;
	display: block;
	color: #FC1717;
	padding: 8px 79px;
}

span#teacher_image_status.waiting {
	background: #FDEFEB;
	display: block;
	color: #F3704B;
	padding: 8px;
}

.d-flex.term-wrap {
	align-items: center;
	column-gap: 1.6rem;
}

.edit-info .bootstrap-tagsinput{
	max-width: 84rem;
}

.data.selfIntro{
	max-width: 89.2rem;
}
.rules {
	display: flex;
	column-gap: 0.4rem;
	margin: 0.8rem 0 1.6rem 0;
}
.teacherOccupationIndustry {
	margin-bottom: 0.8rem;
}


.d-flex.sect-wrap {
	column-gap: 0.8rem;
}

.page-accounts .data-title.InviteFriends{
	display: flex;
	column-gap: 0.8rem;
	align-items: center;
	margin-top: 2rem;
	padding-top: 2.4rem;
	border-top: #D9DBDE 1px solid;
}

.page-accounts a.contentLink {
	flex: 1;
	color: #404040;
	position: relative;
	z-index: 2;
	min-height: 2.4rem;
}
.page-accounts img.arrow-right {
	position: absolute;
	right: 2.4rem;
}
.page-accounts a.btn-orange.btn-copy-invite-url {
	font-size: 1.4rem;
	background: #F1890E;
	color: #fff;
	height: auto;
	padding: 0.85rem 4.5rem;
	width: 100%;
	max-width: 12.8rem;
	border-radius: 0.4rem;
}
.page-accounts .teacherInfoContainer {
	max-width: 84rem;
	margin-top: 4rem;
}

.page-accounts img.nc-teacher-logo {
	border-radius: 2.4rem;
	margin-right: 1.6rem;
}
.page-accounts .inviteQr img{
	margin-right: 2.5rem;
}
.page-accounts .ic-wrap.d-flex img {
	margin: 0;
}
.page-accounts .ic-wrap.d-flex {
	column-gap: 2.4rem;
	margin: 1.8rem 0 0 0;
}
.page-accounts .url-wrap {
	display: flex;
	align-items: center;
	column-gap: 1.6rem;
	margin: 1.6rem 0;
}
.page-accounts input#inviteUrl {
	width: 42.4rem;
	padding: 0.85rem 1rem;
	border: 1px solid #E4E6E9;
}
.page-accounts .sec-account .data-gallery .data-contents .status-wrap{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.6));
	color: #FFF;
	height: 13.7rem;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.page-accounts .sec-account .data-gallery .data-contents .status-wrap .status-inner{
	display: flex;
	align-items: flex-start;
	justify-content: center;
}
.page-accounts .sec-account .data-gallery .data-contents .status-wrap .status.approved{
	color: #05B169;
}
.page-accounts .sec-account .data-gallery .data-contents .status-wrap .status.waiting{
	color: #FFDDB5;
}
.page-accounts .sec-account .data-gallery .data-contents .status-wrap .status.denied{
	color: #FF4E4E;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-gallery .data-contents .multi-image-reset{
	background: #FFF;
	border-radius: 50%;
	width: 2.2rem;
	height: 2.2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: -1.1rem;
	right: -1.1rem;
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
	color: #777777;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-gallery .data-contents .multi-image-reset > img{
	width: 1.2rem;
	height: 1.2rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-gallery .data-contents .img-add-wrap{
	background: #FFF;
	background-size: cover;
	border: #A7A7A7 dashed 1px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	color: #8E8E8E;
	font-size: 1.6rem;
	transition: 0.2s all linear;
	cursor: pointer;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-gallery .data-contents .box_sec + .box-upload{
	margin-left: 2rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-gallery .data-contents .box-upload{
	display: flex;
	align-items: center;
	column-gap: 40px;
}
.page-accounts .sec-account .data-gallery .data-contents .img-add-wrap:hover{
	opacity: 0.6;
}
.page-accounts .sec-account .data-gallery .data-contents .img-add-wrap .ic-plus{
	border: #F1890E 1px solid;
	border-radius: 50%;
	width: 3rem;
	height: 3rem;
	position: relative;
	margin-bottom: 1rem;
}
.page-accounts .sec-account .data-gallery .data-contents .img-add-wrap .ic-plus:before{
	content: "";
	width: 1px;
	height: 1.26rem;
	background: #F1890E;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}
.page-accounts .sec-account .data-gallery .data-contents .img-add-wrap .ic-plus:after{
	content: "";
	width: 1.26rem;
	height: 1px;
	background: #F1890E;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}
.page-accounts .sec-account .data-gallery .photo_list > ul{
	display: flex;
	flex-wrap: wrap;
	column-gap: 34px;
	row-gap: 32px;
	justify-content: flex-start;
	overflow-y: auto;
	padding-top: 1rem;
	padding-right: 1rem;
	overflow-x: hidden;
}
.page-accounts .sec-account .data-gallery .photo_list > ul li{
	position: relative;
}
.page-accounts .sec-account .data-gallery .imageContainer{
	width: 20rem;
	height: 20rem;
	border-radius: 4px;
	position: relative;
	overflow: hidden;
}
.page-accounts .sec-account .data-gallery .imageContainer .photo_thumb{
	width: 100%;
	height: 100%;
	display: block;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .btn-save-wrap{
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: 1px solid #D9DBDE;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .btn-save-wrap > ul{
	display: flex;
	align-items: center;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .btn-save-wrap > ul > li + li{
	margin-left: 1.5rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .btn-save-wrap .btn-style{
	width: 16.4rem;
	height: 4.2rem;
	line-height: 4.2rem;
	font-size: 1.4rem;
	font-weight: 600;
	padding: 0;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .btn-save-wrap .btn-style:hover{
	opacity: 0.6;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .btn-save-wrap .btn-orange{
	background: #F1890E;
	border-color: #F1890E;
	color: #FFF;
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .btn-save-wrap .btn-border-orange{
	color: #F1890E;
	border-color: #F1890E;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .data-desc{
	margin-bottom: 1rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-payment .data-contents + .data-contents{
	margin-top: 1.5rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-payment .data-area{
	max-width: 55rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-payment .data-notice{
	margin-top: 1.2rem;
	font-size: 1.2rem;
	color: #8E8E8E;
	width: 42.2rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-area-western-union .input-wrap > input,
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-area-western-union .input-wrap > select{
	width: 55rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data select.input-bank-type{
	width: 20rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-dob select + select{
	margin-left: 1rem;
}
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .term-wrap select + select{
	margin-left: 1rem;
}
.page-accounts .data-badge table{
	table-layout: fixed;
	width: auto;
}
.page-accounts .data-badge table th,
.page-accounts .data-badge table td{
	padding: 1rem;
	border: 1px solid #ccc;
}
.page-accounts .data-badge table th {
	background: #f5f5f5;
	text-align: left;
	width: 300px;
	font-weight: normal;
}
.page-accounts .data-badge table td input{
	display: none;
}
.page-accounts .data-invite .url-wrap{
	display: flex;
	align-items: center;
	margin-bottom: 20px;
}
.page-accounts .data-invite .url-wrap input{
	width: 424px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: #E4E6E9 1px solid;
	text-align: center;
	font-size: 18px;
}
.page-accounts .data-invite .url-wrap .btn-orange{
	width: 128px;
	height: 42px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #FFF;
	background: #F1890E;
	border-radius: 4px;
	transition: .2s all linear;
	margin-left: 16px;
	font-size: 14px;
}
.page-accounts .data-invite .url-wrap .btn-orange.copied{
	background-color: #ACACAC;
	pointer-events: none;
}
.page-accounts .data-invite .url-wrap .btn-orange.copied:before{
	content: url('../images/account/invite/check-solid.svg');
	display: block;
	padding: 5px 0 0;
}
.page-accounts .data-invite .url-wrap .btn-orange:hover{
	opacity: .6;
}
.page-accounts .data-invite .item + .item{
	margin-left: 16px;
}
.page-accounts .data-invite .item + .item.item-ics{
	margin-left: 25px;
}
.page-accounts .data-invite .item .ic-wrap{
	display: flex;
	align-items: center;
}
.page-accounts .data-invite .item .ic-wrap img{
	width: 40px;
	margin: 0;
}
.page-accounts .data-invite .item .ic-wrap img + img{
	margin-left: 24px;
}
.page-accounts .data-invite .item-ics .text{
	font-size: 16px;
	color: #707070;
	margin-bottom: 16px;
}
/* NJ-16450 */
.page-accounts .sec-account .account-wrap .account-img-area .img-wrap.elite{
	padding: 0.7rem
}
.page-accounts .sec-account .account-wrap .account-img-area .img-wrap.elite::before{
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-image: url(../images/account/elite.png);
	background-repeat: no-repeat;
}
/* END NJ-16450 */
/*-- Payment --*/
.t-link-orange{
	color: #F1890E;
	transition: 0.2s all linear;
}
.t-link-orange:hover{
	opacity: 0.6;
}
.page-payment .ic-loader{
	width: 4rem;
}
.page-payment .data-tabs{
	position: relative;
}
.page-payment .data-tabs .search-area {
	position: absolute;
	right: 0;
	bottom: 1.6rem;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-bottom: 12px;
}
.page-payment .data-tabs .search-area .search-item {
	display: flex;
	align-items: center;
}
.page-payment .data-tabs .search-area .input-select {
	margin-left: .7rem;
	border: #E4E6E9 1px solid;
}
.page-payment .current-coin-wrap{
	display: flex;
	align-items: center;
}
.page-payment .current-coin-wrap .img-wrap{
	width: 2.4rem;
	height: 2.4rem;
}
.page-payment .tutor-rank-wrap{
	display: flex;
	align-items: center;
}
.page-payment .tutor-rank-wrap .img-wrap{
	width: 5rem;
}
.page-payment .sec-ttl{
	font-size: 1.4rem;
	font-weight: 600;
	margin-bottom: 1rem;
}
.page-payment .sec-cut-off{
	margin-bottom: 3rem;
}
.page-payment .cut-off-period{
	color: #8E8E8E;
	font-size: 2.2rem;
}
.page-payment .flex-wrap{
	display: flex;
}
.page-payment .flex-wrap .sec + .sec{
	margin-left: 4rem;
}
.page-payment .flex-wrap .sec .notice-wrap{
	margin-top: 1rem;
	line-height: 1.5;
}
.page-payment .tutor-rank,
.page-payment .balance{
	font-size: 4.2rem;
	font-weight: 600;
	margin-left: 1rem;
}
.page-payment .sec-chart{
	margin-top: 2rem;
}
.page-payment .sec-chart .chart-payment-wrap{
	background: #FFF;
	padding: 2rem 2.7rem;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0, .04);
}
.page-payment .sec-chart .chart-payment-wrap h3{
	margin-bottom: 2.5rem;
}
.page-payment .sec-details .sec-ttl{
	font-size: 1.8rem;
}
.page-payment .notice-wrap .notice{
	color: #8E8E8E;
}
.page-payment .sec-details table th{
	font-size: 1.4rem;
	padding: 1.6rem 2rem;
	text-align: left;
	line-height: 1.5;
	white-space: nowrap;
	color: #777777;
}
.page-payment .sec-details table.table-details th:first-child{
	width: 46%;
}
.page-payment .sec-details table.column-2 th:first-child{
	color: #8E8E8E;
}
.page-payment .sec-details table.column-2 td{
	color: #404040;
}
.page-payment .sec-details table td{
	font-size: 1.8rem;
	padding: 2rem;
	line-height: 1.5;
	white-space: nowrap;
	vertical-align: middle;
}
.page-payment .sec-details table td .star{
	color: #FFBB00;
}
.page-payment .sec-details table td[class^='ic-']{
	display: flex;
	align-items: center;
}
.page-payment .sec-details table td[class^='ic-']:before{
	content: "";
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 4.4rem;
	height: 4.4rem;
	border-radius: 50%;
	background-size: auto;
	background-position: center;
	background-color: #E5F2FF;
	background-repeat: no-repeat;
	margin-right: 1.2rem;
}
.page-payment .sec-details table td.ic-books:before{
	background-image: url('../images/icon/noun_lesson_book.svg');
	background-color: #E5F2FF;
	background-size: 1.5rem;
}
.page-payment .sec-details table td.ic-cancel:before{
	background-image: url('../images/icon/noun_cancel_user.svg');
	background-color: #FFEFEF;
}
.page-payment .sec-details .table-wrap-incentives tr td.ic-percent:before{
	background-color: #EEEEFF;
	background-image: url('../images/icon/tutors.webp');
}
.page-payment .sec-details .table-wrap-incentives tr td.ic-lesson-incentive::before{
	background-image: url('../images/icon/incentive.webp');
}
.page-payment .sec-details .table-wrap-incentives tr td.ic-no-cancellation::before{
	background-image: url('../images/icon/money2.webp');
}
.page-payment .sec-details .table-wrap-incentives tr td.ic-intro-tutor::before{
	background-image: url('../images/icon/tutors.webp');
}
.page-payment .sec-details .table-wrap-incentives tr td.ic-student-appreciation::before{
	background-image: url('../images/icon/appreciation.webp');
}
.page-payment .sec-details table td.ic-trophy:before{
	background-image: url('../images/icon/noun_trophy.svg');
	background-color: rgba(255,188,4, .13);
}
.page-payment .sec-details table td.ic-gavel:before{
	background-image: url('../images/icon/noun_gavel.svg');
	background-color: #FFEFEF;
}
.page-payment .sec-details table td:last-child{
	width: 28%;
}
.page-payment .sec-details table td .t-link{
	text-decoration: underline;
}
.page-payment .sec-details [class^=table-wrap] + [class^=table-wrap]{
	margin-top: 2rem;
}
.page-payment .table-details{
	box-shadow: 0 2px 6px rgba(0,0,0,0.1);
	border-radius: 4px;
	background: #FFF;
}
.page-payment .table-details .t-head-wrap{
	background: #EAECF1;
}
.page-payment .desc-balloon-wrap{
	position: relative;
}
.page-payment .table-wrap-fees .notice-wrap{
	position: relative;
	display: inline-block;
}
.page-payment .notice-balloon{
	display: none;
	position: absolute;
	top: 3.8rem;
	box-shadow: 0 0 8px 2px rgba(0,0,0,0.4);
	background: #fff;
	width: 35rem;
	padding: 1.5rem 2.5rem;
	z-index: 10;
	margin: auto;
	line-height: 1.7;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
	left: 50%;
	transform: translate(-50%);
	white-space: normal;
}
.page-payment .notice-balloon:after,
.page-payment .notice-balloon:before{
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.page-payment .notice-balloon:after{
	border-bottom-color: #fff;
	border-width: 10px;
	margin-left: -10px;
}
.page-payment .notice-balloon:before{
	border-bottom-color: rgba(0,0,0,0.2);
	border-width: 13px;
	margin-left: -13px;
}
.page-payment .table-wrap-obtained-coins table th{
	padding: 0;
	vertical-align: middle;
}
.page-payment .table-wrap-obtained-coins table td{
	font-weight: 600;
	padding: 1.2rem 2rem;
}
.page-payment .table-wrap-total{
	/* NJ-16449 */
	/* border-top: #D6D6D6 1px solid; */
	margin-top: 0;
}
.page-payment .table-wrap-total table th{
	padding: 0;
	vertical-align: middle;
}
.page-payment .table-wrap-total .total-amount{
	font-size: 2.2rem;
	font-weight: 600;
}
.page-payment .ex-desc-wrap ul li{
	color: #8E8E8E;
}
.page-payment .payment-history tr:nth-child(n+3){
	border-top: 1px solid #E4E6E9;
}
.page-payment .payment-history th{
	background: #EAECF1;
	text-align: left;
	padding: 1.5rem 2rem;
	width: 11%;
	vertical-align: middle;
	color: #777777;
	font-size: 1.4rem;
	font-weight: 600;
}
.page-payment .payment-history th:first-child{
	padding-left: min(2.083vw, 4rem);
	width: auto;
}
.page-payment .payment-history th:nth-child(2){
	width: auto;
}
.page-payment .payment-history td{
	background: #FFFFFF;
	text-align: left;
	padding: 2rem 2rem;
	height: 8rem;
	vertical-align: middle;
}
.page-payment .payment-history td:first-child{
	padding-left: min(2.083vw, 4rem);
}
.page-payment .payment-history td:nth-child(2){
	color: #F1890E;
}
.page-payment .payment-history .status-box{
	display: inline-block;
	padding-top: .1rem;
	font-size: 1.6rem;
	font-weight: 600;
	border-radius: 30px;
	width: 11.5rem;
	vertical-align: middle;
	background: #F5F5F5;
	text-align: center;
}
.page-payment .payment-history .status-box.status-carry-over{
	background: #E5F9FB;
	color: #01AEB5;
}
.page-payment .payment-history .status-box.status-paid{
	background: #E5F2FF;
	color: #3582CF;
}
.page-payment .payment-history .status-box.status-not-paid{
	background: #FFEFEF;
	color: #F84D4D;
}
/* page incentive */
.page-incentive .sec-details + .sec-details{
	margin-top: 30px;
}
.page-incentive .sec-details table th,
.page-incentive .sec-details table td{
	white-space: normal;
	text-align: center;
}
.page-incentive .table-details{
	table-layout: fixed;
	width: 100%;
}
.page-incentive .sec-details table.table-details th:first-child,
.page-incentive .sec-details table td:last-child{
	width: auto;
}
.page-incentive .data .data-title{
	font-size: 1.8rem;
	font-weight: 600;
	margin-bottom: 1.1rem;
	position: relative;
	display: inline-block;
}
.page-incentive .data-invite{
	padding: 20px 0;
	border-top: #D6D6D6 1px solid;
	border-bottom: #D6D6D6 1px solid;
	margin-bottom: 2rem;
}
.page-incentive .data-invite .url-wrap{
	display: flex;
	align-items: center;
	margin-bottom: 20px;
}
.page-incentive .data-invite .url-wrap input{
	width: 424px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: #E4E6E9 1px solid;
	text-align: center;
	font-size: 18px;
}
.page-incentive .data-invite .url-wrap .btn-orange{
	width: 128px;
	height: 42px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #FFF;
	background: #F1890E;
	border-radius: 4px;
	transition: .2s all linear;
	margin-left: 16px;
	font-size: 14px;
}
.page-incentive .data-invite .url-wrap .btn-orange.copied{
	background-color: #ACACAC;
	pointer-events: none;
}
.page-incentive .data-invite .url-wrap .btn-orange.copied:before{
	content: url('../images/account/invite/check-solid.svg');
	display: block;
	padding: 5px 0 0;
}
.page-incentive .data-invite .url-wrap .btn-orange:hover{
	opacity: .6;
}
.page-incentive .data-invite .item + .item{
	margin-left: 16px;
}
.page-incentive .data-invite .item + .item.item-ics{
	margin-left: 25px;
}
.page-incentive .data-invite .item .ic-wrap{
	display: flex;
	align-items: center;
}
.page-incentive .data-invite .item .ic-wrap img{
	width: 40px;
	margin: 0;
}
.page-incentive .data-invite .item .ic-wrap img + img{
	margin-left: 24px;
}
.page-incentive .data-invite .item-ics .text{
	font-size: 16px;
	color: #707070;
	margin-bottom: 16px;
}
.page-incentive .info-wrap{
	position: relative;
	cursor: pointer;
	transition: 0.2s all linear;
	display: flex;
	align-items: center;
}
.page-incentive .info-wrap .info-balloon{
	position: absolute;
	bottom: calc(100% + 1.5rem);
	right: -2rem;
	background: #707070;
	border-radius: 1rem;
	padding: 1rem 1.2rem;
	font-size: 16px;
	color: #FFFFFF;
	line-height: 1.7;
	width: max-content;
	max-width: 36.2rem;
	display: none;
	transition: 0.2s all linear;
	white-space: normal;
	opacity: 1;
	font-weight: normal;
	font-family: proxima-nova,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
	letter-spacing: 0px;
}
.page-incentive .info-wrap .info-balloon:after{
	content: "";
	width: 0;
	height: 0;
	border: 1rem solid transparent;
	border-top-width: 1.3rem;
	border-top-color: #707070;
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
}
.page-incentive .info-wrap .info-balloon-incentive:after{
	left:30%;
}
.page-incentive .info-wrap .info-balloon-incentive-date{
	position: absolute;
	bottom: calc(100% + 1.5rem);
	right: -2rem;
	background: #707070;
	border-radius: 1rem;
	padding: 1rem 1.2rem;
	font-size: 16px;
	color: #FFFFFF;
	line-height: 1.7;
	width: max-content;
	max-width: 36.2rem;
	display: none;
	transition: 0.2s all linear;
	white-space: normal;
	opacity: 1;
	font-weight: normal;
	font-family: proxima-nova,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
	letter-spacing: 0px;
}
.page-incentive .info-wrap .info-balloon-incentive-date:after{
	content: "";
	width: 0;
	height: 0;
	border: 1rem solid transparent;
	border-top-width: 1.3rem;
	border-top-color: #707070;
	position: absolute;
	top: 100%;
	transform: translateX(-50%);
}
.page-incentive .info-wrap:hover .info-balloon,
.page-incentive .info-wrap:hover .info-balloon-incentive-date{
	display: block;
}
.page-incentive .info-wrap.info-wrap-date .info-balloon{
/*	left: -44px;*/
	left:calc(50% + 5px);
	transform: translateX(-32%);
}
.page-incentive .info-wrap.info-wrap-date .info-balloon-incentive-date{
	left:14%;
	transform: translateX(-50%);
}
.page-incentive .info-wrap > img{
	width: 1.8rem;
	margin-left: 1rem;
	display: inline;
}
/* page test my cam */
.page-device-settings .help-box-wrap img{
	width: auto;
}
.page-device-settings .chat-area{
	background: #fff;
	padding: 1px;
	border: 1px solid #ccc;
}
.page-device-settings .chat-area .screen {
	display: table;
	width: 100%;
	max-height: calc(100vh - 170px);
	position: relative;
}
.page-device-settings .chat-area .screen .screen-inner {
	display: table-cell;
	vertical-align: middle;
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	overflow-x: hidden;
	background: #000;
}
.page-device-settings .chat-area .screen .screen-obj-wrap {
	width: 381px;
	height: 286px;
}
.page-device-settings .chat-area .btn-setting-flash-start {
	display: inline-block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 200px;
	height: 34px;
	background: #000;
	background: rgba(0,0,0,0.7);
	border: #fff solid 2px;
	border-radius: 6px;
	color: #fff;
	text-align: center;
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: bold;
	cursor: pointer;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
}
.page-device-settings .chat-area .btn-play-sound {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 24px;
	text-align: center;
	font-size: 14px;
	font-size: 1.4rem;
	text-align: center;
	background: #16a9b2;
	border-radius: 4px;
	cursor: pointer;
	-webkit-transition: all 0.2s linear;
	transition: all 0.2s linear;
	z-index: 1001;
	float: right;
	margin-top: 3px;
	margin-left: 3px;
}
.page-device-settings .chat-area .btn-play-sound:before {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	display: inline-block;
	text-align: center;
	font-family: FontAwesome;
	width: 16px;
	height: 16px;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: normal;
	color: #fff;
	line-height: 1;
	content: '\f04b';
	vertical-align: middle;
	line-height: 16px;
	text-indent: 2px;
}
/* reservation */
.page-notice .data-tabs-wrap{
	display: flex;
	align-items: flex-start;
	width: 100%;
}
.page-notice .data-tabs-notice{
	background: #FFF;
	border-radius: 4px;
	text-align: center;
	width: 24rem;
	box-shadow: 0 2px 6px rgba(0,0,0, .16);
	margin-right: 4rem;
}
.page-notice .data-tabs-notice .tab-notice{
	font-size: 1.8rem;
	display: block;
	padding: 1.1rem 0;
	color: #404040;
}
.page-notice .data-tabs-notice .tabs-category > li.on .tab-notice{
	font-weight: 600;
}
.page-notice .data-tabs-notice .tabs-category > li{
	border-bottom: 1px solid #E4E6E9;
	position: relative;
}
.page-notice .data-tabs-notice .tabs-category > li.on{
	border-bottom: 3px solid #F1890E;
	box-shadow: 0 2px 5px rgb(0 0 0 / 5%);
}
.page-notice .data-tabs-notice .tabs-category > li.on:after{
	content: '';
	display: block;
	border: transparent solid 1.5rem;
	border-left-color: #FFF;
	border-right-width: 0;
	position: absolute;
	top: 50%;
	right: -1rem;
	transform: translateY(-50%);
}
.page-notice .data-list-wrap{
	flex: 1;
}
.page-notice .notice{
	display: flex;
	border-radius: 4px;
	background: #F0F2F6;
	padding: 1.5rem 2rem;
	align-items: center;
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
}
.page-notice .notice.unread{
	background: #FFF;
}

.page-notice .notice.read{
	background: #00000029;
}

.page-notice .notice + .notice{
	margin-top: 1.2rem;
}
.page-notice .notice .ic-wrap{
	text-align: center;
	margin-right: 1.2rem;
}
.page-notice .notice .ic-wrap > img{
	width: 3.6rem;
	margin-bottom: 2px;
}

.page-notice .notice .ic-wrap .date {
    font-size: 1.4rem;
    color: #8E8E8E;
}

.page-notice .notice .notice-type-wrap{
	width: 35%;
	max-width: 20.4rem;
	margin-right: 2.5rem;
}

.page-notice .notice .notice-type-wrap .date {
    font-size: 1.4rem;
    color: #8E8E8E;
}

.page-notice .notice .notice-type{
	font-size: 1.8rem;
}
.page-notice .notice .notice-id{
	font-size: 1.6rem;
}
.page-notice .notice .notice-id .c-gray{
	margin-right: .5rem;
}
.page-notice .notice .notice-contents-wrap .date{
	font-size: 1.4rem;
	color: #8E8E8E;
}
.page-notice .notice .notice-contents-wrap .content{
	font-size: 1.8rem;
}
.page-notice .notice.unread .notice-contents-wrap .content{
	font-weight: 600;
}
.page-notice .notice .btn-wrap{
	margin-left: auto;
}
.page-notice .notice .btn-wrap .btn-notice{
	width: 16rem;
	height: 3.4rem;
	line-height: 3.4rem;
	color: #FFF;
	background: #3582CF;
	transition: .2s all linear;
	text-align: center;
	border-radius: 4px;
	font-size: 1.2rem;
	display: block;
}
.page-notice .notice .btn-wrap .btn-notice:hover{
	opacity: .6;
}
/* notice details */
.page-notice .notice-detail-wrap{
	width: 100%;
}
.page-notice .notice-detail{
	background: #FFF;
	border-radius: 4px;
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
	padding: 2rem 3rem 3.5rem;
}
.page-notice .notice-detail .back-btn-wrap{
	margin-bottom: 3rem;
}
.page-notice .notice-detail .btn-back{
	color: #949494;
	font-size: 1.6rem;
}
.page-notice .notice-detail .btn-back:before{
	content: url('../images/icon/ic-back.svg');
	display: inline-block;
	vertical-align: middle;
	margin-right: 1rem;
}
.page-notice .notice-detail .notice-title{
	font-size: 1.8rem;
}
.page-notice .notice-detail .notice-date{
	font-size: 1.4rem;
	color: #8E8E8E;
}
.page-notice .notice-detail .notice-contents{
	font-size: 1.8rem;
	line-height: 1.7;
	border-top: 1px solid #E4E6E9;
	padding-top: 2.2rem;
	margin-top: 3rem;
	color: #8E8E8E;
}
.page-notice .notice-detail .notice-contents p + p{
	margin-top: 1rem;
}
.page-notice .notice-detail .signature{
	display: flex;
	align-items: center;
	margin-top: 3rem;
}
.page-notice .notice-detail .signature img{
	width: auto;
}
.page-notice .notice-detail .signature .text-wrap{
	margin-left: 1.2rem;
}
.page-notice .notice-detail .signature .text-1{
	font-size: 1.4rem;
	color: #8E8E8E;
	line-height: 1.8;
}
/* page ranking */
.page-ranking .my-ranking-wrap{
	display: flex;
	margin: 3rem 0 4rem;
}
.page-ranking .sort_type_wrap ul{
	width: 45rem;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid #1dabbb;
	margin: auto;
	display: table;
}
.page-ranking .sort_type_wrap ul li{
	display: table-cell;
	width: calc(100% / 3);
	vertical-align: middle;
}
.page-ranking .sort_type_wrap ul li a{
	display: block;
	font-size: 1.5rem;
	color: #1dabbb;
	text-align: center;
	line-height: 1.5rem;
	padding: 1.1rem 0;
}
.page-ranking .sort_type_wrap ul li + li{
	border-left: 1px solid #1dabbb;
}
.page-ranking .sort_type_wrap ul li a.on{
	background: #1dabbb;
	color: #fff;
}
.page-ranking .my-ranking-wrap .thumb-wrap .bg-icons{
	background: url('../images/ranking/ranking-bg.svg') no-repeat center;
	padding: 1.2rem .5rem;
	width: 13.1rem;
}
.page-ranking .my-ranking-wrap .thumb-wrap .bg-icons > img{
	width: 12rem;
	border-radius: 50%;
}
.page-ranking .my-ranking-wrap .thumb-wrap .username{
	margin-top: 1rem;
	font-size: 1.8rem;
	text-align: center;
}
.page-ranking .my-ranking-details{
	margin-left: 5rem;
}
.page-ranking .my-ranking-details .details{
	display: flex;
	align-items: center;
	margin-top: 1.4rem;
}
.page-ranking .my-ranking-details .details .item + .item{
	margin-left: 6.2rem;
}
.page-ranking .my-ranking-details .details .title{
	font-size: 1.4rem;
	font-weight: 600;
	color: #8E8E8E;
	margin-bottom: .2rem;
}
.page-ranking .my-ranking-details .details .contents{
	display: flex;
	align-items: center;
}
.page-ranking .my-ranking-details .details .num{
	font-size: 5.4rem;
	font-weight: 600;
	margin-right: 1rem;
	line-height: 1;
}
.page-ranking .ranking-wrap .ranking-header{
	display: flex;
	align-items: center;
	padding: 0 0 1rem;
	border-bottom: 1px solid #D9DBDE;
}
.page-ranking .ranking-wrap .ranking-header .selecter-wrap{
	margin-left: auto;
	display: flex;
	align-items: center;
}
.page-ranking .ranking-wrap .ranking-header .selecter-wrap .term-select{
	margin-left: 1.6rem;
}
.page-ranking .ranking-wrap .sec-ttl{
	font-size: 2.2rem;
	font-weight: bold;
}
.page-ranking .ranking-wrap .ranking-list table{
	border-collapse: separate;
	border-spacing: 0 1rem;
}
.page-ranking .ranking-wrap .ranking-list .list-header{
	color: #8E8E8E;
	font-size: 1.4rem;
}
.page-ranking .ranking-wrap .ranking-list .list-header th{
	text-align: left;
	padding: 1.2rem 2rem .4rem;
}
.page-ranking .ranking-wrap .ranking-list .list-header th:first-child,
.page-ranking .ranking-wrap .ranking-list .list-item td:first-child{
	padding-left: 4rem;
}
.page-ranking .ranking-wrap .ranking-list .list-header .rank{
	width: 10%;
}
.page-ranking .ranking-wrap .ranking-list .list-header .id{
	width: 6.4%;
}
.page-ranking .ranking-wrap .ranking-list .list-header .photo{
	width: 11.7%;
}
.page-ranking .ranking-wrap .ranking-list .list-header .name{
	width: 14.7%;
}
.page-ranking .ranking-wrap .ranking-list .list-header .video{
	width: 15%;
}
.page-ranking .ranking-wrap .ranking-list .list-header .rsv-cnt{
	width: 11%;
}
.page-ranking .ranking-wrap .ranking-list .list-header .lesson-times{
	width: 14%;
}
.page-ranking .ranking-wrap .ranking-list .list-header .rate{
	width: 14.8%;
}
.page-ranking .ranking-wrap .ranking-list .list-item{
	background: #FFF;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
}
.page-ranking .ranking-wrap .ranking-list .list-item td{
	vertical-align: middle;
	height: 9rem;
	padding: 1.2rem 2rem;
}
.page-ranking .ranking-wrap .ranking-list .list-item td .rank-num{
	display: flex;
	width: 5rem;
	justify-content: center;
	font-size: 3.2rem;
	font-weight: 600;
}
.page-ranking .ranking-wrap .ranking-list .list-item .crown{
	position: relative;
}
.page-ranking .ranking-wrap .ranking-list .list-item .crown:after{
	content: url('../images/ranking/rank-1.svg');
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	padding-top: 1.5rem;
}
.page-ranking .ranking-wrap .ranking-list .list-item .crown.second:after{
	content: url('../images/ranking/rank-2.svg');
}
.page-ranking .ranking-wrap .ranking-list .list-item .crown.third:after{
	content: url('../images/ranking/rank-3.svg');
}
.page-ranking .ranking-wrap .ranking-list .list-item .name-wrap{
	/* display: flex; */
	align-items: center;
	padding-right: 10px;
}
.page-ranking .ranking-wrap .ranking-list .list-item .name-wrap > img{
	width: 6rem;
	border-radius: 50%;
	box-shadow: 0 3px 6px rgba(0,0,0, .12);
}
.page-ranking .ranking-wrap .ranking-list .list-item .name-wrap .teacher-name{
	margin-left: 1.6rem;
}
/* page phrases */
.sec-phrase .phrase-list table{
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
	background: #FFF;
	border-radius: 4px;
}
.sec-phrase .phrase-list table tr th:last-child,
.sec-phrase .phrase-list table tr td:last-child{
	width: 18.6rem;
	text-align: center;
}
.sec-phrase .phrase-list table tr:nth-child(even){
	background: #FFF1E2;
}
.sec-phrase .phrase-list table tr td{
	height: 9rem;
	vertical-align: middle;
	padding: 2rem 4rem;
	font-size: 1.8rem;
}
.sec-phrase .phrase-list table tr td + td{
	border-left: 1px solid #D6D6D6;
}
.sec-phrase .phrase-list table tr td:first-child{
	width: 40.13%;
	border-left: none;
}
.sec-phrase .phrase-list table tr td:nth-child(2){
	width: 47.56%;
}
.sec-phrase .phrase-list .btn-im-send{
	background: #16a9b2;
	border-radius: 4px;
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
	transition: .2s all linear;
	width: 10.6rem;
	height: 3.4rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.2rem;
	font-weight: 600;
	color: #FFFFFF;
}
.sec-phrase .phrase-list .btn-im-send:hover{
	opacity: 0.6;
}
/* transition */
.page-translation .contents-desc{
	border-bottom: 1px #D9DBDE solid;
	padding-bottom: 30px;
	margin-bottom: 30px;
}
.page-translation #translated-text{
	white-space: pre-wrap;
	word-wrap: break-word;
	line-break: strict;
	white-space: pre-line;
	word-break: break-all;
}
.page-translation #header {
	min-width: 500px;
	padding-bottom: 60px;
	padding-right: 260px;
}
.page-translation .translate-area {
	position: relative;
}
.page-translation .text-box-wrap {
	display: flex;
	justify-content: center;
	align-items: stretch;
	margin: 56px auto 0;
}
.page-translation .text-box {
	flex: 1;
	height: 100%;
}
.page-translation .text-box .box-title{
	font-size: 20px;
	margin-bottom: 10px;
}
.page-translation .text-box-left{
	padding-right: 10px;
}
.page-translation .text-box-right{
	padding-left: 10px;
	position: relative;
}
.page-translation .text-box-right .placeholder{
	color: #999999;
	font-size: 1.5rem;
	line-height: 1;
}
.page-translation .text-box-right .btn-copy{
	width: 19px;
	height:	24px;
	background: url('../images/icon/copy.svg') no-repeat center / contain;
	transition: .2s all linear;
	position: absolute;
	bottom: 30px;
	right: 30px;
	cursor: pointer;
}
.page-translation .text-box-right .btn-copy:hover{
	opacity: .6;
}
.page-translation .text-box-right .text-copied{
	border-radius: 6px;
	background-color: rgba(0, 0, 0, 0.7);
	color: #FFF;
	font-size: 15px;
	text-align: center;
	padding: 15px;
	line-height: 1;
	width: max-content;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: none;
}
.page-translation .text-box .text-box-inner{
	display: block;
	width: 100%;
	background: #FFF;
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
	height: 100%;
	min-height: 470px;
	padding: 30px;
}
.page-translation .text-box textarea{
	resize: none;
	border: none;
	font-size: 15px;
	line-height: 1.6;
	font-weight: 300;
}
.page-translation .text-box + .text-box {
	margin-left: 20px;
}
.page-translation .btn-wrap-top{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	position: absolute;
	top: -17px;
	right: 0;
	z-index: 10;
}
.page-translation .btn-border-orange{
	border-color: #F1890E;
	color: #F1890E;
	width: 138px;
	height: 38px;
	font-size: 1.2rem;
	padding: 0;
	background: transparent;
}
.page-translation .btn-border-orange:hover{
	opacity: .6;
}
/* inquiry */
.page-inquiry .contents-desc{
	border-bottom: 1px #D9DBDE solid;
	padding-bottom: 30px;
	margin-bottom: 30px;
}
.page-inquiry .input-area{
	width: 480px;
	margin: auto;
}
.page-inquiry .input-area .form-title{
	color: #8E8E8E;
	font-size: 1.8rem;
	margin-bottom: 10px;
}
.page-inquiry .input-area .com-input{
	margin-top: 10px;
}
.page-inquiry .input-area .form-title.required:after{
	content: "*";
	color: #F1890E;
}
.page-inquiry .input-area select,
.page-inquiry .input-area textarea{
	width: 100%;
	border: none;
}
.page-inquiry .input-area textarea{
	padding: 10px;
	height: 280px;
	font-size: 1.8rem;
	resize: vertical;
}
.page-inquiry .form-sub-sec + .form-sub-sec{
	margin-top: 25px;
}
.page-inquiry .form-sub-sec + .btn-wrap{
	margin-top: 25px;
}
.page-inquiry .btn-orange{
	background: #F28A0F;
	color: #FFF;
	font-size: 1.4rem;
	font-weight: 600;
}

.page-inquiry  .sec-inquiry-list .wrap-head {
	display: flex;
	align-items: baseline;
}

.page-inquiry  .sec-inquiry-list .wrap-head .inq-list-filter {
	width: calc(100% - 200px);
	display: flex;
	margin-left: 14px;
}

.page-inquiry  .sec-inquiry-list .wrap-head .inq-list-filter  #inqKeyword {
	width: 290px;
	box-shadow: none;
	border: 1px solid #D8D8D8;
	padding-left: 10px;
}

.page-inquiry  .sec-inquiry-list .wrap-head .inq-list-filter  #inqSearchBtn {
	margin: 0 12px;
	background-color: #16a9b2;
	color: #fff;
	border-radius: 3px;
	border: none;
	font-weight: bold;
	padding: 0 5px;
}

.page-inquiry  .sec-inquiry-list .wrap-head .inq-list-filter  #inqSearchBtn:hover {
	background-color: #18c3cc;
}

.page-inquiry  .sec-inquiry-list .wrap-head .inq-list-filter  #inqKeyword {
	width: 290px;
	box-shadow: none;
	border: 1px solid #D8D8D8;
}

.page-inquiry  .sec-inquiry-list .wrap-head .inq-list-filter  #inqDisplayOption {
	width: 84px;
	border: 1px solid #D8D8D8;
}

.page-inquiry .inquiry-list{
	border: #D9DBDE 1px solid;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0, .29);
}
.page-inquiry .item-inquiry .link-detail{
	padding: 20px;
	display: flex;
	align-items: flex-start;
	color: #404040;
	transition: .2s all linear;
}
.page-inquiry .item-inquiry .link-detail:hover{
	opacity: .6;	
}
.page-inquiry .item-inquiry:first-child{
	border-radius: 4px 4px 0 0;
}
.page-inquiry .item-inquiry:last-child{
	border-radius: 0 0 4px 4px;
}
.page-inquiry .item-inquiry.item-new{
	background: #FFF;
	box-shadow: 0 3px 15px #D2D2D2;
}
.page-inquiry .item-inquiry + .item-inquiry{
	border-top: 1px solid #D9DBDE;
}
.page-inquiry .item-inquiry .area-date{
	display: flex;
	align-items: center;
	flex-direction: column;
	margin-right: 50px;
	height: 78px;
}
.page-inquiry .item-inquiry .area-date .ic-new{
	color: #3582CF;
	font-size: 1.4rem;
	font-weight: 600;
	border-radius: 10px;
	background: #E1ECFF;
	width: 52px;
	height: 19px;
	line-height: 19px;
	display: inline-block;
	text-align: center;
}

.page-inquiry .item-inquiry .area-texts .title {
	display: flex;
	align-items: center;
}

.page-inquiry .item-inquiry .area-texts .title .new-label {
	margin-left: 8px;
	border-radius: 13px;
	background-color: #E3ECFC;
	color: #4B84CA;
	font-size: 12px;
	font-weight: 800;
	text-align: center;
	padding: 0px 6px;
}

.page-inquiry .item-inquiry .area-date .calendar{
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
	width: 65px;
	background: #FFF;
}
.page-inquiry .item-inquiry .area-date .calendar .month{
	background: #173F67;
	color: #FFF;
	font-size: 1.4rem;
	padding: 1px 0;
	text-align: center;
}
.page-inquiry .item-inquiry .area-date .calendar .month:hover {
	border: unset!important;
	border-radius: unset!important;
}
.page-inquiry .item-inquiry .area-date .calendar .day{
	font-size: 2.2rem;
	font-weight: 600;
	height: 36px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.page-inquiry .item-inquiry .area-date .date{
	color: #8E8E8E;
	min-width: 138px;
}
.page-inquiry .item-new + .item-new:not(:last-child){
	box-shadow: none;
}
.page-inquiry .item-new + .item-new:last-child{
	box-shadow: 0 8px 7px #d2d2d2;
}

.page-inquiry .item-inquiry .area-texts{
	font-size: 1.8rem;
}
.page-inquiry .item-inquiry.item-new .area-texts{
	font-weight: 600;
}
.page-inquiry .item-inquiry .area-texts .text {
	color: #8E8E8E;
	height: 38px;
	line-height: 19px;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}
.page-inquiry .sec-inquiry-list{
	margin-top: 28px;
	display: flex;
	margin-bottom: 50px;
}
.page-inquiry .sec-inquiry-list .sec-ttl{
	font-size: 1.8rem;
	font-weight: 600;
	color: #8E8E8E;
	margin-bottom: 25px;
	line-height: 1;
}
/* page-inquiry-detail */
.page-inquiry-detail .head{
	background: #173F67;
	padding: 0 20px;
	height: 80px;
	display: flex;
	align-items: center;
	border-radius: 4px 4px 0 0;
}
.page-inquiry-detail .head .head-link{
	display: inline-block;
	color: #FFF;
	transition: .2s all linear;
}
.page-inquiry-detail .head .head-link:before{
	content: url('../images/icon/chevron-left-grey.svg');
	display: inline-block;
	width: 7px;
	margin-right: 7px;
	vertical-align: middle;
}
.page-inquiry-detail .head .head-link:hover{
	opacity: .6;
}
.page-inquiry-detail .body{
	padding: 20px;
}
.page-inquiry-detail .exchanges-box{
	background: #FFF;
	border-radius: 4px;
	border: #E4E6E9 solid 1px;
	max-width: 1140px;
	margin: auto;
}
.page-inquiry-detail .exchanges{
}
.page-inquiry-detail .exchanges .item{
	display: flex;
	border: #E4E6E9 1px solid;
	min-height: 190px;
}
.page-inquiry-detail .exchanges .item .icon{
	width: 138px;
	padding: 12px 0 0;
	background: #FAFAFA;
}
.page-inquiry-detail .exchanges .item .icon .img-wrap{
	width: 60px;
	height: 60px;
	margin: auto;
	border-radius: 50%;
	overflow: hidden;
}
.page-inquiry-detail .exchanges .item .icon .img-wrap img{
	width: 100%;
}
.page-inquiry-detail .exchanges .item .icon .name{
	margin-top: 10px;
	text-align: center;
}
.page-inquiry-detail .exchanges .item .contents{
	flex: 1;
	padding: 0 13px 18px;
	font-size: 1.8rem;
}
.page-inquiry-detail .exchanges .item .contents .date{
	color: #8E8E8E;
	font-size: 1.8rem;
	border-bottom: #E4E6E9 1px solid;
	letter-spacing: .6px;
	height: 50px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.page-inquiry-detail .exchanges .item .contents .texts{
	margin-top: 10px;
	line-height: 2;
}
.page-inquiry-detail .exchanges .item + .item{
	margin-top: 16px;
}
.page-inquiry-detail .exchanges .btn-expand-wrap{
	position: relative;
	z-index: 100;
	margin: 16px auto;
}
.page-inquiry-detail .exchanges .btn-expand-wrap:before{
	content: "";
	display: block;
	border-top: #E4E6E9 1px solid;
	border-bottom: #E4E6E9 1px solid;
	height: 11px;
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	z-index: 10;
}
.page-inquiry-detail .exchanges .btn-expand{
	border: #A8A8A8 1px solid;
	padding: 10px 12px;
	border-radius: 4px;
	font-size: 1.2rem;
	font-weight: 600;
	display: flex;
	justify-content: center;
	align-items: center;
	width: max-content;
	margin: auto;
	color: #404040;
	background: #FFF;
	position: relative;
	z-index: 110;
	line-height: 1;
	transition: .2s all linear;
}
.page-inquiry-detail .exchanges .btn-expand:after{
	content: url('../images/icon/maximize.svg');
	margin-left: 5px;
	transition: .2s all linear;
}
.page-inquiry-detail .exchanges .btn-expand:hover{
	border-color: rgba(168, 168, 168, .6);
	color: rgba(64, 64, 64, .5);
}
.page-inquiry-detail .exchanges .btn-expand:hover:after{
	opacity: .6;
}
.page-inquiry-detail .exchanges .t-link-orange{
	text-decoration: underline;
}
.page-inquiry-detail .reply{
	margin-top: 20px;
}
.page-inquiry-detail .reply .title{
	font-size: 2.2rem;
	font-weight: 600;
	margin-bottom: 20px;
}
.page-inquiry-detail .reply .form-wrap textarea{
	width: 100%;
	border: #E4E6E9 1px solid;
	padding: 20px;
	font-size: 1.8rem;
	resize: vertical;
	min-height: 184px;
}
.page-inquiry-detail .reply .form-wrap textarea::placeholder{
	color: #8E8E8E;
}
.page-inquiry-detail .reply .btn-send{
	border-radius: 4px;
	width: 128px;
	height: 47px;
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
}
.page-inquiry-detail .exchanges .item.evaluated .contents .date{
	/* display: flex; */
	/* justify-content: space-between; */
	/* align-items: center; */
}
.page-inquiry-detail .exchanges .item .contents .rating-star-wrap{
	display: none;
}
.page-inquiry-detail .exchanges .item .contents .rating-num{
	background: #F1F1F1;
	width: 34px;
	height: 34px;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	border-radius: 50%;
	color: #8E8E8E;
	font-size: 1.6rem;
	font-weight: 600;
	padding: 0 0 4px;
}
.page-inquiry-detail .exchanges .item .contents .rating-num:after{
	content: url('../images/icon/rating-star.svg');
	margin-left: 2px;
}
/* guidelines */
.page-guides .contents-desc{
	border-bottom: #D6D6D6 1px solid;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.page-guides .input-wrap{
	width: 400px;
	height: 34px;
	background: #FFF;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border: #E4E6E9 1px solid;
	border-radius: 4px;
	padding: 0 10px;
	margin-top: 20px;
}
.page-guides .input-wrap input{
	font-size: 1.4rem;
	flex: 1;
	border: none;
}
.page-guides .input-wrap input::placeholder{
	color: #AEAEAE;
}
.page-guides .input-wrap .ic-search{
	width: 14.6px;
}
.page-guides .sec-guides .guide-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	width: 1140px;
}
.page-guides .sec-guides .guide-list .box-guide{
	width: 352px;
	height: 165px;
	display: flex;
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 2px 6px rgba(0,0,0, .1);
	margin: 0 0 40px;
	background: #FFF;
	color: #404040;
	transition: .2s all linear;
}
.page-guides .sec-guides .guide-list .box-guide:hover{
	opacity: .6;
}
.page-guides .sec-guides .guide-list .box-guide .img-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 160px;
}
.page-guides .sec-guides .guide-list .box-guide .text-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 2.4rem;
	font-weight: 600;
	flex: 1;
	text-align: center;
	line-height: 1.3;
}
.page-guides .sec-guides .guide-list .box-guide.box-orientation .img-wrap{
	background: #3B86FF;
}
.page-guides .sec-guides .guide-list .box-guide.box-orientation .img-wrap .icon{
	width: 48px;
}
.page-guides .sec-guides .guide-list .box-guide.box-tutor-hp .img-wrap{
	background: #FFBB00;
}
.page-guides .sec-guides .guide-list .box-guide.box-tutor-hp .img-wrap .icon{
	width: 53px;
}
.page-guides .sec-guides .guide-list .box-guide.box-prohibited .img-wrap{
	background: #13CD7F;
}
.page-guides .sec-guides .guide-list .box-guide.box-prohibited .img-wrap .icon{
	width: 58px;
}
.page-guides .sec-guides .guide-list .box-guide.box-payment .img-wrap{
	background: #D07DFF;
}
.page-guides .sec-guides .guide-list .box-guide.box-payment .img-wrap .icon{
	width: 59px;
}
.page-guides .sec-guides .guide-list .box-guide.box-contract .img-wrap{
	background: #FFC5B2;
}
.page-guides .sec-guides .guide-list .box-guide.box-contract .img-wrap .icon{
	width: 42px;
}
.page-guides .sec-guides .guide-list .box-guide.box-faq .img-wrap{
	background: #9CB6B8;
}
.page-guides .sec-guides .guide-list .box-guide.box-faq .img-wrap .icon{
	width: 52px;
}
/* guides */
.sec-guides .breadcrumbs{
	margin: 20px;
}
.sec-guides .breadcrumbs > ul{
	display: flex;
	align-items: center;
}
.sec-guides .breadcrumbs > ul > li + li:before{
	content: "/";
	display: inline-block;
	margin: 0 5px;
	color: #F1890E;
	font-size: 1.6rem;
}
.sec-guides .breadcrumbs > ul > li > a{
	color: #F1890E;
	transition: .2s all linear;
}
.sec-guides .breadcrumbs > ul > li > a:hover{
	opacity: .6;
}
.sec-guides .breadcrumbs > ul > li:last-child{
	color: #949494;
}
.sec-guides .col-wrap{
	max-width: 1140px;
	margin: auto;
	display: flex;
	/* align-items: flex-start; */
	padding: 30px 0px;
	background: #FFF;
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
}
.sec-guides .col-wrap .col-1{
	width: 297px;
	/* border-right: #D9DBDE 1px solid; */
	flex: inherit;
	max-width: initial;
	padding: 0;
}
.sec-guides .col-wrap .col-2{
	padding: 0 20px;
	flex: 1;
	max-width: initial;
	position: relative;
}
.sec-guides .col-wrap .col-2:before{
	content: "";
	display: block;
	width: 1px;
	height: calc(100% - 30px);
	background: #D9DBDE;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0px;
}
.sec-guides .nav-local-options dd + dt{
	margin-top: 16px;
}
.sec-guides .nav-local-options dt{
	font-size: 2rem;
	font-weight: 600;
	padding: 0 20px;
}
.sec-guides .nav-local-options dd > ul > li > a{
	font-size: 1.6rem;
	color: #8E8E8E;
	/* height: 36px; */
	display: flex;
	align-items: center;
	padding: 8px 20px;
	transition: .2s all linear;
}
.sec-guides .nav-local-options dd > ul > li > a:hover{
	opacity: .6;
}
.sec-guides .nav-local-options dd > ul > li > a.on{
	background: #F1F2F5;
	color: #404040;
	pointer-events: none;
}
.sec-guides .col-wrap .col-2 .contents .sec-ttl{
	font-size: 3rem;
	font-weight: 600;
	color: #F1890E;
	padding: 0 0 15px;
	line-height: 1;
	border-bottom: #D6D6D6 1px solid;
}
.sec-guides .col-wrap .col-2 .contents .sec-box{
	padding: 10px 0 0;
}
.sec-guides .col-wrap .col-2 .contents .sec-box .desc-ttl{
	font-size: 2.6rem;
}
.sec-guides .col-wrap .col-2 .contents .sec-box .desc-area{
	color: #8E8E8E;
}
.sec-guides .col-wrap .col-2 .contents .sec-box .desc-area p + .figure{
	margin-top: 13px;
}
.sec-guides .col-wrap .col-2 .contents .sec-box .desc-area .figure > img{
	box-shadow: 0 3px 6px rgba(0,0,0, .16);
}
.sec-guides .footer-guide{
	margin-top: 3rem;
}
.sec-guides .copyright{
	text-align: center;
	color: #8E8E8E;
	font-size: 1.4rem;
}
.sec-guides .rules-wrap > ul{
	margin: 0 auto;
	width: 100%;
	display: flex;
}
.sec-guides .rules-wrap > ul > li{
	display: block;
	vertical-align: top;
}
.sec-guides .rules-wrap > ul > li+li{
	margin-top: 2rem;
}
.sec-guides .rules-wrap ul li dt,
.sec-guides .rules-wrap ul li dd{
	text-align: center;
}
.sec-guides .rules-wrap ul li dt{
	font-size: 24px;
	font-size: 2.4rem;
	font-family: "RalewayBold";
	margin-bottom: 5px;
}
.sec-guides .rules-wrap ul li dd img{
	padding: 5px 0 10px;
}
.sec-guides .rules-wrap ul li dd p{
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.4;
	text-align: center;
}
.sec-guides .three-criteria img{
	width: auto;
}
.sec-guides .three-criteria .description-wrap dl{
	display: flex;
	align-items: center;
}
.sec-guides .demo{
	padding-bottom: 6px;
}
.sec-guides .demo + .demo{
	border-top: 1px #eee solid;
	padding-top: 30px;
}
.sec-guides .demo dl dd .video_wrap{
	text-align: center;
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.sec-guides .demo dl dd .video_wrap iframe{
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	margin: auto;
	width: 100% !important;
	height: 100% !important;
	max-width: 600px;
	max-height: 340px;
}
.sec-guides .demo_lessons .demo dl dd .d_cell.first{
	width: 120px;
}
.sec-guides .demo_lessons .demo dl dd .d_cell.second{
	width: auto;
}
@media screen and (min-width: 786px){
	.sec-guides .rules-wrap > ul > li{
		display: inline-block;
		width: 22rem;
	}
	.sec-guides .rules-wrap > ul > li+li{
		margin-top: 0;
	}
	.sec-guides .notice-list{
		width: auto;
		padding-left: 10px;
	}	
	.sec-guides .outline-wrap ul li{
		display: inline-block;
		width: 27rem;
	}
	.sec-guides .outline-wrap ul li+li{
		margin-top: 0;
	}
	.sec-guides .outline-wrap ul li:first-child dd figure:after{
		top: 29%;
		right: -10px;
		width: 40px;
		left: auto;
		margin: 0;
		transform: rotate(0deg);
	}
	.sec-guides .outline-wrap ul li:nth-child(2) dd figure:after{
		top: 29%;
		right: -10px;
		width: 40px;
		left: auto;
		margin: 0;
		transform: rotate(0deg);
	}
	/* .sec-guides .demo dl dd .video-wrap{
		padding-top: 37rem;
	} */
}

/*--------------*/
/* learningkit  */
/*--------------*/
.page-learningkit *,
.page-learningkit *:before,
.page-learningkit *:after {
	box-sizing: border-box;
}
.page-learningkit {
	padding: 40px;
	font-size: 15px;
	color: #8E8E8E;
	line-height: 1.6;
}
.page-learningkit hr {
	margin: 30px 0;
	border-top: 1px solid #D6D6D6;
}
.page_learningkit-header {
	display: flex;
	width: 100%;
	align-items: flex-end;
}

.page_learningkit-header .page_learningkit-header--left,
.page_learningkit-header .page_learningkit-header--right {
	width: 50%;
}

.page_learningkit-header .page-ttl .lesson-count {
	color: #F78A62;
}

.page-learningkit .page-ttl {
	font-size: 30px;
	font-size: 3rem;
	font-weight: 600;
	margin-bottom: 20px;
	color: #404040;
}
.page-learningkit .page-desc {
	font-size: 1.8rem;
	line-height: 1.5;
	color: #999;
	padding-bottom: 20px;
	border-bottom: 1px solid #D6D6D6;
}
.page-learningkit .page-sub-ttl {
	color: #F1890E;
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 10px;
}
.page-learningkit .learningkit-list-wrap {
}
.page-learningkit .learningkit-list-wrap .list-name {
	color: #F1890E;
	font-size: 24px;
	font-weight: 600;
}
.page-learningkit .learningkit-list {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	margin-left: -15px;
	margin-right: -15px;
}
.page-learningkit .learningkit-list > li {
	padding: 15px;
}
.page-learningkit .learningkit-list .kit-inner {
	display: flex;
	height: 100%;
	flex-direction: column;
	width: 220px;
	color: #555;
	overflow: hidden;
	border-radius: 4px;
	transition: all .2s ease-in-out;
	box-shadow: 1px 1px 6px rgba(0,0,0,0.2);
}
.page-learningkit .learningkit-list .kit-inner:hover {
	opacity: .6;
}
.page-learningkit .learningkit-list .kit-inner > .kit-img {
	overflow: hidden;
	width: 100%;
	height: 110px;
	display: flex;
	/* align-items: center; */
	justify-content: center;
	padding: 10px;
}
.page-learningkit .learningkit-list .kit-inner.kit-first-lesson > .kit-img {
	background: linear-gradient(to right, #2BACA2, #1BE590);
}
.page-learningkit .learningkit-list .kit-inner.kit-speaking > .kit-img {
	background: linear-gradient(to right, #FF49D0, #FFA2BE);
}
.page-learningkit .learningkit-list .kit-inner.kit-topic-talk > .kit-img {
	background: linear-gradient(to right, #F1890E, #FFDB78);
}
.page-learningkit .learningkit-list .kit-inner.kit-5minvoc > .kit-img {
	background: linear-gradient(to right, #BD63F2, #FF9DE4);
}
.page-learningkit .learningkit-list .kit-inner.kit-5mindis > .kit-img {
	background: linear-gradient(to right, #818181, #DDDDDD);
}
.page-learningkit .learningkit-list .kit-inner.kit-47pref > .kit-img {
	background: linear-gradient(to right, #F96D80, #FFA85E);
}
.page-learningkit .learningkit-list .kit-inner.kit-business > .kit-img {
	background: linear-gradient(to right, #FFE97B, #C2AE4A);
}
.page-learningkit .learningkit-list .kit-inner.kit-speakup > .kit-img {
	background: linear-gradient(to right, #495AFF, #0ACFFE);
}
.page-learningkit .learningkit-list .kit-inner.kit-toeic > .kit-img {
	background: linear-gradient(to right, #58A9D8, #B3E2FE);
}
.page-learningkit .learningkit-list .kit-inner.kit-pronunciation > .kit-img {
	background: linear-gradient(to right, #31DBFB, #04A7C5);
}
.page-learningkit .learningkit-list .kit-inner.kit-news > .kit-img {
	background: linear-gradient(to right, #A3B741, #E6FA80);
}
.page-learningkit .learningkit-list .kit-inner.kit-kids > .kit-img {
	background: linear-gradient(to right, #50C9C3, #A1F6F1);
}
.page-learningkit .learningkit-list .kit-inner.kit-lesson-manners > .kit-img {
	background: linear-gradient(to right, #FF3434, #FFA182);
}
.page-learningkit .learningkit-list .kit-inner.kit-sbs > .kit-img > img,
.page-learningkit .learningkit-list .kit-inner.kit-letsgo > .kit-img > img{
	width: 100%;
}
.page-learningkit .learningkit-list .kit-inner.kit-toeic > .kit-img > img{
	width: 116px;
}
.page-learningkit .learningkit-list .kit-inner > .kit-img > img {
	display: block;
	width: 100%;
	transition: all .2s ease-in-out;
	object-fit: contain;
}
.page-learningkit .learningkit-list .kit-inner > .kit-name {
	background-color: #eee;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	justify-content: center;
	align-items: center;
	min-height: 70px;
}

.page-learningkit .learningkit-list .kit-inner .kit-name .kit-badge {
	font-size: 18px;
	padding: 0 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 600;
}

.page-learningkit .learningkit-list .kit-inner .kit-name .kit-badge-remain {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 13px;
	font-weight: 600;
	padding: 0 5px;
	color: #000;
}

.page-learningkit .learningkit-list .kit-inner .kit-name .kit-badge-remain .number-remain {
	color: #FF9900;
}
/* video-list */
.page-learningkit .video-list .kit-inner {
	display: block;
	width: 90%;
	display: flex;
    height: 100%;
    flex-direction: column;
	transition: all .2s linear;
}
.page-learningkit .video-list .kit-inner:hover {
	opacity: .5;
}
.page-learningkit .video-list .kit-inner > .kit-img {
	position: relative;
	background-color: #000;
	border-radius: 4px;
	overflow: hidden;
}
.page-learningkit .video-list .kit-inner > .kit-img:after {
	content: '';
	position: absolute;
	width: 45px;
	height: 45px;
	background-image: url(../images/learningkit/ic-play.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}
.page-learningkit .video-list .kit-inner > .kit-img > img {
	opacity: .5;
	width: 100%;
}
.page-learningkit .video-list .kit-inner.coming-soon > .kit-img:after {
	display: none;
}
.page-learningkit .video-list .kit-inner.coming-soon > .kit-img > img {
	opacity: 1;
}
.page-learningkit .video-list .kit-inner > .kit-name {
	text-align: center;
	color: #8E8E8E;
	font-size: 1.8rem;
	margin-top: 15px;
}
/*-----------------------------------*/
/*----------- detail page -----------*/
/*-----------------------------------*/
.page-learningkit .detail-tb-cover-wrap {
	display: block;
	width: 140px;
}
.page-learningkit .detail-tb-cover-wrap > a {
	display: block;
	overflow: hidden;
	border-radius: 2px;
	transition: all .2s ease-in-out;
}
.page-learningkit .detail-tb-cover-wrap > a:hover img {
	opacity: 1;
}
.page-learningkit .detail-tb-cover-wrap > a:hover {
	transform: translateY(-3px);
}
.page-learningkit .detail-tb-cover-wrap img {
	display: block;
	width: 100%;
}
.page-learningkit .learningkit-btn {
	display: inline-block;
	box-sizing: border-box;
	color: #fff;
	background-color: #F28A0F;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.6;
	padding: 10px;
	min-width: 200px;
	text-align: center;
	border-radius: 6px;
	transition: all 0.2s ease-in-out;
}
.page-learningkit .learningkit-btn:hover {
	opacity: .6;
}
/* back button */
.page-learningkit .back-btn-wrap{
	margin-bottom: 3rem;
}
.page-learningkit .btn-back{
	color: #949494;
	font-size: 1.6rem;
}
.page-learningkit .btn-back:before{
	content: url('../images/icon/ic-back.svg');
	display: inline-block;
	vertical-align: middle;
	margin-right: 1rem;
}
.page-learningkit .btn-block_wrap{
	position: absolute;
	top: 0;
	right: 0;
}

/* learning kit badges */
.page-learningkit .ic-course_badge.color-orange {
    background-image: url('../images/icon/badge-22-orange.png');
}

.page-learningkit .ic-course_badge {
    display: inline-block;
    width: 22px;
    height: 22px;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-size: cover;
	margin-right: 10px;
    background-image: url('../images/icon/badge-22-gray.png');
}
/* end learning kit badges */

/* learningkit sub */
.page-learningkit-detail .contents-desc{
	border-bottom: 1px solid #D6D6D6;
	padding-bottom: 16px;
	margin-bottom: 16px;
}
.page-learningkit-detail .contents-desc .title-wrap{
	display: flex;
	align-items: center;
}
.page-learningkit-detail .contents-desc .title-wrap .title-img{
	width: 60px;
	height: 60px;
	border-radius: 4px;
	margin-right: 12px;
}
.page-learningkit-detail .contents-desc .title-wrap .title-txt{
	font-size: 2.4rem;
	font-weight: 600;
	color: #404040;
}
.page-learningkit-detail .learningkit-list-wrap .list-name{
    font-size: 2rem;
	margin-bottom: 15px;
}
.page-learningkit-detail .learningkit-list > li{
	padding: 0;
}
.page-learningkit-detail .btn-list{
	margin-top: 15px;
}
.page-learningkit-detail .learningkit-list-wrap{
	margin-bottom: 26px;
}
.page-learningkit-detail .learningkit-list-wrap .video-list{
	display: flex;
	width: 100%;
}
.page-learningkit-detail .learningkit-list-wrap .video-list > li + li{
	margin-left: 20px;
}
.page-learningkit-detail .btn-tab-wrap {
    display: flex;
    align-items: center;
    width: auto;
}
.page-learningkit-detail .btn-tab-wrap .btn-tab{
	width: 140px;
	height: 140px;
	position: relative;
}
.page-learningkit-detail .btn-tab-wrap .btn-tab + .btn-tab{
	margin-left: 20px;
}
.page-learningkit-detail .btn-tab-wrap .btn-tab.on:before{
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	border: #22A9B2 4px solid;
}
.page-learningkit-detail .btn-tab-wrap .btn-tab:not(.on){
	opacity: .5;
}
.page-learningkit-detail .btn-tab-wrap{
	display: flex;
	align-items: center;
	width: auto;
}
.page-learningkit-detail .btn-tab-wrap > .btn-tab:hover {
	transform: none;
}
/* incentive-list */
.page-incentive-list .sec-incentives .page-ttl{
	font-size: 3rem;
	font-weight: 600;
	padding: 0 0 15px;
	border-bottom: #D6D6D6 1px solid;
	margin-bottom: 15px;
}
.page-incentive-list .sec-incentives{
	background: #FFF;
	box-shadow: 0 1px 6px rgba(0,0,0, .29);
	border-radius: 4px;
	padding: 30px;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap + .item-wrap{
	margin-top: 24px;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-ttl{
	font-size: 1.8rem;
	font-weight: 600;
	margin-bottom: 20px;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .incentive-wrap{
	color: #F1890E;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .incentive-wrap.c-blue{
	color: #35A6E2;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .incentive-wrap .amount{
	font-size: 3.4rem;
	font-weight: 600;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .incentive-wrap .text-1{
	font-size: 1.6rem;
	color: #777777;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .item-sub-ttl{
	font-size: 1.8rem;
	font-weight: 600;
	margin-bottom: 16px;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .categories{
	display: flex;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .categories .category + .category{
	margin-left: 23px;
	padding-left: 23px;
	border-left: 1px solid #D6D6D6;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .category .d-flex{
	align-items: flex-start;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .category .num{
	border: 1px solid #F1890E;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.8rem;
	color: #F1890E;
	font-weight: bold;
	width: 40px;
	height: 40px;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .category .main{
	margin-left: 20px;
	height: 200px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .category .main .text{
	color: #777777;
	font-size: 1.6rem;
	font-weight: 600;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .category .main img{
	width: auto;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .incentive-wrap{
	border: 1px solid #D6D6D6;
	border-radius: 4px;
	background: #FFF;
	width: 454px;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .incentive-wrap .table-row{
	display: flex;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .incentive-wrap .table-row + .table-row{
	border-top: 1px solid #D6D6D6;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .incentive-wrap .col{
	padding: 16px 20px;
	font-size: 1.8;
	font-weight: 600;
	display: flex;
	align-items: center;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .incentive-wrap .col + .col{
	border-left: 1px solid #D6D6D6;
}
.page-incentive-list .sec-incentives .list-wrap .item-wrap .item-sub-wrap .incentive-wrap .col .num{
	color: #FFF;
	font-weight: bold;
	padding: 5px 10px;
	border-radius: 4px;
	background: linear-gradient(to right, #F1890E, #FFBB00);
	margin-right: 10px;
}
.page-incentive-list .sec-incentives .notice-wrap{
	margin-top: 20px;
}
.page-incentive-list .sec-incentives .notice{
	font-size: 1.6rem;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .data-head-title{
	font-size: 2.2rem;
	font-weight: 600;
	margin-bottom: 1.3rem;
	position: relative;
	display: inline-block;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .data-contents .data-group-input{
	margin-bottom: 1.3rem;
}

/* NJ-12641 */
.lesson-message-grid{
	display:grid;
	grid-template-columns: repeat(12, 1fr);
	/* grid-template-areas: 
		"area-user area-category area-lesson-start area-lesson-finish area-lesson-time area-lesson-type area-new-msg area-dismiss"
		; */
	gap: 16px;
	align-items: center;
	padding: 24px 30px;
	background-color: #FFF;
}
.tab-message-list .message-list .list-item.list-item-sent .lesson-message-grid,
.tab-message-list .message-list .list-item.list-item-dismissed .lesson-message-grid {
	background-color: #e7e7e7 !important;
}

/* .lesson-message-grid.lesson-message-grid--draft{
	grid-template-areas: 
		"area-user area-category area-lesson-start area-send-callan-message area-message area-dismiss"
		;
} */

.lesson-message-grid.lesson-message-grid--shaded{
	background-color: #EAEAEA;
	transition: background-color .1s ease;
}

.lesson-message-grid.lesson-message-grid--header{
	background-color: unset;
	color: #8E8E8E;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	text-transform: uppercase;
}

.lesson-message.tab-message-list{
	max-width: 1563px;
	margin: auto;
}

.lesson-message.tab-message-list.lesson-message--messsage{
	max-width: unset;
}

.lesson-message.tab-message-list .message-list .list-item{
	padding: unset;
}

.ls-table.list-item{
	padding: 40px 30px!important;
}

/* grid-areas */
.lesson-message-grid>.lesson-message-grid__item.area-user{ 
	grid-area: area-user;
	grid-column: 1/4;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-category{ 
	grid-area: area-category;
	grid-column: 8/10;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-lesson-start{ 
	grid-area: area-lesson-start;
	grid-column: 3/5;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-lesson-finish{ 
	grid-area: area-lesson-finish;
	grid-column: 5/7;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-lesson-time{ 
	grid-area: area-lesson-time;
	grid-column: 7/8;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-bookmark{ 
	grid-area: area-lesson-type;
	grid-column: 10/11;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-message{ 
	grid-area: area-new-msg;
	grid-column: 11/12;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-dismiss{ 
	grid-area: area-dismiss;
	grid-column: 12/-1;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-send-callan-message{ 
	grid-area: area-send-callan-message;
	grid-column: 7/11;
	grid-row: 1/1;
}
.lesson-message-grid>.lesson-message-grid__item.area-lesson-on-air{ 
	grid-area: area-send-callan-message;
	grid-column: 10/11;
	grid-row: 1/1;
}
/* end grid-areas */

.lesson-message-grid>.lesson-message-grid__item:not(.area-user){
	text-align: center;
}

.message-avatar-wrap{
	min-width: 70px;
	min-height: 70px;
	max-width: 70px;
	max-height: 70px;
	position: relative;
	overflow: hidden;
	border-radius: 50%;
}

.lesson-message-grid>.lesson-message-grid__item.area-user{
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	gap: .75em;
	min-width: 220px;
	max-width: 220px;
	padding-inline-end: 27px;
	justify-content: center;
}

.message-avatar-wrap>img{
	position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.lesson-message-grid>.lesson-message-grid__item>.message-details>.message-user-nickname{
	font-weight: 500;
	text-transform: capitalize;
	word-break: break-word;
}

.lesson-message-grid>.lesson-message-grid__item.area-category>p{
	color: #ff8a00;
}

/* msg statuses */
.message-status{
	padding: 3px 18px;
	border-radius: 1em;
	display: inline-block;
	font-size: 14px;
	text-transform: capitalize;
	text-align: center;
	line-height: normal;
	min-width: 100px;
}

.lesson-message-grid>.lesson-message-grid__item.area-category>p,
.lesson-message-grid>.lesson-message-grid__item.area-lesson-type>p{
	text-transform: capitalize;
}

.message-status.message-status--sent{
	background-color: #D2FFE9;
	color: #36A46F;
}

.message-status.message-status--drafts,
.message-status.message-status--present{
	background-color: #EEEEFF;
	color: #7B77F1;
}

.message-status.message-status--unsent{
	background-color: #FFDCD9;
	color: #E61D0C;
}

.message-status.message-status--dismiss,
.message-status.message-status--dismissed{
	background-color: #bababa;
	color: #111;
}

/* .message-status.message-status--present {
	background-color: #f0295d;
	color: #fff;
} */

/* msg buttons */
.btn-user, .btn-user-control{
	background-color: transparent;
	border: 1px solid #404040;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 500;
	line-height: normal;
	min-height: 33px;
	max-height: 33px;
	min-width: 80px;
	padding-inline: 12px;
	position: relative;
	text-transform: capitalize;
}

.btn-user-control{
	height: 45px;
	min-width: 130px;
	border: none;
}

.btn-user-control.btn-user-control--send{
	background-color: #F1890E;
	color: #FFF;
}

.btn-user-control.btn-user-control--undo{
	border: 1px solid #404040;
	color: #404040;
}

.btn-user-control.btn-user-control--save{
	background-color: transparent;
	border: #F1890E 1px solid;
	color: #F1890E;
}

.btn-user-control.btn-user-control--dismiss{
	background-color: #A9A847;
	color: #FFF;
}
.btn-user-control.btn-user-control--dismiss:disabled {
	background: #ccc;
	color: #eee;
	cursor: not-allowed;
}

.btn-user::before{
	content: '';
	position: absolute;
	max-height: 20px;
	left: 10px;
    top: 50%;
    transform: translateY(-50%);
	line-height: 0;
}

.btn-user.btn-user-message--detail,
.btn-user.btn-user-message--create,
.btn-user.btn-user-message--new{
	padding-left: 32px;
}

.btn-user.btn-user-message--create,
.btn-user.btn-user-message--new{
	border-color: #F1890E;
	color: #F1890E;
}

.btn-user.btn-user-message--back{
	border: unset;
	color: #777777;
	font-size: 16px;
}

.btn-user.btn-user-message--undo{
	border-color: #404040;
	color: #404040;
}

.btn-user-message--callan{
	max-width: 310px;
	width: 100%;
	margin: auto;
	height: unset;
	min-width: unset;
	border: 1px solid #173F67;
	border-radius: 4px;
	font-size: 14px;
	padding: 5px;
	font-weight: 500;
}

.btn-user.btn-user-message--detail::before{
	content: url(../images/icon/detail_icon.svg);
}

.btn-user.btn-user-message--create::before,
.btn-user.btn-user-message--new::before{
	content: url(../images/icon/text.svg);
}

.btn-user.btn-user-message--back::before{
	content: url(../images/icon/chevron-left.svg);
	width: 6px;
	left: 2px;
}

.btn-user.btn-user-message--undo::before{
	content: '';
}

.btn-user.btn-user-message--dismiss,
.btn-user.btn-user-message--undo-dismiss{
	padding-inline: unset;
	width: 33px;
	border: none;
	border-radius: 50%;
}

.btn-user.btn-user-message--dismiss{
	min-width: unset;
}

.btn-user.btn-user-message--dismiss.btn-user-message--dismiss-shaded,
.btn-user.btn-user-message--undo-dismiss.btn-user-message--undo-dismiss--shaded,
.btn-user.btn-user-message--edit{
	background-color: #F5F5F5;
}

.btn-user.btn-user-message--chat-log{
	background-color: #8995ad;
	color: #FFFFFF;
	border-radius: 5px;
	border: unset
}

.btn-user.btn-user-message--msg-template{
	color: #4d85c9;
	border: unset;
	padding-left: 4.5rem;
}

.btn-user.btn-user-message--dismiss::before{
	border: none;
	content: url(../images/icon/eye-slash-solid.svg);
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.btn-user.btn-user-message--dismiss-disabled::before{
	content: url(../images/icon/eye-slash-solid-disabled.svg);
}

.btn-user.btn-user-message--msg-template::before{
	content: url(../images/icon/detail_icon.svg);	
}

.btn-user-message--dismiss:hover{
	background-color: #F5F5F5;
}

.btn-user.btn-user-message--dismiss-disabled:hover{
	background-color: unset;
}

.btn-user.btn-user-message--yes-or-no{
	border-color: #F1890E;
	color: #F1890E;
}

.btn-user>.message-notif{
	background-color: #404040;
	border-radius: 50%;
	color: #FFFFFF;
	font-size: 12px;
	position: absolute;
	width: 18px;
	height: 18px;
	top: -9px;
	left: -9px;
	display: inline-block;
    line-height: 1.75rem;
	text-align: center;
}

.lesson-message>.lesson-message__detail{
	display: flex;
	flex-flow: row wrap;
	gap: 30px;
}

.lesson-message__detail.lesson-message__detail__form,
.lesson-message__detail.lesson-message__detail-table{
	flex: 1 1 100%;
	display: flex;
	flex-flow: row wrap;
	gap: 30px;
}

.lesson-message__detail.lesson-message__detail-table{
	order: -1;
	gap: 15px;
}

.lesson-message__detail-table__table{
	flex: 1 1 100%;
	display: flex;
	flex-flow: row wrap;
	border: 1px solid #404040;
}

.lesson-message__detail-table__table>.table-col{
	flex: 1;
}

.table-col.table-col-4{
	flex: 1 1 32%;
}
.table-col.table-col-2{
	flex: 1 1 18%;
}

.table-col-title{
	text-align: center;
    background-color: #4a75a3;
    padding-block: 1rem;
    color: #FFF;
    text-transform: capitalize;
    font-weight: 500;
}

.table-col-content{
	display: flex;
	flex-flow: row wrap;
}

.table-col-content>div{
	flex: 1;
	min-height: 65px;
	text-align: center;
	padding: 10px;
}

.table-col-content>div{
	border-left: 1px solid #101010;
}

.table-col-content>div.QnA{
	color: #df524c;
	position: relative;
}

.table-col-content>div.reading{
	color: #4aaae8;
	position: relative;
}

.table-col-content>div.QnA:after,
.table-col-content>div.reading:after{
	content: '[icon]';
	position: absolute;
	top: 30px;
	left: 50%;
	transform: translateX(-50%);
}

.table-col .table-col-title{
	border-left: 1px solid #101010;
}

.table-col:nth-child(1) .table-col-title,
.table-col:nth-child(5) .table-col-title,
.table-col:nth-child(9) .table-col-title,
.table-col:nth-child(1) .table-col-content>div:first-child,
.table-col:nth-child(5) .table-col-content>div:first-child,
.table-col:nth-child(9) .table-col-content>div:first-child
{
	border-left: none;
}

.table-legend .leggend::after {
    content: 'x';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.table-legend .leggend::before {
    content: ":";
    margin-inline-end: 5px;
}
.table-legend .leggend {
    padding-left: 1rem;
    margin-inline-end: 1em;
    position: relative;
}

.lesson-message__detail__form>.detail-form-item-col-4{
	flex: 1 1 calc((100% / 3) - 30px);
}

.lesson-message__detail__form>.detail-form-item-col-6{
	flex: 1 1 calc((100% / 2) - 30px);
}

.lesson-message__detail__form>.detail-form-item-col-12{
	flex: 1 1 100%;
}

.lesson-message.lesson-message--detail{
	padding: 40px 30px;
	background-color: #fff;
	box-shadow: 0px 3px 6px #00000029;
	position: relative;
}

.detail-form-controls{
	display: flex;
	gap: 1em;
}

.lesson-message-details{
	flex: 1;
}

.lesson-message-details__details, .lesson-message-details__message{
	display: flex;
	flex-flow: row wrap;
	gap: 2.5rem 1rem;
}
.lesson-message-details__details>.lesson-message-details-block,
.lesson-message-details__message>.lesson-message-details-block{
	flex: 0 0 25%;
	display: flex;
	flex-flow: column;
	gap: 1.5rem;
}

.lesson-message-details__message>.lesson-message-details-block--form{
	flex: 0 0 50%;
}

.lesson-message-details__details>.lesson-message-details-footer{
	flex: 1 1 100%;
	word-break: break-all;
}

.lesson-message>.lesson-message__detail>.lesson-message-avatar-card{
	flex: 0 0 220px;
    display: flex;
    flex-flow: column;
    align-items: center;
}

.lesson-message-avatar-card-info{
	display: flex;
    flex-flow: column;
    align-items: center;
    gap: 1rem;
}

.lesson-message-avatar-card-info>.btn-user{
	width: 100%;
}

.lesson-message-avatar-card-info>.avatar-card-info__name{
	font-size: 16px;
	font-weight: 500;
	margin-top: 1rem;
}

.lesson-message_hide{
	display: none!important;
}

/* lesson message modal */
.lesson-message__modal{
	position: fixed;
	width: max-content;
    height: fit-content;
	background-color: #FFF;
	border-radius: 5px;
	box-shadow: 0px 3px 6px #00000029;
	inset: 50%;
	padding: 1.5rem;
	transform: translate(-50%, -50%);
	z-index: 9999;
}

.lesson-message__modal>.lesson-message__modal__content>.modal-content{
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    width: inherit;
    height: inherit;
}

.lesson-message__modal>.lesson-message__modal__content>.modal-content>.content{
	padding-inline: 120px;
	padding-block: 80px;
}

.lesson-message__modal>.lesson-message__modal-exit{
	position: absolute;
	top: -15px;
	right: -15px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background-color: #FFF;
	box-shadow: 0px 3px 6px #00000029;
}

.lesson-message__modal>.lesson-message__modal-exit>svg{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.ls-block{
	display: block;
}

.ls-label{
	color: #8E8E8E;
	font-weight: 500;
}

.ls-detail{
	color: #404040;
}

.ls-input>label{
	color: #707070;
	display: block;
	position: relative;
	text-transform: capitalize;
	margin-block-end: 6px;
}

.ls-block.avatar-card-info__name{
	text-align: center;
}

.lesson-message-avatar-card .lesson-message-avatar-card-info .btn-user,
.lesson-message-avatar-card .lesson-message-avatar-card-info .message-status{
	min-width: 130px;
	max-width: 130px;
}

.ls-input>label>span.lesson-message--tooltip{
	display: none;
	position: absolute;
    bottom: 100%;
    text-align: left;
    background-color: #575757;
    color: #FFF;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    transform: translateX(-50%);
	text-transform: unset;
}

.ls-input-wrap{
	display: block;
	height: auto;
	border-radius: 5px;
}

.ls-input-wrap:focus-within{
	background-color: transparent;
}

.ls-input-wrap>input,
.ls-input-wrap>textarea{
	width: 100%;
	height: 45px;
	border: #E4E6E9 1px solid;
	background-color: #F5F6F8;
	border-radius: 5px;
}

.ls-input-wrap>textarea{
	resize: none;
}
.lesson-message__detail textarea:not(.input_comment) {
	height: 40px !important;
	min-height: unset;
}

.ls-input>.ls-label>.info-icon{
	position: relative;
	width: 14px;
	height: 14px;
	display: inline-block;
	top: 2px;
}

.ls-input>.ls-label>.info-icon::before{
	content: url(../images/icon/charm_info.svg);
	cursor: pointer;
	display: block;
    height: 100%;
    line-height: 0;
}

.ls-input>.ls-label>.info-icon>.lesson-message--tooltip{
	display: none;
	position: absolute;
	left: var(--tool-tip-position);
	transform: translateX(calc(var(--tool-tip-position) - (var(--tool-tip-position) * 2)));
	bottom: calc(100% + 10px);
	width: 360px;
	background-color: #575757e0;
	border-radius: 5px;
	color: #FFF;
	padding: 10px;
	font-style: normal;
	z-index: 999;
	text-transform: none;
}

.ls-input>.ls-label>.info-icon>.lesson-message--tooltip::after{
    content: '';
	position: absolute;
    clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
    width: 10px;
    height: 10px;
    top: 100%;
    left: var(--tool-tip-position);
    background-color: inherit;
    transform: translateX(calc(var(--tool-tip-position) - (var(--tool-tip-position) * 2)));
}

.ls-input>.ls-label>.info-icon:hover>.lesson-message--tooltip
{
	display: unset;
}

.ls-required{
    position: relative;
}

.ls-required::before{
    content: '*';
    position: absolute;
    left: -10px;
    top: -5px;
    font-size: 16px;
    color: #F1890E;
    font-weight: bold;
}

.ls-border-top{
	border-top: 1px solid #f1f2f4;
}

.ls-fluid{
	width: 100%;
}

.ls-center{
	text-align: center;
}

.btn-use-msg-tmp{
	display: flex;
	gap: 8px;
	cursor: pointer;
	align-items: center;
}

.select2-dropdown{
	z-index: 99999;
}

.col-sec1 {
	text-align: center;
	width: 20rem;
	margin: 2rem 0;
}

.sent-message-area .col-sec1, .sent-message-area .col-sec2,
.col-section-main .col-sec1, .col-section-main .col-sec2 {
	display: inline-block;
	vertical-align: top;
}

.col-section-main .col-sec1 {
	width: 25rem;
	margin: 1rem 2rem;
}

.col-section-main .col-sec2 {
	width: 46.8rem
}

.data_item_list1 .data-contents textarea {
  height: 4.5rem !important;
  min-height: 4.5rem !important;
  width: 46.8rem !important;
}

.col-cent .data-contents textarea {
	height: 4.5rem !important;
	min-height: 4.5rem !important;
	width: 50.8rem !important;
	max-width: 100%;
	margin-right: 1rem;
 }

 .col-cent .data-contents .f-width textarea  {
	width: 100% !important;
 }

 .col-cent .data-contents .f-height textarea  {
	height: 8.9rem !important;
 }

 .col-cent .data-contents .h-width textarea  {

	width: 80rem !important;
 }

.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .input_wrap2{
 	display: inline-block;
 }

 .tab-message-list .message-list .list-item .col-center .data-list .data_list {
	display: inline-block;
 }

.tab-message-list .message-list .list-item .col-center .data_item_list .data + .data, 
.tab-message-list .message-list .list-item .col-center .data_item_list1 .data + .data {
	border-top: unset !important;
	padding-top: 0;
	margin-top: 2rem;
}

.tab-message-list .message-list .list-item .col-center .data_item_list1 .data,
.tab-message-list .message-list .list-item .col-center .data_item_list1 .data:nth-child(even) {
	display: inline-block;
	width: 20.8rem;
	vertical-align: top;
	margin: 2rem 0;
	padding: 0;
  }

  .tab-message-list .message-list .list-item .col-center .data_item_list1 ul li {
	display: inline-block;
	width: 20.8rem;
	vertical-align: top;
	padding: 0;
	margin: 0 5rem 0 0;
  }

  .sent-message-area .col-sec1 {
	width: 25rem;
	margin: 1rem 2rem;
  }

  .data_item_list .data:nth-child(4n) {
	margin-top: 0;
  }

  /* Tooltip */
  .tooltip {
	position: relative;
	display: inline-block;
  }
  
  .tooltip .tooltiptext {
	visibility: hidden;
	width: 36.2rem;
	background-color: #575757;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	position: absolute;
	z-index: 1;
	bottom: 125%;
	left: 0;
	margin-left: -140px;
	opacity: 0;
	transition: opacity 0.3s;
  }

  .tooltip .tooltiptext2 {
	margin-left: -27px;
  }
  
  .tooltip .tooltiptext::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #555 transparent transparent transparent;
  }

  .tooltip .tooltiptext2::after {
	border-top: 6px solid rgba(0,0,0, .7);
	border-left: 6px solid transparent;
	border-bottom: 6px solid transparent;
	bottom: 0;
	right: 100%;
	transform: translate(-100px, 0);
	margin-right: -56px;
  }
  
  .tooltip:hover .tooltiptext {
	visibility: visible;
	opacity: 1;
  }

  .tooltip small {
	border: 2px solid;
	border-radius: 50%;
	height: 14px;
	width: 14px;
	display: inline-block;
	color: #F1890E;
	top: 0;
	position: relative;
	line-height: 10px;
	text-align: center;
	font-size: 10px;
  }

@media screen and (max-width: 1650px){
	.col-cent .data-contents .h-width textarea {
		width: 50.8rem !important;
	}
	
	.tab-message-list .message-list .list-item .col-center .data-list .data_list:nth-child(4) {
		display: block;
	  }
}

@media screen and (max-width: 1334px){
	.tab-message-list .message-list .list-item .col-center .data-list .data .data-contents .input_wrap2 {
		display: block;
	}

	.col-cent .data-contents .h-width textarea {
		width: 100% !important;
	}

	.tab-message-list .message-list .list-item .col-center .data-list .data_list {
		display: block;
	}

	.col-cent .data-contents textarea {
		max-width: 100%;
		width: 100% !important;
	}
}

/* NJ-23105 */
.data-contents .data-content-mail{
	display:flex; 
	align-items:center;
	margin-bottom:2rem;
}
.data-contents .data-content-mail:last-child{
	margin-bottom:0;
}
.data-contents .data-content-mail .content-title{
	font-size:1.6rem; 
	color:#404040; 
	line-height:1.25; 
	max-width:17rem; 
	width:100%; 
	margin-right: 4rem;
}
.title-wrap--flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.item--customized {
	position: relative;
}

.item__control {
	position: absolute;
	top: 0;
	right: 0;
}

.item:not(:first-child) .item__control {
	top: 30px;
}

.item__control button {
	background: none !important;
	font-family: inherit;
}

.item__control__button {
	padding: 15px;
	margin: -15px;
}

.item__control__button>svg {
	pointer-events: none;
}

.item__control .item__control__menu {
	position: absolute;
	display: none;
	top: 0;
	right: 30px;
	background: #FFF;
	min-width: 160px;
	max-width: 200px;
	box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
	border: 1px solid rgba(0, 0, 0, 0.05);
	z-index: 99;
	overflow: hidden;
	border-radius: 2px;
}

.item__control.toggled .item__control__menu {
	display: block;
}

.item__control__menu__button {
	position: relative;
	padding: 8px 18px;
	display: block;
	font-size: 1.6rem;
	text-align: left;
	width: 100%;
}

.item__control__menu__button[data-button-role]>svg {
	margin-right: 5px;
	line-height: 0;
	display: inline-block;
	vertical-align: text-top;
	width: 18px;
}

/* NJ-19705 */
/* announcement warning */
.warning-list-wrap{
	margin-top:3rem;
}
.warning-item{
	display:flex; 
	background:#FFFFFF; 
	box-shadow: 0px 2px 6px #00000029; 
	border-radius: 4px; 
	padding:1.1rem 2rem; 
	justify-content: space-between; 
	align-items: center; 
	margin-bottom:1.5rem;
}
.warning-item.approval{
	background:#CECED0; 
}
.warning_item--left{
	display:flex;	
	align-items: center;
}
.warning_item--left_meta{
	display:flex; 
	align-items: center;
}
.warning_item--left_meta img{
	width:3.6rem; 
	margin-right:2rem;
}
.warning_item--left_meta p{
	color:#8E8E8E; 
	font-size:1.4rem; 
}
.warning_item--left_title{
	margin:0 5rem; 
	color:#404040; 
	font-size:1.8rem;
}
.warning_item--left_status{
	background:#EAEAEA; 
	border-radius:4px; 
	padding:1rem 2rem;
}
.warning_item--left_status span{
	color:#404040; 
	font-size:1.2rem; 
	font-weight:bold;
}
.warning_item--left_status span.is-active{
	color:#EB3323;
}
.warning_item--left_status span.is-disapproval{
	color:#05B169;
}
.warning_item--right{
	background:#3582CF; 
	border-radius:4px; 
	padding:1rem 3rem;
}
.warning_item--right a{
	color:#FFFFFF; 
	font-size:1.2rem; 
	font-weight:bold;
}
.warning-contents{
	background:#FFFFFF; 
	box-shadow: 0px 2px 6px #00000029; 
	border-radius: 4px; 
	padding:2rem 3rem 4rem;
	position:relative; 
	color:#999999;
}
/* .warning-contents .warning-back{
	display:flex; 
	justify-content: left; 
	align-items: center;
} */
.warning-contents .warning-back a{
	color:#999999;
	display: flex;
  justify-content: left;
  align-items: center;
}
.warning-contents .warning-back{
	display:flex; 
	justify-content: left; 
	align-items: center;
}
.warning-contents .warning-back img{
	margin:0 1rem 0 0;
	width:0.8rem;
}
.warning-contents .warning-contents-ttl{
	font-size:1.8rem; 
	color:#404040; 
	margin:4.2rem 0 3.2rem; 
	font-weight:normal;
}
.warning-contents .warning-contents-txtarea{
	border-top:1px solid #CCCCCC; 
	margin-bottom:3.5rem;
}
.warning-contents .warning-contents-txt{
	margin:3rem 0;
}
.warning-contents .warning-contents-txt a{
	position:relative;
}
.warning-contents .warning-contents-txt a::after{
	position:absolute;
	content:url('../images/icon/external-link-orange.svg');
	top:50%;
	right:-1.5rem;
	transform: translateY(-50%);
	width:1rem;
}
.warning-contents .warning-contents-logo{
	display:flex; 
	justify-content: left; 
	align-items: center;
}
.warning-contents .warning-contents-logo img{
	margin:0 1rem 0 0;
}
.warning-contents .warning-contents-button{
	background:#16A9B2; 
	box-shadow: 1px 1px 1px #00000029; 
	border-radius: 2px; 
	padding:1.5rem 3rem; 
	text-align: center; 
	position: absolute; 
	bottom: 2.5rem; 
	left: 50%; 
	transform: translateX(-50%);
}
.warning-contents .warning-contents-button a{
	font-size:2rem; 
	color:#FFFFFF; 
	line-height:1.1;
}

.warning-contents .warning-form-textarea{
	color:#8E8E8E; 
	font-size:1.4rem; 
	padding:1rem; 
	width:100%; 
	border: 1px solid #CCCCCC; 
	border-radius: 5px; 
	resize: none;
}
.warning-contents .warning-form-center{
	max-width:556px; 
	width:100%; 
	margin:0 auto; 
	color:#8E8E8E;
}
.warning-contents .warning-form-input.file{
	margin:3rem auto 5rem;
}
.warning-contents .form-file-top{
	display:flex; 
	justify-content: space-between;
}
.warning-contents .form-file-top label{
	color: #404040;
}
.warning-contents .form-file-top .warning-form-file{
	border: #CCCCCC 1px solid; 
	border-radius: 4px; 
	padding: 4px; 
	border-style: dashed !important; 
	border-width: thin !important; 
	border-color: #CCCCCC !important; 
	width: 480px; 
	min-height: 100px;
}
.warning-contents .warning-form-status{
	font-size:1.2rem; 
	color:#404040; 
	font-weight:bold; 
	background:#EAEAEA; 
	border-radius: 4px; 
	padding:1rem 0; 
	width:14.1rem; 
	text-align:center; 
	margin:0 auto;
}
.warning-contents .warning-form-status span{
	color:#404040; 
	font-size:1.2rem; 
	font-weight:bold;
}
.warning-contents .warning-form-status span.is-active{
	color:#EB3323; 
}
.warning-contents .warning-form-status span.is-disapproval{
	color:#05B169; 
}
.warning-contents .warning-form-submit{
	color:#FFFFFF; 
	font-size:2rem; 
	padding:1.5rem 0; 
	background:#16A9B2; 
	box-shadow: 1px 1px 1px #00000029; 
	border-radius: 2px; 
	margin:1rem auto 0; 
	display:block; 
	max-width:30.1rem; 
	width:100%;
	position:relative;
	border:none;
}
.warning-contents .warning-form-submit:disabled span{
	position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  opacity: 0.3;
	background:#000000;
	border-radius: 3px; 
}

/* ------------ NJ5809 ------------ */
.btn_orange--customized {
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-shadow: none !important;
}

.clr-danger {
    color: #FF0000;
}

.title-wrap--flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.item--customized {
    position: relative;
}

.item__control {
    position: absolute;
    top: 0;
    right: 0;
}

.item:not(:first-child) .item__control {
    top: 30px;
}

.item__control button {
    background: none !important;
    font-family: inherit;
}

.item__control__button {
    padding: 15px;
    margin: -15px;
}

.item__control__button>svg {
    pointer-events: none;
}

.item__control .item__control__menu {
    position: absolute;
    display: none;
    top: 0;
    right: 30px;
    background: #FFF;
    min-width: 160px;
    max-width: 200px;
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.05);
    z-index: 99;
    overflow: hidden;
    border-radius: 2px;
}

.item__control.toggled .item__control__menu{
    display: block;
}

.item__control__menu__button {
    position: relative;
    padding: 8px 18px;
    display: block;
    font-size: 1.6rem;
    text-align: left;
    width: 100%;
}

.item__control__menu__button[data-button-role]>svg {
    margin-right: 5px;
    line-height: 0;
    display: inline-block;
    vertical-align: text-top;
    width: 18px;
	pointer-events: none;
}

.item__control__menu__button:hover {
	background: rgba(0, 0, 0, 0.05) !important;
	border: none;
}

.area--customized .content.content-request {
	position: relative;
	overflow: hidden;
}

.content-request .content__shrinkable-wrap {
	height: 13ch;
	position: relative;
	overflow: hidden;
}

.content-expand-button {
	position: absolute;
	width: 18px;
	height: 18px;
	right: 10px;
	bottom: 10px;
	clip-path: polygon(100% 0, 0% 100%, 100% 100%);
	background: #d9dbde;
}

.content-request.toggled .content__shrinkable-wrap {
	height: unset;
}

.content-expand-button:hover {
	background: #c7c7c7;
}

.content-expand-button.toggled {
	clip-path: polygon(100% 0, 0% 100%, 0 0);
    background: rgba(0, 0, 0, 0.05) !important;
    border: none;
}

.area--customized .content.content-request {
    position: relative;
    overflow: hidden;
}

.content-request .content__shrinkable-wrap {
    height: 13ch;
    position: relative;
    overflow: hidden;
}

.content-expand-button {
    position: absolute;
    width: 18px;
    height: 18px;
    right: 10px;
    bottom: 10px;
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    background: #d9dbde;
}

.content-request.toggled .content__shrinkable-wrap {
    height: unset;
}

.content-expand-button:hover {
    background: #c7c7c7;
}

.content-expand-button.toggled {
    clip-path: polygon(100% 0, 0% 100%, 0 0);
}

.paginate_wrapper {
	width:  100%;
	display: inline-block;
}
.paginate_wrapper ul {
	display:  flex;
	justify-content: center;
}
.paginate_wrapper li {
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
}
.paginate_wrapper .on {
    background: #555;
    color: #fff!important;
}
.paginate_wrapper li a {
	color: #999;
}
.paginate_wrapper li a:hover {
	color: red;
}
/* NJ-16449 */
.booked-lesson{
	position:relative;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover{
	display:none; 
	width:415px; 
	background:#FFF8F0; 
	box-shadow: 0px 2px 6px #0000001A;
	border-radius: 5px; 
	position:absolute; 
	top:54px; 
	left: 76px; 
	z-index:1; 
	padding:0;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top{
	background:#F1890E;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top th{
	padding:8px 16px; 
	color:#FFFFFF; 
	font-size:14px; 
	font-weight:bold; 
	line-height:1.2;  
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top th:first-child{
	padding:8px 16px 8px 12px; 
	border-radius:5px 0 0 0;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top th:last-child{
	padding:8px 12px 8px 16px; 
	text-align:right; 
	border-radius:0 5px 0 0;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-bottom td{
	padding:12px 16px; 
	text-align: center; 
	color:#404040; 
	font-size:16px; 
	line-height:1.1875;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-bottom td:first-child{
	padding:12px 16px 12px 12px; 
	text-align:left;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-bottom td:last-child{
	padding:12px 12px 12px 16px; 
	text-align: right;
}

/* NJ-17554 */
.proficiency_quiz_wrap label{
	cursor: pointer;
}
.proficiency_quiz_wrap input[type=checkbox],
.proficiency_quiz_wrap input[type=radio] {
	appearance: none;
	position: relative;
	height: 20px;
	width: 20px;
	transition: all .15s ease-out 0s;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	outline: none;
	border-radius: 10%;
	margin: 0;
}
/* Checkbox */
.proficiency_quiz_wrap input[type=checkbox]:checked:before {
	position: absolute;
	content: "";
	width: 13px;
	height: 10px;
	background: url('../images/learningkit/check.svg');
	background-size: contain;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

/* Radio */
.proficiency_quiz_wrap input[type=radio] {
	border-radius: 50%;
}
.proficiency_quiz_wrap input[type=radio]:checked:before {
	transform: scale(1);
}
.proficiency_quiz_wrap input[type=radio]:before {
	content: "";
	display: block;
	width: 11px;
	height: 11px;
	border-radius: 50%;
	margin: 3px;
	transform: scale(0);
	transition: all ease-out 250ms;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
/* orange */
.proficiency_quiz_wrap input[type=checkbox],
.proficiency_quiz_wrap input[type=radio] {
	border: 2px solid #CCC;
}
.proficiency_quiz_wrap input[type=checkbox]:checked {
	background: #F28A27;
	border: 2px solid #F28A27;
}
.proficiency_quiz_wrap input[type=radio]:checked {
	border: 2px solid #F28A27;
}
.proficiency_quiz_wrap input[type=radio]:checked:before{
	background: #F28A27;
}
.proficiency_quiz_wrap.scoring .correct input[type=checkbox]:checked,
.proficiency_quiz_wrap.scoring .correct input[type=radio]:checked,
.proficiency_quiz_wrap.scoring .incorrect .correct.selected input[type=checkbox]:checked {
	border: 2px solid #05B169;
}
.proficiency_quiz_wrap.scoring .incorrect input[type=radio]:checked,
.proficiency_quiz_wrap.scoring .incorrect .selected input[type=checkbox]:checked {
	border: 2px solid #F84D4D;
}
.proficiency_quiz_wrap.scoring .correct .selected input[type=checkbox]:checked,
.proficiency_quiz_wrap.scoring .correct .selected input[type=radio]:checked:before,
.proficiency_quiz_wrap.scoring .incorrect .correct.selected input[type=checkbox]:checked {
	background: #05B169;
}
.proficiency_quiz_wrap.scoring .incorrect .selected input[type=checkbox]:checked,
.proficiency_quiz_wrap.scoring .incorrect .selected input[type=radio]:checked:before {
	background: #F84D4D;
}
.proficiency_quiz_wrap.scoring .correct .selected,
.proficiency_quiz_wrap.scoring .correct .correct.selected,
.proficiency_quiz_wrap.scoring .incorrect .correct.selected {
	border: 2px solid #05B169;
	border-radius: 4px;
}
.proficiency_quiz_wrap.scoring .incorrect .selected,
.proficiency_quiz_wrap.scoring label.incorrect{
	border: 2px solid #F84D4D;
	border-radius: 4px;
}
.proficiency_quiz_wrap.scoring .correct .correct.selected:after{
	content: "";
	display: block;
	width: 14px;
	height: 10px;
	background: url('../images/learningkit/check-green.svg') no-repeat center;
	background-size: contain;
	margin-left: auto;
}
.proficiency_quiz_wrap.scoring .incorrect .selected:after{
	content: "";
	display: block;
	width: 14px;
	height: 14px;
	background: url('../images/learningkit/x-mark.svg') no-repeat center;
	background-size: contain;
	margin-left: auto;
}
.proficiency_quiz_wrap.scoring .incorrect .correct:after{
	content: "";
	display: block;
	width: 14px;
	height: 14px;
	background: url('../images/learningkit/check-green.svg') no-repeat center;
	background-size: contain;
	margin-left: auto;
}
.proficiency_quiz_wrap .proficiency_quiz_wrap {
	margin: 1rem;
	padding: 1rem;
}
.proficiency_quiz_wrap .input_block {
	margin: 1rem 0 0.5rem;
}
.proficiency_quiz_wrap .fs_20 {
	font-size: 20px;
}
.proficiency_quiz_wrap .m_l_10 {
	margin-left: 1rem;
}
.proficiency_quiz_ttl {
	color: #F1890E;
	font-weight: bold;
}
.proficiency_quiz_wrap p {
	display: inline-block;
	font-size: 2rem;
}
.proficiency_quiz_wrap {
	color: #404040;
	display: block;
}
.proficiency_quiz_wrap .input_area {
	background-color: #fff;
	padding: 0.5rem 1.5rem;
	margin: 1rem 0;
	min-height: 4.6rem;
	display: flex;
	align-items: center;
	border: 1px solid #E4E4E4;
	border-radius: 4px;
}
.proficiency_quiz_wrap .input_area > p {
	font-size: 1.6rem;
	margin-left: 1rem;
}
.btn_submit {
	display: block;
	box-sizing: border-box;
	color: #fff;
	background-color: #F28A27;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.6;
	padding: 1rem;
	margin: 1rem auto 2rem;
	width: 20%;
	height: 100%;
	text-align: center;
	border-radius: 6px;
}
.proficiency_quiz_wrap .result-box {
	background: #FFF;
	width: 65rem;
	text-align: center;
	padding: 1.7rem 0 2.5rem;
	margin: 3.4rem 0 4.4rem;
}
.proficiency_quiz_wrap .result-box .title{
	font-size: 2rem;
	font-weight: bold;
}
.proficiency_quiz_wrap .result-meter{
	margin: 1.5rem auto 2rem;
	width: 30rem;
	height: 16rem;
}
.proficiency_quiz_wrap .result-meter .progressbar-text{
	font-size: 6rem;
	font-weight: bold;
	top: 0 !important;
	color: #000000 !important;
}
.proficiency_quiz_wrap .result-box .txt-1{
	font-size: 1.8rem;
	background: #E4E4E4;
	border-radius: 6px;
	width: 41.8rem;
	margin: 0 auto 1rem;
	padding: 1rem 0;
}
.proficiency_quiz_wrap .result-box .txt-2{
	font-size: 1.6rem;
}
.proficiency_quiz_block .point{
	font-size: 2rem;
	font-weight: bold;
	margin-left: 1rem;
}
.proficiency_quiz_block.correct .point{
	color: #05B169;
	text-decoration: underline;
}
.proficiency_quiz_block.incorrect .point{
	color: #F84D4D;
	text-decoration: underline;
}
.proficiency_quiz_block + .proficiency_quiz_block{
	margin-top: 3rem;
}
.proficiency_quiz_wrap .btn_wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 5rem auto 0;
}
.proficiency_quiz_wrap .btn_wrap .btn{
	background: #F28A27;
	border-radius: 6px;
	min-width: 20rem;
	height: 4.6rem;
	color: #FFF;
	font-size: 1.6rem;
	font-weight: bold;
	display: flex;
	justify-content: center;
	align-items: center;
}
.proficiency_quiz_wrap .btn_wrap .btn + .btn{
	margin-left: 4.5rem;
}

.proficiency_quiz_wrap .refer-wrap{
	background: #DEE4EB;
	border-radius: 4px;
	padding: 2rem;
}
.proficiency_quiz_wrap .refer-wrap .title{
	font-weight: bold;
	font-size: 1.6rem;
	margin-bottom: 1rem;
}
.proficiency_quiz_wrap .refer-wrap .link-text{
	background: #FFF;
	padding: 1rem 2rem;
	font-size: 1.4rem;
	display: flex;
	justify-content: center;
	align-items: center;
	width: max-content;
	color: #000;
	border-radius: 4px;
	line-height: 1;
}
.proficiency_quiz_wrap .refer-wrap .link-text:before{
	content: "";
	display: block;
	width: 1.4rem;
	height: 1.4rem;
	background: url('../images/learningkit/link.svg') no-repeat center;
	background-size: contain;
	margin-right: 1rem;
}
.proficiency_quiz_wrap .error{
	border: solid 1px #cc0000;
    box-shadow: 0 0 3px #cc0000;
    padding: 4px;
}
.proficiency_quiz_wrap .error-message{
	display:none;
	color:#cc0000;
	font-size: 14px;
}
.proficiency_quiz_wrap .error .error-message{
	display:block
}
.progress-wrap .progressbar {
	display: flex;
	align-items: center;
	/* NJ-32828 */
	flex-wrap: wrap;
	column-gap: 9rem;
	row-gap: 2rem;
	overflow: hidden;
}
.progress-wrap .progressbar .btn-quiz,
.progress-wrap .progressbar .btn-callan-test{
	width: 19rem;
	height: 5rem;
	font-size: 1.6rem;
	font-weight: bold;
	background: #F28A27;
	color: #FFF;
	border-radius: 6px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
.progress-wrap .progressbar .btn-quiz.comp:before,
.progress-wrap .progressbar .btn-callan-test.comp:before{
	content: "";
	display: block;
	position: absolute;
	top: 3px;
	right: 4px;
	width: 2rem;
	height: 2rem;
	background: url('../images/learningkit/emblem_icon_s.png') no-repeat center;
	background-size: contain;
}
.progress-wrap .progressbar .btn-quiz.incomp,
.progress-wrap .progressbar .btn-callan-test.incomp{
	background: #FFF;
	color: #F28A27;
	border: 2px solid #F28A27;
}
.progress-wrap .progressbar .step + .step{
	position: relative;
}
.progress-wrap .progressbar .step + .step:before{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	right: 100%;
	width: 9rem;
	height: 2px;
	background: #FFDBB9;
}
.progress-wrap .progressbar .step.complete + .step:before{
	background: #F28A27;
}
.progress-wrap .progressbar .step + .step:after{
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: -4.5rem;
	transform: translate(-50%, -46%);
	width: 3rem;
	height: 3rem;
	background: url('../images/learningkit/arrow_circle_white.png') no-repeat center;
	background-size: contain;
}
.progress-wrap .progressbar .step.complete + .step:after{
	background: url('../images/learningkit/arrow_circle_orange.png') no-repeat center;
	background-size: contain;
}
.progress-wrap .progressbar .step + .step.goal{
	margin-left: -6rem;
}
.progress-wrap .progressbar .step + .step.goal:before{
	width: 3.6rem;
    right: calc(100% - 6px);
}
.progress-wrap .progressbar .step + .step.goal:after{
	content: none;
}
.progress-wrap .progressbar .step.goal .img-goal{
	width: 4.6rem;
	height: 4.6rem;
}

/* NJ-23790 Start */
.page_wrap.page_wrap_recruit {
	background: #F5F6F8
}
.page_wrap_recruit .nc-t-header {
	justify-content: end;
}
.page_wrap_recruit .nc-t-header a {
	color: #707070;
}
.page_wrap_recruit .teacher--tb-btn-list .sub-list-1 {
	align-items: center;
}
.page_wrap_recruit .nc-t-side-menu .menu-logo {
	height: 5rem;
}
.page_wrap_recruit .t_orange {
	color: #f1890c;
}
.page_wrap_recruit .signup_cert_complete, .page_wrap_recruit .signup_userinfo {
	padding-top: 60px;
}
.page_wrap_recruit .mail_confirm h2 {
	font-weight: 600;
}
.page_wrap_recruit button, .page_wrap_recruit a {
	cursor: pointer;
}
.page_wrap_recruit .page_inner{
	max-width: unset !important;
	padding: 0 !important
}
.page_wrap_recruit #textchat_form_wrap .btn_submit {
	background: none;
	margin: 0;
}
.page_wrap_recruit .page-inquiry-detail section {

}
.page-recruit .sec-inquiry-list .sec-ttl{
	font-size: 1.8rem;
	font-weight: 600;
	color: #8E8E8E;
	margin-bottom: 25px;
	line-height: 1;
}
.page-recruit .sec-inquiry-list .wrap-head {
	display: flex;
	align-items: baseline;
}

.page-recruit .sec-inquiry-list .wrap-head .inq-list-filter {
	width: calc(100% - 200px);
	display: flex;
	margin-left: 14px;
}

.page-recruit .sec-inquiry-list .wrap-head .inq-list-filter  #inqKeyword {
	width: 290px;
	box-shadow: none;
	border: 1px solid #D8D8D8;
	padding-left: 10px;
}

.page-recruit .sec-inquiry-list .wrap-head .inq-list-filter  #inqSearchBtn {
	margin: 0 12px;
	background-color: #16a9b2;
	color: #fff;
	border-radius: 3px;
	border: none;
	font-weight: bold;
	padding: 0 5px;
}

.page-recruit .sec-inquiry-list .wrap-head .inq-list-filter  #inqSearchBtn:hover {
	background-color: #18c3cc;
}

.page-inquiry .sec-inquiry-list .wrap-head .inq-list-filter  #inqKeyword {
	width: 290px;
	box-shadow: none;
	border: 1px solid #D8D8D8;
}

.page-inquiry .sec-inquiry-list .wrap-head .inq-list-filter  #inqDisplayOption {
	width: 84px;
	border: 1px solid #D8D8D8;
	margin-left: 14px;
}

.page-inquiry .sec-inquiry-list .wrap-head .sec-fil {
    display: flex;
    align-items: center;
}

.page-inquiry .inquiry-list{
	border: #D9DBDE 1px solid;
	border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0, .29);
}
.page-inquiry .item-inquiry .link-detail{
	padding: 20px;
	display: flex;
	align-items: flex-start;
	color: #404040;
	transition: .2s all linear;
}
.page-inquiry .item-inquiry .link-detail:hover{
	opacity: .6;	
}
.page-inquiry .item-inquiry:first-child{
	border-radius: 4px 4px 0 0;
}
.page-inquiry .item-inquiry:last-child{
	border-radius: 0 0 4px 4px;
}
.page-inquiry .item-inquiry.item-new{
	background: #FFF;
	box-shadow: 0 3px 15px #D2D2D2;
}
.page-inquiry .item-inquiry + .item-inquiry{
	border-top: 1px solid #D9DBDE;
}
/* NJ-23790 End */

.paginate_wrapper {
	width:  100%;
	display: inline-block;
}
.paginate_wrapper ul {
	display:  flex;
	justify-content: center;
}
.paginate_wrapper li {
  color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
}
.paginate_wrapper .on {
    background: #555;
    color: #fff!important;
}
.paginate_wrapper li a {
	color: #999;
}
.paginate_wrapper li a:hover {
	color: red;
}

/* NJ-16449 */
.booked-lesson{
	position:relative;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover{
	display:none; 
	width:415px; 
	background:#FFF8F0; 
	box-shadow: 0px 2px 6px #0000001A;
	border-radius: 5px; 
	position:absolute; 
	top:54px; 
	left: 76px; 
	z-index:1; 
	padding:0;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top{
	background:#F1890E;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top th{
	padding:8px 16px; 
	color:#FFFFFF; 
	font-size:14px; 
	font-weight:bold; 
	line-height:1.2;  
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top th:first-child{
	padding:8px 16px 8px 12px; 
	border-radius:5px 0 0 0;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-top th:last-child{
	padding:8px 12px 8px 16px; 
	text-align:right; 
	border-radius:0 5px 0 0;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-bottom td{
	padding:12px 16px; 
	text-align: center; 
	color:#404040; 
	font-size:16px; 
	line-height:1.1875;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-bottom td:first-child{
	padding:12px 16px 12px 12px; 
	text-align:left;
}
.page-payment .sec-details .booked-lesson .booked-lesson-hover .booked-lesson-bottom td:last-child{
	padding:12px 12px 12px 16px; 
	text-align: right;
}

.pd_containter .payment-statements-container{
	display: flex;
	align-items: stretch;
}
.pd_containter .payment-statements-container.is-bottom{
	align-items: flex-end;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-width{
	width: 49%;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-width table.table-details th:first-child{
	width: 52%;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-width table.table-details th:nth-child(2){
	width: 24%;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-width table.table-details th:last-child,
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-width table.table-details td:last-child{
	text-align: right;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-width table.table-details th:last-child{
	width: 24%;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-total td{
	padding:5px 0;
  text-align: right;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-total tr:nth-child(4){
	border-top: 3px solid #D6D6D6;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-total tr:nth-child(4) td{
	padding: 15px 0 0;
	text-align: right;
	font-size:3rem;
	font-weight:600;
}
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-penalties,
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-incentives,
.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-total{
	margin-top: 0;
}

.page-payment .sec-details .payment-statements-container  table.table-details th,
.page-payment .sec-details .payment-statements-container  table.table-details td{
	white-space: wrap;
}

@media screen and (max-width: 1440px){
	.page-payment .sec-details .payment-statements-container table.table-details th, .page-payment .sec-details .payment-statements-container table.table-details td{
		font-size: 1.2rem;
	}
	.page-payment .sec-details .payment-statements-container  table.table-details th,
	.page-payment .sec-details .payment-statements-container  table.table-details td{
		padding: 1rem;
	}
	.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-total tr:nth-child(4) td{
		font-size:2rem;
	}
	.page-payment .table-wrap-total table th{
		white-space: normal;
	}
}

@media only screen and (max-device-width: 1440px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) {
	.page-payment .sec-details .payment-statements-container table.table-details th, .page-payment .sec-details .payment-statements-container table.table-details td{
		font-size: 1.2rem;
	}
	.page-payment .sec-details .payment-statements-container  table.table-details th,
	.page-payment .sec-details .payment-statements-container  table.table-details td{
		padding: 1rem;
	}
	.table-wrap-fees .pd_containter .payment-statements-container .table-wrap-total tr:nth-child(4) td{
		font-size:2rem;
	}
	.page-payment .table-wrap-total table th{
		white-space: normal;
	}
}

/* NJ-33115 [start] */
/* student's info */
.progress-data > .data-grid-wrap > div {
    display: grid;
    grid-template-columns: 90px auto;
}
.progress-data > .data-grid-wrap div .data-title {
	position: relative;
    font-weight: 800;
}
.progress-data > .data-grid-wrap > div .data-title::after {
	content: ":";
	position: absolute;
	right: 8px;
}
.progress-data > .data-grid-wrap {
    display: grid;
}
.progress-data > .data-grid-wrap > div:not(:first-child) {
    margin-top: 16px;
}
.progress-data > .data-grid-wrap > div:last-child {
    margin-bottom: 40px;
}
.progress-data a.callan-graph i.active{
	rotate: 180deg;
}
.progress-data .callan-progress-table{
	display: none;
}
.progress-data .callan-progress-table.active{
	display: block;
}
.progress-data table .theads{
	background: #E1EEFE;
}
.progress-data table th, .progress-data table td{
	position: relative;
	padding: 18px;
	border: 1px solid #ccc;
	text-align: center;
}
.progress-data table td:nth-child(n+1):nth-child(-n+3), .progress-data table td:nth-child(n+6):nth-child(-n+8){
	max-width: 30px;
}
.progress-data table td:nth-child(n+4):nth-child(-n+5), .progress-data table td:nth-child(n+9):nth-child(-n+11){
	width: 120px;
}
.progress-data a.callan-graph{
	display: block;
	text-decoration: underline;
	margin-bottom: 14px;
}
.progress-data .legend-markers p svg{
	display: inline-block;
	vertical-align: middle;
	margin-inline: 4px;
}
.progress-data .legend-markers .legend:before{
	content: "";
	width: 40px;
	height: 4px;
	display: inline-block;
	vertical-align: middle;
}
.progress-data .legend-markers{
	column-gap: 40px;
	margin-block: 25px 30px;
}
.progress-data .legend-markers .legend.legend-qa::before,
[data-bookmark="qa"]::after{
	background-image: linear-gradient(to right, #FE4140, #FF9C9C);
}
.progress-data .legend-markers .legend.legend-reading::before,
[data-bookmark="reading"]::after{
	background-image: linear-gradient(to right, #4087D0, #A8D1FC);
}
.progress-data .callan-progress-table .data-grid-wrap{
	display: grid;
	grid: repeat(3, auto) / repeat(2, auto);
	grid-gap: 38px;
	width: 70%;
	margin-bottom: 40px;
	color: #404040;
}
[data-bookmark]::after{
	content: "";
	position: absolute;
	width: 100%;
	height: 4px;
	bottom: 0;
	left: 0;
}
/* reservation history */
.reservation-list .lsn-table tr td {
	width: 16% !important;
	padding: 25px;

	@media only screen and (width <= 1280px) {
		padding: 15px !important;
	}
}
.reservation-list .lsn-table tr td.data-name{
	width: max-content !important;
}
.reservation-list .lsn-table tr td.data-time,
.reservation-list .lsn-table tr td.data-created-time{
	padding: 25px 0;
}
.bookmark{
	font-family: "FontAwesome";
	position: relative;
	display: inline-block;
	width: 30px;
	height: 40px;
	border-radius: 2px 2px 0 0;
	background-image: radial-gradient(white 36%, #FFB44A 0%);
	background-size: 120%;
	background-position: center -4px;
}
.bookmark::before{
	content: "\f00c";
	position: absolute;
	color: #FFB44A;
	text-align: center;
	margin: 0 auto;
	width: 100%;
	height: 100%;
	font-size: 14px;
	inset: 0;
	top: 5px;
}
.bookmark::after{
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	background-color: #fff;
	border-bottom: 8px solid transparent;
	border-left: 15px solid #FFB44A;
	border-right: 15px solid #FFB44A;
}
.bookmark.none {
	background-image: radial-gradient(#909090 100%, #909090 0%);
}
.bookmark.none::before {
	content: unset;
}
.bookmark.none::after {
	border-left: 15px solid #909090;
	border-right: 15px solid #909090;
}
/* message to student */
.lesson-message-grid__item.area-bookmark .bookmark{
	background: #FFB44A;
}
.lesson-message-grid__item.area-bookmark .bookmark::before{
	content: url(../images/icon/text.svg);
	filter: brightness(100);
	top: 7px;
}
.lesson-message-grid__item.area-bookmark .bookmark.disabled{
	background: #ccc;
}
.lesson-message-grid__item.area-bookmark .bookmark.disabled:after{
	border-left: 15px solid #ccc;
	border-right: 15px solid #ccc;
}
/* on lesson modal */
.popup_lesson_time .lesson_time_box{
	position: relative;
}
.bookmark_notice {
	position: absolute;
	bottom: -100%;
	left: 50%;
	transform: translate(-50%, -30%);
}
.bookmark_notice p{
	text-align: center;
	width: 11.7rem;
	font-weight: 700;
	line-height: 1.6;
}
.bookmark_notice p::after { /* clearfix */
  content: "";
  clear: both;
  display: table;
}
.bookmark_notice p span {
	display: inline-block;
	margin-top: -0.2rem;
}
.bookmark_notice .bookmark{
	width: 20px;
	height: 30px;
	vertical-align: middle;
	margin-right: 10px;
}
.bookmark_notice .bookmark::before{
	top: 2px;
	font-size: 10px;
}
.bookmark_notice .bookmark::after{
	border-bottom: 6px solid transparent;
	border-left: 10px solid #FFB44A;
	border-right: 10px solid #FFB44A;
}
.bookmark_notice .bookmark-img {
	width: 1.6rem;
	margin-right: 0.2rem;
	height: auto;
	float: left;
}
.data-name a span{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 12ch;
	display: inline-block;
}
.reservation-list .lsn-table td.data-name{
	margin-top: 10%;
}
.lesson-history .lsn-table .lsn-title, .reservation-list .lsn-table .lsn-title{
	padding: 15px !important;
	margin: 0 !important;
}
.lesson-history .lsn-table td.lsn-contents, .reservation-list .lsn-table td.lsn-contents{
	font-size: 1.6rem;
	padding: 15px !important;
}
.reservation-list .lsn-table tr td{
	width: 13% !important;
}
.lesson-message-grid > .lesson-message-grid__item.area-send-callan-message{
	grid-column: 5/8;
}
.reservation-list .data-list-wrap .data-contents > ul > li.data-status,
.reservation-list .lsn-table .lsn-contents > div.data-status,
.lesson-history .lsn-table .lsn-contents > div.data-status{
	justify-content: center;
}
.reservation-list .lsn-table .lsn-contents > div.data-status .data-status__reason {
	color: #F1890E;
	cursor: pointer;
}
@media only screen and (width <= 1440px){
	.page-contents{
		padding: 3.6rem 2rem;
	}
	.lesson-history table, .reservation-list table{
		table-layout: fixed;
	}
	.lesson-history .lsn-table .lsn-title, .reservation-list .lsn-table .lsn-title{
		font-size: 1rem !important;
		padding: 15px 8px !important;
	}
	.reservation-list .data-list-wrap .data-contents > ul > .data-name .img-wrap,
	.lesson-history .data-list-wrap .lsn-contents .img-wrap,
	.reservation-list .data-list-wrap .lsn-contents .img-wrap{
		max-width: 40px;
		max-height: 40px;
		margin-right: 0;
	}
	.reservation-list .lsn-table tr td.data-name{
		flex-direction: column;
		margin: 0 auto;
		margin-top: 10%;
	}
	.lesson-history .lsn-table td.lsn-contents, .reservation-list .lsn-table td.lsn-contents{
		font-size: 1.2rem;
		/* word-break: break-word; */
	}
	.reservation-list .lsn-table td.data-name{
		margin-top: 20%;
	}
	.bookmark:not(.lesson-message-grid__item.area-bookmark .bookmark){
		width: 20px;
		height: 30px;
	}
	.bookmark:not(.lesson-message-grid__item.area-bookmark .bookmark)::after{
		border-left: 10px solid #FFB44A;
		border-right: 10px solid #FFB44A;
	}
	.bookmark:not(.lesson-message-grid__item.area-bookmark .bookmark).none::after {
		border-left: 10px solid #909090;
		border-right: 10px solid #909090;
	}
	.lesson-message-grid > .lesson-message-grid__item.area-lesson-start{
		grid-column: 4/5;
	}
}
/* NJ-33115 [end] */

/* NJ-36234 End */

/* NJ-20069 START */
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .new_video_area .recorded_video {
	position: relative;
	width: 200px;
	overflow: hidden;
	min-height: 355px;
	border: 1px solid #CCC;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .new_video_area .recorded_video:after {
	font-size: 1.4rem;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .new_video_area #youtube_iframe {
	width: 200px;
	min-height: 355px;
}

/* NJ-20069 END */
/* NJ-30598 */
.page-inquiry .sec-inquiry-list .data-tabs-wrap{
	display: flex;
	align-items: flex-start;
}
.page-inquiry .sec-inquiry-list .data-tabs-notice{
	background: #FFF;
	border-radius: 4px;
	text-align: center;
	width: 24rem;
	box-shadow: 0 2px 6px rgba(0,0,0, .16);
	margin-right: 2rem;
}
.page-inquiry .sec-inquiry-list .data-tabs-notice .tab-notice{
	font-size: 1.8rem;
	display: block;
	padding: 1.1rem 0;
	color: #404040;
}
.page-inquiry .sec-inquiry-list .data-tabs-notice .tabs-category > li.on .tab-notice{
	font-weight: 600;
}
.page-inquiry .sec-inquiry-list .data-tabs-notice .tabs-category > li{
	border-bottom: 1px solid #E4E6E9;
	position: relative;
}
.page-inquiry .sec-inquiry-list .data-tabs-notice .tabs-category > li.on{
	border-bottom: 3px solid #F1890E;
	box-shadow: 0 2px 5px rgb(0 0 0 / 5%);
}
.page-inquiry .sec-inquiry-list .data-tabs-notice .tabs-category > li.on:after{
	content: '';
	display: block;
	border: transparent solid 1.5rem;
	border-left-color: #FFF;
	border-right-width: 0;
	position: absolute;
	top: 50%;
	right: -1rem;
	transform: translateY(-50%);
}
.page-inquiry .sec-inquiry-list .data-list-wrap{
	flex: 1;
}
.page-inquiry .sec-inquiry-list2{
	width: 100%;
}
.page-inquiry .data-tabs-notice .tabs-category > li.on .tab-notice{
	font-weight: 600;
}
.page-inquiry .data-tabs-notice .tabs-category > li{
	border-bottom: 1px solid #E4E6E9;
	position: relative;
}
.page-inquiry .data-tabs-notice .tabs-category > li.on{
	border-bottom: 3px solid #F1890E;
	box-shadow: 0 2px 5px rgb(0 0 0 / 5%);
}
.page-inquiry .data-tabs-notice .tabs-category > li.on:after{
	content: '';
	display: block;
	border: transparent solid 1.5rem;
	border-left-color: #FFF;
	border-right-width: 0;
	position: absolute;
	top: 50%;
	right: -1rem;
	transform: translateY(-50%);
}
/* NJ-30598 End */

/* NJ-20590 Start */
.page-accounts .data-account-img{
	display: flex;
	gap: 0 160px;
	padding-bottom: 20px;
}
.page-accounts .data-account-img .data-title{
	margin-bottom: 10px;
}
.page-accounts .data-account-img .flex-wrap{
	display: flex;
	gap: 0 30px;
}
.page-accounts .data-account-img .photo-wrap .account-img-wrap{
	width: 200px;
	height: 200px;
	position: relative;
}
.page-accounts .data-account-img .photo-wrap .account-img-wrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.page-accounts .data-account-img .right-wrap .btn-wrap{
	display: flex;
	gap: 0 15px;
	margin-bottom: 16px;
}
.page-accounts .sec-account .account-wrap .btn-upload-blue{
	background-color: #3582CF;
	color: #FFF;
	font-size: 14px;
	border-radius: 4px;
	box-shadow: 0 3px 6px rgba(0,0,0,.29);
	min-width: 90px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
.page-accounts .sec-account .account-wrap .btn-img-orange{
	background-color: #F1890E;
	color: #FFF;
	font-size: 14px;
	border-radius: 4px;
	box-shadow: 0 3px 6px rgba(0,0,0,.29);
	min-width: 119px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
.page-accounts .sec-account .btn-wrap a[target="_blank"]:after{
	content: none;
}
.page-accounts .data-account-img .status{
	font-size: 18px;
	color: #707070;
}
.page-accounts .data-account-img .status .img-url{
	color: #707070;
}


.page-accounts .data-account-img .status #teacher_image_status {
	font-weight: 700;
	font-size: 15px;
	text-align: center;
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
}

.page-accounts .data-account-img .status #teacher_image_status span {
	padding-block: 8px;
	display: block;
	width: 100%;
}

.page-accounts .data-account-img .status .status-waiting{
	color: #F3704B;
	background: #FDEFEB;
}

.page-accounts .data-account-img .status .status-approved{
	color: #57D7CA;
	background: #EDF9F8;
}

.page-accounts .data-account-img .status .status-disapproved{
	color: #FC1717;
	background: #FFE8E8;
}

.page-accounts .data-account-img .reason{
	font-size: 18px;
	color: #707070;
	padding-top: 10px;
	margin-top: 10px;
}

.page-accounts .data-account-img .reason .errorMsg{
	border-top: 1px solid #D9DBDE;
}

.edit-info{
	input#email {
		width: 84rem;
		padding: .95rem 1.6rem;
	}
	a.svBtn {
		display: block;
		color: #fff;
		font-size: 1.4rem;
		padding: 1.15rem 4.8rem;
		background: #F1890E;
		width: fit-content;
		border-radius: .4rem;
		margin-top: 3.2rem;
		font-weight: 700;
	}
	select#TeacherTimezoneId {
		max-width: 40rem;
		width: 100%;
	}
	.countryEditInfoContent select,
	.timeZoneEditInfoContent select,
	.paymentEditInfoContent select {
		width: 100%;
		-webkit-appearance: none;
		-moz-appearance: none;  
		appearance: none;
	}
	.select-wrapper {
		max-width: 40rem;
		position: relative;
	}
	.select-wrapper::before {
		content: '';
		position: absolute;
		top: 15px;
		left: 380px;
		width: 8px;
		height: 8px;
		z-index: 1;
		border-radius: 2px;
		transform: rotateZ(45deg);
		border-bottom: 2px solid #000000;
		border-right: 2px solid #000000;
		pointer-events: none;
	}
	.paymentEditInfoContent .input.select {
		max-width: 40rem;
		position: relative;
	}
	.paymentEditInfoContent .input.select::before {
		content: '';
		position: absolute;
		top: 15px;
		left: 380px;
		width: 8px;
		height: 8px;
		z-index: 1;
		border-radius: 2px;
		transform: rotateZ(45deg);
		border-bottom: 2px solid #000000;
		border-right: 2px solid #000000;
		pointer-events: none;
	}
	.navBack img {
		margin: 0 .4rem 0 0;
		gap: 0.4rem;
	}
	.navBack {
		display: flex;
		align-items: center;
		column-gap: 0.4rem;
		margin-bottom: 4rem;
		cursor: pointer;
	}
	h2 {
		font-size: 2.4rem;
		margin-bottom: 2.4rem;
		display: block;
	}
	.paymentEditInfoContent .page-accounts p{
		margin-bottom: 2rem;
	}

	.paymentEditInfoContent .data-title{
		font-weight: 700;
		margin-bottom: .5rem;
	}
	.profile-area {
		max-width: 50rem;
	}
}
input[type=checkbox] + label.custom_check::before {
	border-radius: 4px;
}
label.custom-radio:before {
	border: solid 1px #8E8E8E;
}
.input-wrap textarea {
	background: #FFFFFF;
	min-height: 24rem;
}
.selfIntro .item-status span.approved {
	background: #EDF9F8;
	color: #57D7CA;
}
.selfIntro .item-status span.waiting {
	background: #FDEFEB;
	color: #F3704B;
}
.selfIntro .item-status span.disapproved {
	background: #FFE8E8;
	color: #FC1717;
}
input[type='text'], select#select-bank-type {
	border: 1px solid #E4E6E9;
	width: 40rem;
}
[id^="bank-card-sample"] .card-img {
	width:450px;
}
[id^="bank-card-sample"] .card-img img {
	display:block;
	width:100%;
}
#checkNcFilterVideo, #checkNcFilterCanvas {
	display: none;
}
#teacher_image_reason .errorMsg {
	display:none;
	color:red;
}
.account-recorded-video#recorded_video #recorded{
	height:100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 9;
}
#recorded_video#hidden_video {
	display: none;
}
#recorded_video .recorded_video {
	height:355px;
	width: 200px;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 9
}
.data-gallery .data-title .photo-gallery-max-notif{
	display: none;
}
#generateUrlLoading {
	margin-left: 5px;
	color: #ffffff;
}
span.wu-note {
	color:red;
}
.data.dataOcupation {
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: 1px solid #D9DBDE;
}
/* NJ-20590 End */

/* start NJ-41167 */
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .data-title {
	display: flex;
 	justify-content: start;
	gap: 1rem;
	align-items: center;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-title .title-info-icon {
	margin: 0;
	font-size: 0;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-invite .title-info-tooltip {
	width: 290px;
	right: -24rem;
	position: absolute;
	background: #707070;
	border: 1px solid #707070;
	border-radius: 10px;
	z-index: 9999;
	bottom: 3rem;
	color: #fff;
	padding: 2rem;
	box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-invite .title-info-tooltip::after {
	content: "";
	position: absolute;
	bottom: -15px;
	left: 20px;
	margin-top: -5px;
	border-width: 11px;
	border-style: solid;
	border-color: transparent black transparent transparent;
	border-bottom-color: #fff;
	display: none;
	}

  .page-accounts .sec-account .account-wrap .profile-area .profile-form .data-invite .title-info-tooltip::before {
	content: "";
	position: absolute;
	bottom: -21px;
	left: 30px;
	border-width: 11px;
	border-style: solid;
	border-color: transparent transparent transparent transparent;
	border-bottom-color: #707070;
	transform: rotate(-180deg);
	}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-invite .title-info-tooltip p {
	font-size: 14px;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-invite .title-info-tooltip a {
	display: block;
	color: #F1890E;
	margin-top: 12px;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-badge .data-title-info,
.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-invite .data-title-info{
	position: relative;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-badge .title-info-tooltip {
	width: 268px;
	right: -22rem;
	position: absolute;
	background: #707070;
	border: 1px solid #707070;
	border-radius: 10px;
	z-index: 9999;
	bottom: 3rem;
	padding: 2rem;
	box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
	color: #FFFFFF;
}

  .page-accounts .sec-account .account-wrap .profile-area .profile-form .data-badge .title-info-tooltip::before {
	content: "";
	position: absolute;
	bottom: -21px;
	left: 28px;
	margin-top: -5px;
	border-width: 11px;
	border-style: solid;
	border-color: transparent transparent transparent transparent;
	border-bottom-color: #707070;
	transform: rotate(-180deg);
	}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-badge .title-info-tooltip p {
	font-size: 14px;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-badge .title-info-tooltip a {
	display: block;
	color: #F1890E;
	margin-top: 12px;
	cursor: pointer;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data-gallery .data-contents .box_sec + .box-upload {
	margin-left: 0;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-gallery .data-title.required::before {
	content: '';
	display: none;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-gallery .data-title.required .photo-gallery-title {
	position: relative;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-gallery .data-title.required .photo-gallery-max-notif {
	margin-left: auto;
	font-size: 1.6rem;
	font-weight: 400;
	color: #FF0000;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-gallery .data-title.required .photo-gallery-title::before {
	content: "*";
	position: absolute;
	color: #F1890E;
	font-size: 1.6rem;
	top: 0;
	right: -.5rem;
}

.page-accounts .sec-account #reset_profile {
  background: #FFF;
  border-radius: 50%;
  width: 2.2rem;
  height: 2.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -1.1rem;
  right: -1.1rem;
  box-shadow: 0 2px 6px rgba(0,0,0, .1);
}

.page-accounts .sec-account .tb_select_table {
  display: flex;
  flex-wrap: wrap;
  gap: 5rem;
}

.page-accounts .sec-account .tb_select_table li {
	width: 171px;
	text-align: center;
	-webkit-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	-webkit-box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
			box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	overflow: hidden;
	position: relative;
	background: #EEEEEE;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
		-ms-flex-direction: column;
			flex-direction: column;
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
			user-select: none;
  }

.page-accounts .sec-account .tb_select_table .badge-img {
	background: #fff;
	width: 100%;
	padding-block: 16px;
}

.page-accounts .sec-account .tb_select_table li img {
  width: 78px;
  border-radius: 4px;
  object-fit: cover;
}

.page-accounts .sec-account .tb_select_table li .badge-title {
	background: #EEEEEE;
	margin: auto 0;
	padding: 1.6rem;
}

.page-accounts .sec-account .tb_select_table li p {
	color: #555555;
	font-weight: 600;
	font-size: 18px;
}

.page-accounts .sec-account .tb_select_table .admin-series-badge-list {
	position: absolute;
	top: 8px;
	left: 8px;
}

.page-accounts .sec-account .tb_select_table .admin-series-badge-list input[type="checkbox"] + label.custom_check::before {
	background: #fff;
}

.page-accounts .sec-account .tb_select_table .admin-series-badge-list input[type="checkbox"] {
	visibility: hidden;
}

.page-accounts .sec-account .tb_select_table input[type="checkbox"] + label.custom_check {
  position: absolute;
  display: inline-block;
  margin-right: 12px;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 30px;
  cursor: pointer;
  padding: 0 0 0 24px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.page-accounts .sec-account .data-invite .nc-teacher-logo {
	width: 100px;
	border-radius: 2rem;
}

.page-accounts .data-account-img .photo-wrap .profile-save-changes-container {
	border: 1px solid #A7A7A7;
	padding: 16px 18px;
	border-radius: 4px;
	text-align: left;
	box-sizing: border-box;
}

.page-accounts .data-account-img .photo-wrap .profile-save-changes-container p {
	font-size: 12px;
	font-weight: 400;
}

.page-accounts .data-account-img .photo-wrap .profile-save-changes-container p span {
	font-weight: 600;
	color: #F1890E;
}

.page-accounts .data-account-img .photo-wrap .right-wrap {
	width: 226px;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data .input-items-wrap {
	width: 98%;
}

.page-accounts .sec-account .data-title--payment-status span {
	font-weight: 700;
	font-size: 15px;
	text-align: center;
	padding: 8px 85px;
	width: 240px;
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
	border-radius: 4px;
}

.page-accounts .sec-account .data-title--payment-status #payment-info-status-false {
	color: #FC1717;
	background: #FFE8E8;
}

.page-accounts .sec-account .data-title--payment-status #payment-info-status-true {
	color: #57D7CA;
	background: #EDF9F8;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-badge .data-title.required::before {
	right: 20px;
}

.page-accounts .sec-account .data-gallery .gallery-save-changes-container {
	border: 1px solid #A7A7A7;
	padding: 10px;
	border-radius: 4px;
	text-align: center;
	box-sizing: border-box;
	font-size: 12px;
	font-weight: 400;
}

.page-accounts .sec-account .data-gallery .gallery-save-changes-container span {
	font-weight: 600;
	color: #F1890E;
}

.page-accounts .sec-account .data-title--payment-status {
	margin: 16px 0;
}

.page-accounts .sec-account .account-wrap .profile-area .profile-form .data.data-gallery .data-title {
	width: 100%;
	margin-bottom: 24px;
}

.sec-account .btn_style.self_intro_btn_orange,
.sec-account .btn_style.occupation_btn_orange {
	background: #F1890E;
	text-shadow: none;
}

.sec-account .btn_style.self_intro_btn_orange:hover,
.sec-account .btn_style.occupation_btn_orange:hover {
	opacity: 0.8;
}

.sec-account .data.timezone-container .select2-container {
	z-index: 1;
}

.sec-account .data.timezone-container  .select2-container--default.select2-container--disabled .select2-selection--single {
	background-color: #fff;
}

.page-accounts .span_normal {
	display: inline-block;
	width: 240px;
	color: #777777;
	background: #F2F2F2;
	padding-block: 8px;
	text-align: center;
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
	border-radius: 4px;
	font-weight: 700;
}

.page-accounts .sec-account .account-wrap .profile-area .photo_list {
	max-height: 442px;
	overflow: auto;
}

/* end NJ-41167 */

/* NJ-20590 Start */
.page-accounts .data-account-img{
	display: flex;
	gap: 0 160px;
	padding-bottom: 20px;
}
.page-accounts .data-account-img .data-title{
	margin-bottom: 10px;
}
.page-accounts .data-account-img .flex-wrap{
	display: flex;
	gap: 0 30px;
}
.page-accounts .data-account-img .photo-wrap .account-img-wrap{
	width: 200px;
	height: 200px;
}
.page-accounts .data-account-img .photo-wrap .account-img-wrap > img{
	width: 100%;
	height: 100%;
}
.page-accounts .data-account-img .right-wrap .btn-wrap{
	display: flex;
	gap: 0 15px;
	margin-bottom: 12px;
}
.page-accounts .sec-account .account-wrap .btn-upload-blue{
	background-color: #3582CF;
	color: #FFF;
	font-size: 14px;
	border-radius: 4px;
	box-shadow: 0 3px 6px rgba(0,0,0,.29);
	min-width: 90px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
.page-accounts .sec-account .account-wrap .btn-img-orange{
	background-color: #F1890E;
	color: #FFF;
	font-size: 14px;
	border-radius: 4px;
	box-shadow: 0 3px 6px rgba(0,0,0,.29);
	min-width: 119px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
.page-accounts .sec-account .btn-wrap a[target="_blank"]:after{
	content: none;
}
.page-accounts .data-account-img .status{
	font-size: 18px;
	color: #707070;
}
.page-accounts .data-account-img .status .img-url{
	color: #707070;
}
.page-accounts .data-account-img .status .status-orange{
	color: #F84D4D;
}
.page-accounts .data-account-img .reason{
	font-size: 18px;
	color: #707070;
	padding-top: 10px;
	margin-top: 10px;
}
/* NJ-20590 End */

/* NJ-67350 Start */
.page-accounts .wise_area {
	margin-top: 24px;
}
.page-accounts .wise_area .wise-status {
	box-shadow: rgba(0, 0, 0, 0.2) 0 0 4px 0;
	background: #FFE8E8;
	border-radius: 4px;
	padding: 6px 6px;
	font-size: 15px;
	font-weight: 600;
	color: #FC1717;
	width: 240px;
	text-align: center;
}
.page-accounts .wise_area .wise-status.complete {
	background: #EDF9F8;
	color: #57D7CA;
}
.page-accounts .wise_area .btn-update {
	display: block;
	margin-top: 24px;
	background: #3B6FE2;
	border-radius: 4px;
	color: #FFF;
	font-size: 15px;
	font-weight: 600;
	width: max-content;
	padding: 6px 32px;
}
.page-accounts .ws-detail-wrap {
	padding: 24px;
	background: #FFF;
	border-radius: 5px;
	font-size: 16px;
	width: 408px;
	margin-top: 24px;
}
.page-accounts .ws-detail-wrap .item + .item{
	margin-top: 8px;
}
.page-accounts .ws-detail-wrap .item .name {
	font-weight: 700;
}
.page-payment-wise{
	padding: 36px 40px;
}
.page-payment-wise .payment-wise-wrap{
	background: #FFF;
	box-shadow: rgba(0, 0, 0, 0.1) 0 3px 9px 0;
	padding: 24px 40px;
	width: 465px;
	border-radius: 5px;
}
.payment-wise-wrap .btn-wise-back{
	color: #949494;
	font-size: 18px;
	font-weight: 400;
	display: flex;
	align-items: center;
	gap: 0 15px;
}
.payment-wise-wrap .btn-wise-back:before{
	content: "";
	background: url('https://assets.nativecamps.com/admin/assets/images/common/icon/arrow-left-gray.svg') no-repeat center;
	background-size: contain;
	width: 7px;
	height: 13px;
}
.payment-wise-wrap .title{
	margin-top: 30px;
	font-size: 18px;
	font-weight: 700;
}
.payment-wise-wrap .form-wrap{
	margin-top: 24px;
}
.payment-wise-wrap .form-item + .form-item{
	margin-top: 8px;
}
.payment-wise-wrap .form-item .name{
	font-size: 16px;
	margin-bottom: 10px;
}
.payment-wise-wrap .form-item .name .required{
	color: #FC1717;
}
.payment-wise-wrap .form-item input,
.payment-wise-wrap .form-item select,
.payment-wise-wrap .form-item textarea{
	border: #E4E6E9 1px solid;
	border-radius: 5px;
	padding: 9px 16px;
	font-size: 16px;
	width: 100%;
	background: #FFF;
}
.payment-wise-wrap .form-item textarea{
	min-height: 88px;
}
.payment-wise-wrap .err-wrap{
	margin-top: 24px;
	background: #FFF0F0;
	padding: 8px;
	font-size: 18px;
	font-weight: 400;
	color: #FC1717;
}
.payment-wise-wrap .btn-submit{
	display: block;
	width: max-content;
	background: #F1890E;
	padding: 6px 32px;
	color: #FFF;
	font-size: 15px;
	font-weight: 600;
	border-radius: 4px;
	margin-top: 24px;
}
/* NJ-67350 End */


/* NJ-17264 */
.account-img-wrap .img-wrap {
	position: relative;
}
.account-img-wrap .img-wrap.title-platinum:before {
	content: url(../images/icon/icon_medal_platinum.png);
	position: absolute;
	bottom: 0;
	left: 0;
}

.account-img-wrap .img-wrap.title-gold:before {
	content: url('/user/images/waiting/icon_medal_gold.svg');
	position: absolute;
	bottom: 0;
	left: 0;
}
/* NJ-17264 End */

/* START NJ-40984 */
.q-number {
	display: flex;
	align-items: center;
	gap: 2rem;
}

.q-number section {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

.btn-mt-like {
	border: 1px solid #DDDDDD;
	border-radius: 6px;
	color: #404040;
	display: flex;
	align-items: center;
	width: 90px;
	height: 30px;
	justify-content: space-evenly;
	flex-wrap: wrap;
	align-content: space-around;
}

.btn-mt-like:before {
	content: url(/teacher/webroot/images/icon/hand.svg);
	position: relative;
	top: 4px;
}

.btn-mt-like.clicked {
	color: #26AF26;
	border-color: #26AF26;
}

.btn-mt-like.clicked:before {
	content: url(/teacher/webroot/images/icon/hand-green.svg);
}
/* END NJ-40984 */

/* NJ-60175 [START] */
.page-payment .cut-off-period .t_orange{
	color: #F1890E;

	&::after{
		content: "|";
		display: inline-block;
		vertical-align: baseline;
		margin-inline: 1ch 0.5ch;
		color: #8E8E8E;
	}
}

.page-payment #tab_contents-overview .sec-details:has(h3){
	max-width: 930px;
	margin-inline: auto;
}

.page-payment #tab_contents-overview .payment-statements-container{
	display: block;
}

.data-tabs ul li{
	width: 26.7rem;
}

.data-tabs ul li a{
	padding-inline: 3rem;
}
/* NJ-60175 [END] */

/* NJ-75762 Start */
.page-inquiry-detail .exchanges .item .contents .texts,
.page-inquiry-detail .exchanges .item .contents .texts *{
	font-size: 1.8rem !important;
}
.page-inquiry-detail .exchanges .item .contents .contents{
	padding-inline: 0;
}
/* NJ-75762 End */

/* NJ-45194 Start */
.bookmark_icon {
    display: inline-block;
    width: 5.2rem;
    height: 7rem;
    background-image: url(https://textbooks.nativecamps.com/resources/callan_method/images/bookmark_on.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
/* NJ-45194 End */

/* [START] NJ-85939 */
.page-accounts.page-payment-wise {
	display: flex;
}
.paymentEditInfoContent {
    padding: 2.5rem 4rem;
    border-radius: 0.5rem;
}

.page-contents-holder {
    display: flex;
}

.paymentBankEditInforContent {
    margin: 0 auto;
    text-align: center;
}

.error_wrap {
	margin: 0 auto 20px;
}
.paymentBankEditInforContent .card-img {
    margin: auto;
}
/* [END] NJ-85939 */

/* NJ-50173 */
main.avartarsetupfile {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1.6rem;
}

.avartarsetupfile .wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4rem;
    padding: 2rem 2rem 5rem;
    width: 130rem;
}

.avartarsetupfile .box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 2rem;
}

.avartarsetupfile .box-inner {
    display: flex;
    justify-content: stretch;
    align-items: stretch;
    width: 100%;
    gap: 3rem;
    padding: 3rem;
    background-color: #FFFFFF;
    border: 0.1rem solid #D0D0D0;
    border-radius: 0.4rem;
}

.avartarsetupfile .wrap-inner {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 0.1rem 0;
    width: 100%;
}

.avartarsetupfile .title {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    gap: 2.5rem;
}

.avartarsetupfile h2 {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.45;
    text-align: center;
}

.avartarsetupfile .box-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 3rem;
}

.avartarsetupfile .note {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 0.8rem;
}

.avartarsetupfile .avatar-note-content,
.avartarsetupfile .avatar-note-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    background:#fff;
}

.avartarsetupfile .note-title {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.45;
}

.avartarsetupfile .avatar-note-list ul {
    list-style-type: disc;
    padding-left: 1.5rem;
}

.avartarsetupfile .avatar-note-list li {
    display: list-item;
     padding-left: 1rem;
}

.avartarsetupfile .avatar-note-list li::marker {
    content: "• ";
    color: #404040;
}

.avartarsetupfile .avatar-note-item {
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1.45;
    color:#404040;
}

.avartarsetupfile .avartarsetup-container {
    display: flex;
    align-items: center;
    gap: 3rem;
    padding: 3rem;
    border: 0.1rem solid #CCCCCC;
    border-radius: 0.4rem;
    box-sizing: border-box;
    width: 120rem;
}

.avartarsetupfile .download-button {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F1890E;
    border-radius: 2.5rem;
    color: #FFFFFF;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.45;
    text-decoration: none;
    border: none;
    cursor: default;
    height: 5rem;
    width: 31.2rem;
    box-sizing: border-box;
    padding: 0;
}

.avartarsetupfile .hand-cursor {
    position: absolute;
    top: 2.5rem;
    left: 14.8rem;
}

.avartarsetupfile .download-button-text {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: -0.009rem;
}

.avartarsetupfile .instruction-container {
    display: flex;
    height: 46rem;
    width: 100%;
    gap: 5rem;
    padding: 3rem;
    background-color: #FFFFFF;
    border: 0.1rem solid #D0D0D0;
    border-radius: 0.4rem;
}

.avartarsetupfile .instruction-image {
    width: 45rem;
    height: 40rem;
}

.avartarsetupfile .video-container {
    border: 1px solid #A3A5A8;
    position: relative;
    width: 100%;
    max-width: 45rem;
    height: 40rem;
    overflow: hidden;
    border-radius: .4rem;
    object-fit: contain;
}

.avartarsetupfile .video-container.zoomed #video-player {
    object-fit: cover;
}

.avartarsetupfile .hidden {
    display: none;
}

.avartarsetupfile .play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8.2rem;
    height: 8.2rem;
    background-color: #090909;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.avartarsetupfile .instruction-text-box {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    width: 100%;
}

.avartarsetupfile .instruction-title {
    width: 6rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0 2rem 2rem 0;
    border-bottom: 0.1rem solid #CCCCCC;
}

.avartarsetupfile .instruction-number {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    background-color: #19344E;
    border-radius: 2rem;
    color: #FFFFFF;
    font-size: 2.4rem;
    font-weight: 700;
}

.avartarsetupfile .instruction-text{
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.45;
}

.avartarsetupfile .instruction-text-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
}

.avartarsetupfile .warning-text {
    font-size: 2rem;
    font-weight: 400;
    line-height: 1.45;
    color: #FF0000;
}

.avartarsetupfile .bottom-button-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    gap: 1rem;
	margin-top: 2rem;
}

.avartarsetupfile .bottom-download-button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    padding: 1.2rem 3.2rem;
    background-color: #F1890E;
    border-radius: 3rem;
    color: #FFFFFF;
    font-size: 2.2rem;
    font-weight: 600;
    line-height: 1.45;
    text-decoration: none;
    border: none;
    cursor: pointer;
}
/* NJ-50173 end */

/* NJ-92178 start */
.lsn-title.title-transcript {
	min-width: 10rem;
	text-align: center;
}

.lsn-contents.transcript-cell {
	text-align: center;
	padding: 0.8rem;
}

.transcript-view-link {
    color: #F1890E;
    text-decoration: none;
    font-size: 1.6rem;
    cursor: pointer;
    font-weight: 400;
}

.transcript-view-link:hover {
	text-decoration: underline;
}
/* NJ-92178 end */

/* NJ-96550 start */
.bank_account_reg_note {
    padding: 2.4rem;
    border-radius: 0.5rem;
    border: 2px solid #16A9B2;
    background: #F2FEFF;
    margin-left: 1.6rem;
	height: min-content;
	width: 100%;
    max-width: 62rem;
}
.bank_account_reg_note p {
    display: flex;
}
/* NJ-96550 end */