/* container */
#container { flex:1; background-color:#f5f5f7; padding:10rem 0 14rem; } 
#modal #container{background: #0000003d;height: 100%;padding: 17rem 0 14rem;}
#modal .inner { max-width: 70.0rem;}
#container .inner > h3.tit:first-child { margin-top:0; } 
h3.mat0 { margin-top:0!important; } 
h3.mab50 { margin-bottom:5rem!important; } 
h3.tit { font-size:3.5rem; font-weight:800; text-align:center; margin: 10rem 0 6rem; } 
h3.tit .label { display:flex; gap:0 3.2rem; width:fit-content; font-size:1.8rem; font-weight:500; border-radius:50rem; background-color:rgba(0,0,0,.05); padding:2.2rem 5rem; margin:4rem auto 0; } 
.py60 { padding-top:6rem !important; padding-bottom:6rem !important; } 

/* btn */
.btn_base { display:inline-flex; align-items:center; justify-content:center; gap:.8rem; border-radius:1rem; padding:0 2rem; } 
.btn_base.xlg { width:100%; height:6rem; } 
.btn_base.lg { width:24.5rem; height:6rem; } 
.btn_base.md { width:13.2rem; height:6rem; } 
.btn_text { display:inline-flex; align-items:center; justify-content:center; gap:.8rem; font-size:1.6rem; } 
.btn_flex { display:flex; align-items:center; justify-content:center; gap:1.2rem 4.8rem; } 

