
/* ======================================================
   login
========================================================= */
#login_wrap { overflow: hidden; position: relative; width: 100%; height: 100vh; min-height: 100%; margin: 0 auto; background: #fff;}

.login_cont { display: flex; flex-direction: column; align-items: center; padding-top: 150px; margin: 0 auto; }

.login_area { position: relative; width: 450px; text-align: center;}
.login_area img { width: 70%;}
.login_area .tit { text-align: center;}
.login_area .tit h1 { color: #7712f3; font-size: 26px; font-weight: 700; text-align: center;}
.login_area .tit h2 { font-size: 16px; font-weight: 400; }
.login_area .tit h3 { font-size: 22px; }

.login_area .check_list { padding: 40px; padding-top: 30px;}
.login_area .check_list .pw_input { margin-top: 10px;}
.login_area .check_list .txt { font-size: 15px; text-align: left;}

.login_area .check_list input { width: 100%; height: 42px; padding-left: 20px; }
.login_area .check_list input::placeholder { color: #818181; font-size: 14px; }

.login_area .check_list .id_chk { margin-top: 7px; text-align: left;}
.login_area .check_list .id_chk label { font-size: 14px; font-weight: 500; line-height: 2; padding-left: 25px; }

.login_area .check_list .login_btn { display: block; width: 100%; height: 45px; margin-top: 20px; border-radius: 3px; background: #7712f3; color: #fff; font-weight: 500; font-size: 16px; text-align: center; line-height: 45px; text-decoration: none;}
.login_area .check_list .login_option { margin-top: 10px; text-align: center;}
.login_area .check_list .login_option a { font-size: 14px; }
.login_area .check_list .login_option a.inquiry { position: relative; margin-left: 20px;}
.login_area .check_list .login_option a.inquiry::before { content: ""; position: absolute; top: 2px; left: -10px; width: 1px; height: 12px; background: #9d9d9d;}

.login_cont .mention p { font-size: 13px; text-align: left;}




/* ======================================================
   임시 비밀번호 발급
========================================================= */
.temporary_pw { position: relative; width: 450px; text-align: center;}

.temporary_pw .tit { margin-top: 20px; font-size: 16px;}

.temporary_pw .input_area { padding: 40px;}
.temporary_pw .input_area .txt { font-size: 15px; text-align: left;}
.temporary_pw .input_area input { width: 100%; height: 42px; padding-left: 20px; }
.temporary_pw .input_area .btn { display: block; width: 100%; height: 45px; margin-top: 20px; border-radius: 3px; background: #7712f3; color: #fff; font-weight: 500; font-size: 16px; text-align: center; line-height: 45px; text-decoration: none;}













/* ======================================================
   공통
========================================================= */
#wrap { width: 1320px; margin: 0 auto;}
.container { position: relative; min-height: 700px; padding: 50px 0 20px 0;}
.container.ver2 { padding-top: 30px;}

/* 버튼 */
.btn_area { display: flex; justify-content: flex-end; gap: 7px; margin-bottom: 15px;}
.btn_area_reg { display: flex; gap: 7px; margin-bottom: 15px;}
.foot_btn { display: flex; justify-content: center; gap: 20px; padding-top: 15px; }
.base { display: flex; justify-content: center; align-items: center; padding: 10px 18px; border: 1px solid #ccc; border-radius: 4px; background: #fff; color: #333; font-size: 15px; font-weight: 400; line-height: 1;}
.base2 { display: flex; justify-content: center; align-items: center; padding: 10px 8px; border: 1px solid #ccc; border-radius: 4px; background: #fff; color: #333; font-size: 15px; font-weight: 400; line-height: 1;}
.pd515 { padding: 5px 15px; font-size: 13px;}
.purple { border: 1px solid #dcc0ff; background: #f6f0ff;}
.purple2 { border-color: #c495ff; background: #c495ff; color: #fff;}
.purple2:hover { border-color: #7712f3; background: #7712f3; }
.purple3 { border: 1px solid #c495ff; background: #fff; color: #b77dff;}
.purple3:hover { border-color: #7712f3; color: #7712f3;}
.grbg { height: 38px; padding: 0 25px; border: none; border-radius: 4px; background: #999; color: #fff;}
.grbg2 { height: 38px; padding: 0 25px; border: none; border-radius: 4px; background: #686868; color: #fff;}
.reset { display: block; width: 20px; height: 20px; margin-right: 7px; background: url(../img/reset_icon.png) no-repeat; background-size: 100%;}


/* input */
.greybg { border-color: #b9b9b9; background: #f5f5f5;}
.greybg2 { border-color: #b9b9b9; background: #EAEAEA;}



.pagination { display: flex; justify-content: center; align-items: center; margin: 20px 0;}
.pagination .prev { display: block; width: 7px; height: 13px; margin-right: 7px; background: url(../img/ico-paging-prev.png) no-repeat; background-size: 100%;}
.pagination .next { display: block; width: 7px; height: 13px; margin-left: 15px; background: url(../img/ico-paging-next.png) no-repeat; background-size: 100%;}
.pagination .paging { display: flex; gap: 10px;}
.pagination .paging a { display: block; color: #919191; font-size: 14px; font-weight: 400;}
.pagination .paging a.on { width: 18px; height: 18px; border-radius: 100px; background: #ececec; color: #222; text-align: center;}

.pop_btn { display: flex; justify-content: center; gap: 7px; margin-top: 20px;}





/* 스크롤바 */

/* 스크롤바 전체 영역 */
::-webkit-scrollbar {
   width: 8px;  /* 세로축 스크롤바 폭 너비 */
   height: 20px;  /* 가로축 스크롤바 폭 너비 */
}

/* 스크롤바 막대 */
::-webkit-scrollbar-thumb {
   background: #888; /* 스크롤바 막대 색상 */
   border-radius: 20px;
}

::-webkit-scrollbar-thumb:hover {
	background-color:#a0a0a5;
}

/* 스크롤이 움직이는 뒷 배경 */
::-webkit-scrollbar-track {
	background: #ddd; /* 스크롤바 뒷 배경 색상 */
}









/* ======================================================
   프로젝트 리스트
========================================================= */
.project_list { margin-bottom: 60px;}

.project_list .search_area { display: flex; justify-content: center; gap: 50px; padding: 20px; border-radius: 10px; background: #f5f5f5; } /* justify-content: center; */
.project_list .search_area .box { display: flex; align-items: center; gap: 10px; }
.project_list .search_area .box .txt { font-size: 16px;}
.project_list .search_area .box select { width: 160px; padding: 5px 40px 5px 10px; background: #fff;}
.project_list .search_area .box .input_box { display: flex; gap: 5px;}
.project_list .search_area .box .input_box .sch_btn { height: 38px; }
.project_list .search_area { }
.project_list .search_area .search_box { display:flex; height: 38px;}
.project_list .search_area .sch_input { padding: 5px 40px 5px 10px;}
.project_list .search_area .sch_icon { position: relative; }
.project_list .search_area .sch_icon::after { content: ""; position: absolute; top: 8px; right: 15px; width: 20px; height: 20px; background: url(../img/search02.svg) no-repeat;}

.project_list .tbl_area { margin-top: 20px;}
.project_list .tbl_area .tbl { border-top: 2px solid #333;}
.project_list .tbl_area .tbl th { padding: 20px 0; border-bottom: 1px solid #333; color: #222; font-size: 16px; font-weight: 500;}
.project_list .tbl_area .tbl td { padding: 12px 0; border-bottom: 1px solid #c0c0c0; color: #2f2f2f; font-size: 15px; font-weight: 400; text-align: center;}
/*.project_list .tbl_area .tbl td a { display: inline-flex; justify-content: center; align-items: center; padding: 6px 14px; border-radius: 4px; border: 1px solid #c495ff; background: #fff; color: #b67bff; font-weight: 500; font-size: 13px; line-height: 1;}*/
.project_list .tbl_area .tbl tr:last-child td { border-bottom: 1px solid #333; } 
.project_list .tbl_area .tbl td .aclass { display: inline-flex; justify-content: center; align-items: center; padding: 6px 14px; border-radius: 4px; border: 1px solid #c495ff; background: #fff; color: #b67bff; font-weight: 500; font-size: 13px; line-height: 1;}




/* 고객사 */
.project_list .search_area2 { display: flex; justify-content: space-between; align-items: center; padding: 20px; margin: auto; border-radius: 10px; background: #f5f5f5;}
.project_list .search_area3_adm { display: flex; justify-content: space-between; align-items: center; margin: auto;}
.project_list .search_area3_adm .left { display: flex; align-items: center; gap: 20px;}
.project_list .search_area3_adm .left h2 { margin-right: 20px; color: #7712f3; font-size: 18px; font-weight: 700;}
.project_list .search_area3_adm .left h3 { color: #000; font-size: 18px;}

.project_list .search_area3_cln { display: flex; justify-content: space-between; align-items: center; margin: auto; padding-bottom: 20px;}
.project_list .search_area3_cln .left { display: flex; align-items: center; gap: 20px;}
.project_list .search_area3_cln .left h2 { margin-right: 20px; color: #7712f3; font-size: 18px; font-weight: 700;}
.project_list .search_area3_cln .left h3 { color: #000; font-size: 18px;}



.project_list .search_area2 h2 { font-size: 17px; font-weight: 500;}

.project_list .search_area2 .box { display: flex; align-items: center; gap: 15px;}
.project_list .search_area2 .box .txt { font-size: 16px;}
.project_list .search_area2 .box .sch_btn { height: 40px; }
.project_list .search_area2 .box .search_box { position: relative;}
.project_list .search_area2 .box .sch_input { padding: 5px 40px 5px 10px; }
.project_list .search_area2 .box .sch_icon { position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; background: url(../img/search02.svg) center no-repeat; }
.project_list .search_area2 .box a.userid { height: 38px; }

.foot { margin-top: 15px;  }
.foot span  { color:darkred; font-size: 13px; }

.ci_logo {
	width: 150px;
}

/* ======================================================
   프로젝트 등록
========================================================= */
.btn_area a.prList {
	border-color: #7712f3;
	color: #7712f3;
}


.register_project { position: relative; width: 100%; }
.register_project .prbox { display: flex; gap: 10px; width: 100%;}
.column { padding: 30px; border: 1px solid #e2e2e2; border-radius: 9px; background: #fff;}
.column.left { width: 60%; }
.column.right { width: 40%; background: #f8f8f8;}


input[type="date"] { height: 38px; padding: 0 10px; color: #222; font-size: 14px; font-weight: 400;}
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="date"]::-webkit-inner-spin-button { display: none; appearance: none;}
input[type="date"]::-webkit-calendar-picker-indicator {  display: block; width: 18px; height: 18px; border-width: thin; background: url(../img/calendar_icon.png) no-repeat; background-size: 100%; color: rgba(0, 0, 0, 0); opacity: 1; cursor: pointer;}





.register_project .left .tbl th { width: 15%; font-size: 15px; font-weight: 400; text-align: left;}
.register_project .left .tbl td { width: 85%; height: 50px; font-size: 14px; text-align: left;}
.register_project .left .tbl .td2col { width: 30%; }
.register_project .left .tbl .td3col { width: 20%; }

.register_project .left .date_area { display: flex; justify-content: flex-start; align-items: center; gap: 5px;}

.register_project .left .customer_area { display: flex; justify-content: flex-start; align-items: center; gap: 5px;}
.register_project .left .customer_area input.cs01 { width: 20%; }
.register_project .left .customer_area input.cs02 { width: 40%; }
.register_project .left .customer_area .sch_btn { height: 38px; }

.register_project .left .customer_area .scl { overflow-y: scroll; height: 260px;}
.register_project .left .customer_area .scl .tbl3 td { height: 45px; border-bottom: 1px solid rgba(97, 102, 118, .2); }
.register_project .left .customer_area .scl .tbl3 td:first-child { width: 60%;}
.register_project .left .customer_area .scl .tbl3 td:last-child { padding-left: 30px; width: 40%;}
.register_project .left .customer_area .scl .tbl3 .pwreset { display: inline-flex; justify-content: center; align-items: center; padding: 6px 10px; border-radius: 4px; background: #e6e6e6; color: #333; font-size: 13px; font-weight: 400; line-height: 1;}

.register_project .left .customer_area .list li + li { margin-top: 15px;}
.register_project .left .customer_area .list li .txt { font-size: 15px;}
.register_project .left .customer_area .btn { display: flex; justify-content: center; gap: 10px; margin-top: 30px;}
.register_project .left .customer_area .btn a { width: 100px; }


.register_project .left .customer_area .tbl2 th { width: 50%; padding-bottom: 20px;}
.register_project .left .customer_area .tbl2 td { width: 100%;}
.register_project .left .customer_area .tbl2 .input_box { display: flex; align-items: center;}
.register_project .left .customer_area .tbl2 .input_box span { width: 20%;}
.register_project .left .customer_area .tbl2 .input_box input { width: 100%;}
.register_project .left .customer_area .ment { display: block; margin-top: 10px; font-size: 13px; text-align: left;}
.register_project .left .customer_area .warn { display: block; margin-top: 10px; font-size: 13px; text-align: left; color: red;}
.register_project .warn1 { display: block; margin-top: 10px; font-size: 13px; text-align: right; color: red;}












.register_project .left select.endYN { width: 15%; }

.register_project .left .department { display: flex; justify-content: flex-start; align-items: center; gap: 15px;}
.register_project .left .department li { display: flex; align-items: center; gap: 5px; width: 100%;}
.register_project .left .department select { width: 100%; height: 38px; }

.register_project .left .quota { display: flex; justify-content: flex-start; align-items: center; }
.register_project .left .quota li:nth-child(2) { margin-left: 30px; margin-right: 10px; font-size: 15px; font-weight: 400;}
.register_project .left .quota li:nth-child(4) { margin-left: 30px; margin-right: 10px; font-size: 15px; font-weight: 400;}
.register_project .left .quota select { width: 100%; height: 38px; }

.register_project .left .option { display: flex;}
.register_project .left .option input[type="text"] { width: 80px;}
.register_project .left .option dl { display: flex; align-items: center; gap: 5px; margin-left: 15px;}
.register_project .left .option dl + dl { margin-left: 15px;}
.register_project .left .option dl dt { font-size: 15px; font-weight: 400;}

.register_project .left .option_t4 { display: flex;}
.register_project .left .option_t4 input[type="text"] { width: 80px;}
.register_project .left .option_t4 dl { display: flex; align-items: center; gap: 5px;}
.register_project .left .option_t4 dl + dl { margin-left: 15px;}
.register_project .left .option_t4 dl dt { font-size: 15px; font-weight: 400;}

.register_project .left .etc { display: flex; justify-content: flex-start; align-items: center; }
.register_project .left .etc li:nth-child(2) { margin-left: 80px; margin-right: 10px; font-size: 15px; font-weight: 400;}
.register_project .left .etc li:nth-child(4) { margin-left: 30px; margin-right: 10px; font-size: 15px; font-weight: 400;}
.register_project .left .etc select { width: 100%; height: 38px; }

.register_project .foot_btn { display: flex; justify-content: center; gap: 7px; margin-top: 15px; }


.register_project .right .select_area { display: flex; align-items: center; gap: 10px;}
.register_project .right .select_area p { font-size: 15px; font-weight: 400;}

.register_project .right .result_area { padding: 20px; margin-top: 10px; border: 1px solid #ececec; border-radius: 4px; background: #fff;}

.register_project .right .tbl { width: 100%;}
.register_project .right .tbl th { width: 25%; font-size: 15px; font-weight: 400; text-align: left;}
.register_project .right .tbl td { width: 80%; height: 50px; font-size: 14px; text-align: left;}
.register_project .right .tbl .txtQus { width: 45%; margin-left: 12px;}

.register_project .right .tbl .select_area { display: flex; align-items: center; gap: 5px;}
.register_project .right .tbl .select_area .sbtn { display: inline-flex; justify-content: center; align-items: center; width: 100%; height: 38px; border-radius: 4px; background: #999; color: #fff; font-size: 14px;}












 /* ======================================================
   문항 정보 수정
========================================================= */

.modify_question select { height: 36px; }
.modify_question input[type="text"] { height: 36px; }
.modify_question .greybg { border-color: #b9b9b9; background: #f5f5f5;}


.modify_question .tit { display: flex; align-items: center; margin-bottom: 20px;}
.modify_question .tit .pm { color: #555; line-height: 1;}
.modify_question .tit h1 { position: relative; padding-left: 20px; color: #000; font-size: 18px; font-weight: 600;}
.modify_question .tit h1::before { content: ""; position: absolute; left: 10px; top: 6px; width: 1px; height: 12px; background: #ccc;} 

.modify_question .box { display: flex; align-items: flex-start; gap: 10px; width: 100%; }
.modify_question .box .top { display: flex; align-items: flex-end; align-items: center; height: 40px; margin-bottom: 10px;}
.modify_question .box .top p { font-size: 16px;} 
.modify_question .box .scroll { overflow-y: auto; height: 565px;}
.modify_question .box .grlist { display: flex; flex-direction: column; gap: 5px; margin-top: 10px; }
.modify_question .box .grlist li + li { margin-top: 10px;}
.modify_question .box .grlist li { padding: 10px; border: 1px solid rgb(224, 224, 224); border-radius: 5px; font-size: 14px; font-weight: 400;}
.modify_question .box .grlist li .bn .toptit { display: flex; gap: 10px; margin-bottom: 5px;}
.modify_question .box .grlist li .bn .QN { overflow: hidden; text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 2; -webkit-box-orient: vertical;}


.modify_question .box .cleft { width: 50%; padding: 20px 30px; border: 1px solid #e2e2e2; border-radius: 9px; }
.modify_question .box .cleft .tbl { border-top: 1px solid #333;}
.modify_question .box .cleft .tbl th, .modify_question .box .cleft .tbl td { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; text-align: center;}
.modify_question .box .cleft .tbl th:last-child, .modify_question .box .cleft .tbl td:last-child { border-right: 0 none;}
.modify_question .box .cleft .tbl th { height: 35px; padding: 3px 13px; background: #f5f5f5; font-size: 14px; }
.modify_question .box .cleft .tbl th:first-child { width: 15%;}
.modify_question .box .cleft .tbl th:nth-child(2) { width: 42.5%;}
.modify_question .box .cleft .tbl th:last-child { width: 42.5%;}
.modify_question .box .cleft .tbl td { padding: 5px 0; background: #fff; font-size: 14px; }

.modify_question .box .cleft .tbl .line2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-height: 2.8em; padding: 0px 5px 0px 5px; }

.modify_question .box .cleft .foot { display: flex; justify-content: space-between; margin: 15px 0; }
.modify_question .box .cleft .foot .left { display: flex; justify-content: flex-start; gap: 10px;}
.modify_question .box .cleft .foot .left a { padding: 5px 10px 5px 30px; border-radius: 4px; color: #333; font-size: 13px;}
.modify_question .box .cleft .foot .left a.up { background: #f5f5f5 url(../img/arrow_up_icon.png) center left 10px no-repeat;}
.modify_question .box .cleft .foot .left a.dw { background: #f5f5f5 url(../img/arrow_dw_icon.png) center left 10px no-repeat;}


.modify_question .box .cright { width: 100%; padding: 20px 30px; border: 1px solid #e2e2e2; border-radius: 9px; background: #fff;}
.modify_question .box .cright .top { display: flex; justify-content: space-between;}
.modify_question .box .cright .top .tbtn { display: flex; justify-content: flex-end; gap: 10px;}

.modify_question .box .cright .info_area { width: 100%; }
.modify_question .box .cright .info_area ul { border-top: 1px solid #333;}
.modify_question .box .cright .info_area ul li { display: flex; justify-content: flex-start; gap: 20px; padding: 15px 0; border-bottom: 1px solid #ddd;}
.modify_question .box .cright .info_area ul li dl { display: flex; align-items: center; gap: 5px;}
.modify_question .box .cright .info_area ul li dl dt { display: block; width: 65px;  font-size: 14px;}

.modify_question .box .cright .rbtn { display: flex; justify-content: flex-end; gap: 7px; margin-top: 10px;}

.modify_question .box .cright .fbtn { display: flex; justify-content: center; gap: 7px; margin-top: 20px; margin-bottom: 10px;}



.modify_question .box .cleft .tbl td .hovered { background: lightblue; }
.modify_question .box .cleft .tbl td .clicked { background: lightgreen; }



/* popup 폴더 공통 */ 
.fpopup_proj_body_style {  position: absolute;  z-index: 10000;  background:#fff; box-shadow: 6px 6px 30px rgba(0, 0, 0, .2);} 
/*.fpopup_proj_body_style {  position: absolute;  z-index: 10000;  border: 2px solid #e1e1e1; border-radius: 8px; background:#fff; box-shadow: 6px 6px 30px rgba(0, 0, 0, .2);} */
.fpopup { position: fixed;}
.fpopup.ver6 { width: 600px; margin-left: -10px; }
.fpopup.ver7 { width: 700px; margin-left: -10px; }
.fpopup.ver8 { width: 800px; margin-left: -10px; }
.fpopup.ver1100 { width: 1100px; margin-left: -10px; }
.fpopup a.close { display: block; position: absolute; right: 15px; top: 15px; width: 12px; height: 12px; background: url("../img/icon_x.png") no-repeat center; background-size: 100%;}

.fpop_cont { padding: 30px;} 
.fpop_cont .fptbl_top { width: calc(100% - 14px); border-top: 1px solid #d8dee8;}
.fpop_cont .fptbl_top th { height: 34px; border-bottom: 1px solid #f2f2f2; background: #f9fafb; font-size: 14px;} 

.fptbl td { padding: 0 3px; border-bottom: 1px solid #f2f2f2;   font-size: 14px; text-align: center; height: 30px;}
 
.fpop_cont .fptbl tr:hover { background: #FDF6F6; }
.fpop_cont .fptbl tr.active { background: #FDF6F6; }
 

.fpop_cont .pbtn { display: flex; justify-content: center; gap: 5px; margin-top: 15px;}
.fpop_cont .pbtn a { display: flex; justify-content: center; align-items: center; width: 120px; height: 30px; border-radius: 3px; background: #555; color: #fff; font-size: 13px; font-weight: 300; line-height: 1;}
.fpop_cont .pbtn a:last-child { background: #999;}

.fpop_cont .select { display: flex; justify-content: center; gap: 20px; padding-bottom: 20px; }
.fpop_cont .select .area { display: flex; align-items: center; gap: 5px;}
.fpop_cont .select .area p { font-size: 14px;}







/* ======================================================
   프로젝트 담당자 등록
========================================================= */
.register_manager { position: relative; width: 650px; margin: auto;}
.register_manager h4 { padding: 20px 0; font-size: 24px; text-align: center;}
.register_manager .top { display: flex; justify-content: space-between; align-items: center; padding: 30px; border-radius: 8px; background: #f6f0ff;}
.register_manager .top .pr_name li { color: #000; font-size: 18px;}
.register_manager .top .pr_name li:first-child { margin-bottom: 10px; font-weight: 600;}
.register_manager .top .pr_name li a { text-decoration: underline;}
.register_manager .top .btn { }
.register_manager .top .btn a { width: 100px; padding: 10px 0; }

.register_manager .tbl_area { overflow-y: scroll; height: 650px; margin-top: 20px;}
.register_manager .tbl_area .tbl { border-top: 2px solid #333;}
.register_manager .tbl_area .tbl th { padding: 15px 0; border-bottom: 1px solid #333; color: #222; font-size: 16px; font-weight: 500;}
.register_manager .tbl_area .tbl th:first-child { width: 20%;}
.register_manager .tbl_area .tbl th:nth-child(2) { width: 30%;}
.register_manager .tbl_area .tbl th:last-child { width: 50%;}
.register_manager .tbl_area .tbl td { padding: 10px 0; border-bottom: 1px solid #c0c0c0; color: #2f2f2f; font-size: 15px; font-weight: 400; text-align: center;}
.register_manager .tbl_area .tbl td a { display: inline-flex; justify-content: center; align-items: center; padding: 3px 10px; border-radius: 7px; background: #f6f0ff; color: #2f2f2f; font-size: 14px; }
.register_manager .tbl_area .tbl tr:last-child td { border-bottom: 1px solid #333; }
.register_manager .tbl_area .tbl td input.name { width: 50%;}
.register_manager .tbl_area .tbl td input.email { width: 80%;}














/* ======================================================
   리코드 변수 생성
========================================================= */
.bgr { background: #f5f5f5;}
.fMQ_bg { background: #f5f5f5;}
.fMQ_rc { padding: 30px; border-radius: 10px; background: #fff;}
.fMQ_rc .tit { position: relative;}
.fMQ_rc .tit .btn { display: flex; gap: 10px; position: absolute; right: 10px; bottom: 0;}
.fMQ_rc .tit h2 { font-size: 18px;}

.fMQ_rc .box { display: flex; gap: 10px; margin-top: 10px;}
.fMQ_rc .box .variable { width: calc((100% - 20px) / 2); padding: 20px 30px; border: 1px solid #e2e2e2; border-radius: 9px;}

.fMQ_rc .box .variable .selec_tbl tr:first-child th { font-weight: 700;}
.fMQ_rc .box .variable .selec_tbl th { width: 20%; height: 35px; padding-left: 20px;  font-size: 14px; font-weight: 400; text-align: left;}
.fMQ_rc .box .variable .selec_tbl td { width: 80%; height: 35px; padding-right: 20px;  font-size: 13px;}
.fMQ_rc .box .variable .selec_tbl select { width: 100%; height: 30px; background: #fff url(../img/select_icon.png) no-repeat center right 10px; font-size: 13px;}
.fMQ_rc .box .variable .selec_tbl select.bggr { background: #f5f5f5 url(../img/select_icon.png) no-repeat center right 10px; }
.fMQ_rc .box .variable .selec_tbl input[type="text"] { height: 28px; font-size: 13px;}
.fMQ_rc .box .variable .selec_tbl .flex { display: flex; align-items: center; }
.fMQ_rc .box .variable .selec_tbl .flex li:nth-child(2) { padding-left: 40px; font-weight: 400; }
.fMQ_rc .box .variable .selec_tbl .flex li:last-child { padding-left: 20px;}

.fMQ_rc .box .variable.new .selec_tbl .btn { display: flex; justify-content: flex-end; gap: 10px;}
.fMQ_rc .box .variable.new .selec_tbl .type { display: flex; align-items: center; gap: 10px;}
.fMQ_rc .box .variable.new .selec_tbl .type li { display: flex; align-items: center;}
.fMQ_rc .box .variable.new .selec_tbl .type input[type="radio"] + label { font-size: 13px; line-height: 1;}


.fMQ_rc .box .variable .view.ver0 { position: relative; margin-top: 60px;}
.fMQ_rc .box .variable .view.ver1 { position: relative; margin-top: 25px;}
.fMQ_rc .box .variable .view.ver2 { margin-top: 60px;}
.fMQ_rc .box .variable .view.ver3 { position: relative; margin-top: 60px;}
.fMQ_rc .box .variable .view .top { display: flex; justify-content: space-between; align-items: center; padding-bottom: 5px;}
.fMQ_rc .box .variable .view .top .min_max { display: flex; gap: 10px;}
.fMQ_rc .box .variable .view .top .min_max .apply { height: 25px; border-radius: 2px; font-size: 13px;}
.fMQ_rc .box .variable .view .top .min_max ul { display: flex; align-items: center; gap: 10px;}
.fMQ_rc .box .variable .view .top .min_max ul li { font-size: 13px;}
.fMQ_rc .box .variable .view .top .min_max ul li input { width: 50px;height: 25px; border-radius: 2px; font-size: 13px;}
.fMQ_rc .box .variable .view .top .btn2 { padding-right: 8px; }
.fMQ_rc .box .variable .view .top .btn2 a { padding: 7px 18px; font-size: 14px}

.fMQ_rc .box .variable .view .btn { display: flex; gap: 10px; position: absolute; right: 8px; top: -35px; }
.fMQ_rc .box .variable .view .btn a { padding: 7px 18px; font-size: 14px;}
.fMQ_rc .box .variable .view .btn3 { display: flex; gap: 10px; position: absolute; right: 8px; top: -35px; }
.fMQ_rc .box .variable .view .btn3 a { padding: 7px 18px; font-size: 14px;}
.fMQ_rc .box .variable .view .tbl_top { width: calc(100% - 8px); border-top: 2px solid #333;}
.fMQ_rc .box .variable .view .tbl_top th { padding: 12px 0; border-left: 1px solid #dfdfdf; border-bottom: 1px solid #4b4e53; color: #222; font-size: 14px; font-weight: 500;}
.fMQ_rc .box .variable .view .tbl_top th:first-child { width: 10%; border-left: 0;}
.fMQ_rc .box .variable .view .tbl_top th:nth-child(2) { width: 70%;}
.fMQ_rc .box .variable .view .tbl_top th:nth-child(3) { width: 7%;}
.fMQ_rc .box .variable .view .tbl_top th:last-child { width: 13%; border-right: 0;}
.fMQ_rc .box .variable .view .tbl { border-bottom: 1px solid #4b4e53;}
.fMQ_rc .box .variable .view .tbl td { padding: 5px; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; font-size: 14px; font-weight: 400; text-align: center;}
.fMQ_rc .box .variable .view .tbl td:first-child { width: 10%; border-left: 0;}
.fMQ_rc .box .variable .view .tbl td:nth-child(2) { width: 70%; padding-left: 10px; text-align: left;}
.fMQ_rc .box .variable .view .tbl td:nth-child(3) { width: 7%;}
.fMQ_rc .box .variable .view .tbl td:last-child { width: 13%; border-right: 0;}
.fMQ_rc .box .variable .view .tbl input[type="text"] { width: 100%; height: 25px; border-radius: 2px;} 

.fMQ_rc .box .variable .view .tbl_top.sty2 th:first-child { width: 20%;}
.fMQ_rc .box .variable .view .tbl_top.sty2 th:nth-child(2) { width: 60%;}
.fMQ_rc .box .variable .view .tbl_top.sty2 th:last-child { width: 20%;}
.fMQ_rc .box .variable .view .tbl.sty2 td:first-child { width: 20%;}
.fMQ_rc .box .variable .view .tbl.sty2 td:nth-child(2) { width: 60%;}
.fMQ_rc .box .variable .view .tbl.sty2 td:last-child { width: 20%;}


.fMQ_rc .box .variable .view .tbl_top.sty3 th:first-child { width: 20%;}
.fMQ_rc .box .variable .view .tbl_top.sty3 th:nth-child(2) { width: 35%;}
.fMQ_rc .box .variable .view .tbl_top.sty3 th:nth-child(3) { width: 35%;}
.fMQ_rc .box .variable .view .tbl_top.sty3 th:last-child { width: 45%;}
.fMQ_rc .box .variable .view .tbl.sty3 td:first-child { width: 20%;}
.fMQ_rc .box .variable .view .tbl.sty3 td:nth-child(2) { width: 35%;}
.fMQ_rc .box .variable .view .tbl.sty3 td:nth-child(3) { width: 35%;}
.fMQ_rc .box .variable .view .tbl.sty3 td:last-child { width: 45%;}
.fMQ_rc .box .variable .view .tbl.sty3 .range { display: flex; align-items: center; justify-content: center; gap: 5px;}
.fMQ_rc .box .variable .view .tbl.sty3 .range li:first-child { width: 60px;  }
.fMQ_rc .box .variable .view .tbl.sty3 .range input[type="text"] { width: 60px; color: #555; font-size: 13px; font-weight: 400; text-align: center;} 


.fMQ_rc .box .variable .scl { overflow-y: scroll; height: 250px;}






/* ======================================================
   설문 일괄 설정
========================================================= */

.batch { position: relative; width: 100%; padding: 30px; padding-top: 50px; border-radius: 10px; background: #fff;}
.batch .tit h2 { font-size: 18px;}

.batch .btn { display: flex; gap: 10px; position: absolute; right: 40px; top: 40px;}

.batch .tbl_area {  margin-top: 10px; border-top: 2px solid #333; }

.batch .tbl_area ul { display: flex; justify-content: space-between; align-items: center; }
.batch .tbl_area li { padding: 15px 0; font-size: 14px; font-weight: 500; text-align: center;}
.batch .tbl_area li select { width: 100%; height: 27px;}

.batch .tbl_area .fix { width: calc(100% - 8px);}
.batch .tbl_area .fix li:first-child { width: 5%;}
.batch .tbl_area .fix li:nth-child(2) { width: 13%;}
.batch .tbl_area .fix li:nth-child(3) { width: 50%;}
.batch .tbl_area .fix li:nth-child(4) { width: 20%; }
.batch .tbl_area .fix li:nth-child(5) { width: 7%;}
.batch .tbl_area .fix li:last-child { width: 5%;}

.batch .tbl_area .scroll { overflow-y: auto; height: 500px; border-top: 1px solid #333;}
.batch .tbl_area .scroll ul { border-bottom: 1px solid #ddd;}
.batch .tbl_area .scroll li { padding: 5px 5px; }
.batch .tbl_area .scroll li:first-child { width: 5%;}
.batch .tbl_area .scroll li:nth-child(2) { width: 13%; }
.batch .tbl_area .scroll li:nth-child(3) { width: 50%; text-align: left; }
.batch .tbl_area .scroll li:nth-child(4) { width: 20%; }
.batch .tbl_area .scroll li:nth-child(5) { width: 7%;}
.batch .tbl_area .scroll li:last-child { width: 5%;}

.batch .tbl_area .fix2 { width: calc(100% - 8px);}
.batch .tbl_area .fix2 li:first-child { width: 10%;}
.batch .tbl_area .fix2 li:nth-child(2) { width: 50%;}
.batch .tbl_area .fix2 li:nth-child(3) { width: 10%; }
.batch .tbl_area .fix2 li:nth-child(4) { width: 25%;}
.batch .tbl_area .fix2 li:last-child { width: 5%;}

.batch .tbl_area .scroll2 { overflow-y: auto; height: 500px; border-top: 1px solid #333;}
.batch .tbl_area .scroll2 ul { border-bottom: 1px solid #ddd;}
.batch .tbl_area .scroll2 li { padding: 5px 5px; }
.batch .tbl_area .scroll2 li:first-child { width: 10%;}
.batch .tbl_area .scroll2 li:nth-child(2) { width: 50%; text-align: left; }
.batch .tbl_area .scroll2 li:nth-child(3) { width: 10%; }
.batch .tbl_area .scroll2 li:nth-child(4) { width: 25%;}
.batch .tbl_area .scroll2 li:last-child { width: 5%;}

.two-line-ellipsis { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; }


















/* ======================================================
   팝업
========================================================= */
.layer_bg { position: fixed; /*z-index: 1;*/ left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); display: none;}
.layer_wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 850px; height: 620px; background:#fff; text-align: center; display: none;}


/* 공통 */

.pop_cont { padding: 30px;}
.pop_cont .tbl_area { width: 100%; margin-top: 10px; border-top: 2px solid #333;}

.pop_cont .pop_top { display: flex; justify-content: space-between; padding: 0 10px;}
.pop_cont .pop_top a { display: flex; justify-content: center; align-items: center; width: 80px; height: 36px; border-radius: 4px; background: #999; color: #fff; font-size: 14px; font-weight: 400; line-height: 1;}
.pop_cont .pop_top .right { display: flex; gap: 5px;}

.pop_cont .tit h3 { font-size: 16px; text-align: left;}

.pop_cont .tbl_area ul { display: flex; justify-content: space-between; align-items: center; }
.pop_cont .tbl_area ul li { padding: 6px 0; font-size: 14px; text-align: center;}
.pop_cont .tbl_area ul li input { width: 100%; height: 30px;}

.pop_cont .tbl_area .fix { }
.pop_cont .tbl_area .fix ul { padding: 8px 0; }
.pop_cont .tbl_area .scroll { border-top: 1px solid #333;}
.pop_cont .tbl_area .scroll ul { border-top: 1px solid #c0c0c0;}
.pop_cont .tbl_area .scroll ul:first-child { border-top: none;}
.pop_cont .tbl_area .scroll ul:last-child { border-bottom: 1px solid #333;}
.pop_cont .tbl_area .scroll ul li { font-weight: 400;}

.pop_cont .tbl_area .scroll2 { border-top: 1px solid #333;}
.pop_cont .tbl_area .scroll2 ul { border-top: 1px solid #c0c0c0;}
.pop_cont .tbl_area .scroll2 ul:first-child { border-top: none;}
.pop_cont .tbl_area .scroll2 ul:last-child { border-bottom: 1px solid #333;}
.pop_cont .tbl_area .scroll2 ul li { font-weight: 400;}


/* 프로젝트 리스트 -  고객사 찾기 */
.layer_wrap.size7 { z-index: 100; top: 50%; width: 380px; height: 560px; }

.size7 .pop_cont .pop_top { align-items: center; justify-content: flex-end; gap: 5px; padding: 0; }
.size7 .pop_cont .pop_top p {font-size: 15px; }
.size7 .pop_cont .pop_top input { height: 36px;}
.size7 .pop_cont .pop_top a { font-size: 14px; font-weight: 400;}

.size7 .pop_cont .tbl_area { margin-top: 10px;}
.size7 .pop_cont .tbl_area ul li:first-child { width: 30%;}
.size7 .pop_cont .tbl_area ul li:nth-child(2) { width: 30%; }
.size7 .pop_cont .tbl_area ul li:nth-child(3) { width: 40%; }

.size7 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 315px; }





/* 소스 경로 - 설문 검색 */
.size0 .pop_cont .pop_top { padding: 0;}
.size0 .pop_cont .pop_top a { height: 38px;}

.size0 .pop_cont .tbl_area ul li:first-child { width: 5%;}
.size0 .pop_cont .tbl_area ul li:nth-child(2) { width: 45%; }
.size0 .pop_cont .tbl_area ul li:nth-child(3), 
.size0 .pop_cont .tbl_area ul li:nth-child(4), 
.size0 .pop_cont .tbl_area ul li:nth-child(5), 
.size0 .pop_cont .tbl_area ul li:nth-child(6), 
.size0 .pop_cont .tbl_area ul li:nth-child(7) { width: 13%;}

.size0 .pop_cont .tbl_area .fix { padding: 0; }

.size0 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 360px; padding: 0;}
.size0 .pop_cont .tbl_area .scroll ul li { padding: 8px 0;}
.size0 .pop_cont .tbl_area .scroll ul li:nth-child(2) { text-align: left;}








/* 그룹명 수정 */
.layer_wrap.size1 { top: 40%; width: 400px; height: 460px; z-index: 10000; box-shadow: rgba(0, 0, 0, 0.2) 6px 6px 30px;}

.size1 .pop_cont .tbl_area ul li { padding: 6px 10px;}
.size1 .pop_cont .tbl_area ul li:first-child { width: 20%;}
.size1 .pop_cont .tbl_area ul li:nth-child(2) { width: 80%; }

.size1 .pop_cont .tbl_area .fix ul { background: #fff;}
.size1 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 260px; }

.size1 .pop_cont .tbl_area .scroll2 { overflow-y: auto; height: 260px; }


/* 문항 그룹 일괄 설정 */
.layer_wrap.size2 { top: 40%; width: 650px; height: 460px; z-index: 10000;  box-shadow: rgba(0, 0, 0, 0.2) 6px 6px 30px;}

.size2 .pop_cont .tbl_area ul li:first-child { width: 10%;}
.size2 .pop_cont .tbl_area ul li:nth-child(2) { width: 20%; }
.size2 .pop_cont .tbl_area ul li:nth-child(3) { width: 70%; padding: 6px 5px;}
.size2 .pop_cont .tbl_area ul li:nth-child(4) { width: 25%; padding: 6px 5px;}

.size2 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 260px; }

.size2 .pop_cont .tbl_area .scroll2 { overflow-y: auto; height: 260px; }


/* 보기 카드 수정 */
.layer_wrap.size3 { top: 40%; width: 580px; height: 460px; z-index: 10000; box-shadow: rgba(0, 0, 0, 0.2) 6px 6px 30px;}

.size3 .pop_cont .tbl_area ul li:first-child { width: 10%; padding: 6px 5px;}
.size3 .pop_cont .tbl_area ul li:nth-child(2) { width: 70%; }
.size3 .pop_cont .tbl_area ul li:nth-child(3) { width: 15%; padding: 6px 5px;}

.size3 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 260px; }

.size3 .pop_cont .tbl_area .scroll2 { overflow-y: auto; height: 260px; }


/* 변수 Data 수정 */
.layer_wrap.size4 { top: 40%; width: 580px; height: 724px; z-index: 10000;  box-shadow: rgba(0, 0, 0, 0.2) 6px 6px 30px;}

.size4 .pop_cont .pop_top { align-items: flex-end; padding: 0;}
.size4 .pop_cont .pop_top .left { display: flex; align-items: center;}
.size4 .pop_cont .pop_top .left input[type="checkbox"] + label::before { top: 0; }
.size4 .pop_cont .pop_top .left input[type="checkbox"] + label { line-height: 1.5;}

.size4 .pop_cont .tbl_area { margin-top: 10px;}
.size4 .pop_cont .tbl_area ul li:first-child { width: 15%;}
.size4 .pop_cont .tbl_area ul li:nth-child(2) { width: 15%; word-break: break-all; }
.size4 .pop_cont .tbl_area ul li:nth-child(3) { width: 15%; }
.size4 .pop_cont .tbl_area ul li:nth-child(4) { width: 15%; }
.size4 .pop_cont .tbl_area ul li:nth-child(5) { width: 15%; }
.size4 .pop_cont .tbl_area ul li:nth-child(6) { width: 15%; }

.size4 .pop_cont .tbl_area .scroll ul li:nth-child(2) { text-align: center;}
.size4 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 435px; }
.size4 .pop_cont .tbl_area .scroll input { width: 80px;}

.size4 .pop_cont .tbl_area .scroll2 ul li:nth-child(2) { text-align: center;}
.size4 .pop_cont .tbl_area .scroll2 { overflow-y: auto; height: 435px; }
.size4 .pop_cont .tbl_area .scroll2 input { width: 80px;}


/* 고객사 찾기 */
.layer_wrap.size5 { top: 50%; width: 380px; height: 560px;}

.size5 .pop_cont .pop_top { align-items: center; justify-content: flex-end; gap: 15px; padding: 0; }
.size5 .pop_cont .pop_top p {font-size: 15px; }
.size5 .pop_cont .pop_top input { height: 36px;}
.size5 .pop_cont .pop_top a { font-size: 14px; font-weight: 400;}

.size5 .pop_cont .tbl_area { margin-top: 10px;}
.size5 .pop_cont .tbl_area ul li:first-child { width: 30%;}
.size5 .pop_cont .tbl_area ul li:nth-child(2) { width: 30%; }
.size5 .pop_cont .tbl_area ul li:nth-child(3) { width: 40%; }

.size5 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 315px; }



/* admin - 고객사 찾기 */
.layer_wrap.size6 { top: 40%; width: 380px; height: 560px;}

.size6 .pop_cont .pop_top { align-items: center; justify-content: flex-end; gap: 15px; padding: 0; }
.size6 .pop_cont .pop_top p {font-size: 15px; }
.size6 .pop_cont .pop_top input { height: 36px;}
.size6 .pop_cont .pop_top a { font-size: 14px;}

.size6 .pop_cont .tbl_area { margin-top: 10px;}
.size6 .pop_cont .tbl_area ul li:first-child { width: 45%;}
.size6 .pop_cont .tbl_area ul li:nth-child(2) { width: 55%; }

.size6 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 315px; }





/* admin - 사용로그 - 고객사 찾기 */
.layer_wrap.size7 { z-index: 100;top: 50%; width: 380px; height: 520px;}

.size7 .pop_cont .pop_top { align-items: center; justify-content: flex-end; gap: 15px; padding: 0; }
.size7 .pop_cont .pop_top p {font-size: 15px; }
.size7 .pop_cont .pop_top input { height: 36px;}
.size7 .pop_cont .pop_top a { font-size: 14px;}

.size7 .pop_cont .tbl_area { margin-top: 10px;}
/*.size7 .pop_cont .tbl_area ul li:first-child { width: 45%;}
.size7 .pop_cont .tbl_area ul li:nth-child(2) { width: 55%; }*/

.size7 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 315px; }



/* 고객사 관리자/ 담당자 찾기 */
.layer_wrap.size8 { top: 50%; width: 450px; height: 420px;}
.layer_wrap.size8 .tit { padding-bottom: 20px; }

.size8 .pop_cont .pop_top { align-items: center; justify-content: flex-end; gap: 15px; padding: 0; }
.size8 .pop_cont .pop_top p {font-size: 15px; }
.size8 .pop_cont .pop_top input { height: 36px;}
.size8 .pop_cont .pop_top a { font-size: 14px; font-weight: 400;}

.size8 .pop_cont .tbl_area { margin-top: 10px;}
.size8 .pop_cont .tbl_area ul li:first-child { width: 45%;}
.size8 .pop_cont .tbl_area ul li:nth-child(2) { width: 55%; }

.size8 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 315px; }




/* 신규 사용자 등록 */
.layer_wrap.size9 { top: 50%; width: 380px; height: 350px;}
.layer_wrap.size9 .tit { padding-bottom: 20px; }

.size9 .pop_cont .pop_top { align-items: center; justify-content: flex-end; gap: 15px; padding: 0; }
.size9 .pop_cont .pop_top p {font-size: 15px; }
.size9 .pop_cont .pop_top input { height: 36px;}
.size9 .pop_cont .pop_top a { font-size: 14px; font-weight: 400;}

.size9 .pop_cont .tbl_area { margin-top: 10px;}
.size9 .pop_cont .tbl_area ul li:first-child { width: 45%;}
.size9 .pop_cont .tbl_area ul li:nth-child(2) { width: 55%; }

.size9 .pop_cont .tbl_area .scroll { overflow-y: auto; height: 315px; }







/* 쿼터표 조정 */
.layer_wrap.size10 { top: 40%; width: 1300px; height: 650px;}
.layer_wrap.size10 .tit { padding-bottom: 20px; }

.size10 .pop_cont .pop_top { display: block;}
.size10 .pop_cont .pop_top h3 { font-size: 17px; text-align: center;}

.size10 .pop_cont .tbl_area2 { overflow-x: auto; display: flex; justify-content: center; margin-top: 10px; }
.size10 .pop_cont .tbl_area2 .tbl2 { table-layout : fixed; text-align: center;}
.size10 .pop_cont .tbl_area2 .tbl2 th { padding: 5px; border-top: 1px solid #333; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; background: #f1f1f1; color: #222; font-size: 14px; font-weight: 400; word-break: break-all; }
.size10 .pop_cont .tbl_area2 .tbl2 td { padding: 5px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; font-size: 14px; color: #2f2f2f; font-weight: 400; word-break: break-all;}
.size10 .pop_cont .tbl_area2 .tbl2 td:last-child { background: #f1f1f1; }
.size10 .pop_cont .tbl_area2 .tbl2 .num { display: flex; align-items: center; gap: 2px;}
.size10 .pop_cont .tbl_area2 .tbl2 .num input { width: 50px; height: auto; padding: 3px; border-radius: 0;}
.size10 .pop_cont .tbl_area2 .tbl2 .tdnum { width: 50px; height: auto; padding: 3px; border-radius: 0;}
.size10 .pop_cont .tbl_area2 .tbl2 tr:last-child td { background: #f1f1f1; }

.size10 .pop_cont .tbl_area2 .scroll { overflow: auto; width: 1250px; height: 450px;}

.size10 .pop_cont .btn { display: flex; justify-content: center; gap: 10px; margin-top: 30px;}
.size10 .pop_cont .btn a { width: 100px; }





/* 쿼터표 보기 */

.Quota { width: 100%; max-width: 1600px; margin: auto;}

.Quota .top { position: relative; }
.Quota .top h3 { font-size: 17px; text-align: center;}

.Quota .btn { position: absolute; right: 100px; }
.Quota .btn a { width: 100px; }

.Quota .tbl_area2 { overflow-x: auto; display: flex; justify-content: center; margin-top: 60px; }
.Quota .tbl_area2 .tbl2 { table-layout : fixed; text-align: center;}
.Quota .tbl_area2 .tbl2 th { padding: 5px; border-top: 1px solid #333; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc; background: #f1f1f1; color: #222; font-size: 14px; font-weight: 400;  word-break: break-all; }
.Quota .tbl_area2 .tbl2 td { padding: 5px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; font-size: 14px; color: #2f2f2f; font-weight: 400; word-break: break-all; }
.Quota .tbl_area2 .tbl2 td:last-child { background: #f1f1f1; }
.Quota .tbl_area2 .tbl2 tr:last-child td { background: #f1f1f1; }

.Quota .tbl_area2 .scroll { overflow-x: auto; width: 1140px; }















/* ======================================================
   어드민  공통
========================================================= */

#admin_wrap { width: 100%; }


/* 상단 메뉴 */
.header { height: 80px; background: #f5f5f5;}
.header .inner { display: flex; align-items: center; width: 1320px; margin: 0 auto;}
.header .inner .logo { margin-top: 25px;}
.header nav { width: 1320px; margin: auto; padding-top: 30px;}
.header nav ul { display: flex; justify-content: flex-end; gap: 40px; padding-right: 30px;}
.header nav ul li a { color: #333; font-size: 18px; font-weight: 600;}
.header nav ul li a:hover,
.header nav ul li a.on { color: #5408b1;}


.admin_container  { position: relative; width: 1320px; min-height: 700px; padding: 40px 0 30px 0; margin: auto;}

.admin_container .cont { display: flex; gap: 20px;}
.admin_container .cont .left { width: 50%; }
.admin_container .cont .right { height: 90%; padding: 30px; margin-top: 50px; border: 1px solid #dcc0ff; border-radius: 9px; background: #fff;}
.admin_container .cont .right_cln { width: 60%; height: 100%; padding: 30px; border: 1px solid #dcc0ff; border-radius: 9px; background: #fff;}


.trhover { background: #f6f0ff; }


/* 테이블 공통 */
.admin_container .tbl_area { border-top: 2px solid #333; text-align: center;}

.admin_container .tbl_area .tbl thead th { border-bottom: 1px solid #333; width: 25%;}
.admin_container .tbl_area .tbl th { padding: 12px 0; color: #222; font-size: 16px; font-weight: 500;}
.admin_container .tbl_area .tbl td { padding: 8px 0; font-size: 14px; color: #2f2f2f; font-weight: 400;}
.admin_container .tbl_area .tbl td a { font-size: 14px; color: #555; text-decoration: underline;}
.admin_container .tbl_area .tbl tbody td { border-bottom: 1px solid #c0c0c0;}
.admin_container .tbl_area .tbl tbody tr:last-child td { border-bottom: 1px solid #333;}


/* 상단 */
.user_top { display: flex; justify-content: space-between; margin-bottom: 10px;}
.user_top .sch_area { display: flex; align-items: center; gap: 5px;}



/* input 초기화 */
input[type="checkbox"]{ display: none; }

/* (체크박스, 텍스트) 정렬 맞추기 */
.checkbox_label { display: flex; }

/* 체크박스 디자인 */
.checkbox_icon::before{ content:''; display: inline-block; position: relative; width: 16px; height: 16px; margin-right: 10px; border: 1px solid #9da3a5; border-radius: 3px; background: transparent; cursor: pointer;}

/* checked */
.checkbox_label input:checked + .checkbox_icon::before { border: 1px solid #c495ff; background: #c495ff url(../img/check_btn.png) no-repeat center; background-size: 100%; /* transition: all 0.15s ease; */ }





/* ======================================================
   사용자 정보
========================================================= */

.admin_container .tbl_area .tbl.sty1 th:first-child { width: 30%; }
.admin_container .tbl_area .tbl.sty1 th:nth-child(2) { width: 20%; }
.admin_container .tbl_area .tbl.sty1 th:nth-child(3) { width: 30%; }
.admin_container .tbl_area .tbl.sty1 th:nth-child(4) { width: 20%; }

.admin_container .add_area dl { display: flex; justify-content: flex-start; align-items: center;}
.admin_container .add_area dl + dl { margin-top: 15px;}
.admin_container .add_area dl dt { width: 17%; color: #333; font-size: 15px; font-weight: 400;}
.admin_container .add_area dl dd { display: flex; align-items: center; gap: 5px;}
.admin_container .add_area dl dd input { height: 36px;}
.admin_container .add_area dl dd select { height: 36px;}
.admin_container .add_area dl dd a.btn { height: 36px;}
.admin_container .add_area dl dd .txt { padding-left: 15px; padding-right: 10px; color: #333; font-size: 15px; font-weight: 400;}

.admin_container .add_area .fbtn { display: flex; justify-content: center; gap: 7px; margin-top: 40px; }
.admin_container .add_area .required { color: red; }

.admin_container .add_area_cln dl { display: flex; justify-content: flex-start; align-items: center;}
.admin_container .add_area_cln dl + dl { margin-top: 15px;}
.admin_container .add_area_cln dl dt { width: 20%; color: #333; font-size: 15px; font-weight: 400;}
.admin_container .add_area_cln dl dd { display: flex; align-items: center; gap: 5px;}
.admin_container .add_area_cln dl dd input { height: 36px;}
.admin_container .add_area_cln dl dd select { height: 36px;}
.admin_container .add_area_cln dl dd a.btn { height: 36px;}
.admin_container .add_area_cln dl dd .txt { padding-left: 10px; color: #333; font-size: 15px; font-weight: 400;}

.admin_container .add_area_cln .fbtn { display: flex; justify-content: center; gap: 7px; margin-top: 40px; }







/* ======================================================
   고객사 정보
========================================================= */

.admin_container .tbl_area .tbl.sty2 th:first-child { width: 15%; }
.admin_container .tbl_area .tbl.sty2 th:nth-child(2) { width: 15%; }
.admin_container .tbl_area .tbl.sty2 th:nth-child(3) { width: 35%; }






/* ======================================================
   사용 로그
========================================================= */

.user_log .user_log_top { display: flex; justify-content: center; gap: 100px; margin-bottom: 15px;}
.user_log .user_log_top .sch { display: flex; align-items: center; gap: 7px;}
.user_log .user_log_top .sch .btn { padding: 10px 35px; background: #b77dff;}



/* ======================================================
   .footer
=========================================================*/

#footer { display: flex; flex-direction: column;  width: 100%; text-align: left;}
#footer .inner { position: relative; max-width: 1220px; padding: 20px 0 10px 0; margin: 0 auto;}

#footer .inner .info { margin-top: 10px;}
#footer .inner .info ul { display: flex;}
#footer .inner .info li { position: relative; margin-right: 10px; padding-right: 20px; font-size: 14px; font-weight: 300;}
#footer .inner .info li:not(:last-child)::before { content: ''; display: block; position: absolute; right: 0; top: 50%; width: 1px; height: 12px; margin-top: -6px; background: #ccc; z-index: -10;}
#footer .inner .info li a { letter-spacing: -0.005em; text-decoration: underline;}

#footer .inner .copy { display: flex; margin-top: 5px; margin-bottom: 20px;}
#footer .inner .copy p { margin-right: 10px; font-size: 14px; font-weight: 300;}
#footer .inner .copy a { margin-right: 10px; font-size: 14px; font-weight: 300;}
#footer .inner .copy a.privacy { font-weight: 400; text-decoration: underline;}
@media only screen and (max-width:1440px){
   #footer .inner  { padding: 20px;}

   #footer .inner .info ul { flex-wrap: wrap;}
}

@media only screen and (max-width:767px){ 
   #footer { margin: 20px 0 20px 0; }
   #footer .inner { padding: 0 20px; }
   #footer .inner .ci img { width: 30%; }

   #footer .inner .info ul { flex-wrap: wrap;}
   #footer .inner .info li { margin-right: 5px; padding-right: 0; margin-top: 5px; color: #555; font-size: 12px;}
   #footer .inner .info li:not(:last-child)::before { display: none;}

   #footer .inner .copy { flex-wrap: wrap; margin-top: 10px; }
   #footer .inner .copy p { color: #555; font-size: 12px; }
   #footer .inner .copy a { color: #555; font-size: 12px; }
}
