
.inquiryWrap .subVWrap {background:url(../img/sub/contact-bg.jpg) no-repeat center / cover;}
.inquiryWrap {position:relative;}
.inqContWrap {padding:12rem 0;}

.subInner {
	width:100%;
	margin:0 auto;
	padding:0 2rem;
	max-width:148rem;
}

.inqBanner {
	/* margin-top: 2rem; */
    padding: 6rem 0rem 6rem 7rem;
    background: url(../img/sub/inqBbg.jpg) no-repeat center / cover;
}
.inqTitle {
	color: #111;
	font-family: "Pretendard-SemiBold";
	font-size: 3.2rem;
	line-height: 4.6rem;
}
.inqBlist li {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}
.inqBlist li:last-child {padding-bottom:1.5r,m;}
.inqBTitle {
	color: #111;
	font-family: "Pretendard-SemiBold";
	font-size: 3.8rem;
	line-height: 5.4rem;
	margin-bottom:4rem;
}
.inqBNum {
    color: #FFF;
    font-family: "Pretendard-Bold";
    font-size: 1.4rem;
    line-height: 1.8rem;
    border-radius: 99px;
    background: #1A3764;
    width: 2.4rem;
    height: 2.4rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.inqBtxt {
	color: #111;
	font-family: Pretendard;
	font-size: 2rem;
	line-height: 4rem;
	padding-left:1.4rem;
	position:relative;
}

.inqBtxt::before {
	content:'';
	width:0.6rem;
	height:0.6rem;
	background:#1A3764;
	border-radius:50%;
	position:absolute;
	left:0;
	top: 2.1rem;
	transform:translateY(-50%);
}

.inqBtxt span {
    font-family: "Pretendard-SemiBold";
    text-decoration: underline;
}

/* :::::::::::: ====================== 문의 신청 폼 ====================== :::::::::::: */
.inqContWrap form {display: flex; flex-wrap: wrap;}
.inqBox {width:100%;}

.inqBoxTBox {
    width: 100%;
    display: flex;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid #1A3764;
    justify-content: flex-start;
    align-items: flex-end;
}

.inqBoxT {
	color: #222;
	position:relative;
	font-size: 2.8rem;
	line-height: 3.8rem;
	display: inline-block;
	font-family: "Pretendard-SemiBold";
}

.inqBoxT::before {
    content: '';
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 50%;
    background: #1A3764;
    position: absolute;
    right: -0.02rem;
    top: 0;
    transform: translateX(100%);
}

.requireT {
	color: #FF6D1C;
	font-family: "Pretendard-SemiBold";
	font-size: 1.7rem;
	line-height: 2rem;
	padding-left: 1rem;
	padding-bottom: 0.4rem;
}


.width50 {width:calc(50% - 2rem); margin-right:4rem;}
.width100 {width:100%;}
.width50.margin0 {margin-right:0;} 


.flexBox {display: flex; align-items: flex-start;}
.inputName {
	color: #111;
	font-family: "Pretendard-Medium";
	font-size: 2rem;
	line-height: 2.8rem;
	margin-bottom:1rem;
}
.flexBoxBottomBorder {
	padding-bottom:3rem;
	margin-bottom:3rem;
	border-bottom:1px solid #EEE;
}



/* :::::::::::: ====================== 필수정보 ====================== :::::::::::: */
.inqBox.require {margin-top:10rem}

.caseInfo .inputName {
    width: 14rem;
    margin-right: 0;
    min-width: 14rem;
	margin-bottom: 1rem;
}
.extext {
	color: #555;
	font-family: "Pretendard-Light";
	font-size: 1.7rem;
	line-height: 2rem;
	margin-top:1rem;
	margin-bottom: 0rem;
	position:relative;
}

.extextBox {padding-left:3rem; position:relative;}
.extextBox::before {
	content:'ex)';
	color: #555;
    font-family: "Pretendard-Light";
    font-size: 1.7rem;
    line-height: 2rem;
	position:absolute;
	top:1rem;
	left:0;
}



/* =========== 인풋 텍스트 =========== */
.inqContWrap input[type="text"], 
.inqContWrap textarea {
	box-sizing: border-box;
	width:100%;
	height:6rem;
	border:none;
	padding:0rem 2rem;
	border: 1px solid #F6F6F6;
	font-family: 'Pretendard-SemiBold';
	font-size: 1.6rem;
	line-height: 2rem;
	letter-spacing: 0em;
	text-align: left;
	color:#222;
    background: #F8F8F8;
}
.inqContWrap input[type="text"]:focus, .inqContWrap textarea:focus {
    border: 1px solid #111;
    background: #FFFFFF;
    outline: none;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.10);
}

