@charset "utf-8";


section { width: 100%; }
.container { margin: 0 auto; width: 100rem; }
.title_wrap { position: relative; }

.contact_title { margin-top: 15rem;  }
.contact_title > span { display: block; word-break: keep-all; }
.contact_title > span:nth-child(1) { font-size: 4rem; font-weight: 700; }
.contact_title > span:nth-child(2) { margin-top: 1rem; font-size: 3.6rem; font-weight: 300; line-height: 1.8; }
.contact_title > span:nth-child(2) > em { font-weight: 500; }

.arrow_icon { margin-left: 3rem; display: inline-block; width: 5rem; height: 5rem; line-height: 5rem; border: 0.1rem solid #000000; border-radius: 50%; text-align: center; }
.arrow_icon > i { font-size: 2rem;}



.form_container { width: 100%; margin: 0 auto; padding: 3rem 0; box-sizing: border-box; }
.form_wrap { width: 100rem; background: #ffffff; margin: 0 auto; padding: 1rem 4rem 4rem 4rem; box-shadow: 0.3rem 0.3rem 0.5rem 0.1rem rgba(0, 0, 0, 0.2); box-sizing: border-box;}

.half { width: 49% !important; }
.third { width: 31% !important; }
.quarter { width: 22.5% !important; }

.form_title { margin-top: 6rem; border-bottom: 0.1rem solid #02a0fc; padding-bottom: 1.8rem; box-sizing: border-box;}
.form_title > span { display: inline-block; font-size: 2.8rem; line-height: 1; color: #00629b; font-weight: 700; }
.form_title > i { font-size: 2.8rem; margin-left: 0.4rem; color: #02a0fc;}
.form_nt { margin-top: 0.6rem; }
.form_nt > span { font-size: 1.6rem; color: #555555; }

.form_table  { margin: 0 auto; }
.form_table .f_name { display: block; font-size: 1.4rem; color: #777777;}
.form_table > ul { display: flex; justify-content: space-between; flex-wrap: wrap;}
.form_table > ul > li { width: 100%; margin-top: 3rem;}

.form_table input { width: 100%; box-sizing: border-box; font-size: 1.6rem; height: 4.6rem; line-height: 4.6rem; padding: 0 0.6rem; background: transparent; border: 0; border-bottom: 0.1rem solid #cccccc; color: #000000; transition: border 0.4s ease;}
.form_table input::-ms-clear { display: none;}
.form_table input:focus { border-color: #000000; }

.form_table select{ width: 100%; box-sizing: border-box; font-size: 1.6rem; height: 4.6rem; line-height: 4.6rem; padding: 0 0.6rem; background: transparent; border: 0; border-bottom: 0.1rem solid #cccccc; color: #000000; transition: border 0.4s ease; }
.form_table select:focus{ border-color: #000000; }

.form_table textarea { width: 100%; height: 12rem; margin-top: 1rem; box-sizing: border-box; font-size: 1.6rem; line-height: 1.3; padding: 1rem; background: transparent; border: 0.1rem solid #cccccc; color: #000000; transition: border 0.4s ease; }
.form_table textarea:focus{ border: 0.1rem solid #000000;  outline: none;} 

.f_noti { display: inline-block; width: 100%; font-size: 1.2rem; font-weight: 300; color: #00629b; }
.f_noti > em { font-weight: 500; color: #2b2b2b; }


.flex_wrap { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.select_wrap { position: relative; width: 100%; box-sizing: border-box; background: transparent; border: 0; transition: border 0.4s ease;}
.select_wrap > i { position: absolute; top: 50%; right: 0.8rem; font-size: 1.8rem; transform: translateY(-50%) rotate(90deg); transition: all 0.3s ease; pointer-events: none; }
.select_wrap > select:focus + i { transform: translateY(-50%) rotate(-90deg); }

.email_wrap { display: flex; align-items: center; justify-content: space-between; font-size: 1.6rem; box-sizing: border-box;}
.email_wrap > input[type="text"] { width: 37.5%; ime-mode:inactive; }
.email_wrap > input[type="text"]:nth-child(3) { width: 25%; }
.email_wrap > em { display: inline-block; font-size: 1.6rem; }

.email_select_wrap { position: relative; width: 32%; box-sizing: border-box; background: transparent; border: 0; transition: border 0.4s ease;}
.email_select_wrap > i { position: absolute; top: 50%; right: 0.8rem; font-size: 1.8rem; transform: translateY(-50%) rotate(90deg); transition: all 0.3s ease; pointer-events: none; }
.email_select_wrap > select:focus + i { transform: translateY(-50%) rotate(-90deg);  }

.date_wrap { position: relative; width: 100%; box-sizing: border-box; }
.date_wrap > i { position: absolute; top: 50%; right: 0.8rem; font-size: 1.8rem; transform: translateY(-50%); pointer-events: none; cursor: pointer;}

/* 라디오버튼 */
.radio_wrap { display: flex; align-items: center; flex-wrap: wrap; }
.radio_wrap > li { margin-right: 2rem;}
.radio_wrap > li:last-child { margin-right: 0;}
.radio_wrap > li > input { display: none; }
.radio_wrap > li > label { display: flex; align-items: center; width: 100%; height: 4.6rem; line-height: 4.6rem; }
.radio_wrap > li > label > i { position: relative; display: inline-block; background: #f8fdff; width: 1.8rem; height: 1.8rem; border: 0.1rem solid #dddddd; border-radius: 50%; text-indent: -9999em; box-sizing: border-box; overflow: hidden; transform: translateY(0.1rem); margin-right: 0.6rem;}
.radio_wrap > li > label > i::after { opacity: 0; visibility: hidden; position: absolute; content: ''; width: 0; height: 0; border-radius: 50%; background: #00629b; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.4s ease;}
.radio_wrap > li > label > span { display: inline-block; font-size: 1.6rem; color: #777777; }
.radio_wrap > li > input:checked + label > i::after { opacity: 1; visibility: visible; width: 1rem; height: 1rem; }
.radio_wrap > li > input:checked + label > span { color: #000000; font-weight: 500; }

.agree_wrap { margin-top: 3rem; text-align: center; }
.agree_wrap > ul { margin-top: 2.4rem; text-align: center; }
.agree_wrap > ul li { font-size: 1.2rem;} 
.agree_wrap > ul li:first-child{ color: #607997; }
.agree_wrap > ul li:last-child{ margin-top: 0.3rem; color: #848484; display: flex; justify-content: center; align-items: center;}
.agree_wrap > ul li input[type="checkbox"] { appearance: auto; width: 1.6rem; height: 1.6rem; }
.agree_wrap > ul li .f_agree { font-size: 1.2rem; } 
.agree_wrap > ul li .f_agree label:last-child { margin-left: 1rem; } 
.agree_wrap > ul li .f_link { margin-left: 1rem; font-size: 1.2rem; } 

#agree_doc { clear: both; }
#agree_doc div { word-wrap: break-word; white-space: normal; padding: 1.6rem; width: 100%; height: 65rem;	box-sizing: border-box; }
#agree_doc div p{ border: 0.1rem solid #848181; width: 100%; height: 100%; font-size: 1.4rem; line-height: 2.8rem; padding: 1.6rem; box-sizing: border-box; overflow-Y: scroll; }

input[id*="popup"]{
	display:none;
}
input[id*="popup"] + label {
	display: inline-block;
}

input[id*="popup"] + label + div {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s ease;
}
input[id*="popup"]:checked + label + div {
	opacity: 1;
	visibility: visible;
}

input[id*="popup"] + label + div > div {
	position: absolute;
	top: 50%;
	left: 50%;
	transform:translate(-50%,-50%);
	min-width: 34rem;
	height: 80%;
	background: #FFFFFF;
	z-index: 2;
	color: #000000;
	text-align: left;
	font-size: 1.8rem;
	padding: 0;
}

input[id*="popup"] + label + div > div > label{
	position: absolute;
	top: 0;
	right: 0;
	transform:translate(40%, -40%);
	padding: 0.8rem 1.3rem;
	background: #dd5347;
	border-radius:100%;
	z-index: 1;
	font-size: 2rem;
	color: #FFFFFF;
}

input[id*="popup"] + label + div > label{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.6);
	z-index: 1;
}

.btn_wrap { width: 100%; margin-top: 3rem; padding: 2rem 3rem; background: #FFFFFF; border-top: 0.1rem solid #f2f2f2;border-bottom: 0.1rem solid #f2f2f2; box-sizing: border-box;}
.btn_wrap .write_btn { display: block; width: 100%; padding: 1.6rem; font-size: 1.8rem; background: #02a0fc; color: #ffffff; text-align: center; border-radius: 0.8rem; box-sizing: border-box;}

.footer	{ width: 100%; background: #2e3135; text-align: center; }
.footer > span { display: block; padding: 2rem; font-size: 1.8rem; color: #ffffff; }

/* 로딩 버튼 */
#loadingDiv { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 99999; background: rgba(0,0,0,0.5);}
#loadingDiv > div { position: relative; width: 100%; height: 100%; }
#loadingDiv > div img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }

.form_wrap input::-webkit-input-placeholder { color: #999999; font-size: 1.4rem !important; font-weight: 400; }
.form_wrap input:-ms-input-placeholder { color: #999999; font-size: 1.4rem !important; font-weight: 400; }
.form_wrap textarea::-webkit-input-placeholder { color: #999999; font-size: 1.4rem !important; }
.form_wrap textarea:-ms-input-placeholder { color: #999999; font-size: 1.4rem !important;  }

.simple_footer { min-width: 120rem; padding: 2rem 1rem; background: #000000; text-align: center;}
.simple_footer > span { color: #FFFFFF; font-size: 1.6rem;}
.simple_footer > span > em { color: #c7edff; font-weight: 500;}

#floating_bn { display: none; }

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



    .container { margin: 0 auto; width: 100%; }

    .contact_title { margin-top: 10rem; padding: 3.6rem; }
    .contact_title > span:nth-child(1) { font-size: 2.8rem; }
    .contact_title > span:nth-child(2) { margin-top: 0; font-size: 2.6rem; }
    .contact_title > span:nth-child(2) > em { font-weight: 500; }
    
    .form_container { padding: 0 1.6rem 3rem 1.6rem; }

	.form_wrap { width: 100%; padding: 0 1.6rem 2rem 1.6rem; }

    .form_table > ul > li.half { width: 100% !important; }

	.form_title { padding-bottom: 0.8rem; }
	.form_title > span { font-size: 1.8rem; }
	.form_title > i { font-size: 1.8rem; }
	.form_nt > span { font-size: 1.2rem; }

	.form_table input { font-size: 1.4rem; height: 4rem; line-height: 4rem; }
	.form_table select{ font-size: 1.4rem; height: 4rem; line-height: 4rem; }

	.f_noti { font-size: 1rem; }

	.select_wrap > i { font-size: 1.4rem; }

	.email_wrap > input[type="text"] { width: 32%; }
	.email_wrap > input[type="text"]:nth-child(3) { width: 29%; }
	.email_wrap > em { display: inline-block; font-size: 1.2rem; }

	.email_select_wrap { width: 30%; }
	.email_select_wrap > i { font-size: 1.4rem; }

	.date_wrap > i { font-size: 1.4rem; }
	
	.radio_wrap > li > label { height: 4rem; line-height: 4rem; }
	.radio_wrap > li > label > span { font-size: 1.4rem;}

	.agree_wrap > ul{ margin-top: 1rem; }
    .agree_wrap > ul li:first-child{ font-size: 1.2rem; }

	.agree_wrap ul li .f_agree label:last-child { margin-left: 0; margin-top: 0.3rem; display: block; text-align: right; } 

	.btn_wrap { margin-top: 3rem; padding: 1rem 1.6rem; }
	.btn_wrap .write_btn { padding: 1rem; font-size: 1.6rem; }
	
	
	.form_wrap input::-webkit-input-placeholder { color: #999999; font-size: 1.2rem !important; font-weight: 400; }
	.form_wrap input:-ms-input-placeholder { color: #999999; font-size: 1.2rem !important; font-weight: 400; }
	.form_wrap textarea::-webkit-input-placeholder { color: #999999; font-size: 1.2rem !important; }
	.form_wrap textarea:-ms-input-placeholder { color: #999999; font-size: 1.2rem !important;  }

	.simple_footer { min-width: 0; width: 100%; padding: 1rem 0.4rem; }
	.simple_footer > span { font-size: 1rem;}

}