/*form*/
/* form validator */
p{display:block;}
p.error{font-size:0;margin-left:0;color:0;}
.control-group{position:relative; display:inline-block;zoom:1;*display:inline;}
.control-group.warning>p,.control-group.warning .help-block,.control-group.warning .help-inline{color:#c33434;}
.control-group.warning input,.control-group.warning select,.control-group.warning textarea{color:#a11929;border-color:#c33434;}
.control-group.warning input:focus,.control-group.warning select:focus,.control-group.warning textarea:focus{border-color:#c33434;}
.control-group.warning .input-prepend .add-on,.control-group.warning .input-append .add-on{color:#c33434;background-color:#c33434;border-color:#c33434;}
.control-group.error>p,.control-group.error .help-block,.control-group.error .help-inline{position:absolute; left:0; bottom:-15; font-size:1rem; color:#fff;}
.agree.control-group.error>p,.agree.control-group.error .help-block,.agree.control-group.error .help-inline{position:absolute; left:0; bottom:-15; font-size:1rem; color:#fff;}
.select01 p.error, .select02 p.error{position:absolute; left:0; bottom:-15; font-size:1rem; color:#fff;}
.agree p.error{position:absolute; left:0; bottom:-15; font-size:1rem; color:#fff;}
.control-group.error input,.control-group.error select,.control-group.error textarea{color:#c33434;}
.control-group.error .input-prepend .add-on,.control-group.error .input-append .add-on{color:#c33434;}
/* browser placeholder */
::-webkit-input-placeholder {color:#555;}:-moz-placeholder {color:#555;opacity:1;}::-moz-placeholder {color:#555;opacity:1;}:-ms-input-placeholder{color:#555;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { /* WebKit browsers */ color:transparent; }
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color:transparent; }
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */ color:transparent; }
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */ color:transparent; }
/* form setting */
input,select,textarea,button{font-family: 'Noto Sans KR'; font-weight:100; border:0; border-radius:0;}
#form label{font-size:1.6rem; font-weight:400; color:#fff; padding-bottom:1rem; display:inline-block; position:relative; box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.name, .phone, .memo, .date, .select01, .select02, .email{width:100%; border-radius:0px;-moz-border-radius:0px;border-radius:0px; margin-bottom:3rem;}
.memo{margin-bottom:1rem;}
.name input, .phone input, .memo textarea, .date input, .select01 select, .select02 select, .email input{outline:none; border-radius: 5px; color:#333; font-size:1.8rem; border:1px solid #a3a3a3; padding:1.5rem 1.5rem 1.5rem 2rem; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background:#fff; font-weight:100;}
.memo textarea{height:115px;}
.name input:focus, .phone input:focus, .memo textarea:focus, date input:focus{color:#000;}
#user_name{background-position:left top !important}
#user_phone{background-position:left -70px !important}
#user_date{background-position:left -342px !important}
#user_select01{background-position:left -409px !important}
#user_select02{background-position:left -409px !important}
#user_comment{background-position:left -478px !important}
.agree{width:100%; cursor:pointer;}
#form .agree label{font-size:1.4rem;}
.agree input{width:16px; height:16px; margin-right:4px;background-color: #444;}
.agree a{margin: 0 0 0 4px; color: #fff; padding: 0.5rem 1rem; background: #000; font-size: 1.2rem; display: inline-block; border-radius: 5px;}
.agree a:link{color:#fff;}.agree a:visited,.agree a:active{color:#fff;}.agree a:hover{color:#fff; text-decoration:none;background-color: #444;}
/*date picker*/
#ui-datepicker-div{font-size:1.4rem;}
.ui-datepicker .ui-datepicker-header{background:none; border:0;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{background:none; text-align:center;}
.ui-state-default:hover, .ui-widget-content .ui-state-default:hover, .ui-widget-header .ui-state-default:hover{border:1px solid #444;; background:#444; color:#fff;}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{border:1px solid #000; background:#000; color:#fff;}

/*form*/
#formBg{padding:0 0 5rem;}
#form .tit-box{padding:5rem 0rem 0rem 0rem; text-align:center;}
#form .tit-box div img{width:140px;}
#form .tit-box h1{font-size:4rem;font-weight: 600; margin-top:2rem;}
#form .tit-box h2{font-size:2rem; margin-top:0rem;margin-bottom: 3rem;font-weight: 600;}
.form-info{margin-top: 3rem;}
.form-info div{margin-bottom:1rem;}    
.form-info div p{color:black;font-size:1.6rem;}
.form-info div p:first-child{font-weight:400;}
.form-info div p:last-child{font-weight:100;} 
.form-box{ margin:0 3rem; text-align:left;}
.form-btn{text-align:left; margin-top:3rem;}
.form-btn button{display:inline-block; font-family: 'NEXON Lv1 Gothic' ; color:#fff; padding:1rem 1.5rem; text-align:center; border-radius:10px; outline:none; box-shadow: 2px 2px 5px #0006; transition:0.2s; background:#000; font-size:1.8rem; display:inline-block; font-weight: bold;}
.form-btn button:hover{background:#2fbac6; transition:0.2s;}

@media screen and (min-width:1200px){
/* form setting */
#form label{font-size:1.8rem;color:#fff; padding-bottom:1rem; display:inline-block}
.name input, .phone input, .memo textarea, .date input, .select01 select, .select02 select{font-size:1.4rem;}    
#ui-datepicker-div{font-size:1.6rem;}    
    
/*form*/
#formBg{padding:0rem 0rem 11rem 0rem;background-repeat: no-repeat; background-size: cover;}
#form{position:relative;}
#form .tit-box div img{width:auto;}
#form .tit-box h1{font-size:7rem;  line-height:1.2em; margin-top:4.5rem;font-weight: 600; }
#form .tit-box h2{font-size:2.6rem;  line-height:1.2em; margin-top:1rem; font-weight: 500;}
.form-info{margin:4rem 0 0;}   
.form-info div p{font-size:2.4rem; display:inline-block;}
.form-info div p:first-child{margin-right:1rem;}
.form-box{width:100%; margin:1rem 0;}
.name, .phone, .date, .select01, .select02{width:48.8%; padding:0 0.5%;}
.email{width:98.9%; padding:0 0.5%;}

.form-btn button{font-size:2rem; margin-top:0; padding:12px 30px 10px}     
}
