@charset "utf-8";
/*
------------------------------------------------------------------------------------------------------------------------
폼메일 쓰기 스타일
------------------------------------------------------------------------------------------------------------------------
*/

#formmail-write {border-top:  1px solid #999; max-width: 1280px; width: 100%; margin: 0 auto; margin-top: 100px;}
#formmail-write .form-group {height: 70px; display: flex; align-items: center; border-bottom: 1px solid #e8e8e8;}
#formmail-write .form-group h2 { line-height: 70px; width: 20%; font-size: var(--fs16); background: #fafafa; padding-left: 15px; margin-right: 30px; ; position: relative; z-index: -1;}
#formmail-write .form-group h2 span {color: #ac1212; padding-left: 3px;}
#formmail-write .form-group h2 br {display: none;}

#formmail-write .form-group div {width: 80%; box-sizing: border-box; display: flex;}
#formmail-write .form-group span { font-size: var(--fs16); padding: 0 10px;}
#formmail-write .form-group input {height: 36px; line-height: 36px; font-size: var(--fs16); border: 1px solid #e6e6e6; width: 100%; padding-left: 10px; box-sizing: border-box;}
#formmail-write .form-group .ra_box {width: 80%;}
#formmail-write .form-group .num {display: flex; align-items: center;}


#formmail-write .form-group textarea {height: 99px; line-height: 24px; font-size: var(--fs16); border: 1px solid #e6e6e6; width: 100%; padding-left: 10px; box-sizing: border-box;}

#formmail-write .form-group1 {display: flex; justify-content: space-between; align-items: center;}
#formmail-write .form-group1 input {max-width: 110px; width: 30%;}

#formmail-write .form-group2 {display: flex; justify-content: space-between; align-items: center;}
#formmail-write .form-group2 input {max-width: 110px; width: 30%;}
#formmail-write .form-group2 select {line-height: 36px; height: 36px; font-size: var(--fs16); border: 1px solid #e6e6e6; margin-left: 10px;}

#formmail-write .form-group3 {height: 148px;}
#formmail-write .form-group3 h2 {line-height: 148px;}


#formmail-write .privacy-of-use-check {text-align: right; margin-top: 10px;}
#formmail-write .form-footer {text-align: center; margin-top: 50px;}
#formmail-write .form-footer button {font-size: var(--fs18); color: #fff; background: var(--main-color); border-radius: 30px; padding: 0 40px; height: 49px; line-height: 49px; display: inline-block;}

#formmail-write  .ra_box  .label {display: flex; align-items: center;}
#formmail-write .ra_box { display: flex;}
#formmail-write .ra_box input {width: auto;}


.ra_box label {
    position: relative;
    padding-left: 35px; /* 라디오 버튼 대신 이미지가 들어갈 위치 */
    margin-right: 15px; /* 라벨 간 간격 */
    cursor: pointer;
    font-size: 16px;
    display: inline-block;
}

.ra_box input[type="radio"] {
    display: none; /* 라디오 버튼 숨기기 */
}

.ra_box label:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 19px; /* 이미지 크기 */
    height: 19px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url('../../../img/ra_check.png'); /* 기본 이미지 */
}

/* 라디오 버튼 선택 시 배경 이미지 변경 */
.ra_box input[type="radio"]:checked + label:before {
    background-image: url('../../../img/ra_wcheck.png'); /* 선택된 이미지 */
}

@media all and (max-width: 1400px){

}
@media all and (max-width: 1200px){
}
@media all and (max-width: 1024px){

}
@media all and (max-width: 900px){
}
@media all and (max-width: 850px){
}
@media all and (max-width: 768px){
    #formmail-write {margin-top: 60px;}
    #formmail-write .form-group h2 { width: 25%;}
#formmail-write .form-group div {width: 75%;}
#formmail-write .form-group .ra_box {width: 75%;}

#formmail-write .form-group h2 {height: 70px; line-height: 1.2; display: flex; align-items: center;}
#formmail-write .form-group {}
#formmail-write .form-group .ra_box2 {display: flex; gap: 10px 0; flex-wrap: wrap; flex-direction: column; }
#formmail-write .form-group h2 br {display: block;}
#formmail-write .form-group2 {height: 120px;}
#formmail-write .form-group2 h2 {height: 120px;}
.ra_box label {font-size: 14px;}
}
@media all and (max-width: 360px){
    #formmail-write .form-group h2 { width: 32%;}
    #formmail-write .form-group div {width: 68%;}
    #formmail-write .form-group .ra_box {width: 68%;}
    .ra_box label {margin-left: 0px; padding-left: 22px;}
}