.inqContWrap input[type="text"]:read-only, 
.inqContWrap textarea:read-only {
	background: #f9f9f9;
	border: 1px solid #F6F6F6;
}

.inqContWrap input[type="text"]::placeholder,
.inqContWrap textarea::placeholder{
	font-family: "Pretendard-Light";
	font-size: 1.8rem;
	line-height: 3.2rem;
	color:#888;
}



/* =========== 라디오 =========== */
.radioBox label {
    height: 6.4rem;
    cursor: pointer;
    display: inline-flex;
    min-width: calc(100%/4);
    flex-wrap: wrap;
    width: auto;
    align-items: center;
}

.radioBox input {
    margin: 0;
    color: #222;
    font-family: "Pretendard-Medium";
    font-size: 1.8rem;
    line-height: 2.4rem;
    margin-right: 0.6rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 2.4rem;
    height: 2.4rem;
	border-radius: 0.3rem;
    outline: none;
    cursor: pointer;
    box-sizing: border-box;
    background: #DDD;
    border: none;
    outline: none;
}
.radioBox {
    margin: 0;
    color: #222;
    font-family: "Pretendard-Light";
    font-size: 1.8rem;
    line-height: 2.4rem;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
}
.radioBox:last-child {margin-bottom: 0; margin-right: 0;}
.inqContWrap input[type="radio"]:checked {background: url(../img/sub/agcheck.png) no-repeat center / cover;}

/* :::::::::::: ====================== 상담 목적 ====================== :::::::::::: */
.purposeArea .radioBox {width: auto;}
.purposeArea .radioBox:first-child {margin-right: 5rem;}
.purposeArea .radioBox label {width:auto; min-width:50%;}


/* :::::::::::: ====================== 선택 정보 ====================== :::::::::::: */
.inqBox.caseInfo {margin-top:10rem;}

/* :::::::::::: ====================== 사건내용 ====================== :::::::::::: */
.flexBox.casedetail {display: flex; flex-direction: column;}
.casedetail input[type="text"] {height:23rem;}
.casedetail textarea {height: 23rem; padding: 2.2rem 2rem;}


/* :::::::::::: ====================== 의뢰내용 ====================== :::::::::::: */
.flexBox.request, .flexBox.evidence {display: flex; flex-direction: column;}


