
html {font-family: 'Pretendard';}


/* PC ������ */

@media screen and (max-width: 1440px) {    
    html {font-size: 17px}
    .nav_ul {  width: 355px;}    
}


@media screen and (max-width: 1360px) {    
    html {font-size: 16.5px}
    .nav_ul {  width: 350px;}}
    

@media screen and (max-width: 1200px) {    
    html {font-size: 16px}
    .nav_ul {  width: 325px;}    
}

@media screen and (max-width: 1080px) {    
    html {font-size: 14px}    
    .nav_ul { width: 285px;}
    #m_sub_menu4 { width: 470px;}
    #nav > li { font-size: 0.85rem;}
    .nav_ul li {  font-size: 0.7rem; }        
}   

.filebox input[type="file"] {  display: none; }
.filebox label {font-family: 'Pretendard'; display: inline-block;  width: 20%;  height: 41px;  text-align: center;  color: #fff;  font-size: 1rem;  line-height: 41px;  letter-spacing: -0.35px;  vertical-align: middle;  background-color: #898A8A;  cursor: pointer;  }

input:focus { outline-offset: 0px; outline: -webkit-focus-ring-color auto 0px;}
textarea:focus {outline-offset: 0px;outline: -webkit-focus-ring-color auto 0px; }

select {    
    /* ����Ƽ�� ���� ���߱� */ 
    -webkit-appearance: none;  
    -moz-appearance: none; 
    appearance: none;
}

/* IE 10, 11�� ����Ƽ�� ȭ��ǥ ����� */
select::-ms-expand { display: none; }
select {
    width: 100%; 
    /* ���ϴ� �ʺ��� */
    padding: 0px 45px 0px 15px;                                    
    /* �������� ���� ���� */                                    
    font-family: inherit;                                    
    /* ��Ʈ ��� */                                    
    background: url(../image/select.png) no-repeat 95% 50%;
    /* ����Ƽ�� ȭ��ǥ ��ü */                                    
    border: 0px solid #999;                                    
    border-radius: 0px;                                    
    /* iOS �ձٸ𼭸� ���� */                                    
    -webkit-appearance: none;                                    
    /* ����Ƽ�� ���� ���߱� */                                    
    -moz-appearance: none;                                    
    appearance: none;                                    
    cursor: pointer;                                    
    text-align-last: left; 
    
    background-color: transparent;
}

.container{width: 100%; box-sizing: border-box; max-width: 1200px; margin-top: 5vh; position: relative;}
.form_box{border-top: 1px solid #808080; border-bottom: 1px solid #808080; position: relative; padding: 10px 0; margin-bottom: 6vh;}
.form_box::before{content: '';width: 13%;height: 100%;position: absolute;left: 0;top: 0;background: #f2f2f2;z-index: -1;}

.form_inner{ font-size: 0px; width: 100%; margin: auto; box-sizing: border-box;}

#mail_to {margin-bottom: 30px; display: none;}
.mail_to_c {  color: #000000;  font-size: 1rem;  font-weight: 800;  width: 180px;  border: 1px solid #ddd;  padding: 5px;}

.f_title{font-size: 1.1rem; font-weight: 300; color: #404040; width: 12%; height: 40px; display: inline-block; vertical-align: top; box-sizing: border-box; padding-left: 20px; padding-top: 8px; line-height: 40px; }                   
.f_title .color1 {color: #404040; font-weight: 300; padding-left: 5px; }
.f_cont{clear: both;height: 40px;padding-left: 15px;padding-right: 15px;margin: 14px 0;width: 85%;display: inline-block;box-sizing: border-box;background-color: #fff;vertical-align: top;border: 1px solid #ddd;margin-left: 3%;}
.f_cont.width50 {width: 80%}

.f_cont_num{clear: both;height: 40px;padding-left: 15px;padding-right: 15px;margin: 14px 0;width: 85%;display: inline-block;box-sizing: border-box;background-color: #fff;vertical-align: top;border: 1px solid #ddd;margin-left: 3%;}
.f_cont_num.icon { width: 3%;  background-color: transparent;  padding: 0px;  text-align: center; border-bottom: 0px; border: 0px}

.f_cont_email{clear: both;height: 40px;padding-left: 15px;padding-right: 15px;margin: 14px 0;width: 30%;display: inline-block;box-sizing: border-box;background-color: #fff;vertical-align: top;border: 1px solid #ddd;margin-left: 3%;}
.f_cont_email#form_mail_3 {width: 46%;}
.f_cont_email.icon { width: 3%;  background-color: transparent;  padding: 0px;  text-align: center; border-bottom: 0px; border: 0px;}

.f_cont2{clear: both;padding-left: 15px;padding-right: 15px;margin: 14px 0;width: 85%;display: inline-block;box-sizing: border-box;background-color: #fff;vertical-align: top;border: 1px solid #ddd;margin-left: 3%;}
.f_cont3{clear: both;margin: 14px 0;width: 85%;display: inline-block;box-sizing: border-box;vertical-align: top;margin-left: 3%;}
.f_cont4 { clear: both;  margin-bottom: 60px;  width: 83%;  display: inline-block;  box-sizing: border-box; vertical-align: top  }

.f_cont p { color: #808080; font-size: 1.1rem; height: 25px; line-height: 25px; padding: 7px 0px;}
.f_cont_num p { color: #808080; font-size: 1.1rem; height: 25px; padding: 7px 0px; line-height: 25px;}
.f_cont_email p { color: #808080; font-size: 1.1rem; height: 25px; padding: 7px 0px; line-height: 25px;}

#form_send_1 { width: 100%;  text-align: center; }

.f_input { width: 100%; height: 25px;  color: #B2B2B2; border: 0px; background-color: transparent;}
.f_input_radio { margin-right: 5px;}
.form_cate_span {margin-right: 10px;}
.f_input2 { height: 230px;  width: 100%; color: #B2B2B2; padding-top: 10px;  border: 0px;; background-color: transparent;}
.upload-name { display: inline-block;  padding: 0px 8px;  font-size: 0.8rem;  line-height: 40px;  color: #808080;  vertical-align: middle;  background-color: #fff;  border: 0px;  -webkit-appearance: none;  -moz-appearance: none;  appearance: none; border: 1px solid #ddd;  width: 78%;  margin-right: 2%;  box-sizing: border-box;}

.captcha_img {height: 28px; width: auto; margin: 6px 10px 6px 0px;  display: inline-block; vertical-align: top;}
.refresh {font-size: 25px; color: #000000; cursor: pointer; display: inline-block; line-height: 40px; margin-right: 20px; vertical-align: top;}
.captcha_input { display: inline-block;  padding: 0px 8px;  font-size: 0.8rem;  line-height: 40px;  color: #808080;  vertical-align: middle;  background-color: #fff;  border: 0px;  -webkit-appearance: none;  -moz-appearance: none;  appearance: none;  border: 1px solid #ddd;  width: 110px;  box-sizing: border-box;}





.submit{font-size: 1rem; font-weight: 300; line-height: 35px; height: 45px; color: #fff; width: 100%; max-width: 150px;  
    text-align: center;  margin: 10px 20px;   cursor: pointer;  transition: all 0.4s;  background-color: #404040;  border: 1px solid #404040; font-family: 'Pretendard'; }
.reset{font-size: 1rem; font-weight: 300; line-height: 35px; height: 45px; color: #404040;  width: 100%; max-width: 150px; 
    text-align: center;  margin: 10px 20px; background-color: #404040; cursor: pointer; transition: all 0.4s; background-color: #fff; border: 1px solid #404040;  font-family: 'Pretendard';   }





.block {display: block; }

.checkbox {
    font-family: 'Pretendard';
    text-align: center;   
    font-size: 1rem;
    line-height: 1.3;
    letter-spacing: -0.9px;
    color: #4D4D4D;
    margin-bottom: 22px;
    transform: skewX(-0.3deg);
}
.checkbox input {
    vertical-align: middle;
    width: 20px;
    height: 20px;
    margin-right: 5px;
}


input::placeholder {color:#ccc; font-size: 0.9rem; font-family: 'Pretendard';}
input::-webkit-input-placeholder {color:#ccc; font-size: 0.9rem; font-family: 'Pretendard';}
input:-ms-input-placeholder {color:#ccc; font-size: 0.9rem; font-family: 'Pretendard';}
textarea::placeholder {color:#ccc; font-size: 0.9rem;font-family: 'Pretendard';}
textarea::-webkit-input-placeholder {color:#ccc; font-size: 0.9rem; font-family: 'Pretendard';}
textarea:-ms-input-placeholder {color:#ccc; font-size: 0.9rem; font-family: 'Pretendard';}






@media screen and (max-width: 840px) {
    html {font-size: 14px;}
    .form_box::before{display: none;}
    .container{padding: 30px 0 60px;}
    .f_input {font-size: 1rem;}
    .f_title{font-size: 1.1rem; width: 100%; transform: skew(-0.3deg); border-right: 0; padding-left: 0;}
    .f_cont.width50 {width: 100%;}
    .f_cont{margin-bottom: 20px;}
    .f_cont_email{width: 39%; margin-bottom: 20px;}
    .f_cont_email.icon {/* width: 7%; */}
    .f_cont_num {width: 100%; margin-bottom: 20px;}
    .f_cont_num.icon {width: 3.5%;}
    select{padding: 0;}
    .f_cont{width: 100%;}
    .f_cont2{width: 100%; margin-bottom: 20px;}
    .f_cont3{width: 100%;}
    .submit{font-size: 1.1rem; width: 130px; margin: 10px;}
    .reset{font-size: 1.1rem; width: 130px; margin: 10px;}
    .f_cont_email#form_mail_3{width: 49%;}
}

@media screen and (max-width: 460px) {
    .container{margin-top: 0;}
    .submit{width: 100px;}
    .reset{width: 100px;}
    select{background-size: 12px;}
    .refresh{margin-right: 10px;}
    .captcha_input{width: 80px;}
    .f_cont4{width: 100%;}

}


#form_number_1{position: relative;}
#selboxDirect{position: absolute; width: 80%; left: 50%; top: 50%; transform: translate(-50%,-50%);}
