@charset "utf-8";
/*
------------------------------------------------------------------------------------------------------------------------
폼메일 쓰기 스타일
------------------------------------------------------------------------------------------------------------------------
*/
#formmail-write { position:relative;  max-width: 1280px; margin-bottom:100px; font-size:18px;margin: 0 auto; }
#formmail-write .form-group { display:flex; margin-bottom:28px; align-items: center ;justify-content: start;gap:4rem ;}
#formmail-write .form-group>label { padding:0 20px; width:20% }
#formmail-write .form-group>div { width:80% }
#formmail-write .form-group.col4 label { width:100% ;color: #333; font-size: 2rem; font-weight: 600;}
#formmail-write .form-group.col4>div { width:50% }
#formmail-write .form-group.col4 .full { width:100% }
#formmail-write .form-group .form-control {margin-top: 12px; width:100%; padding:1.7rem 2.4rem; height: 7rem; line-height: 7rem; border:1px solid #E5E5EC ;border-radius: 8px;}
#formmail-write .form-group textarea{border-radius: 8px;
border: 1px solid #E5E5EC;padding: 1.7rem 2.4rem; margin-top: 12px; width: 100%; height: 16.4rem; 
background: #FFF;}
#formmail-write .form-group .form-control::placeholder{color: #999;}
.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 {
  width: 100%;
  height: 7rem;
  padding: 0 20px; /* 왼쪽은 16px, 오른쪽은 화살표 들어갈 공간 확보 */
  border-radius: 8px;
  border: 1px solid #E5E5EC;
  background: #FFF;
  font-size: 16px;
  appearance: none;   /* 기본 브라우저 화살표 제거 */
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  line-height: 7rem;
}

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

.select_wrap input::placeholder{color: #999;}
#formmail-write .form-footer { padding-top:60px; text-align: center;  }
#formmail-write .btn_submit { border-radius: 34px; color: #ffff; font-weight: 600; font-size: 1.8rem;
background: #067DFD; padding: 1.6rem 3.2rem; height: 6rem;  width: 18rem; }
#formmail-write .check-list { position:absolute; right:0; top:-30px }
#formmail-write .privacy-of-use {font-size:14px;padding:15px; border-top:1px solid #e0dedf; border-bottom:1px solid #e0dedf; height:150px; overflow-y:scroll }
#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 {  color:#8a8a8a; font-size:14px; }

.required_mark{color: #CC0000; font-size: 2rem; font-weight: 600;}






.screen-reader { /* 스크린 리더를 고려해서 체크박스를 화면에서 숨김 */
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    margin: -1px;
    clip-path: inset(50%);
}
.label-box {
    position: relative;
}

.check-icon {
    width: 1.4em;
    height: 1.4em;
    border-radius: 50%;
    background-color: #E5E5EC;
    border: 1px solid #E5E5EC;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.check-icon::before {
    content: "";
    position: absolute;
    box-sizing: border-box;
    width: 30%;
    height: 55%;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-70%) rotateZ(40deg);
    border-right: 1.7px solid #fff;
    border-bottom: 1.7px solid #fff;
}

[type="checkbox"]:checked + .label-box .check-icon {
    border-color:  #fff;
    background-color: #067DFD;
}
[type="checkbox"]:checked + .label-box .check-icon::before {
    border-color: #fff;
}




#formmail-write .radio_wrap{display: flex; gap: 7px 2%;margin-top: 0.8rem;}
#formmail-write .radio_wrap .box{width: 50%;}
#formmail-write .radio_wrap input[type=radio]{display: none;}
#formmail-write .radio_wrap label{font-size: 1.8rem; color: #a3a3a3; border: 1px solid #cbcbcb; height: 50px; border-radius: 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-weight: 400; gap: 0px 4px}
#formmail-write .radio_wrap label i{display: none;}
#formmail-write .radio_wrap input[type=radio]:checked + label{border: 1px solid #067DFD; color:#067DFD; font-weight: 500;}
#formmail-write .radio_wrap input[type=radio]:checked + label i{display: block;}


#formmail-write .form-group:last-of-type{margin-bottom: 0;}

.checkbox_wrap{padding: 18px 0;}
.checkbox_wrap input{padding: 18px 0;}
.checkbox_wrap{padding: 18px 0;}
.checkbox_wrap input{padding: 18px 0;}
/* 기본 라디오 숨김 */
.checkbox_wrap input[type="radio"] {
  display: none;
}

/* 라벨 스타일 */
.checkbox_wrap label {
  position: relative;
  cursor: pointer;font-weight: 500;
  font-size: 1.8rem; color: #505050;
  user-select: none;padding-left: 35px;
}

/* 라디오 버튼 모양 */


/* 선택됐을 때 안쪽 동그라미 */
.checkbox_wrap input[type="radio"] + label::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 50%;
  width: 10px;
  height: 10px;
  background: #E5E5EC; /* 파란색 */
  border-radius: 50%;
  transform: translateY(-50%);
}

.checkbox_wrap input[type="radio"]:checked + label::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 50%;
  width: 10px;
  height: 10px;
  background: #3460CA; /* 파란색 */
  border-radius: 50%;
  transform: translateY(-50%);
}

.checkbox_wrap input[type="radio"]:checked + label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 20px;
  height: 20px;
  border: 1px solid #3460CA;
  border-radius: 50%;
  transform: translateY(-50%);
  background: #fff;
}


.pop_wrap {display: none;position: fixed;top: 0;left: 0;background: rgb(0, 0, 0, 0.3);width: 100%;  height: 100%;  z-index: 9999;}
.pop_wrap .pop-inner {position: absolute;  top: 50%;  left: 50%;  transform: translate(-50%, -50%);  width: 90%;  max-width: 650px;  height: 50vh;  max-height: 600px;  padding: 50px 20px;  background: #fff;  border-radius: 20px;}
.pop_wrap .pop-inner h3{text-align: center;margin-bottom: 3rem;font-size: 2rem;}
.pop-close {  position: absolute;  top: 5px;  right: 5px;  width: 30px;  height: 30px;  cursor: pointer;line-height: 30px; font-size: 20px;}
.pop-close i{font-size: 24px;}
.pop-text{overflow-y: scroll; height: 100%;}
#formmail-write .pop-text p span{color: #111;}

.pop-btn1 { text-decoration: none;text-decoration-line: underline;
text-decoration-style: solid;
text-decoration-skip-ink: none;
text-decoration-thickness: auto;
text-underline-offset: auto;
text-underline-position: from-font;color: #505050; font-size: 1.8rem; font-weight: 600;}