@charset "utf-8";

.inner_wrap .img_wrap {
    width: 1000px;
    margin: 0 auto;
}
.online {
    width: 100%;
}
.online_title {
    text-align: center;
}
.online_title h2 {
    font-weight: 200;
    text-transform: uppercase;
    color: rgb(255 193 37);
    font-size: 20px;
    letter-spacing: 1px;
}
.online_title h1 {
    font-size: 30px;
}
.online_title .sub_des {
    padding: 1.5rem 0;
    color: #777;
    word-break: keep-all;
}

.contact_line {
    border: 2px solid #bbb;
    padding: 3rem 2rem;
    box-sizing: border-box;
    background: whitesmoke;
}
.contact_line .textInput {
    height: 45px;
    width: 100%;
    border: 1px solid #aaa;
    padding: 5px 10px;
    box-sizing: border-box;
    display: block;
}
.textarea {
    width: 100%;
    height: 100%;
    border: 1px solid #aaa;
    padding: 10px;
    box-sizing: border-box;
    resize: none;
    display: block;
}

.agree.inline{
    text-align: center;
    margin: 1.5rem auto;
    padding-bottom: 20px;
}
.inq_btn {
    display: flex;
    justify-content: center;
    gap: 1rem;
}
.inq_btn .c_btn {
    height: 40px;
    width: 150px;
    border: 0;
    background: #000;
    color: #fff;
    box-sizing: border-box;
    border-radius: 5px;
} 
.online-de {
    padding-bottom: 1rem;
}
.online-de p {
    padding-bottom: 5px;
}

/* checkbox */
.todayDate .checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    justify-content: center;
    padding-bottom: 20px;
}

/* begin:checkbox-custom/radiobox-custom */
/* 체크박스/라디오박스와 글자 줄맞춤 */
.checkbox,
.radiobox {
  display: flex;
  align-items: center;
  cursor: pointer;
  justify-content: center;
}

/* 체크박스 인풋은 숨김처리 */
.checkbox input,
.radiobox input {
  display: none;
}

/* 체크박스 테두리 */
.checkbox_icon,
.radiobox_icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  background-color: #fff;
  border: 1px solid #aaa;
  position: relative;
  cursor: pointer;
  margin-right: 7px;
  margin-left: 7px;
  top: 4px;
}

/* 체크박스 가상요소 */
.checkbox_icon::before,
.checkbox_icon::after,
.radiobox_icon::before,
.radiobox_icon::after {
  content: '';
  /* 가상요소 필수값 */
  display: inline-block;
  /* 크기 지정 */
  width: 1px;
  height: 0;
  /* 체크박스가 체크가 되면 변화값으로 커지게 하기 위해 (일단 화면에는 나타나지 않음) */
  background-color: red;
  position: absolute;
  /* 체크박스 테두리 기준으로 위치조정 가능 */
  transform-origin: left top;
  /* 기울기 지정, 기준점을 왼쪽 상단 모서리로 (기본값은 중심임) */
}

/* 가상요소 before */
.checkbox_icon::before,
.radiobox_icon::before {
  top: 8px;
  /* 위치값 top */
  left: 2px;
  /* 위치값 left */
  transform: rotate(-45deg);
  /* 회전값 */
}

/* 가상요소 after  */
.checkbox_icon::after,
.radiobox_icon::after {
  top: 12px;
  /* 위치값 top */
  left: 8px;
  /* 위치값 left */
  transform: rotate(-135deg);
  /* 회전값 */
}

/* 체크되었을 때 테투리 설정 */
.checkbox input:checked+.checkbox_icon,
.radiobox input:checked+.radiobox_icon {
  border-color: #aaa;
}

/* 체크되었을 때 가상요소 before */
.checkbox input:checked+.checkbox_icon::before,
.radiobox input:checked+.radiobox_icon::before {
  height: 7px;
  /* 높이값 지정 */
  transition: all 0.15s ease;
  /* 0.15초 변화시간 줌 */
}

/* 체크되었을 때 가상요소 after */
.checkbox input:checked+.checkbox_icon::after,
.radiobox input:checked+.radiobox_icon::after {
  height: 15px;
  /* 높이값 지정 */
  transition: all 0.15s ease 0.15s;
  /* 0.15초 변화시간 + 딜레이 시간 줌 */
}
/* end:checkbox-custom/radiobox-custom */

@media all and (max-width: 1280px) {
    .inner_wrap .img_wrap {
        width: 100%;
    }
}

@media all and (max-width: 937px) {
    .online_title h2 {
        font-size: 18px;
    }
    .online_title h1 {
        font-size: 26px;
    }
    .online_title .sub_des {
        padding: 1.2rem 0;
        font-size: 15px;
    }
    .contact_line {
        padding: 2rem 1rem;
    }
    .agree.inline {
        margin: 1rem auto;
        padding-bottom: 5px;
        font-size: 15px;
    }
    #contact_form tr:last-child td.online-de {
        padding-bottom: 0;
    }
}

@media all and (max-width: 550px) {
    .online_title h2 {
        font-size: 16px;
    }
    .online_title h1 {
        font-size: 24px;
    }
    .online_title .sub_des {
        padding: 7px 0 10px;
        font-size: 14px;
    }
    .contact_line {
        padding: 1rem 10px;
    }
    .online-de {
        padding-bottom: 10px;
    }
    .inq_btn {
        gap: 10px;
    }
    .inq_btn .c_btn {
        width: 50%;
    }
    .checkbox_icon, .radiobox_icon {
        margin-left: 0;
        margin-right: 0;
    }
}