@charset "utf-8";
*{ margin: 0; padding: 0; list-style: none; box-sizing: border-box; font-family: "NanumSquareNeo", 맑은 고딕, 微软雅黑, sans-serif; font-weight: 300; letter-spacing: 0; color: #000; -webkit-text-size-adjust: none; word-break: keep-all;}
a{ text-decoration: none !important;}
img{ border: 0;}
select::-ms-expand{ display: none;}
html{ overflow: hidden; height: 1920px;}
body{ position:absolute; top:0; left:0; bottom:0; right:0; }


.container{ display: flex; flex-direction: column; align-items: center; position: relative; margin: 0 auto; padding: 130px 0 0 0; width: 1080px; height: 1920px; background: url(/images/bg.jpg) center/cover;}


.title{ margin: 130px 0 0 0; text-align: center; line-height: 55px; font-size: 40px; font-weight: 400; color: #000;}
.title span{ font-weight: 400; color: #2e3192;}


.search_voice{ margin: 130px 0 0 0;}
.search_voice .tit{ text-align: center; line-height: 55px; font-size: 40px; font-weight: 400; color: #000;}
.search_voice .btn{ display: flex; justify-content: center; align-items: center; margin: 50px auto 0 auto; height: 200px;}
.search_voice .btn .row{ display: flex; justify-content: center; align-items: center; position: relative; width: 200px; height: 200px; border-radius: 100px; background: #2e3192; transition: all .3s;}
.search_voice .btn .row img{ display: block; height: 100px; transition: all .3s;}
.search_voice .btn .row p{ position: absolute; margin: 0 0 0 30px; width: 230px; text-align: right; line-height: 40px; font-size: 36px; font-weight: 400; color: #FFF; opacity: 0; transition: all .3s;}
.search_voice .btn.on .row{ width: 400px; height: 100px;}
.search_voice .btn.on .row img{ margin: 0 230px 0 0; height: 40px; animation: svbi 1s infinite;}
.search_voice .btn.on .row p{ opacity: 1; animation: svbp .8s infinite;}
@keyframes svbi{
    0%   { opacity: 1;}
    50%  { opacity: .5;}
    100% { opacity: 1;}
}
@keyframes svbp{
    0%   { opacity: 1;}
    50%  { opacity: .5;}
    100% { opacity: 1;}
}

.timeleft{ position:relative; top:20px; display:none; }
.timeleft span{ position:absolute; text-indent:-30px; font-size: 75px; font-weight:bold; color:#2e3192; pointer-events:none; }

.keypad{ position:fixed; height:960px; left:0px; bottom:0px; right:0px; z-index:99999; display:none; max-width:1080px; margin:auto; background:#2f2f2f3d;}

.replace_search{ position:relative; width:100%; }
.replace_search span{ position:absolute; left:100px; top: 50px; font-size:36px; }

.search_enter .subtooltip{ font-size:24px; padding:10px; color:red; display:none; }

.user_list{ position: relative; margin: 130px 0 0 0; padding: 0 50px 0 0; width: 900px;}
.user_list:before{ content: ""; display: block; position: absolute; top: 55px; right: -10px; width: 30px; height: 35px; background: url(/images/icon_up.png) no-repeat;}
.user_list:after{ content: ""; display: block; position: absolute; bottom: -55px; right: -10px; width: 30px; height: 35px; background: url(/images/icon_down.png) no-repeat;}

.user_list .head{ display: flex; align-items: center; height: 100px; border-top: 1px solid rgba(0 0 0/30%); border-bottom: 2px solid #2e3192;}
.user_list .head p{ text-align: center; font-size: 24px; font-weight: 400; color: #000;}
.user_list .head p:nth-child(1){ width: 14%;}
.user_list .head p:nth-child(2){ width: 14%;}
.user_list .head p:nth-child(3){ width: 14%;}
.user_list .head p:nth-child(4){ width: 16%;}
.user_list .head p:nth-child(5){ width: 20%;}
.user_list .head p:nth-child(6){ width: 190px;}
.user_list .body{ overflow-y: scroll; position: relative; margin: 0 -50px 0 0; padding: 0 50px 0 0; max-height: 800px;}

.user_list .body::-webkit-scrollbar{ width: 10px;}
.user_list .body::-webkit-scrollbar-track{ border-radius: 10px; background: rgba(0 0 0/10%);}
.user_list .body::-webkit-scrollbar-thumb{ border-radius: 10px; background: #2e3192;}
.user_list .body::-webkit-scrollbar-thumb:hover{ background: #5c5fb5;}

.user_list .body table{ border-collapse: collapse; border-spacing: 0; width: 100%;}
.user_list .body table tbody{}
.user_list .body table tbody tr{ height: 100px; border-bottom: 1px solid rgba(0 0 0/30%);}
.user_list .body table tbody tr td{}
.user_list .body table tbody tr td p{ text-align: center; line-height: 1.4; font-size: 22px; color: #000;}
.user_list .body table tbody tr td p.name{ font-weight: 400; color: #2e3192;}
.user_list .body table tbody tr td a{ display: flex; justify-content: center; align-items: center; margin: 0 auto; width: 100px; height: 60px; border-radius: 40px; background: #2e3192; font-size: 22px; color: #FFF;}
.user_list .body table tbody tr td:nth-child(1){ width: 14%;}
.user_list .body table tbody tr td:nth-child(2){ width: 14%;}
.user_list .body table tbody tr td:nth-child(3){ width: 14%;}
.user_list .body table tbody tr td:nth-child(4){ width: 16%;}
.user_list .body table tbody tr td:nth-child(5){ width: 20%;}
.user_list .body table tbody tr td:nth-child(6){ width: 190px;}

.user_list.detail{ margin: 50px 0 0 0; padding: 0;}
.user_list.detail:before{ display: none;}
.user_list.detail:after{ display: none;}
.user_list.detail .head p:nth-child(1){ width: 15%;}
.user_list.detail .head p:nth-child(2){ width: 15%;}
.user_list.detail .head p:nth-child(3){ width: 15%;}
.user_list.detail .head p:nth-child(4){ width: 25%;}
.user_list.detail .head p:nth-child(5){ width: 30%;}
.user_list.detail .body table tbody tr td:nth-child(1){ width: 15%;}
.user_list.detail .body table tbody tr td:nth-child(2){ width: 15%;}
.user_list.detail .body table tbody tr td:nth-child(3){ width: 15%;}
.user_list.detail .body table tbody tr td:nth-child(4){ width: 25%;}
.user_list.detail .body table tbody tr td:nth-child(5){ width: 30%;}


.user_detail{ display: flex; justify-content: center; align-items: center; margin: 50px 0 0 0; width: 900px; height: 800px; border-radius: 40px; border: 1px solid rgba(0 0 0/30%); background: #FFF;}
.user_detail img{ display: block; max-width: 99%; max-height: 99%;}


.basic_btn{ display: flex; justify-content: center; align-items: center; margin: 80px auto 0 auto; width: 400px; height: 80px; border-radius: 40px; background: #2e3192; font-size: 26px; font-weight: 400; color: #FFF;}

.btn_box{ display:flex; justify-content:center; align-items:center; margin: 80px auto 0 auto; gap:20px; }
.custom_btn{ width: 200px; height: 80px; text-align:center; line-height:80px; vertical-align:middle; border-radius: 40px; background: #2e3192; font-size: 26px; font-weight: 400; color: #FFF; }
.gray_btn{ background:gray; }

.search_enter{ margin: 130px 0 0 0;}
.search_enter .tit{ text-align: center; line-height: 55px; font-size: 40px; font-weight: 400; color: #000;}
.search_enter .enter{ display: flex; margin: 50px auto 0 auto; width: 700px;}
.search_enter .enter .in{ position: relative; width: 100%;}
.search_enter .enter .in .close{ display: flex; justify-content: center; align-items: center; position: absolute; z-index: 10; top: 15px; right: 15px; width: 50px; height: 50px; border-radius: 50%; background: #F00; cursor: pointer;}
.search_enter .enter .in .close img{ display: block; width: 20px;}
.search_enter .enter .in input{ display: flex; align-items: center; margin: 0; padding: 0 40px; width: 100%; height: 80px; border-radius: 50px; border: 1px solid rgba(0 0 0/30%); background: #FFF; font-size: 24px; font-weight: 300; color: #000; outline: none; -webkit-appearance: none;}
.search_enter .enter .btn{ flex: 0 0 160px; display: flex; justify-content: center; align-items: center; margin: 0 0 0 10px; width: 160px; height: 80px; border-radius: 50px; background: #2e3192;}
.search_enter .enter .btn p{ font-size: 26px; font-weight: 400; color: #FFF;}


.notice{ margin: 130px 0 0 0; padding: 50px 60px; width: 900px; border-radius: 40px; border: 1px solid rgba(0 0 0/30%); background: rgba(255 255 255/70%);}
.notice .head{ display: flex; justify-content: space-between; align-items: center;}
.notice .head .tit{ font-size: 40px; font-weight: 400; color: #000;}
.popup_notice .row > .tit{ font-size: 40px; font-weight: 400; color: #000; padding:30px 0px; border-bottom:3px solid #333333;}
.notice .head .more{ display: flex; align-items: center; padding: 0 30px; height: 60px; border-radius: 30px; background: #2e3192; font-size: 24px; font-weight: 400; color: #FFF;}
.notice .list{ margin: 30px 0 0 0;}
.notice .list ul{}
.notice .list ul li{}
.notice .list ul li a{ display: flex; align-items: center;}
.notice .list ul li a .tit{ width: 100%; line-height: 50px; font-size: 24px; color: #000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;}
.notice .list ul li a .date{ flex: 0 0 200px; text-align: right; line-height: 50px; font-size: 24px; color: #666;}


.popup_notice{ overflow: hidden; display: flex; justify-content: center; align-items: center; position: absolute; z-index: 100; top: 100%; right: 0; bottom: -100%; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); opacity: 0; transition: opacity .3s;}
.popup_notice .row{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-40%); padding: 30px 70px 0 70px; width: 900px; height: 1500px; border-radius: 40px; background: #FFF; opacity: 0; transition: all .5s;}
.popup_notice .row .list{}
.popup_notice .row .list ul{}
.popup_notice .row .list ul li{ border-bottom: 1px solid #DDD;}
.popup_notice .row .list ul li a{ display: block; padding: 40px 0;}
.popup_notice .row .list ul li a .ft{ display: flex; justify-content: space-between; align-items: center;}
.popup_notice .row .list ul li a .ft p{ font-size: 24px; color: #333;}
.popup_notice .row .list ul li a .ft p:first-child{ font-weight: 500; color: #2e3192;}
.popup_notice .row .list ul li a .tit{ margin: 30px 0 0 0; line-height: 45px; font-size: 32px; font-weight: 400; color: #000; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.popup_notice .row .page{ margin: 60px 0 0 0;}
.popup_notice .row .page ul{ display: flex; justify-content: center; align-items: center;}
.popup_notice .row .page ul li{ margin: 0 5px;}
.popup_notice .row .page ul li p{ display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; border-radius: 20px; border: 1px solid #DDD; font-size: 20px; color: #999;}
.popup_notice .row .page ul li p.on{ border: 2px solid #2e3192; color: #2e3192;}
.popup_notice .row .page ul li span{ display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; cursor: pointer;}
.popup_notice .row .page ul li span img{ display: block; width: auto; height: 30px;}
.popup_notice .row .btn{ display: flex; justify-content: center; align-items: center; position: absolute; bottom: 80px; left: 50%; margin: 0 0 0 -200px; width: 400px; height: 80px; border-radius: 40px; background: #2e3192; font-size: 26px; font-weight: 400; color: #FFF;}
.popup_notice .row .close{ display: flex; justify-content: center; align-items: center; position: absolute; z-index: 10; top: -40px; right: -40px; width: 80px; height: 80px; border-radius: 50%; background: #F00; cursor: pointer;}
.popup_notice .row .close img{ display: block;}
.popup_notice.on{ top: 0; bottom: 0; opacity: 1;}
.popup_notice.on .row{ transform: translate(-50%,-50%); opacity: 1;}

.popup_printing{ overflow: hidden; display: flex; justify-content: center; align-items: center; position: absolute; z-index: 110; top: 100%; right: 0; bottom: -100%; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); opacity: 0; transition: opacity .3s;}
.popup_printing .row{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-40%); padding: 0 70px 0 70px; width: 900px; height: 1500px; border-radius: 40px; background: #FFF; opacity: 0; transition: all .5s;}
.popup_printing .row .head{ padding: 70px 0 40px 0; border-bottom: 1px solid #DDD;}
.popup_printing .row .head .ft{ display: flex; justify-content: space-between; align-items: center;}
.popup_printing .row .head .ft p{ font-size: 24px; color: #333;}
.popup_printing .row .head .ft p:first-child{ font-weight: 500; color: #2e3192;}
.popup_printing .row .head .tit{ margin: 30px 0 0 0; line-height: 45px; font-size: 32px; font-weight: 400; color: #000;}
.popup_printing .row .body{ overflow-y: scroll; margin: 0 -40px 0 0; padding: 50px 30px 50px 0; max-height: 980px;}
.popup_printing .row .body *{ line-height: 1.8; font-size: 26px; color: #000;}

.popup_printing .row h1{ text-align:center; width:100%; font-size:72px; margin-top:50%; }
.popup_printing .row h2{ text-align:center; width:100%; font-size:64px; margin-top:50px; }

.popup_printing .row .body::-webkit-scrollbar{ width: 10px;}
.popup_printing .row .body::-webkit-scrollbar-track{ border-radius: 10px; background: #f0f0f0;}
.popup_printing .row .body::-webkit-scrollbar-thumb{ border-radius: 10px; background: #2e3192;}
.popup_printing .row .body::-webkit-scrollbar-thumb:hover{ background: #5c5fb5;}

.popup_printing .row .btn{ display: flex; justify-content: center; align-items: center; position: absolute; bottom: 80px; left: 50%; margin: 0 0 0 -200px; width: 400px; height: 80px; border-radius: 40px; background: #2e3192; font-size: 26px; font-weight: 400; color: #FFF;}
.popup_printing .row .close{ display: flex; justify-content: center; align-items: center; position: absolute; z-index: 10; top: -40px; right: -40px; width: 80px; height: 80px; border-radius: 50%; background: #F00; cursor: pointer;}
.popup_printing .row .close img{ display: block;}
.popup_printing.on{ top: 0; bottom: 0; opacity: 1;}
.popup_printing.on .row{ transform: translate(-50%,-50%); opacity: 1;}

.popup_notice_detail{ overflow: hidden; display: flex; justify-content: center; align-items: center; position: absolute; z-index: 110; top: 100%; right: 0; bottom: -100%; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); opacity: 0; transition: opacity .3s;}
.popup_notice_detail .row{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-40%); padding: 0 70px 0 70px; width: 900px; height: 1500px; border-radius: 40px; background: #FFF; opacity: 0; transition: all .5s;}
.popup_notice_detail .row .head{ padding: 70px 0 40px 0; border-bottom: 1px solid #DDD;}
.popup_notice_detail .row .head .ft{ display: flex; justify-content: space-between; align-items: center;}
.popup_notice_detail .row .head .ft p{ font-size: 24px; color: #333;}
.popup_notice_detail .row .head .ft p:first-child{ font-weight: 500; color: #2e3192;}
.popup_notice_detail .row .head .tit{ margin: 30px 0 0 0; line-height: 45px; font-size: 32px; font-weight: 400; color: #000;}
.popup_notice_detail .row .body{ overflow-y: scroll; margin: 0 -40px 0 0; padding: 50px 30px 50px 0; max-height: 980px;}
.popup_notice_detail .row .body *{ line-height: 1.8; font-size: 26px; color: #000;}

.popup_notice_detail .row .body::-webkit-scrollbar{ width: 10px;}
.popup_notice_detail .row .body::-webkit-scrollbar-track{ border-radius: 10px; background: #f0f0f0;}
.popup_notice_detail .row .body::-webkit-scrollbar-thumb{ border-radius: 10px; background: #2e3192;}
.popup_notice_detail .row .body::-webkit-scrollbar-thumb:hover{ background: #5c5fb5;}


.popup_notice_detail .row .btn{ display: flex; justify-content: center; align-items: center; position: absolute; bottom: 80px; left: 50%; margin: 0 0 0 -200px; width: 400px; height: 80px; border-radius: 40px; background: #2e3192; font-size: 26px; font-weight: 400; color: #FFF;}
.popup_notice_detail .row .close{ display: flex; justify-content: center; align-items: center; position: absolute; z-index: 10; top: -40px; right: -40px; width: 80px; height: 80px; border-radius: 50%; background: #F00; cursor: pointer;}
.popup_notice_detail .row .close img{ display: block;}
.popup_notice_detail.on{ top: 0; bottom: 0; opacity: 1;}
.popup_notice_detail.on .row{ transform: translate(-50%,-50%); opacity: 1;}


.popup_check{ overflow: hidden; display: flex; justify-content: center; align-items: center; position: absolute; z-index: 120; top: 100%; right: 0; bottom: -100%; left: 0; background: rgba(0 0 0/70%); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); opacity: 0; transition: opacity .3s;}
.popup_check .row{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-40%); padding: 70px; width: 600px; border-radius: 40px; background: #FFF; opacity: 0; transition: all .5s;}
.popup_check .row .tit{ text-align: center; font-size: 46px; font-weight: 500; color: #2e3192;}
.popup_check .row .btn{ display: flex; justify-content: center; align-items: center; margin: 70px -10px 0 -10px;}
.popup_check .row .btn a{ display: flex; justify-content: center; align-items: center; margin: 0 10px; width: 100%; height: 80px; border-radius: 40px; font-size: 26px; font-weight: 400; color: #FFF;}
.popup_check .row .btn a:first-child{ background: #999999;}
.popup_check .row .btn a:last-child{ background: #2e3192;}
.popup_check .row .close{ display: flex; justify-content: center; align-items: center; position: absolute; z-index: 10; top: -40px; right: -40px; width: 80px; height: 80px; border-radius: 50%; background: #F00; cursor: pointer;}
.popup_check .row .close img{ display: block;}
.popup_check.on{ top: 0; bottom: 0; opacity: 1;}
.popup_check.on .row{ transform: translate(-50%,-50%); opacity: 1;}






























