em {
	font-style: italic !important;
}

.component-wrap {
	padding: 50px;
}
.component-wrap > div:not(:first-child) {
	margin: 50px 0;
}

.wrap {
	width: 100%;
	height: 100%;
	min-height: 100vh;
	background-color: var(--bg-color);
}
.custom-scroll {
	overflow: auto;
}
.custom-scroll::-webkit-scrollbar{
	width:8px;
	height:8px;
	border: 1px solid var(--gray300-color);
	border-radius: 30px;
}
.custom-scroll::-webkit-scrollbar-thumb {
	height: 30%;
	background: var(--gray300-color);
	border-radius: 30px;
}

/****************** login ******************/
.login-in {
	display: flex;
	align-items: center;
	gap: 235px;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	max-width: 1035px;
	width: 100%;
	margin: auto;
}
.login-in .logo {
	width: 250px;
}
.login-in .id-wrap {
	margin-bottom: 12px;
}
.login-in .pw-wrap {
	position: relative;
}
.login-in .id-wrap > div,
.login-in .pw-wrap > div {
	position: relative;
}
.login-in input[type="text"],
.login-in input[type="password"] {
	display: block;
	padding: 17px 12px;
	width: 550px;
	font-size: var(--font-body1);
	font-weight: 500;
	text-indent: 40px;
}
.login-in input[type="text"]:placeholder,
.login-in input[type="password"]:placeholder {
	color: var(--gray700-color);
}

.login-in .icon {
	display: block;
	position: absolute;
	top: 50%;
	left: 13px;
	transform: translateY(-50%);
	width: 28px;
	height: 28px;
}
.login-in .id-wrap .icon {
	background: url("../images/icon/ico_id.svg") no-repeat center / 100%;
}
.login-in .pw-wrap .icon {
	background: url("../images/icon/ico_pw.svg") no-repeat center / 100%;
}
.login-in .check-box {
	margin-top: 15px;
}
.login-in button {
	width: 550px;
	margin: 40px auto 0;
	font-size: var(--font-title);
	font-weight: 600;
	color: var(--white-color);
	border-color: var(--primary-color);
}
.login-in .find-pw-btn {
	margin-top: 20px;
	font-size: var(--font-body2);
	font-weight: 500;
	color: var(--gray700-color);
	transition: all .3s;
}
.login-in .find-pw-btn:hover {
	color: var(--gray800-color);
}
.login-in .find-pw-btn:active {
	color: var(--gray900-color);
}
.login-in i {
	position: absolute;
    top: 50%;
    right: 15px;
	transform: translateY(-50%);
}
.login-in i.on img:first-child,
.login-in i.off img:last-child {
	display: none;
}
.login-in i.on img:last-child {
	display: block;
}
/****************** login ******************/

/****************** find pw / change pw ******************/
#find_pw .inner,
#change_pw .inner {
	width: 550px;
	margin: auto;
	position: absolute;
	top: 265px;
	left: 50%;
	transform: translateX(-50%);
}
.pw-top {
	margin-bottom: 25px;
	text-align: center;
}
.pw-top h1 {
	display: block;
	margin-bottom: 14px;
	font-size: var(--font-header3);
	font-weight: 700;
}
.pw-top p {
	font-size: var(--font-body2);
	color: var(--gray700-color);
}
#find_pw .form input,
#find_pw .form button,
#change_pw .form input,
#change_pw .form button {
	width: 100%;
}
#find_pw .form input {
	padding: 17px 12px;
	width: 550px;
    font-size: var(--font-body1);
    font-weight: 400;
}
#find_pw .form input[type="text"]:not(:last-child) {
	margin-bottom: 10px;
}
#change_pw .form > div:first-child {
	margin-bottom: 12px;
}
#find_pw .form button,
#change_pw .form button {
	margin-top: 20px;
}
#find_pw .inner > div:nth-child(2) {
	margin-bottom: 50px;
}
/****************** find pw / change pw ******************/

/****************** header ******************/
#header {
	width: 100%;
	min-width: 1440px;
	height: 70px;
	padding: 0 50px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background: var(--white-color);
	border-bottom: 1px solid var(--gray300-color);
    z-index: 100;
}
#header > .header-in {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
}
#header > .header-in .left, #header > .header-in .right {
	display: flex;
	align-items: center;
}
#header .logo {
    width: 110px;
	margin-right: 50px;
    vertical-align: middle;
}
#header .logo a {	
    display: block;
    width: 110px;
    height: 34px;
    background: url("../../assets/images/logo/logo.png") no-repeat left center / 100%;
    text-indent: -9000px;
}
#header .gnb {
	display: flex;
	align-items: center;
	gap: 40px;	
    height: 70px;
}
#header .gnb > li {
	position: relative;
	height: 100%;
	line-height: 70px;
}
#header .gnb li a {
	display: block;
	position: relative;
	font-size: var(--font-body2);
	font-weight: 500;
	color: var(--gray700-color);
	cursor: pointer;
}
#header .gnb li .depth-2 {
	display: none;
	padding: 20px 10px;
	position: absolute;
	width: 100%;
	min-width: 120px;
	top: 70px;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 12px;
	border: 1px solid var(--gray300-color);
	background-color: var(--white-color);
	box-sizing: border-box;
}
#header .gnb li .depth-2 li + li {
	margin: 15px 0 0;
}
#header .gnb li .depth-2 li {
	line-height: initial;
}
#header .gnb li .depth-2 a {
	font-size: var(--font-body3);
	color: var(--gray700-color);
	text-align: center;
	cursor: pointer;
}
#header .gnb li:hover .depth-2 {
	display: block;
}
#header .gnb li a:hover {
	color: var(--primary-color);
	font-weight: 600;
}
#header .gnb li a:active {
	color: var(--blue600-color);
}
#header .right {
	gap: 35px;
}
#header .right .user {
	font-size: var(--font-body4);
}
#header .util {
	display: flex;
    align-items: center;
	gap: 0 15px;
}
#header .util li a {
	position: relative;
	display: inline-block;
	font-size: var(--font-body4);
	color: var(--gray700-color);
	transition: all .3s;
	cursor: pointer;
}
#header .util li:first-child,
#header .util li.m-add {
	padding-right: 15px;
	border-right: 1px solid var(--gray300-color);
}
#header .util a:hover {
	color: var(--gray900-color);
}
#header .util a:active {
	color: var(--black-color);
}
/****************** header ******************/

/****************** container ******************/
#container-wrap {
	min-width: 1440px;
	height: 100%;
    min-height: 100vh;
	padding: 150px 50px 100px;
	background-color: var(--bg-color);
}
.main .container {
	overflow: hidden;
}

