._inquiry{
	--grayBg:#f5f5f5;
	--radius:9px;
	--grayColor:#ababab;
	--padding:30px;
	--inputH:60px;
}
._inquiry .contents{}
._inquiry .contents .wrap{
	padding: 130px 0;
}
._inquiry .contents .top{
	display: flex; align-items: flex-start; justify-content: space-between;
	margin-bottom: 50px;
}
._inquiry .contents .top h3{}
._inquiry .contents .top h3 div{}
._inquiry .contents .top h3 p{
	font-size: 64px; font-weight: 700; letter-spacing: -0.04em;
	color: var(--point-color-1); margin-bottom: 10px;
}
._inquiry .contents .top h3 small{
	font-size: 20px; font-weight: 500; letter-spacing: -0.04em;
	line-height: 1.3; color: #373737;
}
._inquiry .contents .top .infoBx{
	background-color: var(--grayBg); overflow: hidden; border-radius: var(--radius);
	display: flex; flex-wrap: wrap; column-gap: 40px; row-gap: 14px; padding: 30px; padding-right: 40px; box-sizing: border-box; line-height: 1.3;
}
._inquiry .contents .top .infoBx em{
	font-size: 20px; font-weight: 600; letter-spacing: -0.025em; color: var(--point-color-2);
}
._inquiry .contents .top .infoBx ul{}
._inquiry .contents .top .infoBx ul li{
	display: flex; align-items: center; flex-wrap: wrap;
	margin-bottom: 6px;
}
._inquiry .contents .top .infoBx ul p{
	color: #333333; letter-spacing: -0.025em;
	display: flex; align-items: center;
}
._inquiry .contents .top .infoBx ul p span{
	display: inline-block; min-width: calc(28/16*1em);
}
._inquiry .contents .top .infoBx ul small{}

._inquiry form{
	border-top: 2px solid #000; box-sizing: border-box;
}
._inquiry form .box{
	padding: 36px 0; box-sizing: border-box;
	border-bottom: 1px solid #d9d9d9;
	display: flex; justify-content: space-between;
	gap: 40px;
}
._inquiry form .box.last{
	border: 0; padding-bottom: 0;
}

._inquiry form .box h4{
	font-size: 40px; display: flex; font-weight: 700; white-space: nowrap;
}
._inquiry form .box h4.star{}
._inquiry form .box h4.star::after {
	content:'*'; display: block; margin-left: 0.1em; color: #083388;
}
._inquiry form .box .tit p{
	display: block; font-weight: 500;
	margin-top: 14px; color: #666;
}
._inquiry form .box .inputArea{
	max-width: 820px; width: 100%;
}

._inquiry form .flexBx{
	display: flex; gap: 10px;
}
._inquiry form .flexBx2{
	display: flex; flex-direction: column; gap: 10px;
}

