@charset "utf-8";
/* 공통 */
#board {margin-top: 35px;}
#board:first-child {margin-top: 0;}



/* 작성 */
#board .write_bx .w_con {margin-bottom: 54px;}
#board .write_bx .w_con:last-child {margin-bottom: 0;}
#board .write_bx .w_con .w_con_ttl {font-size: 30px; color: #222222; font-weight: 700; word-break: keep-all; margin-bottom: 26px;}

#board .write_bx .agree_bx .txt {background-color: #fafafa; padding: 18px 20px; font-size: 16px; color: #333333; line-height: 26px; word-break: keep-all; box-sizing: border-box; height: 200px; overflow-y: auto;}
#board .write_bx .agree_bx .chk {position: relative; padding-left: 40px; font-size: 0; margin-top: 20px;}
#board .write_bx .agree_bx .chk input {position: absolute; left: 0; top: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; width: 30px; height: 30px; background: url(../images/icon/chk2.png) no-repeat center; border: 1px solid #aaa; border-radius: 50%; box-sizing: border-box; margin: 0; padding: 0; cursor: pointer;}
#board .write_bx .agree_bx .chk input:checked {background: url(../images/icon/chk1.png) no-repeat center #003b83; border-color: #003b83;}
#board .write_bx .agree_bx .chk label {font-size: 16px; color: #111111; letter-spacing: -0.05em; line-height: 30px; word-break: keep-all; display: inline-block; cursor: pointer;}

#board .write_bx .tb_bx {border-top: 2px solid #111111;}
#board .write_bx .tb_bx table {width: 100%; table-layout: fixed;}
#board .write_bx .tb_bx table tbody tr {border-bottom: 1px solid #dddddd;}
#board .write_bx .tb_bx table tbody th {width: 200px; box-sizing: border-box; padding: 15px 0 15px 30px; font-size: 18px; color: #222222; font-weight: 700; text-align: left; box-sizing: border-box; height: 90px;}
#board .write_bx .tb_bx table tbody th label.imp::after {content: '필수'; font-size: 0; display: inline-block; vertical-align: middle; width: 14px; height: 10px; background: url(../images/icon/chk3.png) no-repeat center; margin-left: 11px;}
#board .write_bx .tb_bx table tbody td {font-size: 16px; color: #333333; line-height: 24px; word-break: keep-all; box-sizing: border-box; padding: 15px 40px; height: 90px;}
#board .write_bx .tb_bx table tbody td input[type=text], #board .write_bx .tb_bx table tbody td input[type=password], #board .write_bx .tb_bx table tbody td input[type=tel], #board .write_bx .tb_bx table tbody td input[type=email] {width: 100%; outline: none; height: 60px; border: 1px solid #fafafa; background-color: #fafafa; box-sizing: border-box; padding: 0 20px; font-size: 16px; color: #111111; letter-spacing: -0.05em; word-break: keep-all;}
#board .write_bx .tb_bx table tbody td input[type=text]::placeholder, #board .write_bx .tb_bx table tbody td input[type=password]::placeholder, #board .write_bx .tb_bx table tbody td input[type=tel]::placeholder, #board .write_bx .tb_bx table tbody td input[type=email]::placeholder {color: #aaaaaa;}
#board .write_bx .tb_bx table tbody td input[type=text]:focus, #board .write_bx .tb_bx table tbody td input[type=password]:focus, #board .write_bx .tb_bx table tbody td input[type=tel]:focus, #board .write_bx .tb_bx table tbody td input[type=email]:focus {background-color: #fff; border-color: #222222;}
#board .write_bx .tb_bx table tbody td select {width: 100%; outline: none; height: 60px; border: 1px solid #fafafa; box-sizing: border-box; padding: 0 40px 0 20px; font-size: 16px; color: #111111; letter-spacing: -0.05em; word-break: keep-all; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url(../images/icon/arrow3.png) no-repeat right 19px center #fafafa;}
#board .write_bx .tb_bx table tbody td select:focus {background-color: #fff; border-color: #222;}
#board .write_bx .tb_bx table tbody td textarea {width: 100%; outline: none; height: 200px; border: 1px solid #fafafa; background-color: #fafafa; box-sizing: border-box; padding: 18px 20px; font-size: 16px; color: #111111; letter-spacing: -0.05em; word-break: keep-all; resize: none;}
#board .write_bx .tb_bx table tbody td textarea::placeholder {color: #aaaaaa;}
#board .write_bx .tb_bx table tbody td textarea:focus {background-color: #fff; border-color: #222222;}

#board .write_bx .tb_bx table .sub_txt {font-size: 16px; color: #111111; line-height: 24px; letter-spacing: -0.05em; word-break: keep-all; margin-top: 12px;}