#container-wrap.narrow {
	padding: 150px 0px 100px 250px;
}
#container-wrap.narrow .container {
	padding-right: 50px;
}
.container {
	position: relative;
	width: 1440px;
	margin: auto;
}
.page-depth {
	margin-bottom: 50px;
    font-size: var(--font-title2);
    font-weight: 400;
}
.page-title {
	margin-bottom: 25px;
	font-size: var(--font-title1);
	font-weight: 500;
}
.page-title.omr {
	margin-left: 25px;
}
.main .in-class {
	margin-bottom: 90px;
}
.main .class-area {
	position: relative;
	width: 1440px;
}
.main .class-area .swiper {
	/*width: 1340px;*/
	display:flex;
	min-height: 460px;
    margin: 0 50px;
	overflow: hidden;
}
.main .swiper-slide {
	padding: 0 10px;
}
.main .class-area .nav {
	width: 100%;
	margin-top: -30px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.main .class-area .nav .prev {
	position: absolute;
	left: 0;
	width: 40px;
    height: 40px;
}
.main .class-area .nav .next {
	position: absolute;
	right: 0;
	width: 40px;
    height: 40px;
}
.main .class-area .nav button img.on,
.main .class-area .nav button.on img {
	display: none;
}
.main .class-area .nav button.on img.on {
	display: block;
}
.main .class-area .nav button img {
	width: 40px;
}
.class-list-wrap {
	width: 1328px;
	height: 400px;
	margin: auto;
    overflow: hidden;
}
.main .class-area .class-list {
	display: flex;
    justify-content: start;
}
.main .class-area .list {
	flex-shrink: 0;
	/*width: calc(25% - 16px);*/
	width: 100%;
    /*margin: 0 8px;*/
	padding: 50px 20px;
	border-radius: 8px;
	background-color: var(--white-color);
	border: 0px;
	box-shadow: 0 6px 12px 0px rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
}
.main .class-area .list .class-name {
	font-size: var(--font-header3);
	font-weight: 700;
	text-align: center;
    display: -webkit-box;
    text-overflow: ellipsis;
	overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
	word-break: keep-all;
}
.main .class-area .list .class-info {
	width: 100%;
	margin: 15px 0 30px;
	padding: 20px;
	background-color: var(--secondary-color);
	border-radius: 8px;
	min-height: 134.78px;
}
.main .class-area .list .class-info > span {
	display: block;
	margin-bottom: 5px;
	font-size: var(--font-body3);
	font-weight: 600;
	color: var(--primary-color);
}
.main .class-area .list .class-info div {
	font-size: var(--font-body1);
	font-weight: 500;
	line-height: 1.2;
}
.main .class-area .list .class-info div:not(:last-child) {
	margin-bottom: 5px;
}
.main .class-area .class-link {
	display: flex;
/*    flex-direction: column;*/
	flex-wrap: wrap;
	gap: 8px;
}
.main .class-area .class-link li,
.main.academy .t-btn-wrap .class-link li {
	padding: 13px 14px;
	width: calc(50% - 4px);
	/*width: 100%;*/
	height: 44px;
	font-size: var(--font-body2);
	color: var(--gray700-color);
	border-radius: 8px;
	border: 1px solid var(--gray300-color);
	cursor: pointer;
	transition: all .3s;
}
.main .class-area .class-link li img.on,
.main.academy .t-btn-wrap .class-link img.on {
	display: none;
}
.main .class-area .class-link li a,
.main.academy .t-btn-wrap .class-link li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 100%;
}
.main .class-area .class-link li:hover,
.main.academy .t-btn-wrap .class-link li:hover {
	color: var(--white-color);
	background-color: var(--primary-color);
}
.main .class-area .class-link li:hover img,
.main.academy .t-btn-wrap .class-link li:hover img {
	display: none;
}
.main .class-area .class-link li:hover img.on,
.main.academy .t-btn-wrap .class-link li:hover img.on {
	display: block;
}
.main .class-area .class-link li:active,
.main.academy .t-btn-wrap .class-link .list:active {
	background-color: var(--blue600-color);
}
.main .notice {
	margin-bottom: 136px;
}
.main .notice-list {
	/*display: flex;*/
	/*flex-wrap: wrap;*/
	/*gap: 16px;*/
	display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(2, auto);
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    /* height: 200px; */
	height: auto;
}
.main .notice-list .list {
	/*width: calc(50% - 8px);*/
	width: calc(100% - 8px);
	/* padding: 30px 20px; */
	padding: 14px 20px;
	border-radius: 8px;
	background-color: var(--white-color);
	border: 0px;
	box-shadow: 0 6px 12px 0px rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
	transition: all .3s;
}
.main .notice-list .list > div {
	display: flex;
	align-items: center;
	gap: 30px;
	width: 100%;
	height: 100%;
	cursor: pointer;
}
.main .notice-list .list .badge {
	display: inline-block;
	width: 62px;
	padding: 8px 0px;
	font-size: var(--font-body3);
	font-weight: 600;
	text-align: center;
	color: var(--white-color);
	border-radius: 8px;
	background-color: var(--primary-color);
	box-sizing: border-box;
}
.main .notice-list .list .text {
	width: calc(100% - 92px);
	font-size: var(--font-body1);
	font-weight: 500;
    display: -webkit-box;
    text-overflow: ellipsis;
	overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.main .notice-list .list:hover {
	border-color: var(--gray500-color);
}
.main .notice-list .list:active {
	border-color: var(--primary-color);
}
.write-content .flex.in-notice .con {
	gap: 20px;
}
.write-content .flex.in-notice .check-box.notice {
	margin-bottom: initial;
}
.write-content .flex.in-notice .con input {
	width: calc(100% - 100px);
}
.main.academy .academy-box {
	margin-bottom: 90px;
	padding: 40px 20px;
	border-radius: 8px;
	background-color: var(--white-color);
 /*   border: 1px solid var(--gray300-color);*/
    box-shadow: 0 6px 12px 0px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}
.main.academy .academy-box .academy-name {
	margin-bottom: 35px;
    font-size: var(--font-header3);
    font-weight: 700;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.main.academy .con-title {
	font-size: var(--font-title2);
	font-weight: 600;
	color: var(--black-color);	
}
.main.academy .academy-bottom .con-title {
	display: block;
	margin-bottom: 15px;
}
.main.academy .subjects,
.main.academy .subjects-btn {
	display: flex;
	align-items: center;
	gap: 30px;
}
.main.academy .subjects {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--gray300-color);
}
.main.academy .subjects-btn {
	gap: 10px;
}
.main.academy .subjects-btn button {
	padding: 0 15px;
	min-width: auto;
	height: 44px;
}
.main.academy .subjects-btn button:hover {
	color: var(--white-color);
	background-color: var(--blue300-color);
}
.main.academy .subjects-btn button:active {
	color: var(--white-color);
	background-color: var(--blue600-color);
}
.main.academy .subjects-btn button.selected {
	background-color: var(--primary-color);
	color: var(--white-color);
}
.main.academy .academy-bottom {
	display: flex;
	align-items: baseline;
	gap: 30px;
}
.main.academy .academy-bottom > div {
	width: calc(50% - 15px);
}
.main.academy .t-btn-wrap {
	position: relative;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.main.academy .t-btn {
	position: relative;
	width: calc(50% - 5px);
}
.main.academy .t-btn-wrap button {
	width: calc(100% - 5px);
	padding: 17px 0px;
	font-size: var(--font-title2);
	color: var(--black-color);
	text-align: center;
	border: 1px solid var(--gray300-color);
	border-radius: 8px;
	transition: all .3s;
}
.main.academy .t-btn-wrap button:hover,
.main.manager .f-btn button:hover {
	color: var(--white-color);
	background-color: var(--primary-color);
	border-color: var(--primary-color);
}
.main.academy .t-btn-wrap button:active,
.main.manager .f-btn button:active {
	color: var(--white-color);
	background-color: var(--blue600-color);
	border-color: var(--blue600-color);
}
.main.academy .t-btn-wrap .class-link {
	display: none;
	position: absolute;
    top: 0px;
    right: -154px;
    padding: 12px;
    border: 1px solid var(--gray300-color);
    border-radius: 8px;
	background-color: var(--white-color);
    box-shadow: 0 4px 18px 0px rgba(0, 0, 0, 0.1);
	z-index: 3;
}
.main.academy .t-btn-wrap .class-link li {
	width: 100%;
}
.main.academy .t-btn-wrap .class-link li:not(:last-child) {
	margin-bottom: 8px;
}
.main.academy .t-btn button.hover + .class-link {
	display: block;
}
.main.academy .t-btn button.hover + .class-link:hover {
	display: block;
}
.main.academy .table-wrap {
	padding-right: 7px;
	height: 270px;
	overflow: auto;
}
.main.academy .table-wrap table {
	margin-top:0px;
}
.main.academy .recent-data th {
	position: sticky;
	padding: 8px 10px;
}
.main.academy .recent-data td {
	padding: 16px 10px;
}
.main.academy .recent-data .empty {
	height: 220px;
}
.main.manager .filter-top {
	margin-bottom: 30px;
}
.main.manager .filter-top,
.main.manager .f-btn {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 30px;
}
.main.manager .filter-top .line {
	width: 1px;
	height: 46px;
	background: var(--gray300-color);
}
.main.manager .f-btn {
	gap: 10px;
}
.main.manager .f-btn button {
	padding: 10px 15px;
	min-width: initial;
	border-radius: 8px;
}
.main.manager .f-btn button.on {
	background: var(--primary-color);
	color: var(--white-color);
}
.main.manager .manage-table-wrap {
	width: 1440px;
	height: 697px;
	overflow: auto;
}
.main.manager .manage-table {
	height: 698px;
}
.main.manager .manage-table.teacher {
	/*height: 346px;*/
    height: initial;
	max-height: 346px;
}
.main.manager .manage-table .thead.no-line {
	border-top: none;
}
.main.manager .manage-table .t-body .empty {
	height: 600px;
	line-height: 1.4;
}
.main.manager .manage-table .table-in {
	width: fit-content;
	background-color: var(--white-color);
}
.main.manager .manage-table div.per-100 {
	display: flex;
	width: calc(100% - 280px);
}
.main.manager .manage-table div.per-100 .full {
	width: 100%;
}
.main.manager .manage-table div.per-100 .two {
	width: 50%;
}
.main.manager .manage-table div.per-100 .three {
	width: 33.33%;
}
.main.manager .manage-table div.w-280 {
	width: 280px;
}
.main.manager .manage-table div.w-280.view-2 {
	width: 50%;
}
.main.manager .manage-table div.w-280.view-3 {
    width: 33.33%;
}
.main.manager .manage-table div.w-274 {
	width: 274px;
}
.main.manager .manage-table div.w-220 {
	width: 220px;
}
.main.manager .manage-table.other div .th.w-220 {
	width: 221px;
}
.main.manager .manage-table div.w-174 {
	width: 174px;
}
.main.manager .manage-table div.w-140 {
	width: 140px;
}
.main.manager .manage-table.other div .th.w-140 {
	width: 141px;
}
.main.manager .manage-table div.w-100 {
	width: 100px;
}
.main.manager .manage-table div.w-200 {
	width: 200px;
}
.main.manager .manage-table div.w-80 {
	width: 80px;
}
.main.manager .manage-table .t-list {
	display: flex;
	align-items: center;
}
.main.manager .manage-table .t-list.line {
	border-bottom: 1px solid var(--gray300-color);
}
.main.manager .manage-table .t-list .flex:last-child div {
	border-bottom: none;
}
.main.manager .manage-table .t-list div {
    text-align: center;
}
.main.manager .manage-table .list-wrap {
	border-left: 1px solid var(--gray300-color);
}
.main.manager .t-name {
	margin-bottom: 15px;
	font-size: var(--font-title2);
	font-weight: 600;
}
.main.manager .mt-table-wrap:not(:last-child) {
	margin-bottom: 50px;
}
.main.manager .pro-btn button {
	display: flex;
	gap: 10px;
	color: var(--primary-color);
	transition: all .3s;
}
.main.manager .pro-btn button:hover {
	gap: 15px;
	color: var(--blue300-color);
}
.main.manager .pro-btn button:active {
	color: var(--blue600-color);
}
.main.manager .manage-table div.w-280.open .divide-3 {
    flex: 1;
	width: 33.33%;
	border-bottom: none;
	box-sizing: border-box;
}
.main.manager .manage-table div.w-280.view-2.open .divide-3 {
	width: 33.33%;
}
.main.manager .manage-table div.per-100.open .divide-3 {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 388px;
	border-bottom: none;
}
.main.manager .manage-table div.w-280 .divide-3 {
	align-items: center;
    justify-content: center;
	width: 100%;
	border-bottom: none;
	box-sizing: border-box;
}
.main.manager .manage-table div.w-280.open {
	padding: initial;
}
.main.manager .manage-table .hide {
	display: none;
    width: 0;
	transition: all .3s;
}
.main.manager .manage-table div.open button img {
	transform: rotate(180deg);
}
.main.manager .manage-table div.w-280.open .hide {
	display: flex;
	width: 66.66%;
}
/*.main.manager .manage-table div.td.w-280.open .hide,
.main.manager .manage-table div.td.w-280.open .divide-3,*/
.main.manager .manage-table div.th.w-280.open .divide-3:last-child {
	border-right: 1px solid var(--gray300-color);
}
.main.manager .manage-table div.th.open .hide .divide-3:last-child,
.main.manager .manage-table div.td.open .hide .divide-3:last-child,
.main.manager .manage-table th {
	border-right: 0;
}
.main.manager .manage-table div.per-100.open .hide {
	display: flex;
	width: calc(100% - 33.33% / 2);
	border-left: 1px solid var(--gray300-color);
}
.main.manager .manage-table div.td.open {
	padding: 0;
}
.main.manager .manage-table div .th,
.main.manager .manage-table div .td,
.main.manager .manage-table div.w-280.open .divide-3,
.main.manager .manage-table div.td.open .hide .divide-3 {
	padding: 22px 0px;
}
.main.manager .manage-table div.w-280.open.pro-btn .divide-3 {
	padding: 18px 0px;
}
.main.manager .manage-table div.w-280.open.pro-btn .hide .divide-3:first-child,
.main.manager .manage-table div.td.w-280.open .hide .divide-3:first-child  {
	border-left: 1px solid var(--gray300-color);
	border-right: 1px solid var(--gray300-color);
}
.main.manager .pro-btn.view-2:last-child .th,
.main.manager .pro-btn.view-3:last-child .th,
.main.manager .manage-table div.per-100.open .hide > div {
	border-right: 1px solid var(--gray300-color);
}

/*
.main.manager .pro-btn.th.open {
	border-right: 1px solid var(--gray300-color);
}
*/
/****************** container ******************/

/****************** board ******************/
.snb.result.area {
  float: left;
  position: relative;
  top: 100px;
  left: 0px;
}
.snb.result{
  position: unset;
  padding: 20px;
}
.snb.result.omr {
  position: unset;
  margin-top: 20px;
}
.snb {
	position: absolute;
	top: 150px;
	left: 50px;
}
.board-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 30px;
}
.board-top .left.total {
	font-size: var(--font-body3);
	font-weight: 500;
	color: var(--gray700-color);
}
.board-top .left.total span {
	color: var(--primary-color);
	font-weight: 500;
}
.board-top .right.filter {
	display: flex;
	align-items: center;
	gap: 10px;
}
/****************** board ******************/

/****************** faq ******************/
.faq .que {
	display: flex;
	align-items: center;
	position: relative;
	padding: 24px 20px;
	font-size: var(--font-body2);
	background-color: var(--white-color);
	border-radius: 8px;
	cursor: pointer;
}
.faq .que:not(:last-child) {
	margin-bottom: 5px;
}
.faq .que:before {
	display: flex;
	align-items: center;
	justify-content: center;
	content: 'Q';
	width: 33px;
	height: 33px;
	margin-right: 15px;
	font-size: var(--font-body2);
	color: var(--white-color);
	border-radius: 50%;
	background-color: var(--primary-color);
	border: 1px solid var(--primary-color);
}
.faq .que.on > span{
  font-weight: bold;
  color: #006633; 
}  
.faq .anw {
	display: none;
	overflow: hidden;
	margin: -5px 0 5px;
	padding: 24px 20px;
	font-size: var(--font-body2);
	line-height: 1.5;
	background-color: var(--white-color);
	border-radius: 8px;
}  
.faq .anw:before {
	float: left;
	display: flex;
	align-items: center;
	justify-content: center;
	content: 'A';
	width: 33px;
	height: 33px;
	margin-right: 15px;
	font-size: var(--font-body2);
	color: var(--primary-color);
	border-radius: 50%;
	background-color: var(--white-color);
	border: 1px solid var(--primary-color);
}
.faq .anw .anw-con {
	float: left;
	width: calc(100% - 50px);
	margin-top: 6px;
}
.faq .anw .anw-btn-wrap,
.qna .que .anw-btn-wrap,
.qna .anw .anw-btn-wrap {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 14px;
}
.faq .anw .anw-btn-wrap button,
.qna .que .anw-btn-wrap button,
.qna .anw .anw-btn-wrap button {
	width: 60px;
    height: 38px;
	font-size: var(--font-body3);
	font-weight: 500;
}
.faq .anw .anw-btn-wrap button.edit,
.qna .anw .anw-btn-wrap button.edit {
	color: var(--gray900-color);
	border-color: var(--gray900-color);
}
.faq .anw .anw-btn-wrap button.delete,
.qna .anw .anw-btn-wrap button.delete {
	color: var(--negative-color);
	border-color: var(--negative-color);
}
.faq .anw .anw-btn-wrap button.edit:hover,
.qna .anw .anw-btn-wrap button.edit:hover {
	color: #333333;
	border-color: #333333;
	background-color: var(--gray100-color);
}
.faq .anw .anw-btn-wrap button.delete:hover,
.qna .anw .anw-btn-wrap button.delete:hover {
	color: #ff3e48;
	border-color: #ff3e48;
	background-color: #fff6f7;
}
.faq .anw .anw-btn-wrap button.edit:active,
.qna .anw .anw-btn-wrap button.edit:active {
	color: var(--black-color);
	border-color: var(--black-color);
	background-color: #e9e9e9;
}
.faq .anw .anw-btn-wrap button.delete:active,
.qna .anw .anw-btn-wrap button.delete:active {
	color: #ff2934;
	border-color: #ff2934;
	background-color: #fff1f3;
}
.faq .anw .anw-con .text-area {
	width: 100%;
	word-break: keep-all;
}
.faq .anw:after {
	content: "";
	display: block;
	clear: both;
}
.faq .arrow-wrap {
	position: absolute;
	top:50%;
	right: 20px;
	transform: translate(0, -50%);
}
.faq .que .arrow-top,
.faq .que.on .arrow-bottom {
	display: none;
}
.faq .que .arrow-bottom,
.faq .que.on .arrow-top {
	display: block;
}
.faq .anw .down-btn,
.qna .anw .down-btn {
	min-width: 180px;
	padding: 12px 15px;
}
/****************** faq ******************/

/****************** q&a ******************/
.qna .container {
	position: relative;
}
.qna .list-wrap li {
	display: block;
}
.qna .list-wrap li.empty {
	display: flex;
}
.qna .list-wrap li .date {
	width: 180px;
}
.qna .list-wrap li .con.text {
	display: block;
	padding: 24px 170px 24px 110px;
	font-size: var(--font-body2);
    line-height: 1.5;
}
.qna .list-wrap li .title {
	display: flex;
	align-items: center;
}
.qna .list-wrap li .title .secret {
	width: 16px;
	margin-left: 8px;
}
.qna .list-wrap li .title .btn-answer {
	max-width: 60px;
	height: 38px;
	margin-left: 20px;
	background-color: var(--white-color);
	border-color: var(--primary-color);
	color: var(--primary-color);
	transition: all .3s;
}
.qna .list-wrap li .title .btn-answer:hover {
    color: var(--blue300-color);
    border-color: var(--blue300-color);
	background-color: var(--secondary-color);
}
.qna .list-wrap li .title .btn-answer:active {
	color: var(--blue600-color);
    border-color: var(--blue600-color);
	background-color: var(--gray200-color);
}
.qna .btn-edit {
	margin-bottom: 14px;
	max-width: 60px;
	height: 38px;
	border-color: var(--gray900-color);
	color: var(--gray900-color);
	transition: all .3s;
}
.qna .btn-edit:hover {
    color: #333333;
    border-color: #333333;
    background-color: var(--gray100-color);
}
.qna .btn-edit:active {
	color: var(--black-color);
    border-color: var(--black-color);
    background-color: #e9e9e9;
	background-color: var(--gray200-color);
}
.qna .list-wrap li .con.text .text-area img {
	display: block;
	margin: 10px 0;
	/*max-width: 450px;*/
	max-width: 100%;
}
.qna .list-wrap li .con.text > div {
	padding: initial;
	word-break: keep-all;
}
.qna .list-wrap li .con.text > div.text-area {
    max-width: 1108px;
    word-wrap: break-word;
}
.qna .anw .title {
	display: flex;
	align-items: center;
	gap: 15px;
	color: var(--primary-color);
	font-weight: 600;
}
.qna .list-wrap li .con.text > div.writer {
	margin-top: 20px;
	padding-top: 15px;
	border-top: 1px solid var(--gray300-color);
}
.btn-write {
	margin-top: 25px;
	position: absolute;
    right: 50px;
	min-width: 150px;
	gap: 10px;
}
/****************** q&a ******************/

/****************** omr upload ******************/
.omr .container {
	width: 100%;
}
#container-wrap.narrow.omr.process .container {
	width: 1440px;
}
.omr .contents {
	width: 100%;
	padding: 20px 20px;

	border-radius: 12px;
	background-color: var(--white-color);
}
.omr .contents.mb-30 {
	padding-top: 35px;
	margin-bottom: 30px;
}
.sub-title {
	margin-bottom: 15px;
	font-size: var(--font-title2);
	font-weight: 600;
}
.omr .scan-box {
	padding: 25px 26px;
	background-color: var(--secondary-color);
	border-radius: 12px;
}
.scan-title {
	margin-bottom: 20px;
	font-size: var(--font-body1);
	font-weight: 700;
}
.omr .scan-box .flex-wrap {
	display: flex;
	align-items: center;
	gap: 20px;
}
.omr .scan-box .flex-wrap > div {
	width: 33.33%;
}