/* =========== 체크박스 =========== */
.agree_checkBox {display: block; width: 100%; display: flex; flex-wrap: wrap;}
.agree_check {
    display: flex;
    text-align: left;
    position: relative;
    margin-bottom: 0px;
    margin-bottom: 0rem;
    align-items: center;
    width: calc(100%/4);
    height: 6.4rem;
}
.agree_check input[type=checkbox] {position: absolute; display: none;}
.agree_check label {
    padding-left: 3.2rem;
    font-family: "Pretendard-Light";
    font-size: 1.8rem!important;
    line-height: 2.4rem;
    letter-spacing: 0em;
    text-align: left;
    color: #222;
    margin-left: 0;
    cursor: pointer;
    white-space: nowrap;
	display: flex;
    align-items: center;
}
.agree_check label a {text-decoration: underline; margin-left: 1rem; display: inline-block; color: #666;}
.agree_check input[type=checkbox].check-all+label em {
    box-sizing: border-box;
    left: 0;
    top: 50%;
    width: 2.4rem;
    height: 2.4rem;
    position: absolute;
    border-radius: 0.3rem;
    transform: translateY(-50%);
    fill: #DDD;
    background: #DDD;
}
.agree_check input[type=checkbox].check-all:checked+label em{background:url(../img/sub/agcheck.png) no-repeat center / cover;}


/* :::::::::::: ====================== 관련증거 (체크박스) ====================== :::::::::::: */
.request .etcArea, .progressArea .etcArea {width: 23rem!important; margin: 0; margin-left: 2rem;}

.caseInfo .evidence .inputName {
    margin-top: 0rem;
    width: auto;
    position: relative;
    min-width: auto;
}

.caseInfo .evidence .inputName::before {
    content: '중복체크가능';
    position: absolute;
    left: 100%;
    bottom: 0;
    width: 156%;
	color: #FF6D1C;
    font-family: "Pretendard-Medium";
    font-size: 1.7rem;
    line-height: 2.8rem;
	margin-left: 1rem;
}

.evidence .agree_check {margin: 0; height: 6.4rem;}

/* :::::::::::: ====================== 기타 인풋 ====================== :::::::::::: */
.etcBoxWrap {display: flex; align-items: center;}
.etcArea {margin-left: 2rem; border-radius: 0!important;}




/* 개인정보처리방침 */
.agbotm {
    width: 100%;
    padding-top: 2rem;
    border-top: 1px solid #1A3764;
    margin-top: 6rem;
}

.agbotm .agree_check {
    height: auto;
    width: 100%;
}
.agree_check label.agtxt {
	color: #111;
	font-size: 1.8rem!important;
	line-height: 2.8rem;
	font-family: "Pretendard-SemiBold";
}

.cinbottombtn {
    position: relative;
    width: 100%;
    margin-top: 6rem;
    text-align: center;
}
.cinbottombtn button {
    background: #1A3764;
    border: none;
    outline: none;
    padding: 2rem 3rem;
    width: 34rem;
    text-align: left;
	color: #FFF;
	font-family: "Pretendard-Bold";
	font-size: 2rem;
	font-style: normal;
	font-weight: 700;
	line-height: 2.8rem;
	position: relative;
	cursor:pointer;
}
.cinbottombtn button::before {
	content:'';
	top:50%;
	right:3rem;
	width:1.7rem;
	height:1.6rem;
	position:absolute;
	transform:translateY(-50%);
	background: url(../img/sub/simbtnArrow.png) no-repeat center / cover;
}

.agvmore {
	cursor:pointer;
	color: #111;
	opacity:0.5;
	font-size: 1.8rem;
	line-height: 2.8rem;
	padding-left: 0.6rem;
	text-decoration-line: underline;
}





@media (max-width:1500px) and (min-width:992px) {
	.subInner {padding: 0 6rem;}
	.inqBanner {margin-top: 2rem; padding: 5rem 0rem 4rem 5rem;}
	.inqBTitle {font-size: 3.4rem; line-height: 5rem; margin-bottom: 3rem;}
	.extext {
		color: #555;
		font-family: "Pretendard-Light";
		font-size: 1.5rem;
		line-height: 1.8rem;
		margin-top: 1rem;
	}

}
@media (max-width:991px) {
	.inquiryWrap .subVWrap {background:url(../img/sub/contact-bg-mo.jpg) no-repeat center / cover;}
	.inqContWrap {padding: 6rem 0;}
	.amenuT {font-size: 1.5rem; padding: 1.5rem 0;}
	.inqTitle {font-size: 2.4rem; line-height: 3.6rem;}
	
	.inqBanner {
		/* margin-top: 2rem; */
		padding: 2.6rem 2.6rem 13.6rem 2.6rem;
		background: url(../img/sub/inqBbg-mo.jpg) no-repeat bottom / cover;
	}
	.inqBTitle {
		font-size: 2rem;
		line-height: 2.8rem;
		margin-bottom: 2rem;
	}
	.inqBlist li {
		display: flex;
		align-items: flex-start;
	}
	.inqBNum {
		font-size: 1.2rem;
		line-height: 1.8rem;
		width: 2.1rem;
		height: 2.1rem;
		min-width: 2.1rem;
		min-height: 2.1rem;
		align-items: center;
	}
	.inqBtxt {
		font-size: 1.4rem;
		line-height: 2.1rem;
		margin-left: 0rem;
	}
	.inqBtxt::before {
		width: 0.4rem;
		height: 0.4rem;
		top: 1.1rem;
	}
	.inqContWrap form {
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
	}
	.width50 {
		width: 100%;
		margin-right: 0;
	}
	.flexBox {
		display: flex;
		align-items: flex-start;
		flex-direction: column;
	}
	
	.inqBoxTBox {
		padding-bottom: 1.8rem;
		margin-bottom: 1.8rem;
	}
	
	.inqBoxT {
		font-size: 2rem;
		line-height: 2.6rem;
	}

	.requireT {
		font-size: 1.4rem;
		line-height: 2rem;
		padding-left: 1.4rem;
	}
	.radioBox {line-height:2.4rem; font-size:1.5rem;}
	
	.inputName {
		font-size: 1.7rem;
		line-height: 2.4rem;
		margin-bottom: 0;
	}
	
	
	.flexBoxBottomBorder {padding-bottom: 3rem; margin-bottom: 3rem;}
	.extext {font-size: 1.4rem; line-height: 2rem; margin-top: 0.6rem; margin-bottom: 0rem;}
	
	.extextBox {padding-left: 2.6rem;}
	.extextBox::before {font-size: 1.4rem; line-height: 2rem; top:0.6rem;}
	
	.inqContWrap input[type="text"]:focus, .inqContWrap textarea:focus {box-shadow:none;}
	
	/* =========== 인풋 텍스트 =========== */
	.inqContWrap input[type="text"]::placeholder {font-family: "Pretendard-Light"; font-size: 1.5rem; line-height: 2rem;}
	
	/* =========== 라디오 =========== */
	.radioBox label {height:4rem; width: calc(100%/2); margin-top: 0.6rem;}
	
	/* 이름 */
	.nameArea {margin-bottom: 3rem; padding-bottom: 3rem; border-bottom: 1px solid #EEE;}
	
	/* 상담목적 */
	.purposeArea .flexBox {flex-direction: row;}
	
	/* 죄명 */
	.crimeArea {margin-bottom: 3rem; padding-bottom: 3rem; border-bottom: 1px solid #EEE;}
	
	/* 사건내용 */
	.caseInfo .inputName {margin-bottom:0;}
	.inqBox.caseInfo {margin-top:8rem;}
	
	.inqContWrap input[type="text"], .inqContWrap textarea {height:5.4rem; font-size:1.5rem; padding:0 2rem; font-size: 1.5rem; line-height: 2rem; margin-top: 0.6rem;}
	.inqContWrap textarea::placeholder{font-size: 1.5rem; line-height: 2rem;}
	.inqContWrap textarea {padding:2rem; height:25rem; margin-top: 0.6rem;}
	
	/* 의뢰내용 */
	.request input[type="text"], .request textarea {height:4rem;}
	
	/* 증거 */
	
	.agree_check label {
		padding-left: 3.2rem;
		font-family: Pretendard;
		font-size: 1.5rem!important;
		line-height: 1.8rem;
	}


	.evidence .inputName {margin-bottom: 0.6rem;}
	.evidence .agree_check {height:4rem;}
	.evidence .agree_check:last-child {width: 100%;}
	.evidence input[type="text"], .evidence textarea {height:4rem; margin-top:0;}
	
	.caseInfo .evidence .inputName::before {
		font-size: 1.4rem;
		line-height: 2rem;
		margin-left: 1rem;
	}
	
	/* 진행상황 */
	.progressArea .inputName {margin-bottom: 0.6rem;}
	.progressArea .radioBox label {margin-top:0;}
	.progressArea input[type="text"], .progressArea textarea {height:4rem; margin-top: 0;}
	.progressArea .etcBoxGroup {width:100%;}
	
	.progressArea .etcArea {width: 100%!important;}
	
	.radioBox .progres07 {width: 100%;}
	.radioBox .progres07 .etcBox {width: calc(100% - 7rem)!important;}
	
	
	/* =========== 체크박스 =========== */
	.agree_check {height:5.4rem; width:calc(100%/2);}
	
	
	/* =========== 기타 인풋 =========== */
	.etcBoxWrap {display: flex; align-items: center;}
	.etcBox {width: 100%!important;}
	
	.radioBox .request03Label {width: 100%; display: flex; align-items: center; justify-content: space-between;}
	.radioBox .request03Label .etcBox {width: calc(100% - 7rem)!important;}
	
	input#requestr_etc {margin: 0; width: 100%!important;}
	
	
	/* 개인정보처리방침 */
	.agbotm {padding-top: 2rem;margin-top: 4rem; padding-top:2rem;}
	.agree_check label.agtxt {font-size: 1.3rem!important; line-height: 2.8rem;}
	a.agvmore {font-size: 1.3rem; line-height: 2.8rem; margin-left: 0.6rem;}

	.cinbottombtn button {
		background: #1A3764;
		border: none;
		outline: none;
		padding: 1.2rem 2rem;
		width: 100%;

		text-align: left;
		color: #FFF;
		font-size: 1.6rem;
		cursor: pointer;
	}
	.cinbottombtn {margin-top: 4rem;}
	.agvmore {font-size:1.5rem;}
}
@media (max-width:767px) {
	.inqBox.require {margin-top: 5.2rem;}
	
	.flexBoxBottomBorder {padding-bottom: 2rem; margin-bottom: 2rem;}
	/* 이름 */
	.nameArea {margin-bottom: 3rem; padding-bottom: 3rem;}
	
	/* 사건정보 */
	.inqBox.caseInfo {margin-top:5.2rem;}
	
	/* 죄명 */
	.crimeArea {margin-bottom: 3rem; padding-bottom: 3rem;}
	.agvmore {font-size:1.2rem;}
	
	.extextBox {padding-left: 2.4rem;}
}



/* 개인정보처리방침 팝업 */
.priPopUp {display:none; position:relative; top: 0;width: 100%; height: 100vh; position: fixed;}
.priPopUp.show {
    z-index: 40;
	display: flex;
	align-items: center;
    justify-content: center;
}

.priPopUp_BG {
	left:0;
	top:0;
	opacity: 0;
	position:absolute;
	width:100%; height:100%;
    background: rgba(0,0,0,0.5);
    transition: all 0.8s ease-in-out;
}
.priPopUp.show .priPopUp_BG {opacity:1;}




.per_popup {
    width: calc(100% - 4rem);
    max-width: 140rem;
    margin: 0 auto;
	position: relative;
	height: 77%;
	padding: 0 1rem;
	background:#FFF;
}

.open .per_popup {
    display: block;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background: #FFF;
}
.per_popupClose {
    top: 0;
    right: 0;
    width: 1.8rem;
    height: 1.8rem;
    position: absolute;
    transform: translateX(150%);
    cursor: pointer;
}
.per_popupClose img {width:100%; height:auto;}

html.hidden {overflow:hidden;}

.per_popcont {
    position: relative;
    width: 100%;
    height: 86.4%;
    padding: 5rem;
}
p.tp_toptitle {
    letter-spacing: -0.2px;
    margin: 0px;
    width: 100%;
    padding-bottom: 2rem;
    border-bottom: 1px solid #c4c4c4;
    font-weight: 500;
    color: #333;
    font-size: 2.4rem;
    line-height: 2.6rem;
}

.pop_terms.strong.top {margin: 0px 0 10px 0;}

.pop_terms.strong {
	font-family: Pretendard;
	font-size: 1.6rem;
	font-weight: 500;
	line-height: 2rem;
	letter-spacing: 0em;
	text-align: left;
}

.per_popup .per_popcont {
    font-family: Pretendard;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2.3rem;
    letter-spacing: 0em;
    text-align: left;
    overflow-y: scroll;
    background: #FFF;
	overflow-x: hidden;
}

.per_popup .per_popcont::-webkit-scrollbar {width: 4px;}
.per_popup .per_popcont::-webkit-scrollbar-thumb {
	height: 4px;
	background: red;
	border-radius: 10px;
	border: 5px solid #888;
	box-sizing: border-box;
}
.per_popup .per_popcont::-webkit-scrollbar-track {background: #FFF;}
	

.per_popcontTxt {
    padding: 0px 0 3rem 0;
    position: relative;
}
.closeBtn {
    right: 6rem;
    top: 3rem;
    width: 2rem;
    height: 2rem;
    position: absolute;
    cursor: pointer;
}
.closeBtn span {
    width: 1px;
	right: 50%;
    height: 2.6rem;
    background: #333333;
    position: absolute;
}
.closeBtn span:nth-child(1) {transform: rotate(-45deg);}
.closeBtn span:nth-child(2) {transform: rotate(45deg);}

.popuptitleBox {width: 100%; padding: 3rem 5rem 0rem 5rem; background: #fff; z-index: 10;}


@media (max-width:991px) {
	.per_popcontTxt br {display:block;}
	.per_popup {width: 85%; height: 72%;}
	p.tp_toptitle {
		font-size: 1.8rem;
		line-height: 2.6rem;
		padding-bottom: 1.1rem;
	}
	.closeBtn {top:2.3rem; right:2rem;}
	.closeBtn span {height:1.8rem;}
	
	.pop_terms.strong.top {margin: 0 0 1.3rem 0;}
	.pop_terms.strong {font-size:1.6rem;}
	.per_popcont {font-size: 1.3rem; line-height: 2.1rem;}
	.per_popcontTxt {padding: 0; position: relative;}
	
	.popuptitleBox {padding: 2rem 1rem 0rem 1rem;}
	.per_popcont {padding: 2rem 1rem;}
	
	.per_popup .ta5box {overflow: scroll;}
	.per_popup .ta5box table {width: 100%; overflow: scroll;}
	.per_popup .privSubTBox ul li {margin-bottom:2rem}
	
	.per_popup .privTBox h3 {
		font-size: 1.7rem;
		line-height: 2.2rem;
		word-break: keep-all;
	}
}
@media (max-width:767px) {
	.per_popup {width: calc(100% - 4rem); height: calc(100% - 4rem);}
	.pop_terms.strong {font-size: 1.4rem;}
	.per_popup .privTBox h3 {font-size: 1.4rem; line-height: 2rem;}
}