#board .write_bx .tb_bx table .chk_bx {font-size: 0;}
#board .write_bx .tb_bx table .chk_bx li {display: inline-block; vertical-align: middle; margin-right: 60px; position: relative; padding-left: 26px;}
#board .write_bx .tb_bx table .chk_bx li:last-child {margin-right: 0;}
#board .write_bx .tb_bx table .chk_bx li input {appearance: none; -webkit-appearance: none; -moz-appearance: none; position: absolute; width: 20px; height: 20px; border: 1px solid #dfdfdf; border-radius: 50%; left: 0; top: 50%; margin-top: -10px; cursor: pointer;}
#board .write_bx .tb_bx table .chk_bx li input:checked {border-color: #0076f7;}
#board .write_bx .tb_bx table .chk_bx li label {font-size: 16px; color: #333333; line-height: 24px; word-break: keep-all; cursor: pointer;}
#board .write_bx .tb_bx table .chk_bx li label::before {content: ''; width: 12px; height: 12px; left: 4px; top: 50%; margin-top: -6px; border-radius: 50%; position: absolute; z-index: 1; background-color: #0076f7; display: none;}
#board .write_bx .tb_bx table .chk_bx li input:checked + label::before {display: block;}

#board .write_bx .tb_bx table .email_bx {display: flex; flex-flow: wrap; max-width: 874px;}
#board .write_bx .tb_bx table .email_bx input {width: calc(50% - 123px)!important;}
#board .write_bx .tb_bx table .email_bx span {line-height: 60px; text-align: center; width: 36px;}
#board .write_bx .tb_bx table .email_bx select {width: 200px!important; margin-left: 10px;}

#board .write_bx .tb_bx table .fileBox {position:relative; padding-left: 150px; width: 100%; box-sizing: border-box; height: 60px; max-width: 550px;}
#board .write_bx .tb_bx table .fileBox input[type=file]{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; top:0; left:0;}
#board .write_bx .tb_bx table .fileBox input[type=text]{width:100%; overflow: hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; max-width: 100%; padding-right: 66px;}
#board .write_bx .tb_bx table .fileBox label{position: absolute; left:0; top: 0; cursor: pointer; float:left; text-align:center; width:140px; color:#ffffff; background:#111111; font-size:18px; font-weight: 700; line-height: 60px; letter-spacing: -0.05em;}
#board .write_bx .tb_bx table .fileBox .del_btn {width: 66px; height: 60px; position: absolute; right: 0; top: 0; cursor: pointer; font-size: 0; background: url(../images/icon/delete.png) no-repeat center;}

#board .write_bx .tb_bx table .spam_bx {font-size: 0;}
#board .write_bx .tb_bx table .spam_bx .num_bx {display: inline-block; vertical-align: middle; margin-right: 20px;}
#board .write_bx .tb_bx table .spam_bx .num_bx .num_w {display: flex; flex-flow: wrap; border: 1px solid #dddddd; border-radius: 5px; height: 60px; max-width: 200px; overflow: hidden;}
#board .write_bx .tb_bx table .spam_bx .num_bx .l_bx {display:flex; justify-content:center; align-items:center; table-layout:fixed; box-sizing: border-box; width: 50%; position: relative;}
#board .write_bx .tb_bx table .spam_bx .num_bx .l_bx::before {content: ''; width: 1px; height: 20px; background-color: #dddddd; position: absolute; right: -1px; top: 50%; margin-top: -10px;}
#board .write_bx .tb_bx table .spam_bx .num_bx .l_bx img {max-width: 100%;}
#board .write_bx .tb_bx table .spam_bx .num_bx .r_bx {display:flex; justify-content:center; align-items:center; table-layout:fixed; box-sizing: border-box; width: 50%;}
#board .write_bx .tb_bx table .spam_bx .num_bx .r_bx input {background-color: #fff!important; text-align: center;}
#board .write_bx .tb_bx table .spam_bx .num_bx .r_bx input:focus {border-color: transparent!important;}
#board .write_bx .tb_bx table .spam_bx  .sub_txt {display: inline-block; vertical-align: middle; margin-top: 0;}

#board .write_bx .tb_bx table .w500 {max-width: 500px;}



/* 하단버튼 */
#board .btm_btn {font-size: 0; text-align: center; padding-top: 60px;}
#board .btm_btn a {display: inline-block; width: 100%; max-width: 280px; border: 1px solid #111111; background-color: #111111; border-radius: 35px; font-size: 18px; color: #ffffff; font-weight: 700; line-height: 68px;}


/* PC */
@media all and (min-width:1025px){
	
}