.omr .scan-box .flex-wrap.teacher > div {
	width: 40.33%;
}
.omr .tooltip.teacher {
	margin-bottom: 22px;
	width:18% !important;
	align-items: end;
	cursor: auto;
}
.omr .scan-box .flex-wrap.teacher > div:first-child {
	width: 25.33%;
	margin-top:auto;
	margin-bottom:auto;
	padding-top:50px;
}
.omr .scan-box .flex-wrap.teacher > div:last-child {

}
.omr .scan-box .flex-wrap .select {
	width: 50%;
}
.omr .scan-box .flex-wrap.teacher .select {
	width:100%;

}
.omr .scan-box .flex-wrap.teacher .select:first-child {

	margin-bottom: 20px;
}
.omr .scan-box .flex-wrap .flex {
	display: flex;
	gap: 10px;
}
.omr .scan-box .flex-wrap .mtb-10 {
	margin: 10px 0;
}
.omr .tooltip {
	position: relative;
	display: flex;
    align-items: center;
	margin-top: 30px;
	font-size: var(--font-body3);
	font-weight: 500;
	color: var(--primary-color);
	cursor: pointer;
}

.omr .tooltip img {
	margin-right: 5px;
}
.omr .tooltip-box {
	display: none;
    position: absolute;
    top: 26px;
    padding: 20px 18px;
    width: 330px;
    font-size: 0.8em;
    color: var(--black-color);
    background: var(--white-color);
    border-radius: 8px;
    border: 1px solid var(--gray300-color);
	z-index: 1000;
}
.omr .tooltip-box.open {
	display: block;
}
.omr .tooltip-box strong {
	display: block;
	margin-bottom: 10px;
	font-size: var(--font-body2);
}
.omr .tooltip-box li {
	margin-bottom: 8px;
	font-size: var(--font-body4);
	font-weight: 400;
}
.omr .tooltip-box li:last-child {
	margin-bottom: 0;
}
.omr .tooltip-box button {
	position: absolute;
    top: 19px;
    right: 18px;
    width: 14px;
}
.omr .button-wrap,
.omr .button-wrap > div {
	display: flex;
	align-items: center;
	gap: 10px;
}
.omr .button-wrap {
	justify-content: space-between;
	margin-bottom: 10px;
}
.omr .button-wrap button {
	width: 107px;
	font-size: var(--font-body3);
	font-weight: 400;
	color: var(--white-color);
	border-radius: 4px;
}
.omr .button-wrap button img {
	margin-right: 10px;
}
.omr .button-wrap button.select-file {
	background-color: var(--gray900-color);
}
.omr .button-wrap button.select-file:hover {
	background-color: #3f3f3f;
}
.omr .button-wrap button.select-file:active {
	background-color: #333;
}
.omr .button-wrap button.delete-all {
	background-color: var(--negative-color);
}
.omr .button-wrap button.delete-all:hover {
	background-color: #ff3e48;;
}
.omr .button-wrap button.delete-all:active {
	background-color: #ff2934;
}
.omr .button-wrap button.upload {
	background-color: var(--primary-color);
}
.omr .button-wrap button.upload:hover {
	background-color: var(--blue300-color);
}
.omr .button-wrap button.upload:active {
	background-color: var(--blue600-color);
}


