html, body {background-color:white;}
/*인풋 공통스타일*/
input[type="text"].form_control{width:100%; height:49px; border:1px solid #054391; border-radius:4px; box-sizing:border-box;}
input[type="text"].form_control:focus {outline:0; border:1px solid #eee; box-shadow: 0 0 0 0.1rem rgba(5, 67, 145, .1);}
input[type="text"].form_control::placeholder {font-size:0.875rem; color:#707070;}
 
/*사전문진시스템 첫화면*/ 
.interview_wrap {position:relative; min-width:300px; max-width:1024px; width:100%; margin:0 auto; background-color:#fff;}
/*
.interview_wrap .interview_cont {min-height:100vh; padding:0 20px; box-sizing:border-box; display:flex; flex-direction:column; justify-content:center;}
*/
.interview_wrap .interview_cont {min-height: 100vh; padding:60px 20px 60px; box-sizing:border-box;}
.interview_wrap .interview_cont .login_form label {display:block; margin:20px 0 10px 0;}
.interview_wrap .start_btn {position:fixed; bottom:0; display:block; min-width:300px; max-width:1024px; width:100%; height:48px; line-height:48px; text-align:center; background-color:#054391; color:#fff;}

/*사전문진 헤더*/
.header {position:fixed; min-width:300px; max-width:1024px; width:100%; background:#fff; z-index:10;}
.header .header_top {display:flex; align-items:center; justify-content:center; height:60px; border-bottom:1px solid #054391;}
.progress_wrap {display:flex; align-items:center; justify-content:space-between; padding:20px; box-sizing:border-box;}
.progress_wrap .col.progress {width:70%; height:5px; border-radius:4px; background-color:#eee;}
.progress_wrap .progress_bar {height:100%; border-radius:4px; background-color:#054391;}
.progress_wrap .progress_bar.w10 {width:10%;} /* 진행률 표기 */
.progress_wrap .progress_bar.w20 {width:20%;}
.progress_wrap .progress_bar.w30 {width:30%;}
.progress_wrap .progress_bar.w40 {width:40%;}
.progress_wrap .progress_bar.w50 {width:50%;}
.progress_wrap .progress_bar.w60 {width:60%;}
.progress_wrap .progress_bar.w70 {width:70%;}
.progress_wrap .progress_bar.w80 {width:80%;}
.progress_wrap .progress_bar.w90 {width:90%;}
.progress_wrap .progress_bar.w100 {width:100%;}

.progress_wrap .progress_bar.w1 {width:1%;}
.progress_wrap .progress_bar.w2 {width:2%;}
.progress_wrap .progress_bar.w3 {width:3%;}
.progress_wrap .progress_bar.w4 {width:4%;}
.progress_wrap .progress_bar.w5 {width:5%;}
.progress_wrap .progress_bar.w6 {width:6%;}
.progress_wrap .progress_bar.w7 {width:7%;}
.progress_wrap .progress_bar.w8 {width:8%;}
.progress_wrap .progress_bar.w9 {width:9%;}

.progress_wrap .progress_bar.w11 {width:11%;}
.progress_wrap .progress_bar.w12 {width:12%;}
.progress_wrap .progress_bar.w13 {width:13%;}
.progress_wrap .progress_bar.w14 {width:14%;}
.progress_wrap .progress_bar.w15 {width:15%;}
.progress_wrap .progress_bar.w16 {width:16%;}
.progress_wrap .progress_bar.w17 {width:17%;}
.progress_wrap .progress_bar.w18 {width:18%;}
.progress_wrap .progress_bar.w19 {width:19%;}

.progress_wrap .progress_bar.w21 {width:21%;}
.progress_wrap .progress_bar.w22 {width:22%;}
.progress_wrap .progress_bar.w23 {width:23%;}
.progress_wrap .progress_bar.w24 {width:24%;}
.progress_wrap .progress_bar.w25 {width:25%;}
.progress_wrap .progress_bar.w26 {width:26%;}
.progress_wrap .progress_bar.w27 {width:27%;}
.progress_wrap .progress_bar.w28 {width:28%;}
.progress_wrap .progress_bar.w29 {width:29%;}

.progress_wrap .progress_bar.w31 {width:31%;}
.progress_wrap .progress_bar.w32 {width:32%;}
.progress_wrap .progress_bar.w33 {width:33%;}
.progress_wrap .progress_bar.w34 {width:34%;}
.progress_wrap .progress_bar.w35 {width:35%;}
.progress_wrap .progress_bar.w36 {width:36%;}
.progress_wrap .progress_bar.w37 {width:37%;}
.progress_wrap .progress_bar.w38 {width:38%;}
.progress_wrap .progress_bar.w39 {width:39%;}

.progress_wrap .progress_bar.w41 {width:41%;}
.progress_wrap .progress_bar.w42 {width:42%;}
.progress_wrap .progress_bar.w43 {width:43%;}
.progress_wrap .progress_bar.w44 {width:44%;}
.progress_wrap .progress_bar.w45 {width:45%;}
.progress_wrap .progress_bar.w46 {width:46%;}
.progress_wrap .progress_bar.w47 {width:47%;}
.progress_wrap .progress_bar.w48 {width:48%;}
.progress_wrap .progress_bar.w49 {width:49%;}

.progress_wrap .progress_bar.w51 {width:51%;}
.progress_wrap .progress_bar.w52 {width:52%;}
.progress_wrap .progress_bar.w53 {width:53%;}
.progress_wrap .progress_bar.w54 {width:54%;}
.progress_wrap .progress_bar.w55 {width:55%;}
.progress_wrap .progress_bar.w56 {width:56%;}
.progress_wrap .progress_bar.w57 {width:57%;}
.progress_wrap .progress_bar.w58 {width:58%;}
.progress_wrap .progress_bar.w59 {width:59%;}

.progress_wrap .progress_bar.w61 {width:61%;}
.progress_wrap .progress_bar.w62 {width:62%;}
.progress_wrap .progress_bar.w63 {width:63%;}
.progress_wrap .progress_bar.w64 {width:64%;}
.progress_wrap .progress_bar.w65 {width:65%;}
.progress_wrap .progress_bar.w66 {width:66%;}
.progress_wrap .progress_bar.w67 {width:67%;}
.progress_wrap .progress_bar.w68 {width:68%;}
.progress_wrap .progress_bar.w69 {width:69%;}

.progress_wrap .progress_bar.w71 {width:71%;}
.progress_wrap .progress_bar.w72 {width:72%;}
.progress_wrap .progress_bar.w73 {width:73%;}
.progress_wrap .progress_bar.w74 {width:74%;}
.progress_wrap .progress_bar.w75 {width:75%;}
.progress_wrap .progress_bar.w76 {width:76%;}
.progress_wrap .progress_bar.w77 {width:77%;}
.progress_wrap .progress_bar.w78 {width:78%;}
.progress_wrap .progress_bar.w79 {width:79%;}

.progress_wrap .progress_bar.w81 {width:81%;}
.progress_wrap .progress_bar.w82 {width:82%;}
.progress_wrap .progress_bar.w83 {width:83%;}
.progress_wrap .progress_bar.w84 {width:84%;}
.progress_wrap .progress_bar.w85 {width:85%;}
.progress_wrap .progress_bar.w86 {width:86%;}
.progress_wrap .progress_bar.w87 {width:87%;}
.progress_wrap .progress_bar.w88 {width:88%;}
.progress_wrap .progress_bar.w89 {width:89%;}

.progress_wrap .progress_bar.w91 {width:91%;}
.progress_wrap .progress_bar.w92 {width:92%;}
.progress_wrap .progress_bar.w93 {width:93%;}
.progress_wrap .progress_bar.w94 {width:94%;}
.progress_wrap .progress_bar.w95 {width:95%;}
.progress_wrap .progress_bar.w96 {width:96%;}
.progress_wrap .progress_bar.w97 {width:97%;}
.progress_wrap .progress_bar.w98 {width:98%;}
.progress_wrap .progress_bar.w99 {width:99%;}



.interview_category {padding:0 20px 20px; box-sizing:border-box;}
.interview_category .q_icon {display:inline-block; width:28px; height:28px; line-height:28px; font-size:1.250rem; text-align:center; border-radius:50%; margin-right:6px; background-color:#01010d; color:#fff;}

/*사전문진 콘텐츠*/
.interview_wrap .interview_box {padding:180px 20px;min-height:100%;box-sizing:border-box;}


/*========= 사전문진 콘텐츠 내 질문 카테고리 스타일 =========*/
.inputNone input{display:none;}

/*초이스박스 1*/
.c_box1 {display:flex; width: 100%; margin:20px 0 24px 0;}
.c_box1 li {height:49px; line-height:49px; text-align: center; box-sizing: border-box; cursor:pointer;}
.c_box1 li label {display:block; width:100%; height:100%; border:1px solid #054391; background-color:#fff; transition:all .2s;}
.c_box1 li label.active {background-color:#054391; border:1px solid #054391; color: #fff;}
.c_box1 li label:hover {background-color:#054391; border:1px solid #054391; color: #fff;}
.c_box1 li:first-child label {border-radius:4px 0 0 4px;}
.c_box1 li:last-child label {border-radius:0 4px 4px 0;}

.c_box1.col3 li {width: 33.33%;} /* 초이스박스1 탭 컬럼3개 */
.c_box1.col2 li {width: 50%;}

/*초이스박스 2*/
.c_box2 li.c_box2_c1 {height:49px; line-height:49px; text-align: center; margin:10px 0; box-sizing: border-box; cursor:pointer;}
.c_box2 li.c_box2_c1 > label {display:block; width:100%; height:100%; border:1px solid #054391; border-radius:4px; background-color:#fff; transition:all .2s;}
.c_box2 li.c_box2_c1 > label.active {background-color:#054391; border:1px solid #054391; color: #fff;}
.c_box2 li.c_box2_c1 > label:hover {background-color:#054391; border:1px solid #054391; color: #fff;}



/*초이스박스 3*/
.c_box3_wrap {width:95%; border:2px solid #ffffff; background-color:#ffffff; padding:0 10px; /*margin:24px auto;*/ border-radius:4px; box-sizing:border-box;margin:10px auto;}
.c_box3_wrap_a{border:2px solid #054391; background-color:#23467333;padding-top:10px;}
.c_box3 li.c_box3_c1 {display:flex; align-items:center;   box-sizing:border-box;}
.c_box3 li.c_box3_c1 > label {display:flex; align-items:center; width:100%; height:100%; border:1px solid #707070; border-radius:4px; background-color:#fff; padding:20px 40px; word-break:keep-all;}
.c_box3 li label.active {border:1px solid #34557d; background-color:#5e7898; color:#fff; font-weight:300;}

/*체크박스 스타일링*/


/*초이스박스 4*/
.c_box4 {width:95%; margin:0 auto;}
.c_box4 li{display:flex; align-items:center; justify-content:center; background-color:#fff; border-radius:4px; margin:10px 0;  box-sizing:border-box;  text-align:center;}
.c_box4 li label {width:100%; height:100%; border:1px solid #707070; border-radius:4px; background-color:#fff; padding:20px 10px; justify-content: center;}
.c_box4 li label.active {border:1px solid #054391; background-color:#054391;}


/*사전문진 푸터하단버튼*/
.foot_btn {position:fixed; bottom:0; min-width:300px; max-width:1024px; width:100%; display:flex;}
.foot_btn a {height:48px; line-height:48px; text-align:center; }
.foot_btn a.foot_btn_prev {width:40%; background-color:#d1d1d1;}
.foot_btn a.foot_btn_next {width:60%; background-color:#054391; color:#fff;}




/*main.html ----css추가 // 20220727 */

/*동의 label css추가*/
.c_box3.agree {margin-top:50px;}
.c_box3.agree li label {position:relative;}
.c_box3.agree li label > a {position:absolute; right:20px; text-decoration:underline;color: #000;}


/*동의 모달창*/
.open_modal, .close_modal {cursor:pointer;}
.modal {position:fixed; width:500px; background:#fff; top: 50%;  left: 50%; transform: translate(-50%, -50%); z-index:99991; display:none;}
.modal .top {background:#2c3137; color:#fff; padding:10px 20px 10px 30px; box-sizing:border-box; font-size:1.125rem; line-height:32px;}
.modal .close_modal {float:right; width:32px; height:32px; line-height:32px; box-sizing:border-box; font-size:1.875rem;}
.modal_filter{position:fixed; top:0; right:-100%; width: 100%; height: 100%; background: rgba(0,0,0,.6); opacity: 0; transition: opacity .4s; z-index: 9999;}
.modal_filter.open{opacity: 1; right:0;}
.modal .agree_cont {padding:20px; box-sizing:border-box;}



/*interviewProcess.html ----css추가 // 20220727 */
.interview_wrap .interview_cont .confirm_form label {display:block; position:relative;}
.interview_wrap .interview_cont .confirm_form label .confirm_tit{display:block; margin:20px 0 10px 0;}
.interview_wrap .interview_cont .confirm_form label .confirm_tag {position:absolute; right:20px; bottom:14px;}

.confirm_2box {display:flex; justify-content:space-between;}
.confirm_2box li{width:calc(50% - 10px); background-color:#fff; border-radius:4px; margin:10px 0; box-sizing:border-box;  text-align:center;}
.confirm_2box li label {border:1px solid #707070; border-radius:4px; background-color:#fff; padding:14px 0px;}
.confirm_2box li label.active {border:1px solid #054391; background-color:#054391; color:#fff;}



.emo_imgWrap {margin: 0 auto 100px; width: 60%;}
.emo_imgWrap img {width: 100%;}


/*visitPurpose.html ----css추가 // 20221206 */
.purposeCheck {margin: 30px 0 50px 0;}
.purposeCheck ul li {
	position: relative;
	width: 100%;
    height: 100%;
    border: 1px solid #707070;
    border-radius: 4px;
    background-color: #fff;
    padding: 0;
    word-break: keep-all;
	overflow: hidden;
	cursor:pointer;
}
.purposeCheck ul li.active {
	border: 1px solid #4e83c7;
	background-color:#eaf3ff;
}
.purposeCheck ul li.active .chkBoxWrap label {
	color: #054391;
}
.purposeCheck ul li.active .categoryTit {
	background-color: #054391;
	color: #fff;
}
.purposeCheck ul li .chkBoxWrap {
	box-sizing: border-box;
	width: 100%;
}
.purposeCheck ul li input[type=checkbox] {
    display: none;
}
.purposeCheck ul li .chkBoxWrap label {
	padding-left: 0;
	height: auto;
	background-position: 10px center;
}
.purposeCheck ul li .chkBoxWrap input[type=checkbox] + label {
	display: flex;
	padding: 20px 50px !important;
	width: 100%;
    height: 100%;
	background-size: 40px 24px;
	padding: 0 50px;
	color: #000;
}
.purposeCheck ul li .categoryTit {
	padding: 20px;
	min-width: 64px;
	height: 21px;
	background-color: #acc7e7;
	color: #000;
	font-size: 0.875rem;
}
.purposeCheck .purposeChk {
	margin-top: 20px;
}
.purposeAgree li > label {
	padding: 20px 50px !important;
}
.purposeAgree li input[type=checkbox] + label {
	background-size: 40px 24px;
	color: #000;
}
.purposeAgree li label.active {
	border: 1px solid #4e83c7;
	background-color: #eaf3ff;
	color: #000;
}

/*curePurpose.html */
.symptom_box_wrap .symptom_box {
	margin-top: 20px;
	padding: 20px 15px;
	border-radius: 5px;
	background-color: #efefef;
}
.symptom_box_wrap .symptom_box .symptom_tit {
	margin-bottom: 15px;
}
.symptom_box_wrap .symptom_box textarea {
	border-radius: 5px;
	font-family: 'Pretendard';
	font-size: 1rem;
	height: 110px;
}
.symptom_more_btn {
	margin-top: 15px;
	height: 50px;
	border-radius: 5px;
	box-sizing: border-box;
	border: 1px solid #000;
	transition: all 0.3s;
}
.symptom_more_btn:hover {
	background-color: #054391;
	border: 1px solid #054391;
	color: #fff;
}

.interview_box .chkBoxWrap {
	box-sizing: border-box;
    width: 100%;
    height: 100%;
    border: 1px solid #707070;
    border-radius: 4px;
    background-color: #fff;
}
.interview_box .chkBoxWrap.active {
	border: 1px solid #4e83c7;
    background-color: #eaf3ff;
}
.interview_box .chkBoxWrap input[type=checkbox] + label {
    display: flex;
    padding: 20px 50px !important;
    width: 100%;
    height: 100%;
    background-size: 40px 24px;
    padding: 0 50px;
    color: #000;
	background-position: 10px center;
}

@media screen and (max-width:500px){
	.f18 {font-size:1rem;}
	.m_80 {margin-bottom:40px;}
	.c_box3.agree {margin-top:20px;}
	.modal {width:90%;}
	.interview_cont h2 {margin-top:20px; text-align:center;}
	.interview_cont .f18.lh15 {text-align:center; font-size:1rem;}
	.purpose_cont h2 {text-align:left;}
	.purpose_cont .f18.lh15 {text-align:left;}
	.symptom_box_wrap .symptom_box textarea {height: 95px;}

}

/* 약관 서식 */
.agree_cont{
	overflow-y: scroll;
	height: 90vh;
	
}
.info_css{
	border: 1px solid #000;
}
.info_css1{
	border: 1px solid #000;
}
.info_css th{
	border: 1px solid #000;
	width: 33.3%;
}
.info_css1 th{
	border: 1px solid #000;
	width: 25%;
}
.info_css td{
	border: 1px solid #000;
	width: 33.3%;
	text-align: center;
}
.info_css1 td{
	border: 1px solid #000;
	width: 33.3%;
	text-align: center;
}