
/*********** List *************/
.bbs_con {width:100%; border-collapse:separate; border-spacing:0;}
.bbs_con input[type="checkbox"] {width:20px; height:20px;  margin:0 12px;}
.bbs_con th {color:#1c2025; font-weight:300; background:var(--grayBg); text-align:center; padding:20px 0; border-bottom:1px solid var(--border); border-top:2px solid var(--main); border-right:1px solid var(--border);}
.bbs_con th:last-child{border-right:0}
.bbs_con td {padding:20px 10px; text-align:center; border-bottom:1px solid var(--border); border-right:1px solid var(--border);}
.bbs_con td:last-child{border-right:0}
.bbs_con td img{margin-left:5px}
.bbs_con td.left {text-align:left; padding-left:15px;}

td.state_cont {}
td.state_cont select {width:150px;}
td.state_cont a.stateBtn {display:block; width:150px; line-height:40px; color:var(--white); background:#69737c; margin:4px auto 0; text-align:center; font-size:14px; letter-spacing:-0.5pt; font-weight:500; cursor: pointer;}
td.state_cont input.stateBtn {display:block; width:150px; line-height:40px; color:var(--white); background:#69737c; margin:4px auto 0; text-align:center; font-size:14px; letter-spacing:-0.5pt; font-weight:500; border: none; cursor: pointer;}
.acceptance_number {width:100%; margin:0 0 10px;}

.bbs_con td .white_btn {width:60px; height:50px; background:#fff; color:#aaa; letter-spacing: -0.07em; border:0; cursor:pointer; margin-left:4px; border:1px solid #ddd; box-sizing:border-box; vertical-align:middle;}



.top_Excel{display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px;}
.top_Excel .btnExcel{padding: 0 10px 0 30px; height: 34px; line-height: 32px;}
.top_Excel .ment{font-size:14px; letter-spacing:var(--letter-spacing-input); color: var(--main); font-weight: 700;}
.top_Excel .ment::before{content: '\e000'; display: inline-block; vertical-align: middle; margin: -4px 5px 0 0; width: 20px; height: 20px; line-height: 20px; font-size: 20px; font-family: var(--icon); font-weight: 400; color:inherit; text-align: center;}

.t_value .select_m{max-width:140px; width: 100%;}


/*********** Input *************/
.acceptance_input {display: flex;}
.acceptance_input .white_btn {width:70px; height:50px; line-height: 48px; background:var(--white); color:var(--basic); letter-spacing: var(--letter-spacing-input); font-size:14px; border:0; cursor:pointer; margin-left:4px; border:1px solid var(--border); border-radius: var(--borderR5); box-sizing:border-box;}
.acceptance_input .input_s{max-width:300px;}


.report_input { display:flex; flex-direction:column; gap:25px; }
.report_input dl { display:flex; align-items:flex-start; gap:20px; }
.report_input dl:has(.input_l) { align-items:center; }
.report_input dl:has(.datepicker-box),
.report_input dl:has(.select-box) { align-items:center; }
.report_input dt { flex:0 0 160px; width:160px; }
.report_input dt .fs18 { font-weight:600; color:var(--black); }
.report_input dt b { color:var(--main); font-weight:600; }
.report_input dt small{display: block; }
.report_input dd { flex:1; min-width:0; }
.report_input .input { width:100%; height:50px; padding:0 20px; box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR5); background:var(--white); color:var(--black); font-size:0.889rem; line-height:175%; letter-spacing:var(--letter-spacing-input); }
.report_input .input::placeholder { color:var(--basic); opacity:0.5; }
.report_input .input.input_m { width:100%; max-width:310px; }
.report_input .datepicker-box { position:relative; width:100%; max-width:310px; }
.report_input .datepicker-box img{display: none !important;}
.report_input .datepicker-box .input { padding-right:50px; }
.report_input .datepicker-box::after { content:'\ebcc'; display:block; width:23px; height:23px; line-height:23px; font-size:23px; font-family:var(--icon); font-weight:400; color:var(--basic); opacity: 0.8; position:absolute; right:20px; top:50%; transform:translateY(-50%); pointer-events:none; }


.report_input .select-box { position:relative; width:100%; max-width:310px; }
.report_input .select-box::after { content:'\e313'; display:block; width:18px; height:18px; line-height:18px; font-size:18px; font-family:var(--icon); font-weight:400; color:var(--basic); position:absolute; right:20px; top:50%; transform:translateY(-50%); pointer-events:none; }
.report_input .select.select_m { width:100%; height:50px; padding:0 45px 0 20px; box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR5); background:var(--white); color:var(--basic); font-size:0.889rem; line-height:175%; letter-spacing:var(--letter-spacing-input); appearance:none; -webkit-appearance:none; }
.report_input .select.select_m:invalid { color:var(--basic); }


.report_input .radio-list { display:flex; gap:5px; width:100%; }
.report_input .radio-list li { flex:1; min-width:0; position:relative;}
.report_input .radio-list input[type="radio"] + label { display:flex; align-items:center; gap:10px; width:100%; height:50px; padding:0 20px; box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR5); background:var(--white); color:var(--basic); font-size:0.889rem; line-height:175%; letter-spacing:var(--letter-spacing-input); cursor:pointer; transition:all .3s; }
.report_input .radio-list input[type="radio"] + label::before { content:''; display:block; flex:0 0 20px; width:20px; height:20px; border:1px solid var(--border); border-radius:50%; background:var(--white); box-sizing:border-box; }
.report_input .radio-list input[type="radio"]:checked + label { background:var(--main); border-color:var(--main); color:var(--white); }
.report_input .radio-list input[type="radio"]:checked + label::before { border:5px solid var(--white); background:var(--white); box-shadow:inset 0 0 0 5px var(--main); }
.report_input .radio-list input[type="radio"] { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }


.report_input .file-info { display:flex; width:100%; border-radius:var(--borderR10); overflow:hidden; margin-top:10px; }
.report_input .file-info_item { position:relative; flex:1; min-height:330px; padding:20px 25px; box-sizing:border-box; background:var(--grayBg); display: flex; flex-direction: column; justify-content: space-between; gap:10px;}
.report_input .file-info_item:first-child { border-right:1px solid var(--border); }
.report_input .file-info_item h4.fs18 { font-weight:600; color:var(--black); letter-spacing:var(--letter-spacing-heading); margin-bottom:4px; }
.report_input .file-info_dot { display:flex; flex-direction:column; gap:4px; }
.report_input .file-info_dot > li { position:relative; padding-left:11px; color:var(--basic); font-size:0.889rem; line-height:175%; letter-spacing:var(--letter-spacing-input); }
.report_input .file-info_dot > li::before { content:''; display:block; width:3px; height:3px; border-radius:var(--borderR5); background:var(--main); position:absolute; left:0; top:11px; }
.report_input .file-info_down { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; max-width:100%; padding:10px 20px 11px; box-sizing:border-box; border:1px solid var(--main); border-radius:var(--borderR5); background:var(--white); text-decoration:none; transition:all .3s; }
.report_input .file-info_down:hover { background:var(--subBg); }
.report_input .file-info_down_txt { display:flex; flex-direction:column; color:var(--main); gap:4px;}
.report_input .file-info_down_txt strong { font-weight:600; line-height: 140%; letter-spacing:var(--letter-spacing-button); }
.report_input .file-info_down_txt span { color:var(--main); line-height: 130%;}
.report_input .file-info_down_icon { display:block; flex:0 0 23px; width:23px; height:23px; position:relative; font-style: normal;}
.report_input .file-info_down_icon::after { content:'\f090'; display:block; width:100%; height:100%; line-height:23px; font-size:23px; text-align:center; font-family:var(--icon); font-weight:400; color:var(--main); }
.report_upload { display:flex; flex-direction:column; gap:5px; width:100%; }
.report_upload .add_file { display:none !important; }
.report_upload .fileDrop { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-height:98px; padding:30px 20px; box-sizing:border-box; border:1px solid var(--border); border-radius:var(--borderR5); background:var(--grayBg); }
.report_upload .fileDrop::before { content:''; display:block; width:38px; height:38px; background: url('/twcenter/bbs/skin/reportBasic/image/file-icon.png') no-repeat center/contain;}
.report_upload .fileDrop.file { align-items:flex-start; justify-content:flex-start; min-height:auto; padding:20px; }
.report_upload .fileDrop.file::before { display:none; }
.report_upload .fileDrop p { width:100%; position:relative; color:var(--basic); font-size:0.889rem; line-height:175%; letter-spacing:var(--letter-spacing-input); word-break:break-all; padding-right:50px; box-sizing:border-box; }
.report_upload .fileDrop .report_btn_down,
.report_upload .file_btn .report_btn_down { display:inline-block; vertical-align:middle; margin-left:6px; -webkit-appearance:none; appearance:none; -webkit-border-radius:0; border-radius:0; border:1px solid var(--border); border-bottom-color:#aaa; border-right-color:#aaa; background:var(--white); cursor:pointer; font-weight:bold; letter-spacing:var(--letter-spacing-input); font-size:12px; line-height:22px; color:#666; padding:0; width:50px; height:24px; box-sizing:border-box; font-family:inherit; }
.report_upload .file_btn { position:relative; width:100%; }
.report_upload .file_add_btn { display:flex; align-items:center; justify-content:center; width:100%; height:50px; padding:0; box-sizing:border-box; border:0; background:var(--main); border-radius:var(--borderR5); cursor:pointer; transition:all .3s; }
.report_upload .file_add_btn span { color:var(--white); font-size:0.889rem; font-weight:600; line-height:175%; letter-spacing:var(--letter-spacing-button); }
.report_upload .file_add_btn:hover { background:var(--sub); }
.report_upload .input_file { position:absolute; left:0; top:0; width:100%; height:50px; opacity:0; cursor:pointer; z-index:2; }
.report_input .info-txt { margin-top:10px; color:var(--basic); font-size:0.889rem; line-height:175%; letter-spacing:var(--letter-spacing-input); }
.report_input_pri { margin-top:40px; padding-top:40px; border-top:1px solid var(--border); }
.report_input_pri_inner { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.report_pri_left { display:flex; align-items:center; gap:30px; flex:1; min-width:0; }
.report_spamcheck { flex:0 0 auto; }
.report_spamcheck .norobot_img{}
.report_spamcheck .sub_txt { margin-top:5px; color:var(--basic); font-size:0.889rem; line-height:175%; letter-spacing:var(--letter-spacing-input); }

.report_input_pri .agree { display:flex; flex-direction:column; gap:7px; }
.report_input_pri .agree label { display:flex; align-items:center; flex-wrap:wrap; gap:6px; color:rgba(28,32,37,.7); font-size:0.889rem; line-height:150%; letter-spacing:var(--letter-spacing-input); cursor:pointer; }
.report_input_pri .agree label input[type="checkbox"] { flex:0 0 22px; width:22px; height:22px; margin:0; border:1px solid #bbb; border-radius:var(--borderR5); appearance:none; -webkit-appearance:none; background:var(--white); cursor:pointer; position:relative; }
.report_input_pri .agree label input[type="checkbox"]:checked { background:var(--main); border-color:var(--main); }
.report_input_pri .agree label input[type="checkbox"]:checked::after { content:'\f88b'; display:block; color: var(--white); font-family: var(--icon); width: 100%; height: 100%; line-height: 20px; font-size: 22px; font-weight: 400; text-align: center; position: absolute; left: 0; top:0;}
.report_input_pri .agree label a { color:var(--black); font-weight:600; text-decoration:underline; letter-spacing:var(--letter-spacing-button); color: var(--black); cursor:pointer; }
.report_btn { flex:0 0 auto; }
.report_btn .more-btn.apply_btn { width:180px; background:var(--main); color: var(--white);}
.report_btn .more-btn.apply_btn::after { border-color:var(--main); }
.report_btn .more-btn.apply_btn:hover { color:var(--main); }
.report_btn .more-btn.apply_btn:before { background:var(--white); }


/*******************************************************************************
	@media ~1500px
*******************************************************************************/
@media all and (max-width:1500px){



}


/*******************************************************************************
	@media ~1300px
*******************************************************************************/
@media all and (max-width:1300px){







.report_input_pri_inner { align-items: flex-end;}
.report_pri_left {gap:10px; flex-wrap: wrap;}
.report_input_pri .agree { width: 100%;}



}
/*******************************************************************************
	@media ~980px
*******************************************************************************/
@media all and (max-width:980px){


/*********** Input *************/

.report_input .input.input_m { max-width:100%; }
.report_input .datepicker-box { max-width:100%; }
.report_input .select-box { max-width:100%; }


.report_input .file-info {  flex-wrap: wrap;}
.report_input .file-info_item { flex:auto; width: 100%; min-height:auto;}
.report_input .file-info_item:first-child { border-right:0; border-bottom: 1px solid var(--border); }
.report_input .file-info_dot > li br{display: none;}
.report_input .file-info_dot > li::before { top:10px; }


.report_input_pri { margin-top:30px; padding-top:30px; }

}
/*******************************************************************************
	@media ~680px
*******************************************************************************/
@media all and (max-width:680px){

/*********** Input *************/

	.report_input { gap:15px; }
	.report_input dl { gap:5px; flex-wrap: wrap;}
	.report_input dt { flex:auto; width:100%; }
	.report_input dd { flex: auto; width: 100%; }
	.report_input .input { height:45px; padding:0 15px;}
	.report_input .input.input_m { max-width:100%; }
	.report_input .datepicker-box { max-width:100%; }
	.report_input .datepicker-box .input { padding-right:40px; }
	.report_input .datepicker-box::after { width:18px; height:18px; line-height:18px; font-size:18px; right:15px;}
	
	
	.report_input .select-box::after { right:15px; }
	.report_input .select.select_m { height:45px; padding:0 35px 0 15px; }

	.report_input .radio-list { flex-wrap: wrap; }
	.report_input .radio-list li { flex: auto; width: 100%;}
	.report_input .radio-list input[type="radio"] + label {  gap:6px;  height:45px; padding:0 15px; }
	.report_input .radio-list input[type="radio"] + label::before { flex:0 0 16px; width:16px; height:16px; margin-top: 1px;}
	.report_input .radio-list input[type="radio"]:checked + label::before { border-width: 3px; }
	
	
.report_input .file-info {  margin-top:5px;}
.report_input .file-info_item { padding:15px 20px; gap:5px;}
.report_input .file-info_dot > li { padding-left:9px; }
.report_input .file-info_dot > li::before { top:9px; }
.report_input .file-info_down { padding:10px 15px 11px; }
.report_input .file-info_down_icon {flex:0 0 20px; width:20px; height:20px;}
.report_input .file-info_down_icon::after {line-height:20px; font-size:20px; }



.report_upload .fileDrop { min-height:70px; padding:15px; }
.report_upload .fileDrop::before { width:30px; height:30px; }
.report_upload .file_add_btn { height:45px; }
.report_upload .input_file { height:45px; }
.report_input .info-txt { margin-top:5px; }


.report_input_pri { margin-top:20px; padding-top:20px; }
.report_input_pri_inner { gap:30px; flex-wrap: wrap;}
.report_pri_left {width: 100%; justify-content: center; flex: auto;}

.report_spamcheck {flex: auto; width: 100%; display: flex; justify-content: center;}
.report_spamcheck .g-recaptcha{transform: scale(0.85);}
.report_input_pri .agree { gap:4px; width: 100%;}
.report_input_pri .agree label { justify-content: center; gap:4px; flex-wrap: nowrap;}
.report_input_pri .agree label input[type="checkbox"] { flex:0 0 16px; width:16px; height:16px; }
.report_input_pri .agree label input[type="checkbox"]:checked::after { line-height: 14px; font-size: 16px;}
.report_btn{flex:auto; width: 100%; display: flex; justify-content: center;}
.report_btn .more-btn.apply_btn { width:140px;}


}