.omr .pendingDiv{
	margin:auto;
	margin-right: 0px;
	display:inline-block !important;
	font-size: var(--font-body);
	color: var(--gray900-color);
}

.omr .dropzone {
	width: 100%;
	margin-top: 10px;
	background-color: var(--white-color);
	border: 1px dashed var(--gray300-color);
	border-radius: 8px;
	transition: all .3s;
	min-height: 162px;
	position: relative;
	overflow: hidden; /* dropzone 자체는 넘치는 것 방지 */
}

.omr .dz-message {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center; /* 파일 목록 위쪽부터 쌓이게 */
	gap: 8px;
	height: 162px; /* 고정 */
	overflow-y: auto; /* ★ 스크롤 추가 */
	padding: 12px;
	box-sizing: border-box;
}

.omr .dz-message.files-present {
	justify-content: flex-start; /* 파일이 있으면 위쪽부터 */
	align-items: flex-start;
	text-align: left;
}

.omr .dz-message p {
	font-size: var(--font-body1);
	font-weight: 600;
	color: var(--gray700-color);
}

.omr .dz-message small {
	font-size: var(--font-body2);
	color: var(--gray700-color);
}

/* 업로드된 파일 리스트 */
.omr .uploaded-files {
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.omr .uploaded-files li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: var(--white-color);
	border: 1px solid var(--gray300-color);
	border-radius: 6px;
	padding: 8px 12px;
	margin-top: 8px;
	font-size: var(--font-body2);
	word-break: break-all;
}

.omr .uploaded-files li .file-delete-btn {
	background: none;
	border: none;
	font-size: 16px;
	cursor: pointer;
	color: var(--gray600-color);
	margin-left: 8px;
}

.omr .upload-file-box {
	width: 100%;
	max-height: 220px;
	padding: 18px 12px;
	border-radius: 8px;
	background-color: var(--white-color);
	border: 1px solid var(--gray300-color);
}
.omr .upload-file-box ul {
	max-height: 184px;
	padding-right: 10px;
	overflow: auto;
}
.omr .upload-file-box ul::-webkit-scrollbar,
.recent-data::-webkit-scrollbar {
    width: 3px;
	height: 3px;
}
.omr .upload-file-box ul::-webkit-scrollbar-thumb,
.recent-data::-webkit-scrollbar-thumb {
    height: 30%;
    background: var(--gray300-color);
    border-radius: 30px;
}
.omr .upload-file-box ul::-webkit-scrollbar-track,
.recent-data::-webkit-scrollbar-track {
    background: var(--gray100-color);
}
.omr .upload-file-box li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 12px;
	font-size: var(--font-body3);
	font-weight: 400;
	color: var(--gray900-color);
}
.omr .contents-top, .omr .contents-top .left {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.omr .contents-top .sub-title {
	margin-bottom: 0;
}
.omr .contents-top .left ul {
	margin-left: 30px;
}
.omr .contents-top .left li {
	float: left;
	font-size: var(--font-body1);
	color: var(--gray700-color);
	margin-right: 20px;
}
.omr .contents-top .left li:first-child {
	margin-right: 20px;
	padding-right: 20px;
	border-right: 1px solid var(--gray300-color);
}
.omr .contents-top .left ul:after {
	content: "";
	display: block;
	clear: both;
}
.omr .contents-top .btn-wrap {
	margin: 0 0 20px;
}
.omr .contents-top button {
	font-weight: 400;
}
.omr .data-box {
	padding: 15px 26px;
	border-radius: 12px;
	background-color: var(--secondary-color);
}
.omr .data-box,
.omr .data-box .left,
.omr .data-box .calculate,
.omr .data-box .radio-wrap,
.omr .filter-box,
.omr .filter-box .left,
.omr .filter-box .right {
	display: flex;
	align-items: center;
}
.omr .data-box,
.omr .filter-box {
	justify-content: space-between;
}
.omr .data-box .left {
	gap: 50px;
}
.omr .data-box .calculate li:not(:last-child) {
	margin-right: 30px;
	padding-right: 30px;
	border-right: 1px solid var(--gray500-color);
}
.omr .data-box .calculate li span {
	font-weight: 700;
}
.omr .data-box .calculate li.cumulative span {
	color: var(--primary-color);
}
.omr .data-box .calculate li.error span {
	color: var(--negative-color);
}
.omr .filter-box {
	margin: 20px 0 25px;
}
.omr .filter-box .left,
.omr .filter-box .right {
	gap: 10px;
}
.omr .filter-box .btn-stroke:hover {
	background-color: var(--primary-color);
	color: var(--white-color);
}
.omr .filter-box .btn-stroke:active {
	background-color: var(--blue600-color);
	color: var(--white-color);
}
.omr .filter-box .btn-stroke.delete:hover,
.omr .filter-box .btn-stroke.delete:active {
	background-color: var(--white-color);
}
.omr .filter-box .btn-stroke.delete:hover {
	background-color: #ff3e48;
}
.omr .filter-box .btn-stroke.delete:active {
	background-color: #ff2934;
}
.omr .filter-box .btn-stroke.disabled:hover,
.omr .filter-box .btn-stroke.disabled:active {
	color: var(--gray700-color);
    background-color: var(--gray100-color);
    border-color: var(--gray100-color);
}
.omr .data-info {
	margin-bottom: 25px;
	font-size: var(--font-body3);
	font-weight: 500;
	color: var(--gray700-color);
}
.data-table-wrap {
	position: relative;
}
.data-table,
.manage-table {
	position: relative;
	width: 1410px;
	height: 600px;
	background-color: var(--white-color);
	overflow: auto;
}
.manage-table-student {
	position: relative;
	width: 1400px;
	height: unset;
	background-color: var(--white-color);
	overflow: auto;
}

.omr .data-table {
	width: 100%;
}
.omr .data-table .t-list {
	display: flex;
	align-items: center;
	font-size: var(--font-body2);
	color: var(--black-color);
	text-align: center;
	background: var(--bg-color);
	border-top: 1px solid var(--black-color);
}
.omr .data-table .thead {
	z-index: 2;
}
.omr .data-table .t-list  {
	background-color: var(--white-color);
	border-top: 0;
}
.omr .data-table .w-50 {
	width: 50px;
}
.omr .data-table .w-58 {
	width: 58px;
}
.omr .data-table .w-80 {
	width: 80px;
}
.omr .data-table .w-145 {
	width: 145px;
}
.omr .data-table .w-116 {
	width: 110px;
}
.omr .data-table .w-122 {
	width: 140px;
}
.omr .data-table .w-130 {
	width: 150px;
}
.omr .data-table .w-34 {
	width: 34px;
}
.omr .data-table .w-36 {
	width: 36px;

}
.omr .data-table .td.w-36 {
	width: 36px;
	border-right:1px solid var(--gray300-color);
}
.omr .data-table .t-list .td.w-36.first {

	border-left:1px solid var(--gray300-color);
}
.omr .data-table .thead .th.w-36 {

	border-right:1px solid var(--gray300-color);
}
.omr .data-table .thead .th.w-36.first {

	border-left:1px solid var(--gray300-color);
}
.omr .data-table .check-box {
	width: 24px;
	margin: auto;
}
.omr .data-table .check-box input[type="checkbox"] + label {
	padding-left: 0;
}
.omr .data-table .check-box input[type="checkbox"] + label:before,
.omr .data-table .check-box input[type="checkbox"]:checked + label:after {
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
}
.omr .data-table .t-body .empty,
.main.manager .manage-table .t-body .empty {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1400px;
	height: 540px;
	text-align: center;
}
.omr .data-table .t-body {
	height:auto;
	max-height: 540px;
}
.omr .data-table .t-body.alllist {
	height:auto;
	max-height: unset;
}
.omr .data-table .number {
	text-decoration: underline;
	color: var(--primary-color);
	transition: all .3s;
}
.omr .data-table .number:hover {
	text-decoration: underline;
	cursor: pointer;
}
.omr .student-info {
	bottom: 50px;
	right: 50px;
	display: flex;
    flex-direction: column;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	text-align: center;
	vertical-align: middle;
    gap: 8px;
	width: 80px;
	height: 80px;
	position: fixed;
	font-size: var(--font-body3);
	color: var(--primary-color);
	background-color: var(--secondary-color);
	border-radius: 50% 50%;
	transition: all 0.3s ease;
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
	z-index: 4;
}
.omr .student-info img {
	width: 24px;
}
.omr .student-info .btn-label {
    font-size: 14px;
    font-weight: 600;
    height: 18px;
}
.omr .student-info:hover {
	transform: translateY(-1px);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
}
.omr .student-info:active {
	background-color: #dcf2ff;
}
.omr .data-table .t-list.directly > div {
	background-color: var(--secondary-color);
}
.omr .data-table .t-list.on {

}
.list.omr.open {
	position: relative;
}
.omr .t-omr-img {
	display: none;
	display: block;
	width: 100%;
	background-color: var(--secondary-color);
}
.omr .t-omr-img .left {
	float: left;
	margin-left: 114px;
	background-color: var(--bg-color);
	border-left:1px solid var(--gray300-color);
	border-top:1px solid var(--gray300-color);
	border-bottom:1px solid var(--gray300-color);
}
.omr .t-omr-img .left .t-omr {
	display: flex;
	align-items: center;
}
.omr .t-omr-img .left .t-omr > div {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 58.2px;
    height: 58px;
	background-color: var(--white-color);

    border-left: 1px solid var(--gray300-color);
	border-bottom: 1px solid var(--gray300-color);

}
.omr .t-omr-img .left .t-omr > div:first-child {
	border-left: 1px solid var(--gray300-color);
}
.omr .t-omr-img .left .t-omr.num > div {
	background-color: var(--bg-color);
	height:60px;
}
.omr .t-omr-img .left .t-omr.answer > div {

	height:60px;
}
.omr .t-omr-img .left .t-omr.num > div.first {
	border-left: none;
}
.omr .t-omr-img .left .t-omr.answer > div.first {
	border-left: none;
}
.omr .t-omr-img .left .t-omr > div input[type="text"] {
	width: 40px;
    height: 40px;
    padding: 5px;
    text-align: center;
}
.omr .t-omr-img .right {
	float: left;
	position: relative;
	padding: 20px;
	width: 61%;
	height: 330px;
	border-top:1px solid var(--gray300-color);
	border-left: 1px solid var(--gray300-color);
	border-right:1px solid var(--gray300-color);
	border-bottom:1px solid var(--gray300-color);

}
.omr .t-omr-img .right .title {
	font-size: var(--font-body2);
	font-weight: 700;
}
.omr .t-omr-img .right .img-wrap {
	position: absolute;
	/*top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);*/
	max-width: 937px;
	width: 937px;
	font-size: var(--font-header1);
	font-weight: 700;
	color: rgba(17, 17, 17, 0.2);
	text-align: center;
}
.omr .t-omr-img .right .img-wrap.default {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);

}