/* 태블릿&모바일 공통*/
@media all and (max-width:1024px){
    /* 공통 */
    #board {margin-top: 0;}
    
    
    
	/* 작성 */
    #board .write_bx .w_con {margin-bottom: 47px;}
    #board .write_bx .w_con .w_con_ttl {margin-bottom: 11px; font-size: 20px;}
    
    #board .write_bx .agree_bx .txt {font-size: 13px; line-height: 18px; height: 100px; padding: 8px 10px;}
    #board .write_bx .agree_bx .chk {padding-left: 20px; margin-top: 10px;}
    #board .write_bx .agree_bx .chk input {width: 15px; height: 15px; background-size: 8px auto!important;}
    #board .write_bx .agree_bx .chk label {font-size: 13px; line-height: 15px;}
    
    #board .write_bx .tb_bx {border-width: 1px;}
    #board .write_bx .tb_bx table tbody th {font-size: 14px; line-height: 19px; padding: 0 0 0 15px; height: 61px; width: 130px;}
    #board .write_bx .tb_bx table tbody th label.imp::after {width: 8px; background-size: 8px auto; margin-left: 7px;}
    #board .write_bx .tb_bx table tbody td {font-size: 13px; line-height: 18px; padding: 10px 15px; height: 61px; widows: 130px;}
    #board .write_bx .tb_bx table tbody td input[type=text], #board .write_bx .tb_bx table tbody td input[type=password], #board .write_bx .tb_bx table tbody td input[type=tel], #board .write_bx .tb_bx table tbody td input[type=email] {height: 40px; padding: 0 10px; font-size: 13px;}
    #board .write_bx .tb_bx table .email_bx select {height: 40px; padding: 0 20px 0 10px; font-size: 13px; background-size: 6px auto; background-position: right 10px center;}
    #board .write_bx .tb_bx table tbody td textarea {font-size: 13px; line-height: 18px; padding: 8px 10px; height: 100px;}
    
    #board .write_bx .tb_bx table .sub_txt {margin-top: 5px; font-size: 13px; line-height: 18px;}
    
    #board .write_bx .tb_bx table .chk_bx li {margin-right: 30px; padding-left: 15px;}
    #board .write_bx .tb_bx table .chk_bx li input {width: 10px; height: 10px; margin-top: -5px;}
    #board .write_bx .tb_bx table .chk_bx li label {font-size: 13px; line-height: 18px;}
    #board .write_bx .tb_bx table .chk_bx li label::before {width: 4px; height: 4px; margin-top: -2px; left: 3px;}
    
    #board .write_bx .tb_bx table .email_bx span {line-height: 40px;}
    
    #board .write_bx .tb_bx table .fileBox {padding-left: 75px; height: 40px; max-width: 100%;}
    #board .write_bx .tb_bx table .fileBox label {width: 70px; line-height: 40px; font-size: 13px;}
    #board .write_bx .tb_bx table .fileBox input[type=text] {padding-right: 32px;}
    #board .write_bx .tb_bx table .fileBox .del_btn {background-size: 12px auto; width: 32px; height: 40px;}
    
    #board .write_bx .tb_bx table .spam_bx .num_bx {margin-right: 10px;}
    #board .write_bx .tb_bx table .spam_bx .num_bx .num_w {height: 40px; border-radius: 3px;}
    #board .write_bx .tb_bx table .spam_bx .num_bx .l_bx img {max-width: 68px; width: 100%;}
    
    #board .write_bx .tb_bx table .w500 {max-width: 100%;}



    /* 하단버튼 */
    #board .btm_btn {padding-top: 30px;}
    #board .btm_btn a {max-width: 170px; line-height: 58px; font-size: 14px;}
}

/* 모바일 */
@media all and (max-width:768px){
    /* 작성 */
    #board .write_bx .tb_bx table tbody tr {display: block; width: 100%; padding: 11px 15px 15px; box-sizing: border-box;}
    #board .write_bx .tb_bx table tbody th {display: block; width: 100%; height: auto; padding: 0 0 13px;}
    #board .write_bx .tb_bx table tbody td {display: block; width: 100%; height: auto; padding: 0;}
    
    #board .write_bx .tb_bx table .chk_bx li {display: block; margin-right: 0; margin-bottom: 5px;}
    #board .write_bx .tb_bx table .chk_bx li:last-child {margin-bottom: 0;}
    
    #board .write_bx .tb_bx table .email_bx input {width: calc(100% - 105px)!important;}
    #board .write_bx .tb_bx table .email_bx input:first-child {margin-bottom: 5px;}
    #board .write_bx .tb_bx table .email_bx span {width: 23px; margin-bottom: 5px;}
    #board .write_bx .tb_bx table .email_bx select {width: 100px!important; margin-left: 5px;}
    
    #board .write_bx .tb_bx table .spam_bx .num_bx {margin-right: 0; display: block;}
    #board .write_bx .tb_bx table .spam_bx .num_bx .num_w {max-width: 100%;}
    #board .write_bx .tb_bx table .spam_bx .sub_txt {display: block; width: 100%; margin-top: 5px;}
}