@charset "utf-8";
/*
------------------------------------------------------------------------------------------------------------------------
폼메일 쓰기 스타일
------------------------------------------------------------------------------------------------------------------------
*/
#formmail-write { position:relative;  width:100%;  font-size:18px }
#formmail-write>h3{margin-bottom: 3.2rem; font-size: 3.2rem;}
#formmail-write .form-body {display: flex; flex-direction: column; gap: 7rem;margin-bottom: 12rem; }
#formmail-write .form-group { display:flex; align-items: center; gap:4rem ; }
#formmail-write .form-group2  { display:flex; flex-direction: column; gap: 8px; align-items: start;  }
#formmail-write .form-group2>div{width: 100%;}
#formmail-write .form-group2 .wrap{display: flex; justify-content: start; align-items: center; gap: 10rem; }
#formmail-write .form-group2 .wrap>div{display: flex; justify-content: start; align-items: center; gap: 12px;}
#formmail-write .form-group2 .wrap>div b{font-size: 2rem; font-weight: 600; }
#formmail-write .form-group2 .wrap>div span{color: #767676;}
#formmail-write .form-group2 h4{font-weight: 600; margin-bottom: 2rem; margin-top: 3.3rem;}
#formmail-write .form-group2 h5{color: #505050; font-weight: 600;}
#formmail-write .col4 .item{width: 50%; display: flex; flex-direction: column; gap: 8px;}
#formmail-write .input_name{color: #505050; font-size: 2rem; font-weight: 600;}
#formmail-write .form-group>div { width:80% }
#formmail-write .form-group.col4>label { width:20% }
#formmail-write  .col4 input{ width:100%; padding:17px 12px;border-bottom: 1px solid #505050; height: 72px; background-color: transparent;}
#formmail-write  .col4 input[type="checkbox"]{width: 20px;height: 20px;border: 1px solid #e5e5ec; background-color: #f7f7f7;border-radius: 0; margin-right: 8px;}
#formmail-write  .col4 input[type="date"]{border: none;border-bottom: 1px solid #505050;}
#formmail-write .form-group .form-control::placeholder{color: #999;font-weight: 500;}
#formmail-write .form-footer { padding-top:6rem;  text-align: center;border-top: 1px solid #DBDBDB;  }
#formmail-write .btn_submit {background-color: #111; width: 22rem;height: 6rem; line-height: 6rem; text-align: center; color: #fff; font-weight: 600; border-radius: 0;}
#formmail-write .check-list { position:absolute; right:0; top:-30px }
#formmail-write .privacy-of-use {border-bottom: 1px solid #505050; height:85px; overflow-y:scroll;color: #505050; font-size: 1.6rem;  }
#formmail-write .privacy-of-use .cont {margin-bottom:15px;}
#formmail-write .privacy-of-use h4 {margin-bottom: 5px}
#formmail-write .privacy-of-use dl { padding:10px 0}
#formmail-write .privacy-of-use dl dt { font-weight: 600}
#formmail-write .privacy-of-use dl dd { margin-left: 20px}
#formmail-write .privacy-of-use ul { margin-left:20px }
#formmail-write .privacy-of-use ul li { margin-top:5px }
#formmail-write .privacy-of-use table { width:100%; border-collapse: collapse }
#formmail-write .privacy-of-use table th,
#formmail-write .privacy-of-use table td { border:1px solid rgb(226,226,226); padding:5px }
#formmail-write .privacy-of-use table th { background:rgb(245,245,247) }