.omr .t-omr-img .right .img-wrap img {
	width: 100%;
	position: absolute;

}
.omr .t-omr-img .right .zoom {
	position: absolute;
	top: 20px;
	right: 20px;
}
.omr .t-omr-img .right .zoom .select {
	max-width: 100px;
	margin-bottom: 10px;
}
.omr .t-omr-img .right .zoom .zoom-btn {
	display: inline-flex;
	flex-direction: row;
	align-items: end;
	gap: 5px;
}
.omr .t-omr-img .right .zoom .zoom-btn button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 4px;
	background-color: var(--gray700-color);
	transition: all .3s;
}
.omr .t-omr-img .right .zoom .zoom-btn button:hover {
	background-color: var(--gray800-color);
}
.omr .t-omr-img .right .zoom .zoom-btn button:active {
	background-color: var(--gray900-color);
}

.omr .t-omr-img::after {
	content: "";
	display: block;
	clear: both;
}
.omr .loading {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100vh;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 9;
}
.omr .loading-in {
	position: absolute;
	top: 380px;
	left: 50%;
	transform: translateX(-50%);
}
.omr .spinner {
	margin: 0 auto 30px;
	width: 130px;
	height: 130px;
	border: 5px solid var(--secondary-color);  
	border-top-color: var(--primary-color);
	border-radius: 100%;
	box-sizing: border-box;
	animation: spin 1s ease-in-out infinite;
}
.omr .loading-txt {
	font-size: var(--font-header2);
	font-weight: 700;
	color: var(--white-color);
}
.omr .loading-txt .progress {
	display:none;
	text-align: center;

}
@keyframes spin {
	100% {
		transform: rotate(360deg);
	}
}
.omr .student-info-pop {
	display: none;
	position: fixed;
	top: 240px;
	right: 50px;
	padding: 20px;
	width: 580px;
	background: var(--white-color);
	border-radius: 12px;
	border: 1px solid var(--gray300-color);
	box-shadow: 0 4px 18px 0 rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
	z-index: 110;
}
.authorization .recent-log-pop {
	display: none;
	position: absolute;
	top: -42px;
	right: 0;
	padding: 20px;
	width: 650px;
	background: var(--white-color);
	border-radius: 12px;
	border: 1px solid var(--gray300-color);
	box-shadow: 0 4px 18px 0 rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
	z-index: 4;
}
.omr .student-info-pop.open,
.authorization .recent-log-pop.open {
	display: block;
}
.omr .student-info-pop .search-box {
	margin-bottom: 15px;
}
.omr .student-info-pop table,
.authorization .recent-log-pop table {
	width: 100%;
}
.omr .student-info-pop table th,
.authorization .recent-log-pop table th {
	padding: 14px 20px;
	font-size: var(--font-body2);
	font-weight: 600;
	text-align: center;
	background-color: var(--bg-color);
	border: 1px solid var(--gray300-color);
}
.omr .student-info-pop table tr:first-child th,
.omr .student-info-pop table tr td,
.authorization .recent-log-pop table tr:first-child th,
.authorization .recent-log-pop table tr td {
	border-left: 0;
}
.omr .student-info-pop table tr th:last-child,
.omr .student-info-pop table tr td:last-child,
.authorization .recent-log-pop table tr th:last-child,
.authorization .recent-log-pop table tr td:last-child {
	border-right: 0;
}
.omr .student-info-pop table td,
.authorization .recent-log-pop table td {
	padding: 14px 20px;
	font-size: var(--font-body2);
	font-weight: 400;
	text-align: center;
	background-color: var(--white-color);
	border: 1px solid var(--gray300-color);
}
.omr .student-info-pop button.close-btn,
.authorization .recent-log-pop button.close-btn {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 20px;
}
.omr .error-table > div {
	display: flex;
	align-items: center;
	text-align: center;
}
.omr .error-table .thead {
	background-color: var(--bg-color);
}
.omr .error-table .thead > div {
	padding: 20px 20px;
	border-bottom: 0;
}
.omr .error-table .t-body > div {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 52px;
}
.omr .error-table .thead > div:last-child,
.omr .error-table .t-body > div:last-child {
	border-right: 0;
}
.omr .error-table > div div {
	padding: 0px 10px;
	border-top: 1px solid var(--gray300-color);
	border-right: 1px solid transparent;/*var(--gray300-color);*/
	border-bottom: 1px solid var(--gray300-color);
}
.omr .error-table .w-86 {
	width: 86px;
	text-align: center;
}
.omr .error-table .w-160 {
	width: 160px;
}
.omr .error-table .w-64 {
	width: 64px;
}
.omr .error-table .w-130 {
	width: 130px;
}
.omr .error-table > div div input[type="text"],
.omr .error-table > div div input[type="number"] {
	width: 100%;
	height: 38px;
}
.omr .error-message {
	display: block;
	margin-top: 5px;
	font-size: var(--font-body2);
	line-height: 1.3;
	color: var(--negative-color);
}
.omr .modal {
	top: 50%;
	transform: translate(-50%, -50%);
}
.omr .modal .btn-wrap {
	margin-top: 20px;
}
.omr .modal button.btn-small.no-mg {
    margin: 0;
}
.omr .modal .error {
	font-weight: 700;
	color: var(--negative-color);
}
.omr .modal.warning .title {
	font-weight: 600;
	line-height: 1.4;
}
.omr .modal .date {
	font-size: var(--font-body1);
	color: var(--primary-color);
}
.omr .modal p.info {
	margin: 20px 0 0;
	font-size: var(--font-body2);
	line-height: 1.5;
	color: var(--gray700-color);
}
/****************** omr upload ******************/