/* select */
._inquiry form .box .inputArea .select{position: relative; font-size: 16px;}
._inquiry form .box .inputArea .select div{
	padding: 0 var(--padding); box-sizing: border-box;
	color: var(--grayColor); background-color: var(--grayBg);
	display: flex; align-items: center; justify-content: space-between;
	height: var(--inputH); border-radius: var(--radius); cursor: pointer;
	border: 2px solid var(--grayBg); font-weight: 500;
}
._inquiry form .box .inputArea .select.selected div{color: #000;}
._inquiry form .box .inputArea .select:focus div{border-color: var(--point-color-1);}

._inquiry form .box .inputArea .select div p{}
._inquiry form .box .inputArea .select div i{}
._inquiry form .box .inputArea .select ul{
	display: none;
	position: absolute; left: 0; top: 100%; margin-top: 6px;
	border-radius: var(--radius); background-color: var(--grayBg); color: var(--grayColor);
	width: 100%; overflow: hidden;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}
._inquiry form .box .inputArea .select ul li{
	padding: 0 var(--padding); box-sizing: border-box; height: var(--inputH);
	display: flex; align-items: center; cursor: pointer;
}
._inquiry form .box .inputArea .select ul li:hover{
	background-color: #444; color: #fff;
}

/* write */
._inquiry form .box .inputArea .write{
	font-size: 16px;
	background-color: var(--grayBg); padding: var(--padding); box-sizing: border-box;
	margin-top: 20px; border-radius: var(--radius); overflow: hidden;
	display: flex; flex-direction: column; gap: 10px;
	border: 2px solid var(--grayBg);
}
._inquiry form .box .inputArea .write.focus{border-color: var(--point-color-1);}
._inquiry form .box .inputArea .write > *{
	display: flex; align-items: flex-start; flex-wrap: wrap; line-height: 1.6;
	font-size: 18px;
}

._inquiry form .box .inputArea .write .labelBx{display: none;}
._inquiry form .box .inputArea .write .labelBx.on{display: block;}

._inquiry form .box .inputArea .write > * p{margin-right: 0.4em;}


._inquiry form .box .inputArea .write > *.noneblock{display: none;}
._inquiry form .box .inputArea .write > *.noneblock_p p:nth-child(1){display: block;}
._inquiry form .box .inputArea .write > *.noneblock_p p:nth-child(2){display: none;}

._inquiry form .box .inputArea .write.first_click > *.noneblock{display: flex;}
._inquiry form .box .inputArea .write.first_click > *.noneblock_p p:nth-child(1){display: none;}
._inquiry form .box .inputArea .write.first_click > *.noneblock_p p:nth-child(2){display: block;}



._inquiry form .box .inputArea .write > * em{
	display: flex; align-items: center; white-space: nowrap;  letter-spacing: -0.025em;
}
._inquiry form .box .inputArea .write > * input{
	height: 1.6em; letter-spacing: -0.025em; font-size: 16px;
	width: 100%; border: 0;
	background-color: transparent; padding-left: 6px; padding-right: 0;
}
._inquiry form .box .inputArea .write > * textarea{
	box-sizing: border-box; resize: none; font-size: 16px;
	/* border: 1px solid #e1e1e1; */
	border: 0 !important;
	background-color: #fff; margin-top: 8px;
	padding: 6px; border-radius: 4px; width: 100%; font-weight: 500;
	color: #000; line-height: 1.6; letter-spacing: -0.025em; height: 2.6em;
}
._inquiry form .box .inputArea .write > * textarea.height{height: 7em;}


/* 인풋 공통 */
._inquiry form .inputArea input[type='text']{
	width: 100%; height: var(--inputH); background-color: var(--grayBg);
	letter-spacing: -0.025em; font-size: 17px; border-radius: var(--radius);
	padding: 0 var(--padding); border: 2px solid var(--grayBg);
}
._inquiry form .inputArea input[type='text']::placeholder{
	color: var(--grayColor);
}

._inquiry form .inputArea textarea{
	width: 100%; background-color: var(--grayBg); height: 60px;
	letter-spacing: -0.025em; font-size: 17px; border-radius: var(--radius);
	padding: calc(var(--padding) / 2) var(--padding); border: 2px solid var(--grayBg);
	resize: none;
}

._inquiry form .inputArea input:focus,
._inquiry form .inputArea textarea:focus{
	border-color: var(--point-color-1);
}


/* 라디오 박스 */
.radio{margin-top: 30px;}
.radio > p{
	font-size: 22px; line-height: 1.3;
	margin-bottom: 10px; font-weight: 500; color: #666;
}
.radio > p span{font-size: 14px;}
.radio > div{
	display: flex; flex-wrap: wrap; column-gap: 20px; row-gap: 14px;
	background-color: var(--grayBg); padding: var(--padding);
	border-radius: var(--radius); border: 2px solid var(--grayBg); box-sizing: border-box;
}
.radio > div.focus{border-color: var(--point-color-1);}
.radio > div label{
	display: flex; align-items: center; gap: 4px; color: var(--grayColor); cursor: pointer;
}
.radio > div label:hover{color: #000;}
.radio > div label:hover input{border-color: #000;}
.radio > div label input{
	appearance: none;
    border-radius: 50%;
    box-sizing: border-box;
    width: 1em;
    height: 1em;
    border: 1px solid gray;
    cursor: pointer;
}
.radio > div label input:checked{
    border: 3px solid var(--point-color-1);
}
.radio > div label p{}
.radio > div label input:checked + p{color: #000;}




/* 라디오박스 2 */
.radio2{width: 100%;}
.radio2 input{
	display: none;
}
.radio2 div{
	background-color: var(--grayBg); border-radius: var(--radius); height: var(--inputH);
	font-size: 17px; font-weight: 500;
	display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.radio2 div:hover{background-color: #666; color: #fff;}
.radio2 div P{}

.radio2 input:checked + div{background-color: var(--point-color-1); color: #fff;}


/* 파일 첨부 + 약관 */
.file{
	display: flex;
}
.file label{
	display: flex; gap: 8px;
}
.file label.none{display: none;}
.file input{display: none;}
.file .left{
	border: 1px solid #ababab; box-sizing: border-box;
	border-radius: var(--radius); height: var(--inputH); width: 100%;
	padding: 0 var(--padding); box-sizing: border-box;
	display: flex; align-items: center; font-weight: 500;
	cursor: pointer;
}
.file .left i{
	color: var(--point-color-2); font-size: 17px; margin-right: 10px;
}
.file .left p{
	font-size: 14px; color: #ababab; padding-top: 2px; font-weight: 500; letter-spacing: -0.025em;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.file .left p.on{color: #000;}
.file .btn{
	width: 120px; height: var(--inputH); background-color: #000; color: #fff;
	border-radius: var(--radius); font-size: 14px;
	cursor: pointer;
	display: flex; align-items: center; justify-content: center; font-weight: 500;
	transition: background-color 0.2s;
}
.file .btn:hover{
	background-color: #666;
}
.file .btn p{}


.privacy{
	font-size: 14px; color: #ababab; letter-spacing: -0.025em; line-height: 1.6;
	border: 1px solid #dfdfdf; box-sizing: border-box; border-radius: var(--radius);
	margin-top: 20px; height: 230px; overflow: auto;
}
.privacy div{
	padding: 10px var(--padding);
}




/* 버튼 호버 효과 */
._hoverEffect{
	font-size: 22px; margin-top: 50px; margin-left: auto;
	display: flex; width: calc(248/22*1em); height: calc(67/22*1em);
	color: #717171; box-sizing: border-box;
	align-items: center; justify-content: center; position: relative;
	font-weight: 600; overflow: hidden; border-radius: calc(20/22*1em); border-top-right-radius: 0;
	transition: color 0.5s;
}
._hoverEffect::before {
	content:''; display: block; position: absolute; width: 100%; height: 100%;
	left: 0; top: 0;
	border-radius: calc(20/22*1em); border-top-right-radius: 0; border: 1px solid var(--point-color-1); box-sizing: border-box;
	transition: border-color .5s;
	z-index: 2;
}
._hoverEffect .circle{
	width: 0; height: 0; border-radius: 50%; background-color: var(--point-color-1);
	position: absolute;
	transform: translate(-50%,-50%);
	transition: width .8s,height .8s;
}
._hoverEffect p{
	position: relative;line-height: 1;
}
._hoverEffect i{
	position: absolute; right: calc(27/22*1em); font-size: 1.1em;
}

/* 호버 */
._hoverEffect:hover{color: #fff;}
._hoverEffect:hover .circle{width: 20em; height: 20em;}


@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
	._hoverEffect{font-size: 16px; margin-top: 40px;}
}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {}
@media screen and (max-width:500px) {
	._hoverEffect{font-size: 14px;}
}
@media screen and (max-width:320px) {}






@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
	._inquiry .contents .wrap{max-width: 740px;}

	._inquiry .contents .top{flex-direction: column; gap: 20px;}
	._inquiry .contents .top h3 p{font-size: 54px;}
	._inquiry .contents .top h3 small{font-size: 16px;}

	/* 하단 */
	._inquiry form .box{flex-direction: column;}
}
@media screen and (max-width:1024px) {

	._inquiry{
		--inputH:50px;
		--radius:4px;
		--padding:20px;
	}

	/* 하단 */
	._inquiry form .box{gap: 14px;}
	._inquiry form .box h4{font-size: 30px;}
}
@media screen and (max-width:820px) {
	._inquiry .contents .top h3 p{font-size: 44px;}


	/* 하단 */
	._inquiry form .box .inputArea .write > *.flexWrap{flex-wrap: wrap;}
	._inquiry form .box .inputArea .write > * textarea{margin-top: 10px; margin-left: 0;}
}
@media screen and (max-width:500px) {
	._inquiry .contents .wrap{padding: 80px 0;}
	._inquiry{--padding:10px;}

	._inquiry .contents .top{align-items: center;}
	._inquiry .contents .top h3{text-align: center;}
	._inquiry .contents .top h3 p{font-size: max(calc(44/500*100vw),34px);}
	._inquiry .contents .top h3 small{font-size: 15px; line-height: 1.4;}
	._inquiry .contents .top .infoBx{
		font-size: 14px; width: 100%; flex-direction: column; align-items: center;
		padding: 20px 10px;
	}
	/* ._inquiry .contents .top .infoBx ul li{justify-content: center;} */


	/* 하단 */
	._inquiry form .box h4{font-size: 20px;}
	._inquiry form .flexBx{flex-direction: column;}

	._inquiry form .box .inputArea .select{font-size: 14px;}
	._inquiry form .box .inputArea .write{font-size: 14px;}
	._inquiry form .box .inputArea .write > *{flex-wrap: wrap; font-size: 16px;}
	._inquiry form .box .inputArea .write > * input{font-size: 14px; width: 100%; background-color: #fff; padding: 4px; box-sizing: unset; margin-top: 10px;}
	._inquiry form .box .inputArea .write > * textarea{font-size: 14px;}

	._inquiry form .inputArea input[type='text']{font-size: 14px;}
	._inquiry form .inputArea textarea{font-size: 14px;}

	.radio2 div{font-size: 14px;}
	.radio > div label{font-size: 14px;}

}
@media screen and (max-width:320px) {}