#formmail-write .privacy-of-use-check { text-align: right; margin-bottom: 6rem; text-align: center;margin-top:1.6rem ;}
#formmail-write .privacy-of-use-check label{font-weight: 400;}
.required_mark{color: #CC0000; font-weight: 600;}
#formmail-write textarea{background-color: transparent; padding: 2.3rem 0 ;border-bottom: 1px solid #505050;width: 100%; }

.file-group .hidden_file{position: absolute;margin-left:500px;}
.file-group .file_text{overflow: hidden;}
.file-group .file_upload{background: transparent;width: 100px;height: 100%;display: flex;align-items:center;justify-content:start;color:#000;}
.file-group  input[name = 'wr_8_del']{display: none;}
.file-group .file_delx2{width: 100px; height: 100%; background: #eee; font-size: 1.6rem; display: flex; justify-content: center; align-items: center;}

.file-group .file_del{position: relative;display: inline-flex;align-items:center;}
.file-group .file_del input{display: none;}
.file-group .file_del span{display: inline-block;width: 17px;height: 17px;border: 1px solid #c8ccd4;background: #fff;border-radius:3px;transition:background 0.2s ease;position: absolute;left:0;top:50%;transform:translateY(-50%);}
.file-group .file_del span::after{content:"";position: absolute;top:1px;left:5px;width: 5px;height: 11px;border-right: 2px solid #fff;border-bottom: 2px solid #fff;transform:rotate(45deg) scale(0);transition:all 0.3s ease 0.15s;opacity:0;}
.file-group .file_del label{cursor:pointer;padding-left: 23px;position: relative;z-index: 1;word-break:break-all;display: inline-block;line-height: 1em;}
.file-group .file_del label.sound_only{width: 17px;height: 17px;}
.file-group .file_del label.sound_only .sch_word{display: none !important;}
.file-group .file_del input:checked ~ span{border-color: transparent;background: #1c54a7;animation: checkbox-jelly 0.6s ease;}
.file-group .file_del input:checked ~ span:after{opacity:1;transform:rotate(45deg) scale(1);}

.file-group{width: 100%;}
.file_wrap{display: flex; align-items: center;width: 100%;}
.file-group .write_box{display: flex; background: transparent; position: relative;   width: 100%;}
.file-group .write_box input{background: transparent; width: 100%;width: 31%; }
.file_upload{width: 100%!important;position: absolute;top: 0; left: 0;}
.file_box{width: 96%;margin-bottom: 4px;}
#formmail-write .form-group .content_box2 .file_name{width: 100%;}
.file_btn{margin-left: 87%;background-color: #2f333e; color: #fff; text-align: center;height: 7.2rem; width: 16rem; border: none;font-size: 1.8rem;}
.file_btn_plus{color: #fff; text-align: center;border: none;display: inline-block;position: absolute; top: 0px ; right: 0%; width: 7.2rem;}
.file_btn_plus img{width: 100%;}

.file_wrap {display: flex;position: relative;} 
.file_wrap label{width: 20%; font-size: 2rem; font-weight: 500; color: #000022;}
.file_wrap input{width: 85% !important;}

select{width:100%; padding:17px 12px;border: none; border-bottom: 1px solid #505050; height: 72px; background-color: transparent; }
.select_wrap {
  position: relative; display: flex; justify-content: space-between; align-items: center;
  width: 100%;gap: 2rem;
}
.select_wrap .select_box{width: 100% ; margin-top: 12px; position: relative;}
.select_wrap select {
position: relative; display: flex; justify-content: space-between; align-items: center;
  width: 100%;gap: 2rem;  appearance: none;  
}

/* 화살표 이콘 삽입 */
.select_box::after {
  content: "";
  background: url(../../../img/arrow2.png)no-repeat center/cover;
  width: 28px; height: 28px;
  color: #555;
  position: absolute;
  right: 16px;
  top: 50%;display: block;
  transform: translateY(-50%);
  pointer-events: none; /* 화살표 클릭해도 select 동작되게 */
}

.select_wrap input::placeholder{color: #999;}


.address_input_btn{border: 1px solid #111; height: 7.2rem;text-align: center; color: #111; font-weight: 500;background-color: #fff;width: 16rem; margin-left: 15px;}
.address_btn{width: 33%; display: flex; justify-content: space-between; align-items: center;}
.addr_input .address_padding{margin: 2rem 0;}