/****************** student registration ******************/
.s-btn-wrap {
	display: flex;
	align-items: center;
	justify-content: end;
	gap: 10px;
	margin-bottom: 15px;
}
.s-btn-wrap button.btn-small,
.result.class button.excel {
	padding: 0 14px;
	gap: 10px;
}
.s-btn-wrap button.disabled img {
	-webkit-filter: grayscale(1);
}
.s-btn-wrap button.excel,
.result.class button.excel {
	border-color: #1d7545;
	color: #1d7545;
}
.s-btn-wrap button.excel:hover,
.result.class button.excel:hover {
	background: var(--white-color);
	border-color: #125330;
	color: #125330;
}
.s-btn-wrap button.excel:active,
.result.class button.excel:active {
	background: var(--white-color);
	border-color: #0a331d;
	color: #0a331d;
}
.student .manage-table th {
	padding: 14px 10px;
	font-size: var(--font-body2);
	font-weight: 500;
	color: var(--black-color);
	text-align: center;
	border-top: 1px solid var(--gray300-color);
	border-right: none;
	border-bottom: 1px solid var(--gray300-color);
}
.student .manage-table th:last-child,
.student .manage-table td:last-child {
	border-right: 0;
}
.student .manage-table th button,
.system.authorization th button {
	margin-left: 10px;
}
.student .manage-table .check-box input[type="checkbox"] + label:before,
.student .manage-table .check-box input[type="checkbox"] + label:after {
	top: -17px;
    left: 50%;
    transform: translateX(-50%);
}
.student .manage-table td  {
	padding: 18px 14px;
	min-height: 60px;
	font-size: var(--font-body2);
	font-weight: 500;
	color: var(--black-color);
	text-align: center;
	background-color: var(--white-color);
	border-right: none;
	border-bottom: 1px solid var(--gray300-color);
}
.student .manage-table td.empty {
	height: 650px;
	line-height: 650px;
    text-align: center;
    width: 100%;
}
.student .manage-table td .switch {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.student .manage-table td .switch.on {
	color: var(--primary-color);
}
.student .manage-table td .switch.off {
	color: var(--gray700-color);
}
.student .manage-table td .name,
.authorization .table-wrap td .recent_login {
	color: var(--primary-color);
	text-decoration: underline;
	transition: all .3s;
}
.student .manage-table td .name:hover,
.authorization .table-wrap td .recent_login:hover {
	color: var(--blue300-color);
	text-decoration: none;
}
.student .manage-table td .name:active,
.authorization .table-wrap td .recent_login:active {
	color: var(--blue600-color);
	text-decoration: none;
}
.manage-table td .name .new {
	display: inline-block;
	margin-left: 5px;
	color: var(--negative-color);
}
.student .modal,
.system .modal {
	min-width: 640px;
	padding: 52px 35px;
}
.modal .sub-text.info {
	position: relative;
	padding-left: 10px;
	width: fit-content;
    margin: 0 auto 12px;
	text-align: left;
}
.modal .sub-text.info:before {
	content: "*";
	display: block;
	position: absolute;
	top: 0px;
	left: -2px;
}
.modal .sub-text.info.no:before {
	content: "";
}
.modal.excel-add .excel-down {
	display: block;
	margin: 0 auto 10px;
	font-size: var(--font-body2);
	font-weight: 600;
	color: var(--primary-color);
	text-decoration: underline;
}
.modal.excel-add .excel-down:hover {
	color: var(--blue300-color);
}
.modal.excel-add .excel-down:active {
	color: var(--blue600-color);
}
.modal.excel-add .student-reg {
	position: absolute;
	right: 35px;
	padding: 0 14px;
	gap: 10px;
}
.write .filebox label:hover {
	background-color: #333333;
}
.write .filebox label:active {
	background-color: var(--black-color);
}
.student .modal {
	top: 50%;
	transform: translate(-50%, -50%);
}
.student .modal .filebox input[type="file"],
.system .modal .filebox input[type="file"] {
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
}
.student .modal .filebox label,
.system .modal .filebox label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 108px;
    height: 46px;
    font-size: var(--font-body3);
    font-weight: 400;
    color: var(--white-color);
    background-color: var(--gray900-color);
    border-radius: 8px;
    vertical-align: middle;
    box-sizing: border-box;
    cursor: pointer;
}
.student .modal .filebox label:hover,
.system .modal .filebox label:hover {
	background-color: #333333;
}
.student .modal .filebox label:active,
.system .modal .filebox label:active {
	background-color: var(--black-color);
}
.student .modal .dropzone,
.system .modal .dropzone {
	display: flex;
	align-items: center;
	justify-content: center;
    width: 100%;
	height: 154px;
    margin-top: 10px;
	color: var(--gray700-color);
    background-color: var(--gray100-color);
    border: 1px dashed var(--gray300-color);
    border-radius: 5px;
    transition: all .3s;
}
.student .modal .dropzone.file,
.system .modal .dropzone.file {
	align-items: baseline;
	justify-content: flex-start;
	padding: 15px;
}
.student .modal .dropzone.file .file-area,
.system .modal .dropzone.file .file-area {
	display: flex;
    flex-wrap: wrap;
    gap: 10px;
    max-width: 580px;
}
.student .modal .btn-wrap,
.system .modal .btn-wrap {
	margin-top: 20px;
}
.student .modal button.btn-small.no-mg,
.system .modal button.btn-small.no-mg {
	margin: initial;
}
.student .modal .up-file,
.system .modal .up-file {
    display:block;
    padding: 12px 15px;
    border: 1px solid var(--gray300-color);
    background-color: var(--white-color);
    border-radius: 8px;
    transition: all .3s;
}
.student .modal .up-file:hover,
.system .modal .up-file:hover {
    border: 1px solid var(--gray500-color);
}
.student .modal .up-file .file-name,
.system .modal .up-file .file-name {
    float: left;
    margin-right: 30px;
    font-size: var(--font-body2);
    color: var(--black-color);
}
.student .modal .up-file .delete,
.system .modal .up-file .delete {
    float: right;
    width: 14px;
}
.student .modal .up-file:after,
.system .modal .up-file:after {
	content: "";
	display: block;
	clear: both;
}
.student .modal .error-data,
.student .modal .error-type {
	width: 100%;
}
.student .modal .error-data th,
.student .modal .error-type th,
.student .modal .history th,
.student .modal.move-class th {
	padding: 6px 18px;
    font-size: var(--font-body2);
    font-weight: 600;
    text-align: center;
    background-color: var(--bg-color);
    border: 1px solid var(--gray300-color);
}
.student .modal .error-data tr:first-child th,
.student .modal .error-data tr td,
.student .modal .error-type tr:first-child th,
.student .modal .error-type tr td,
.student .modal .history tr:first-child th,
.student .modal .history td:first-child,
.student .modal.move-class tr:first-child th,
.student .modal.move-class td:first-child {
    border-left: 0;
}
.student .modal .error-data tr th:last-child,
.student .modal .error-data tr td:last-child,
.student .modal .error-type tr th:last-child,
.student .modal .error-type tr td:last-child,
.student .modal .history th:last-child,
.student .modal .history td:last-child,
.student .modal.move-class th:last-child,
.student .modal.move-class td:last-child {
    border-right: 0;
}
.student .modal .error-data td,
.student .modal .error-type td,
.student .modal .history td,
.student .modal.move-class td {
	padding: 10px 18px;
    font-size: var(--font-body2);
    font-weight: 400;
    text-align: center;
	color: var(--negative-color);
    background-color: var(--white-color);
    border: 1px solid var(--gray300-color);
}
.student .modal .error-type td {
	color: inherit;
}
.student .modal.quick-add {
	min-height: 560px;
}
.student .modal.quick-add .select-wrap {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
}
.student .modal.quick-add .select.w-100,
.student .modal.move-class .select {
	width: 100%;
}
.student .modal.quick-add .select.w-50,
.student .modal.move-class .select.w-50 {
	width: 50%;
}
.student .modal.quick-add .select.w-33,
.student .modal.move-class .select.w-33 {
	width: 33.33%;
}
.student .modal .title.mb-20 {
	margin-bottom: 20px;
}
.student .modal.wide {
	width: 1120px;
}
.student .modal .history {
	width: 100%;
}
.student .modal .history td {
	padding: 10px;
	color: var(--black-color);
}
.student .modal .history td.bg {
	background-color: var(--bg-color);
}
.student .modal.move-class th,
.student .modal.move-class td {
	padding: 10px 20px;
	min-width: 100px;
	color: var(--black-color);
}
.student .modal.move-class .disabled td {
	color: var(--gray700-color);
	background-color: var(--gray100-color);
	pointer-events : none;
}
.student .modal.move-class .disabled td .select {
	background-color: var(--gray100-color);
}
.student .modal.move-class td .flex {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.student .modal.move-class td .badge {
	width: 9px;
	height: 9px;
	border-radius: 100%;
}
.student .modal.move-class td .badge.on {
	background-color: var(--primary-color);
}
.student .modal.move-class td .badge.off {
	background-color: var(--gray700-color);
}
.student .modal.move-class .select-box {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 420px;
	border: none;
    border-bottom: 1px solid var(--gray300-color);
}
.student .modal.move-class table {
	table-layout: fixed;
}
.student .modal.move-class.wide2 {
	width: 1210px;
}
.student .modal.move-class.wide2 th,
.student .modal.move-class.wide2 td {
	min-width: initial;
}
/****************** student registration ******************/

/****************** process status ******************/
.process .table-wrap button.btn-stroke {
	margin: auto;
}
.process .table-wrap {
	display: flex;
	margin-bottom: 50px;
    flex-direction: column;
	/*max-height: 250px;*/
	/*overflow-y: auto;*/
}
.process .table-wrap :is(.table-header, .table-body) > table {
   margin: 0;
}
.process .table-wrap .table-body {
	max-height: 185px;
	overflow-y: auto;
}
.process .table-wrap.mb-0 {
	margin-bottom: 0;
}
.process .btn-more-view {
	margin: 25px 0 0 auto;
	border-radius: 4px;
}
.process .table {
	width: 100%;
}
.etc.process .table {
	width: 100%;
}
.process .top.flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.process.omr .btn-large {
	margin: 50px auto 0;
}
/****************** process status ******************/

/****************** result ******************/
.result .top-filter {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	margin-bottom: 20px;
}
.result .contents {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 30px;
}
.result .contents .box {
	width: calc(50% - 15px);
	min-height: 1072px;
	padding: 30px 0px;
	border-radius: 12px;
	background-color: var(--white-color);
}
.result .contents .box .con-title p {
	margin-bottom: 8px;
	font-size: var(--font-body2);
	font-weight: 600;
	color: var(--gray700-color);
	text-align: center;
}
.result .contents .box .con-title div {
	font-size: var(--font-title2);
	font-weight: 600;
	color: var(--black-color);
	text-align: center;
}
.result .contents .box .con-title.left div {
/*	margin-bottom: 14px;*/
	text-align: left;
}
.result .test-name {
	width: 100%;
	margin: 20px 0 30px;
	padding: 16px 20px;
	font-size: var(--font-title2);
	font-weight: 600;
	color: var(--primary-color);
	background-color: var(--secondary-color);
}
.result .con-wrap {
	width: calc(100% - 40px);
	margin: auto;
	/*min-height: 400px;*/
}

.result .con-wrap.mb-30 {
	/*margin-bottom: 30px;*/
	/*min-height: 360px;*/
}
.result .con-sub-title {
	display: block;
	margin-bottom: 14px;
	font-size: var(--font-title2);
	font-weight: 600;
}
.result th button {
    margin-left: 10px;
}
.result .table-wrap.student table td,
.result .table-wrap.individual table td,
.result.class .table-wrap table td,
.assistant .table-wrap table td {
	padding: 18px 14px;
    min-height: 60px;
}
.result .con-wrap .btn-more {
	margin: 15px 0 0 auto;
}
.result .right .con-wrap .pdf,
.result .contents .box .comparison {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 14px;
}
.result .right .con-wrap .pdf .con-sub-title {
	margin-bottom: 0;
}
.result .right .con-wrap .pdf button {
	width: 150px;
}
.result .right .con-wrap.mb-90 {
	margin-bottom: -10px;
}
.result .contents .box .comparison .con-title div {
	text-align: left;
}
.result .contents .box.left .con-title.left {
	height:45.99px;
	display:flex;
	align-items:center;
}
.result .right .graph-wrap {
	width: calc( 100% - 70px);
	height: 312px;
	padding: 30px;
	border-top: 1px solid var(--gray300-color);
	border-bottom: 1px solid var(--black-color);
	overflow-x:auto;
	overflow-y: hidden;
	margin-left:30px;

}
.result .right .graph-wrap::-webkit-scrollbar{
	width:5px;
	height:10px;

}
.result .right .graph-wrap::-webkit-scrollbar-thumb {
	height: 30%;
	background: var(--gray400-color);
	border-radius: 30px;
}
.result .loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 862px;
}
.result .loading-spinner {
	width: 60px;
	height: 60px;
	border: 5px solid var(--primary-color);
/*	border-top: 5px solid transparent;*/
	border-radius: 50%;
	/*animation: rotate 1s linear infinite;*/
}
@keyframes rotate {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}
.result .loading .load-info {
	margin: 25px 0 10px;
	font-size: var(--font-title2);
	font-weight: 600;
	text-align: center;
}
.result .loading .load-info span {
	color: var(--primary-color);
}
.result .loading p {
	display: block;
	font-size: var(--font-body2);
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	color: var(--gray700-color);
}
.loading.common {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	min-height: 100vh;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 100;
}
.loading.chart {
	display: none;
	position: absolute;
	top: 500px;
	left: 0;
	width: calc(50% - 15px);
	left: calc(50% - 15px);
	min-height: 100vh;

	z-index: 100;
}
.loading.chart .loading-in {
	position: absolute;
	top: 380px;
	left: 50%;
	transform: translateX(-50%);
}
.loading.chart .spinner {
	margin: 0 auto 30px;
	width: 130px;
	height: 130px;
	border: 5px solid var(--secondary-color);
	border-top-color: var(--primary-color);
	border-radius: 100%;
	box-sizing: border-box;
	animation: spin 1s ease-in-out infinite;
}
.loading.percent {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: calc(50% - 15px);
	left: calc(50% - 15px);
	min-height: 100vh;

	z-index: 100;
}
.loading.percent .loading-in {
	position: absolute;
	top: 380px;
	left: 50%;
	transform: translateX(-50%);
}
.loading.percent .spinner {
	margin: 0 auto 30px;
	width: 130px;
	height: 130px;
	border: 5px solid var(--secondary-color);
	border-top-color: var(--primary-color);
	border-radius: 100%;
	box-sizing: border-box;
	animation: spin 1s ease-in-out infinite;
}
.loading.common .loading-in {
	position: absolute;
	top: 380px;
	left: 50%;
	transform: translateX(-50%);
}
.loading.common .spinner {
	margin: 0 auto 30px;
	width: 130px;
	height: 130px;
	border: 5px solid var(--secondary-color);
	border-top-color: var(--primary-color);
	border-radius: 100%;
	box-sizing: border-box;
	animation: spin 1s ease-in-out infinite;
}
.loading.common .loading-txt {
	font-size: var(--font-header2);
	font-weight: 700;
	color: var(--white-color);
}
.result .data-down .down-area {	
    width: 570px;
}
.result .data-down .down-area .down-btn {
	width: calc(50% - 5px);
	min-width: initial;
}
.result .data-down .down-btn.full {
	width: 100%;
	margin: 10px 0 15px;
}
.result .data-down .down-btn-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 30px;
}
.result .data-down .down-btn:hover {
	border-color: var(--primary-color);
}
.result .data-down .down-btn:hover .file-name {
	color: var(--primary-color);
}
.result .data-down .down-btn:active {
	border-color: var(--blue600-color);
	background-color: var(--secondary-color);
}
.result .data-down .down-btn:active .file-name {
	color: var(--blue600-color);
}
.result .data-down .down-btn-wrap a {
	font-size: var(--font-body3);
	color: var(--primary-color);
	text-decoration: underline;
	transition: all .3s;
}
.result .data-down .down-btn-wrap a:hover {
	font-weight: 600;
	color: var(--blue300-color);
	text-decoration: none;
}
.result .data-down .down-btn-wrap a:active {
	font-weight: 600;
	color: var(--blue600-color);
	text-decoration: none;
}
.result.class .contents .box {
	min-height: 855px;
	/*height: 1200px;*/
}
.result.class .page-title span {
	display: inline-block;
	margin-left: 30px;
	color: var(--primary-color);
}
.result.class .table-wrap table td.high {
	font-weight: 700;
	color: var(--primary-color);
	background-color: var(--secondary-color);
}
.result.class .table-wrap.rate table td {
	padding: 0px 14px;

}
.result.class .table-wrap table td.num {
	color: var(--blue600-color);
}
.result.class .table-wrap table td.low {
	font-weight: 700;
	color: var(--negative-color);
	background-color: #fff6f7;
}
.result .modal {
	top: 50%;
	transform: translate(-50%, -50%);
}
/****************** result ******************/

