@charset "utf-8";
/* CSS Document */

/* ---------- common ---------- */
html, body {width:100%; height:100%; font-size: 62.5%;}
body {background-color: #ffffff; font-family: "Noto Sans KR", sans-serif, NanumGothic,dotum,"돋움",Gulim, Arial, "Open Sans";}
input, select, textarea { font-size:0.75em; font-family: "Noto Sans KR", sans-serif, NanumGothic,dotum,"돋움",Gulim, Arial, "Open Sans", sans-serif; color:#333; background:#FFFFFF;}

a:link {color: #999999; text-decoration:none;}
a:active {color: #999999; text-decoration:none;}
a:visited {color: #999999; text-decoration:none;}
a:hover {color: #999999; text-decoration:none;}

.hidden, hr {font-size:0; height:0; line-height:0; position:absolute; margin:0; padding:0; width:0; visibility:hidden; overflow:hidden;}
.bold {font-weight:bolder;}
caption {font-size:0; height:0; line-height:0; margin:0; padding:0; width:0; visibility:hidden; overflow:hidden;}

input {font-size:12px; vertical-align:middle; font-family:NanumGothic,dotum,"돋움",Gulim; color:#363636;}
input[type=checkbox] {background:none;}
input[type=file] {width:90%; height:25px;}
input[type=radio] {vertical-align:middle;}
.input_style1 {height:16px; line-height:14px; border:1px solid #ccc; padding:3px 5px 1px 5px; vertical-align: middle;}
.input_style2 {height:16px; line-height:14px; border:1px solid #ccc; padding:3px 5px 1px 5px; vertical-align: middle;}
select {vertical-align:middle; border:1px solid #ccc; font-size:12px; color:#363636; min-height:20px; }
select option {vertical-align:middle; height:21px;}
textarea {font-size:12px; font-family:NanumGothic,dotum,"돋움",Gulim; color:#363636; border:1px solid #ccc; padding: 5px; line-height:18px; resize:none; }
textarea[readonly=readonly] {background:#ebebeb;}
.ellipsis {overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.blue {color:#2e69eb !important;}
.blue2 {color:#1274b9 !important;}
.red {color:#d12937 !important;}
.orange {color:#ff8200;}
.gray {color:#ababab;}
.brown {color:#958159;}
.yellow {color:#f4dd39 !important;}
.disabled {color:#898989;}
hr { color:#d2d2d2; border-width:1px; border-style: inset;}
.nopadding {padding:0;}
.border1 {border:1px solid #c9c9c9;}
.capital {text-transform:uppercase;}

.text_alignC {text-align:center !important;}
.text_alignL {text-align:left !important;}
.text_alignR {text-align:right !important;}

.MT40 {
	margin-top:40px;
}

.MT50 {
	margin-top:50px;
}

.MR10 {
	margin-right:10px;
}


.btn_red,
.btn_red:focus,
.btn_red:visited,
.btn_red:active,
.btn_red:hover {
	background-color:#d12937;
	border:none;
	color:#fff;
	font-weight:bold;
	font-size:14px;
}

.btn_brown,
.btn_brown:focus,
.btn_brown:visited,
.btn_brown:active,
.btn_brown:hover {
	background-color:#958159;
	border:none;
	color:#fff;
	font-weight:bold;
	font-size:14px;
}

.btn_gray,
.btn_gray:focus,
.btn_gray:visited,
.btn_gray:active,
.btn_gray:hover {
	background-color:#434343;
	border:none;
	color:#fff;
	font-weight:bold;
	font-size:14px;
}

.btn_close,
.btn_close:focus,
.btn_close:visited,
.btn_close:active,
.btn_close:hover {
	background-color:#434343;
	border:none;
	color:#fff;
	font-weight:bold;
	font-size:14px;
}

.img-responsive {
    display: block;
    height: auto;
    max-width: 100%;
}

.h2 {font-size:32px;}



/* ---------- main ---------- */

.standby {
	background-color: #fdf6e4;
	/*height: 100%;*/ 
	min-height: 100vh;
	position: relative;
	padding-bottom: 2vw;
	box-sizing:border-box;
}


.standby .title_blue {
	font-size:4vw;
	line-height: 1;
	font-weight:bold;
	background-color: #0085fe;
	color:#fff;
	padding-top:2vw;
	padding-bottom:2vw;
}

.standby .title_red {
	font-size:4vw;
	line-height: 1;
	font-weight:bold;
	background-color: #d61213;
	color:#fff;
	padding-top:2vw;
	padding-bottom:2vw;
}

.standby .title_blue span,
.standby .title_red span {
	font-size:3vw;
}

.standby .box_year {
	padding-left: 1vw;
	text-align: center;
}


.standby .h_center .d-t { display: table; width: 100%; min-height: calc(100vh - 30vw);}
.standby .h_center .d-tc {display: table-cell; vertical-align: middle;}

.standby .year {
	display: inline-block;
	padding-top:1.5vw;
	font-size:3.5vw;
	font-weight:bold;
}

.standby .year span {
	font-size:2.5vw;
}

.standby .week {
	display: inline-block;
	padding-left:2vw;
}

.standby .week p {
	display: inline-block;
	color:#000;
	font-size:2.2vw;
	padding:0.5em;
	font-weight:bold;
}

.standby .week.blue p.select {
	color:#0085fe;
}

.standby .week.red p.select {
	color:#d61213;
}


.standby .box_month.blue {
	color:#0085fe;
}

.standby .box_month.red {
	color:#d61213;
}

.standby .month {
	display: inline-block;
	font-size:10vw;
	font-weight:bold;
}

.standby .month span {
	font-size:3vw;
	color:#000;
}

.standby .date {
	display: inline-block;
	font-size:10vw;
	font-weight:bold;
	padding-left:2rem;
}

.standby .date span {
	font-size:3vw;
	color:#000;
}

.standby .time {
	padding-top: 0rem;
    font-size: 3vw;
    font-weight: bold;
}

.standby .time span {
	color:#2e69eb;
	font-size: 4vw;
}

.standby .period {
	padding-top: 0rem;
    font-size: 3vw;
    font-weight: bold;
}

.standby .period span {
	color:#d61213;
	font-size: 4vw;
}

.standby button {
	width:30%;
	margin-top: 1.5vw;
	font-size: 3.5vw;
	padding:2vw; height: auto !important;
	border-radius:1rem;
	color:#fff;
	background-color: #51bc48;

}

.standby button svg {
	margin-top:-15px;
}

header {
	background-color: #00163f;
	color:#fff;
	float:left;
	width:100%;
	line-height: 7vw;
}

header .prev svg,
header .setting svg {
	color:#fff;
	width: 3vw; height: 3vw;
}

header .prev {
	padding-left:0.5rem;
}

header .setting {
	padding-right:0.5rem;
}

header .title {
	font-size:2.5vw;
}

header .dropdown a {
	color:#fff;
}

header .dropdown-menu a {
	color:#000;
	font-size:1.7vw; line-height: 1.5;
} 

header .dropdown-menu.show {
	margin-top:15px !important;
}

header .dropdown-menu[data-bs-popper] {
    top: 100%;
    left: -120px;
    margin-top: 1rem;
}

header a.dropdown-item:active {
	background-color: #e9ecef;
	color:#000;
}

.contents {
	margin-top:2rem;
	width:100%;
	margin: 0;
}

.search_file {
	
}

.search_file input {
	width:250px;
	display:inline-block;
}

.contents .info_top {
	display:inline-block;
	font-size: 1.8vw;
	color:#000;
	text-align: center;
	padding-top: 3vw;
	margin-bottom:3vw;
}

.d-t1 {display: table; width: 100%; height: calc(100vh - 16vw);}
.d-t1 > div {display: table-cell; vertical-align: middle;}

.contents .info_select {
	display:inline-block;
	font-size: 1.5vw;
	color:#d12937;
	border:1px solid #ddd;
	border-radius: 10px;
	padding:0.5em 1em;
	min-width:300px;
	margin-left:10px;
}


.contents .box {
	background-color: #fff;
    background-clip: border-box;
    border: 0.0625rem solid rgba(231,234,243,.7);
    border-radius: 0.75rem;
	width:23%;
	box-shadow: 0 0 0.875rem 0 rgb(41 48 66 / 5%);
	padding:2.5vh 0;
	/*min-height:25vh;*/
	margin:0.5vw;
	text-align: center;
	display: inline-block;
}

.contents .ty2 .box {width: 23%; min-height:auto; padding: 2.5vh 0;}
.contents .ty2 .box .number {width: 6vw; height: 6vw; line-height: 6vw; font-size: 3vw;}

.text-center .ta-l {text-align: left;}


.contents .box2 {
	background-color: #fff;
    background-clip: border-box;
    border: 0.0625rem solid rgba(231,234,243,.7);
    border-radius: 0.75rem;
	width:18.5%;
	box-shadow: 0 0 0.875rem 0 rgb(41 48 66 / 5%);
	padding:2.5rem 0;
	margin:0.5vw;
	text-align: center;
	display: inline-block;
}

.contents .box .number {
	background: #e0eafc;
    border-radius: 50%;
    width: 6vw; height: 6vw; line-height: 6vw; font-size: 3vw;
	color:#3f80ea;
	text-align: center;
	display:block;
    margin: 0 auto;
}

.contents .box2 .number2 {
	background: #e0eafc;
    border-radius: 50%;
    height: 6vw;
    width: 6vw;
	line-height: 6vw;
	color:#3f80ea;
	text-align: center;
	font-size: 2vw;
	margin:0 auto;
}

.contents .box .grade {
	display:inline-block;
	font-size: 2vw;
	color:#000;
	text-decoration: none;
	padding-top:1rem;
}


.contents .box2 .name {
	display:inline-block;
	padding-top:1rem;
	font-size: 1.5vw;
	color:#000;
	text-decoration: none;
}


/* ---------- modal ---------- */

.modal {font-size: 1.5vw;}
.modal button {font-size: 1.2vw;}
.modal .modal-title {
	font-size:1.5vw;
}

.modal .modal-title span {
	color:#2e69eb;
	padding-left:10px;
}

.modal .modal-body {
	margin-top:1.5rem;
	margin-bottom:1rem;
	text-align: center;
}

.modal .pic {
	border:1px solid #ddd;
	border-radius: 5px;
	background-color: #eee;
	width:110px;
	height:140px;
    display: inline-block;
	margin-right: 70px;
	margin-left: 50px;
	float:left;
}

.modal .pic svg {
	color:#ccc;
	margin-top:55px;
}

.modal .pic img {
	border-radius: 5px;
}

.modal .barcode {
	display: inline-block;
	float:left;
    margin-top: 30px;
}

.modal .barcode .number {
	font-size:1.5rem;
	font-weight: bold;
	margin-top:0.5rem;
}

.modal .info {
	margin-right:20%;
}

.modal .modal-footer svg {
	margin-right: 20%;
}


@media (max-width: 1200px) {
	#hd, #wrapper, #ft {min-width:auto; width: 100%;}
}

@media (max-width: 800px) {
	.standby .year {display: block;}
	.standby .h_center .d-t {min-height: calc(100vh - 45vw);}
}


/*
@media (max-width: 1600px) {


/* ---------- main ---------- *

.standby .box_year {
	padding-left:1rem;
}
	
.standby .week {
	display: inline-block;
	padding-left:1rem;
}	
	
.standby .month {
	display: inline-block;
	font-size:10rem;
	font-weight:bold;
}	

	
.standby .date {
	display: inline-block;
	font-size:10rem;
	font-weight:bold;
	padding-left:1.5rem;
}	
	
.standby .week p {
	display: inline-block;
	color:#000;
	font-size:2.5rem;
	padding:0.5rem 0.7rem;
	font-weight:bold;
}
	
	
	
	
	
	
}


@media (max-width: 1400px) {
	
/* ---------- main ---------- *
	
.standby .year {
	display: inline-block;
	padding-top:1.5rem;
	font-size:3.5rem;
	font-weight:bold;
}	
	
.standby .month {
	display: inline-block;
	font-size:9rem;
	font-weight:bold;
}	
	
.standby .month span {
	font-size:3.5rem;
	color:#000;
}
	
.standby .date {
	display: inline-block;
	font-size:9rem;
	font-weight:bold;
	padding-left:1.5rem;
}	
	
.standby .date span {
	font-size:3.5rem;
	color:#000;
}	

.standby .week p {
	display: inline-block;
	color:#000;
	font-size:2rem;
	padding:0.5rem 0.5rem;
	font-weight:bold;
}
	
.standby .time {
	padding-top: 0rem;
    font-size: 3.5rem;
    font-weight: bold;
}

.standby .period {
	padding-top: 0rem;
    font-size: 3.5rem;
    font-weight: bold;
}

.standby button {
	margin-top: 2rem;
	font-size: 3rem;
	padding:1rem 2rem;
	color:#fff;
	background-color: #51bc48;
}
	
	
.contents .box {
	background-color: #fff;
    background-clip: border-box;
    border: 0.0625rem solid rgba(231,234,243,.7);
    border-radius: 0.75rem;
	width:220px;
	box-shadow: 0 0 0.875rem 0 rgb(41 48 66 / 5%);
	padding:2.5rem 0;
	height:220px;
	margin:.5rem;
	text-align: center;
	display: inline-block;
}
	
.contents .box2 {
	background-color: #fff;
    background-clip: border-box;
    border: 0.0625rem solid rgba(231,234,243,.7);
    border-radius: 0.75rem;
	width:250px;
	box-shadow: 0 0 0.875rem 0 rgb(41 48 66 / 5%);
	padding:2.5rem 0;
	margin:.5rem;
	text-align: center;
}

.contents .box2 .name {
    display: inline-block;
    padding-top: 1rem;
    font-size: 1.2rem;
    color: #000;
    text-decoration: none;
}
	
	

}



@media (max-width: 1200px) {
	
		

}


@media (min-width: 992px) and (max-width: 1199.98px) {


/* ---------- main ---------- *
	
.standby .title_red {
	font-size:3rem;
	font-weight:bold;
	background-color: #d61213;
	color:#fff;
	padding-top:2rem;
	padding-bottom:2rem;
}
	
.standby .title_blue span,
.standby .title_red span {
	font-size:1.5rem;
}	
	
.standby .title_blue {
	font-size:3rem;
	font-weight:bold;
	background-color: #0085fe;
	color:#fff;
	padding-top:2rem;
	padding-bottom:2rem;
}
	
.standby .year {
	display: inline-block;
	padding-top:2rem;
	font-size:3rem;
	font-weight:bold;
}		
	
.standby .year span {
	font-size:2rem;
}	

.standby .week p {
	display: inline-block;
	color:#000;
	font-size:1.5rem;
	padding:0.5rem 0.5rem;
	font-weight:bold;
}	
	
.standby .month {
	display: inline-block;
	font-size:8rem;
	font-weight:bold;
}		
	
.standby .date {
	display: inline-block;
	font-size:8rem;
	font-weight:bold;
	padding-left:1.5rem;
}	
	
.standby .month span {
	font-size:3rem;
	color:#000;
}	
	
.standby .date span {
	font-size:3rem;
	color:#000;
}		
	
.standby .time {
	padding-top: 3rem;
    font-size: 2.5rem;
    font-weight: bold;
}

.standby .period {
	padding-top: 3rem;
    font-size: 2.5rem;
    font-weight: bold;
}

.standby button {
	margin-top: 2rem;
	font-size: 2.5rem;
	padding:1rem 2rem;
	color:#fff;
	background-color: #51bc48;
}
	
	
	
	
	
	
	
}

@media (min-width: 768px) and (max-width: 991.98px) {

/* ---------- main ---------- *
	
.standby .title_red {
	font-size:2.5rem;
	font-weight:bold;
	background-color: #d61213;
	color:#fff;
	padding-top:2rem;
	padding-bottom:2rem;
}
	
.standby .title_blue span,
.standby .title_red span {
	font-size:1.5rem;
}	
	
.standby .title_blue {
	font-size:2.5rem;
	font-weight:bold;
	background-color: #0085fe;
	color:#fff;
	padding-top:2rem;
	padding-bottom:2rem;
}
	
.standby .year {
	display: inline-block;
	padding-top:3rem;
	font-size:2.5rem;
	font-weight:bold;
}		
	
.standby .year span {
	font-size:1.5rem;
}	

.standby .week p {
	display: inline-block;
	color:#000;
	font-size:1.5rem;
	padding:0.5rem 0.2rem;
	font-weight:bold;
}	
	
.standby .month {
	display: inline-block;
	font-size:6rem;
	font-weight:bold;
}		
	
.standby .date {
	display: inline-block;
	font-size:6rem;
	font-weight:bold;
	padding-left:1.5rem;
}	
	
.standby .month span {
	font-size:2.5rem;
	color:#000;
}	
	
.standby .date span {
	font-size:2.5rem;
	color:#000;
}		
	
.standby .time {
	padding-top: 3rem;
    font-size: 2rem;
    font-weight: bold;
}

.standby .time span {
	color:#2e69eb;
	font-size: 4rem;
}

.standby .period {
	padding-top: 3rem;
    font-size: 2rem;
    font-weight: bold;
}

.standby .period span {
	color:#d61213;
	font-size: 4rem;
}	

.standby button {
	margin-top: 2rem;
	font-size: 2rem;
	padding:1rem 2rem;
	color:#fff;
	background-color: #51bc48;
}
	
.standby .week {
	display: inline-block;
	padding-left:0.5rem;
}		

.standby button svg {
	margin-top:-10px;
}	
	
.contents .box {
	background-color: #fff;
    background-clip: border-box;
    border: 0.0625rem solid rgba(231,234,243,.7);
    border-radius: 0.75rem;
	width:220px;
	box-shadow: 0 0 0.875rem 0 rgb(41 48 66 / 5%);
	padding:2.5rem 0;
	height:220px;
	margin:.5rem;
	text-align: center;
    display: inline-block;
}	
	
	
.contents .box2 {
	background-color: #fff;
    background-clip: border-box;
    border: 0.0625rem solid rgba(231,234,243,.7);
    border-radius: 0.75rem;
	width:250px;
	box-shadow: 0 0 0.875rem 0 rgb(41 48 66 / 5%);
	padding:2.5rem 0;
	margin:.5rem;
	text-align: center;
}	

.contents .box2 .name {
    display: inline-block;
    padding-top: 1rem;
    font-size: 1.2rem;
    color: #000;
    text-decoration: none;
}
	
	
	
}



@media (min-width: 576px) and (max-width: 767px) { 
	
	

	
}



@media (max-width: 575.98px) {
	
	
}



@media (max-width: 320px) {
	
	

	
	
}
*/