/* tx */
.tx_list { display:flex; flex-direction:column; color:#696969; gap:1rem 0; } 
.tx_list > li { display:inline-flex; gap:.5rem 1rem; } 
.tx_list > li i { flex-shrink:0; } 
.tx_list > li.dot { position:relative; width:fit-content; padding-left:1rem; } 
.tx_list > li.dot::before { position:absolute; top:1rem; left:0; content:''; display:block; width:.3rem; height:.3rem; border-radius:50rem; background-color:#696969;; } 
.tx_list.tx_box { width: 100%; border-radius:1.5rem; background-color:#ebecf1; padding:2.6rem 6rem; margin-bottom: 3.5rem; } 
.tx_list.tx_box > li { justify-content:center; font-size:1.7rem; } 

/* table_list */
.table_list { width:100%; text-align:center; } 
.table_list thead { border-radius:1.5rem; background-color:#6e6e6e; } 
.table_list thead tr th { color:#fff; padding:2.2rem 1rem; } 
.table_list thead tr th:first-child { border-radius:1.5rem 0 0 1.5rem; } 
.table_list thead tr th:last-child { border-radius:0 1.5rem 1.5rem 0; } 
.table_list tbody tr { border-bottom:.1rem solid #d8d8d8; } 
.table_list tbody tr td {padding: 1.8rem 1rem;} 
.table_list tbody tr td > a { text-decoration:underline; } 
.table_list tbody tr td > span { display:block; width:100%; max-width:15rem; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; } 
.table_list tbody tr td .state {display:inline-flex;align-items:center;justify-content:center;width:100%;max-width:15rem;height:4.6rem;border-radius: 13rem;background-color:#f4f4f4;padding: 0 2rem;} 

/* file_list */
.file_list { display:flex; flex-direction:column; gap:1.5rem 0; } 
.file_list li { display:inline-flex; align-items:center; justify-content:space-between; gap:1rem; width:100%; min-width:0; height:6.8rem; border:.1rem solid #cbcbcb; border-radius:50rem; padding:0 3rem; } 
.file_list li .file { display:inline-flex; width:calc(100% - 4rem); } 
.file_list li .name { position:relative; max-width:calc(100% - 6rem); white-space:nowrap; text-overflow:ellipsis; overflow:hidden; padding-left:3rem; } 
.file_list li .name::before { position:absolute; top:.2rem; left:0; content:''; display:block; width:1.9rem; height:1.9rem; background:url(/html/images/sinmungo/common/sp_layout.png) no-repeat -44.7rem -2.8rem; } 
.file_list li .btn_icon { flex-shrink:0; } 
.file_list li .ico_close_sm { width:3.7rem; height:3.8rem; border-radius:50rem; background-color:#f0f0f0; } 

/* state_list */
.state_list { display:flex; gap:2.4rem; } 
.state_list > li { position:relative; display:inline-flex; flex-direction:column; align-items:center; justify-content:center; width:calc(25% - 1.8rem); min-height:30.8rem; text-align:center; word-break:keep-all; border:.5rem solid #efefef; border-radius:2.5rem; background-color:#fbfbfb; padding:2rem; } 
.state_list > li .tit { font-size:1.8rem; font-weight:700; color:#5b5b5b; margin-top:2rem; } 
.state_list > li .sub { color:#888; margin-top:1rem; } 
.state_list > li::after { position:absolute; top:50%; right:-1.6rem; transform:translate(50%, -50%); content:''; display:block; width:5.8rem; height:5.8rem; border-radius:50rem; background:#fff url(/html/images/sinmungo/common/sp_layout.png) no-repeat -39.8rem -5.3rem; box-shadow:0 0 .6rem rgba(0,0,0,.25); z-index:1; } 
.state_list > li:last-child:after { display:none; } 
.state_list > li.on { border-color:#1652e9; } 
.state_list > li.on .tit { color:#1652e9; } 
.state_list > li.on::after { border-color:#1652e9; background-color:#1652e9; background-position-x:-43.6rem; } 

/* pagination */
.pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:0 2rem; margin-top:10rem; } 
.pagination a { display:inline-flex; align-items:center; justify-content:center; width:4.3rem; height:4.3rem; font-size:1.5rem; font-weight:600; color:#828282; border-radius:1rem; } 
.pagination a.btn_text { border:.3rem solid #f4f4f4; } 
.pagination .page_link { display:flex; align-items:center; justify-content:center; gap:.8rem; } 
.pagination .page_link a { background-color:rgba(237,237,237,.6); } 
.pagination .page_link a.on { color:#fff; background-color:#1652e9; } 

/* card */
.card { border:.5rem solid #f6f6f6; border-radius:2.5rem; background-color:#fff; padding:3.4rem 2.4rem; } 
.card_body { padding:1rem 2rem; } 
.card_body .tx_list li { margin-top:.5rem; } 

/* write */
form fieldset { display:flex; flex-direction:column; gap: 4rem 0; min-width:0; } 
form fieldset.mat50{margin-top:5rem;}
.title_box .title { display:flex; flex-wrap:wrap; gap:1rem 2rem; font-size:1.8rem; border-radius:1.5rem;; background-color:#f9f9f9; padding:2.2rem 2.5rem; } 
.title_box .title b { flex-shrink:0; } 
.title_box .title.tx_blue { border:.1rem solid #1652e9; background-color:#f7faff; } 
.title_box .title .ico_chk_white { width:2.3rem; height:2.3rem; border-radius:50rem; background-color:#1652e9; vertical-align:middle; margin:-.2rem 1rem 0 0; } 
.write_box .w_tit { margin-bottom:2rem; } 
.write_box .w_tit .label_base span { display:block; font-size:1.8rem; font-weight:500; color:#696969; margin-top:1.2rem; } 
.write_box.col2 { display:flex; gap:0 10rem; } 
.write_box.col2 > div { width:calc(50% - 5rem); } 
.write_box.col3 { display:flex; gap:3rem; } 
.write_box.col3 > div { width:calc(33.33% - 2rem); } 

/* white_cnt */
.white_cnt { border-radius:3.5rem; background-color:#fff; padding:6rem; } 
.white_cnt.tp1 { padding:10rem 6rem 8rem; } 
.white_cnt.tp2 { padding:8rem; } 
.white_cnt.tp3 {padding: 6rem 0rem 7rem;} 

/* login */
.login_area { display:flex; align-items:center; justify-content:space-between; gap:6rem; padding:0 6rem; transition:padding .2s; } 
.login_area .l_area { display:inline-flex; flex-direction:column; align-items:center; width:calc(100% - 60rem); } 
.login_area .r_area { flex-shrink:0; width:60rem; } 
.login_list { display:flex; flex-direction:column; gap:3.6rem; } 
.login_list li .label_base { display:inline-flex; align-items:center; width:100%; } 
.login_list li .label_base a { margin-left:auto; } 
.login_list li .input_base { margin-top:1rem; } 

/* list */
.search_box {display: flex;gap: 1rem;justify-content: center;margin-bottom: 7rem;} 
.search_box input {display: flex;padding: 1rem;border: 1px solid #cecece;border-radius: 1rem;} 
.search_box .search_btn {display: flex;min-width: 6.6rem;padding: 1rem 0;background-color: #444444;color: #fff;font-weight: 800;border-radius: 1rem;font-size: 1.5rem;justify-content: center;align-items: center;}
.search_box .search_reset_btn{display: flex;min-width: 6.6rem;padding: 1rem 0;background-color: #7b7b7b;color: #fff;font-weight: 800;border-radius: 1rem;font-size: 1.5rem;justify-content: center;align-items: center;}
.cate_box { display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; margin-bottom: 4rem; } 
#category { display: inline-flex; gap: 1.5rem; } 
#category li { display: inline-flex; padding: 1rem 1.5rem 1rem 2rem; border-radius: 9rem; background-color: #f4f4f4; align-items: center; gap: 1rem; }
#category li.on{background-color: #fff;border: 2px solid #e2e2e2;}
#category li.bl span{background-color: #2196F3;}
#category li.rd span{background-color: #E91E63;}
#category li.gr span{background-color: #4caf50;}
#category li.gy span{background-color: #8451bd;}
#category li.bk span{background-color: #000;}
#category li span { display: inline-flex; width: 4rem; height: 3rem; border-radius: 50rem; background-color: #666666; color: #fff; align-items: center; justify-content: center; font-size: 1.4rem; } 
.btn_box {display: flex;} 
.btn_box a { padding: 1.2rem 2rem; color: #1652e9; border: 1px solid #1652e9; font-weight: 700; border-radius: .8rem; } 
.btn_box a:hover{color: #fff; background-color: #1652e9;border: 1px solid #1652e9; } 

#report_nosecret { display:none; } 

@media screen and (max-width:1560px){
 .login_area { padding:0; } 
 .white_cnt.tp3 {padding: 5rem 5rem 6rem;} 
 }

@media screen and (max-width:1200px){
 .cate_box {display: flex;flex-direction: column;gap: 4rem;}
 .search_box {margin: 3rem 0;} 
.search_box input {width: 50%;height: fit-content;padding: 1rem;border-radius: 1rem;} 
.search_box .search_btn {min-width: 5.6rem;padding: 0.5rem 0;} 
#category {display: inline-flex;gap: 1.5rem;flex-wrap: wrap;justify-content: center;} 
#category li {display: inline-flex;padding: 1rem 1.5rem 1rem 2rem;border-radius: 9rem;background-color: #f4f4f4;align-items: center;gap: 1rem;} 
 .btn_box a {padding: 1.2rem 2rem;color: #1652e9;border: 1px solid #1652e9;font-weight: 700;border-radius: .8rem;} 
 }

@media screen and (max-width:1280px){
 .table_list tbody tr td { padding:3rem .5rem; } 

 .white_cnt.tp2 { padding:8rem 6rem; } 
 
 .login_area { flex-direction:column; } 
 .login_area .l_area { width:100%; } 
 
 }

@media screen and (max-width:1024px){
 #container {padding: 6rem 0 10rem;} 
 h3.tit {font-size:3rem;margin: 6rem 0 4rem;} 
 h3.tit .label { padding:1.8rem 4rem; margin-top:2rem; } 
 .py60 { padding-top:4rem !important; padding-bottom:4rem !important; } 

 .btn_base.xlg { height:4.8rem; } 
 .btn_base.lg { height:4.8rem; } 
 .btn_base.md { height:4.8rem; } 
 
 .tx_list.tx_box { align-items:flex-start; } 
 .tx_list.tx_box > li { text-align:left; word-break:keep-all; } 

 .table_list { display:block; border-top:.1rem solid #d8d8d8; } 
 .table_list thead { display:none; } 
.table_list tbody { display:flex; flex-direction:column; } 
.table_list tbody tr { display:flex; flex-wrap:wrap; gap:1rem 0; padding:2.5rem 0; } 
.table_list tbody tr td { display:inline-flex; flex-wrap:wrap; gap:.2rem; width:100%; height:auto; position:relative; font-size:1.6rem; text-align:left; padding:0 0 0 11rem; } 
.table_list tbody tr td::before { position:absolute; top:0; left:0; content:attr(aria-label); display:block; width:11rem; font-weight:700; text-align:left; } 
 .table_list tbody tr td > span { max-width:100%; } 
 .table_list tbody tr td .state { width:auto; height:auto; background-color:transparent; padding:0; } 

 .state_list { flex-direction:column; } 
 .state_list > li { width:100%; min-height:26.8rem; } 
 .state_list > li::after { top:initial; right:initial; bottom:-1.6rem; left:50%; transform:translate(-50%, 50%) rotate(90deg); } 
 
 .card_body { padding:1rem; } 

 .white_cnt { padding:4rem; } 

 form,
 form fieldset { gap: 3rem 0; } 
 .title_box .title { font-size:1.7rem; padding:1.6rem 2rem; } 
 .write_box.col2 { flex-direction:column; gap:6rem 0; } 
 .write_box.col2 > div { width:100%; } 
 .write_box.col3 { gap:2rem; } 
 .write_box.col3 > div { width:calc(50% - 1rem); } 
 .write_box .w_tit { margin-bottom:1.2rem; } 
 .write_box .w_tit .label_base span { font-size:1.6rem; } 
 }

/*findpw*/
.findpw .login_area h2 { font-size: 3.0rem; font-weight: 600;}
.findpw .white_cnt.tp1 { padding:6rem ;}
.findpw .login_area { flex-direction:column;}
.findpw .login_area .r_area { width: 100%; }
.findpw .login_area .r_area li.btn { display: flex; gap:0 1.4rem; }
.findpw .login_area .r_area li .btn_base { width: 50%;}

@media screen and (max-width:854px){
 .login_area .r_area { width:100%; } 
 }

@media screen and (max-width: 768px){
 .btn_flex { flex-direction:column; } 
 .pagination { gap:1rem .8rem; margin-top:5rem; } 
 .pagination .btn_text { order:2; } 
 .pagination .page_link { order:1; width:100%; } 
 .tx_list.tx_box { padding:3rem; } 
 form,
 form fieldset { gap: 2rem 0; } 
 .write_box.col2 { gap:4rem 0; } 
 .write_box.col3 { flex-direction:column; gap:6rem 0; } 
 .write_box.col3 > div { width:100%; } 
 .white_cnt { padding:3rem; } 
 .white_cnt.tp1, .findpw .white_cnt.tp1 { padding:8rem 3rem 6rem; } 
 .white_cnt.tp2 { padding:3rem; } 
 .white_cnt.tp3 {padding: 4rem;} 
 }