/****************** mypage ******************/
.mypage-con .explain {
	margin-bottom: 30px;
	font-size: var(--font-body3);
	color: var(--gray700-color);
	text-align: right;
}
.mypage .form-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 30px 90px;
}
.mypage .form-box > div {
	width: calc(50% - 45px);
    display: flex;
    align-items: baseline;
	font-size: var(--font-body1);
}
.mypage .form-box > div .error-message {
	margin-top: 10px;
}
.mypage .form-box > div.line {
	width: 100%;
	height: 1px;
	background-color: var(--gray300-color);
}
.mypage .form-box .label {
	width: 160px;
}
.mypage .form-box .box > *:not(.label) {
	width: calc(100% - 160px);
}
.mypage .form-box .box input[type="text"],
.mypage .form-box .box input[type="password"],
.mypage .form-box .box input[type="number"] {
	width: 100%;
	padding: 18px 12px;
	font-size: var(--font-body1);
}
.mypage .form-box .box input::placeholder {
	font-size: var(--font-body1);
}
.mypage.system.narrow .form-box .box input::placeholder {
	font-size: 16px;
}
.mypage .pw-wrap,
.mypage .pw-wrap > div {
	position: relative;
}
.mypage .pw-wrap input {
	width: 100%;
}
.mypage .pw-wrap > div i {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}
.mypage .pw-wrap i.on img:first-child,
.mypage .pw-wrap i.off img:last-child {
    display: none;
}
.mypage .pw-wrap i.on img:last-child {
    display: block;
}
.mypage .btn-wrap {
	position: fixed;
	left: 50%;
	bottom: 100px;
	transform: translateX(-50%);
}
.mypage .btn-wrap.none {
	position: initial;
	transform: initial;

}
.mypage .btn-wrap.none.create {
	position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    max-width: 90%;
    min-height: 56px;
    padding: 12px 24px;
    z-index: 10;
    display: flex;
     align-items: center;
     justify-content: center;
    box-sizing: border-box;
	border-radius: 12px;
    background: var(--bg-color);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.assistant .table-wrap .empty {
	height: 540px;
	text-align: center;
}
.assistant .sub-title {
	display: block;
}
.authority-wrap {
	margin-top: 100px;
}
.assistant .authority .switch {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.assistant .authority .switch.on {
	color: var(--primary-color);
}
.assistant .authority .switch.off {
	color: var(--gray700-color);
}
.assistant.detail .board-top {
	justify-content: end;
}
.assistant.detail .d-table th,
.assistant.detail .d-table td {
	padding: 25px 20px;
	min-height: 74px;
}
.assistant.detail .d-table tr:first-child td {
	border-top: 1px solid var(--black-color);
}
.assistant.detail .a-circle {
	width: 22px;
	height: 22px;
	margin: auto;
	border-radius: 100%;
	display: flex;
	align-items: center;   /* 수직 가운데 정렬 */
	justify-content: center; /* 수평 가운데 정렬 */
}
.assistant.detail .a-circle.allowance {
	background-color: var(--primary-color);
}
.assistant.detail .a-circle.block {
	background-color: var(--gray700-color);
}

/****************** mypage ******************/

/****************** system ******************/
.system .filter-box {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 30px;
	padding: 25px 26px;
    border-radius: 12px;
    background-color: var(--secondary-color);
}
.system .filter-box > div {
	display: flex;
	align-items: center;
}
.system .filter-box > div .label {
	width: 110px;
}
.w-230 {
	width: 230px;
}
.w-740 {
	width: 740px;
}
.system .s-table .thead {
	border-top: 1px solid var(--black-color);
}
.system .s-table .t-list {
	display: flex;
}
.system .s-table .hide .con-sub-title {
	display: block;
    margin-bottom: 14px;
    font-size: var(--font-body2);
    font-weight: 600;
}
.system .s-table .td {
	height: initial;
}
.system .s-table .td.w-740 {
	padding: 0;
}
.system .s-table button.view {
	width: 100%;
	height: 60px;
	color: var(--primary-color);
}
/* .system .s-table .open button.view {
	border-bottom: 1px solid var(--gray300-color);
} */
.system .s-table button.view img {
	margin-left: 10px;
	transition: all .3s;
}
.system .s-table button.view:hover img  {
	margin-left: 15px;
}
.system .s-table .open button.view img {
	transform: rotate(180deg);
}
.system .s-table .hide {
	display: none;
	padding: 20px 0;
	margin: 0 20px;
}
.system .s-table .open .hide,
.system .s-table .subject-detail-row:not([hidden]) .hide {
	display: block;
	border-top: 1px solid var(--gray300-color);
}
.system .s-table tr.subject-row:has(+ tr.subject-detail-row:not([hidden])) td {
	border-bottom: none;
}

tr.subject-row.selected td{
	background-color: #f1f9ff;
}

.system .s-table tr.subject-detail-row:not([hidden]) > td {
	border-top: none;
	padding-top: 0;
	background-color: #f1f9ff;
}

.system .s-table .con-sub-title {
	text-align: left;
}
.system .s-table .hide input,
.system .s-table .hide button {
	height: 46px;
}
.system .s-table .registration {
	display: flex;
	gap: 10px;
	margin-bottom: 20px;
}
.system .s-table .registration input {
	width: 290px;
}
.h-table.table-wrap table th {
	height: 52px;
	border-top: 1px solid var(--gray300-color);
}
.h-table.table-wrap table td {
	height: 52px;
}
.no-flex {
	display: block;
}
.system .filter-box input {
	height: 46px;
}
.system.contents .filter-box {
	align-items: end;
}
.system.contents .filter-box > div {
	position: relative;
	flex-direction: column;
	align-items: baseline;
	gap: 5px;
	width: 160px;
}
.system.contents .filter-box > div .select,
.system.contents .filter-box > div input {
	width: 100%;
}
.system.contents .filter-box .search-con {
	display: none;
    padding: 0px 25px;
	position: absolute;
    top: 80px;
	width: 328px;
    background: var(--white-color);
    border-radius: 8px;
    border: 1px solid var(--gray300-color);
	box-shadow: 0 4px 18px 0 rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}
.system.contents .filter-box .search-con.on {
	display: block;
}
.system.contents .filter-box .search-word,
.system.contents .filter-box .search-result {
	font-size: var(--font-body2);
	line-height: 1.4;
	word-break: keep-all;
}
.system.contents .filter-box .search-word {
	padding: 20px 0 10px;
	font-weight: 700;
	color: var(--primary-color);
	border-bottom: 1px solid var(--gray300-color);
}
.system.contents .filter-box .search-result {
	padding: 10px 0 20px;
}
.system.contents .calendar-wrap {
	display: none;
	position: absolute;
    top: 80px;
	box-shadow: 0 4px 18px 0 rgba(0, 0, 0, 0.1);
}
.system.contents .calendar-wrap.on {
	display: block;
}
.system.contents .calendar .days {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: 0;
}
.system.contents.class .filter-box > div {
	width: 238px;
}
.system.contents.class .disabled td,
.authorization .disabled td {
	background: var(--gray100-color);
    color: var(--gray700-color);
	pointer-events : none;
    cursor: default;
}
.system.contents.class .disabled td button,
.authorization .disabled td button{
	color: var(--gray700-color);
}
.system.contents.class .disabled td:first-child {
	pointer-events: initial;
}
.system.contents.class .disabled td .check-box input[type="checkbox"] + label:before,
.authorization .disabled td .check-box input[type="checkbox"] + label:before {
	background: var(--gray100-color);
}
.system.contents.class .s-num {
	align-items: center;
	gap: 5px;
}
.authorization .table-wrap td .recent_login.blank {
	columns: var(--black-color);
	text-decoration: none;
}
.authorization .table-wrap td {
	position: relative;
}
.authorization .recent-log-pop {
	top: 59px;
	padding: 30px 20px;
}
.authorization .recent-log-pop .title {
	margin-bottom: 15px;
    font-size: var(--font-title2);
    font-weight: 600;
	text-align: left;
}
.authorization .recent-log-pop table th {
	padding: 0px 10px;
    height: 30px;
}
.authorization .recent-log-pop table td {
	padding: 0px 10px;
    height: 36px;
}
.system.mypage .box .flex {
	align-items: center;
	gap: 10px;
}
.system.mypage .box .flex.top {
	align-items: baseline;
}
.system.mypage .form-box > div.full {
	width: 100%;
}
.system.mypage .form-box > div.full .box {
	width: calc(50% - 45px);
}
.system.mypage .form-box .full > div {
    display: flex;
    align-items: baseline;
    font-size: var(--font-body1);
}
.system.mypage .box .flex > div {
	width: calc(100% - 120px);
}
.system.mypage .box .flex.radio-wrap > div {
	width: 114px;
}
.system.mypage .box .flex input {
	width: 100%;
}
.system.mypage .box .flex .btn-large {
	min-width: 110px;
	font-size: var(--font-body1);
	font-weight: 500;
	border-radius: 4px;
}
.system.mypage .box .flex .select {
	width: calc(100% - 30px);
	padding: 18px 12px;
	height: 59px;
	max-height: initial;
}
.system.mypage .box .flex .select .selected .selected-value {
	font-size: var(--font-body1);
}
.system.mypage .select .arrow {
    position: absolute;
    right: -2px;
    top: 50%;
    transform: translateY(-50%);
}
.system.analysis .board-top {
	justify-content: end;
}
.system.analysis .contents-top {
	display: flex;
    align-items: center;
    justify-content: space-between;
	margin-bottom: 15px;
}
.system.analysis .contents-top .btn-wrap {
	margin: initial;
}
.system.analysis .contents-top .btn-wrap button {
    padding: 0 14px;
    gap: 10px;
}
.system.analysis .contents-top .btn-wrap button.disabled img {
    -webkit-filter: grayscale(1);
}
.system.analysis .contents-top .download img.white {
	display: none;
}
.system.analysis .contents-top .download:hover img,
.system.analysis .contents-top .download.disabled:hover img.white {
	display: none;
}
.system.analysis .contents-top .download:hover img.white,
.system.analysis .contents-top .download.disabled:hover img {
	display: block;
}
.system.analysis .select-file {
	color: var(--primary-color);
	text-decoration: underline;
}
.system.analysis .select-file.selected {
	color: var(--black-color);
	text-decoration: none;
}
/****************** system ******************/

.table-hover{
	cursor: pointer;
}
i.input-button1{
	background-image : url("../../assets/images/icon/input-button1.png");
	width : 22px;
	height : 22px;
	cursor : pointer;
	display:none;
	right: 13px;
	top: 13px;
	display: inline-flex;
	position: absolute;
}
.rotate-btn {

	position: absolute;
	top: 55px;
	flex-direction: column;
	align-items: end;
	gap: 5px;

}
.rotate-btn button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 4px;
	background-color: var(--gray700-color);
	transition: all .3s;


}
.rotate-btn button.leftRotation  {
	background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='-4 -4 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.24986 15.85C7.44747 19.6564 12.3146 20.9605 16.121 18.7629C19.9274 16.5653 21.2315 11.6982 19.0339 7.89181C16.8363 4.08545 11.9691 2.78129 8.16278 4.9789C6.19178 6.11685 4.89171 7.97061 4.40135 10.0222' stroke='%23ffffff'/%3E%3Cpath d='M8.4431 8.7554L3.93291 10.6015L2.55111 5.92811' stroke='%23ffffff'/%3E%3C/svg%3E%0A");

}
.rotate-btn button.rightRotation  {
	background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='-4 -4 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.7501 15.85C16.5525 19.6564 11.6854 20.9605 7.879 18.7629C4.07264 16.5653 2.76848 11.6982 4.96609 7.89181C7.16369 4.08545 12.0309 2.78129 15.8372 4.9789C17.8082 6.11685 19.1083 7.97061 19.5987 10.0222' stroke='%23ffffff'/%3E%3Cpath d='M15.5569 8.7554L20.0671 10.6015L21.4489 5.92811' stroke='%23ffffff'/%3E%3C/svg%3E%0A");

}

.log-table-wrap{
	max-height: 510px;
    overflow-y: auto;
}


.search-result div, .search-word {
	cursor: pointer;
}

.footer-qna {
	margin: 30px auto 0;
	width: 1440px;
}
.footer-qna .footer-wrap {
	display: flex;
	padding: 20px;
	gap: 40px;
	width: 1390px;
	border-top: 1px solid var(--gray600-color);
}
.footer-qna .footer-wrap div {
	display: flex;
	font-size: var(--font-body4);
	color: var(--gray700-color);
	flex-wrap: wrap;
}

.footer-qna .footer-wrap div span {
	margin-left: 4px;
}


.custom-list {
	list-style: none; /* 기본 마커 제거 */
	padding: 0;
	margin: 0;
}

.custom-list li {
	position: relative;
	padding-left: 1.2em;  /* ● 다음 내용 들여쓰기 */
	line-height: 1.6;
}

.custom-list li::before {
	content: "●";
	position: absolute;
	left: 0;
}

.custom-list-teacher li::before {
	content: "●";
	color: #0078d4; /* 파란색 마커 */
	position: absolute;
	left: 0;
}