@charset "utf-8";

/*
=========================================================================
모달 공통 css
=========================================================================
*/
.modal_box{position: fixed; top:50%; left:50%; transform: translate(-50%,-50%); width: 60%; height: auto; z-index: 900; background: #fff; border: 1px solid #ccc; border-radius: 10px; min-width: 360px; font-size: .95em; box-shadow: 5px 5px 20px 0px rgba(0, 0, 0, 0.1); max-height: 90%; overflow-x: hidden;-ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */} 
.modal_box::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera*/}
.modal_tit{width: 100%; font-weight: 700; padding: 30px 30px 0; color: #238C60; font-size: 1.4em; box-sizing: border-box;}

.modal_close{position: absolute; top:18px; right: 20px; cursor: pointer; width: 22px; height: 22px; background: url(../img/common/icon_close.png) no-repeat center / 90%;}
.modal_inner{padding: 20px 30px 40px;  overflow-x: hidden; background: #fff;}
.modal_box .sub_modal_tit{font-size: 1.3em; margin-bottom: 20px; font-weight: 600;}

.modal_bg{background: rgba(0,0,0,.25); height: 100%; width: 100%; position: absolute; top:0; left: 0; z-index: 800; display: none;}

.modal_searchBox{padding: 10px 30px; margin-bottom: 20px; font-size: .9em;}
.modal_searchBox label{font-weight: 500; margin-right: 10px;}
.modal_searchBox input, .modal_searchBox select{padding: 5px ; height: 35px;}
.modal_searchBox .searchRow .searchCont{margin: 10px 15px 10px 0;}
.modal_searchBox .search_btn{padding: 5px 15px;height: 35px; line-height: 24px;}

.modal_BtnWrap{margin-top: 20px; display: flex; justify-content: right;}


@media (max-width: 1300px) {
	.modal_box{width: 80%;}
	.modal_tit{padding: 20px 20px 0;}
	.modal_inner{padding: 15px 20px 30px;}
	.modal_searchBox .search_btn{margin-top: 11px; line-height: 23px;}
}
@media (max-width: 900px) {
	.modal_box .sub_modal_tit{font-size: 1.2em; margin-bottom: 10px;}
}
@media (max-width: 720px) {
	.modal_box{width: 90%;}
	.modal_close{top:15px; right: 15px; width: 20px; height: 20px;}
	.modal_tit{padding: 15px 15px 0;}
	.modal_inner{padding: 10px 15px 20px;}
	.modal_searchBox{padding: 5px 20px;}
	.modal_searchBox .searchRow .searchCont{margin: 10px 10px 10px 0;}
	.modal_searchBox input{width: 160px;}
}
@media (max-width: 550px) {
	.modal_searchBox input, .modal_searchBox select{padding: 3px;}
	.modal_searchBox input{width: 100px;}
}
/*
=========================================================================
modal_user_add.php css
=========================================================================
*/
#modal_user_add{display: none;}
#modal_user_add .modal_box{width: 500px;}
#modal_user_add input{box-sizing: border-box;}
#modal_user_add #infoForm{width: 100%;}
#modal_user_add .userAddBtn{padding: 6px 10px; width: 120px; margin-top: 40px;  margin-bottom: 10px;}
@media (max-width: 720px) {
	#modal_user_add .userAddBtn{margin-top: 30px; width: 100px;}
}
@media (max-width: 550px) {
	#modal_user_add .modal_box{width: 90%;}
	#modal_user_add .userAddBtn{margin-top: 30px; width: 100px;}
}

/*
=========================================================================
modal_delivery.php css
=========================================================================
*/
#modal_delivery_add, #modal_delivery_edit{display: none;}
#modal_delivery_add .modal_box, #modal_delivery_edit .modal_box{width: 500px;}
#modal_delivery_add select, #modal_delivery_edit select{width: 200px;}
#modal_delivery_add .deliverySaveBtn, #modal_delivery_edit .deliverySaveBtn{padding: 6px 10px; width: 120px; margin-top: 40px;  margin-bottom: 10px;}

@media (max-width: 720px) {
	#modal_delivery_add .deliverySaveBtn, #modal_delivery_edit .deliverySaveBtn{margin-top: 30px; width: 100px;}
}
@media (max-width: 550px) {
	#modal_delivery_add .modal_box, #modal_delivery_edit .modal_box{width: 90%;}
	#modal_delivery_add .deliverySaveBtn, #modal_delivery_edit .deliverySaveBtn{margin-top: 30px; width: 100px;}
}

/*
=========================================================================
match_ok.php 매칭 확인 모달 css
=========================================================================
*/
#match_ok{display: none;}
.match_modal .modal_inner{padding: 15px 20px;}
.match_modal .total{font-weight: 600; color: #238C60; margin-bottom: 10px; font-size: 1.05em;}
.match_modal .lab_list{overflow-y: scroll; border: 1px solid #ccc; padding: 0 20px; box-sizing: border-box; max-height: 300px;}
.match_modal .lab_list li{border-bottom: 1px dashed #ccc; padding: 20px 0;}
.match_modal .lab_list li:last-of-type{border-bottom: none;}
.match_modal .lab_list li { position:relative;}
.match_modal .lab_list li.new_partner:before {
	content:"New";
	position: absolute;
	left: 0;
	top: 4px;
	width: 30px;
	height: 20px;
	border-radius: 50%;
	display: inline-block;
	text-align: center;
	font-size: .75em;
	line-height: 20px;
	vertical-align: middle;
	background: var(--new-color);
	color: #fff;
}
.match_modal .lab_list li div{display: flex;}
.match_modal .lab_list .lab_tit{font-weight: 600;}
.match_modal .lab_list .lab_tit::after{content: ''; width: 1px; height: 15px; background: #ccc; display: inline-block; margin: 0 15px;}
.match_modal .guide_text{font-size: 1.2em; font-weight: 600; text-align: center; margin-top: 20px;}
.match_modal 
.matchBtnWrap{display: flex; justify-content: center; margin-bottom: 50px; margin-top: 10px;}
.matchBtnWrap>*{width: 120px;margin: 30px 20px 0;padding: 8px 20px;box-sizing: inherit;}
.matchBtnWrap .no{border: 1px solid var(--main-color);; color: var(--main-color);; background: #fff;}
.matchBtnWrap .btn_style1{margin-top: 0;}
@media (max-width: 900px){
	.matchBtnWrap>div{margin: 30px 10px 0;  padding: 8px 16px;}
}

@media (max-width: 720px){
	.matchBtnWrap>div{width: 90px; padding: 6px 18px;}
}
/*
=========================================================================
modal_refuse_data.php 반려 css
=========================================================================
*/
#modal_refuse_data{display: none;}
#modal_refuse_data .modal_box{width: 500px;}
#modal_refuse_data .refuseDate, #modal_refuse_data .refuseName{display: flex; margin-bottom: 5px;}
#modal_refuse_data .refuseDate>p:first-of-type, #modal_refuse_data .refuseName>p:first-of-type{width: 80px; font-weight: 500;}
#modal_refuse_data .refuseName{margin-bottom: 20px;}
#modal_refuse_data textarea{width:100%; padding: 20px; box-sizing: border-box; border-radius: 5px; border: 1px solid #ccc; resize: none; height: 200px; pointer-events: none; background: #f5f5f5;}
.refuseBtnWrap{display: flex; justify-content: center;}
.refuseBtnWrap>div{padding: 6px 10px; width: 120px; margin:40px 10px 0;  margin-bottom: 10px;}

@media (max-width: 720px) {
	.refuseBtnWrap>div{margin-top: 30px; width: 100px;}
}
@media (max-width: 550px) {
	#modal_refuse_data .modal_box{width: 90%;}
	.refuseBtnWrap>div{margin-top: 30px; width: 100px;}
}