body, html {
  font-family: 'ArtPass', sans-serif;
  line-height: 1.5;
  font-size: 23px;
  font-weight: 400;
  margin: 0;
  text-align: left;
  -webkit-font-smoothing: antialiased;
  color:#000;
  background-color: #fff;
}

/* 타이포그래피 추가 */
h1 {
  font-size: 42px;
  font-weight: 700;
  line-height: 1.5;
  margin:0;
}

h2 {
  font-size: 30px;
  font-weight: 400;
  line-height: 1.5;
  margin:0;
}

p {
  font-size: 23px;
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
}

b, strong {
  font-size: 23px;
  font-weight: 700;
  line-height: 1.5;
}

.caption {
  font-size: 16px;
  line-height: 1.5;
}
.tit_top{
  font-size: 23px;
  padding:15px 0;
  border-bottom:1px solid #000
}
.tit{
  padding: 100px 0 80px 0
}
.tit .tit_box{
  margin-bottom:60px
}
.tit .tit_desc{
  display: flex;
  flex-direction: column;
  gap:10px
}
.tit1{
  font-size: 74px;
  font-weight: 700;
}
/* 인풋 */
.input_wrap {
  display: flex;
  flex-direction: column;
  text-align: left;
}
.input_wrap.description .input_box{
  border-bottom:1px solid #000
}
.input_wrap .input_box{
  padding: 40px 0;
  display: flex;
}
.input_wrap .label{
  width: 200px;
  font-weight:700;
  text-align: left;
}
.input_wrap .input_box .box{
  text-align: left;
  width:100%;
  display: flex;
  flex-direction: column;
  gap:10px
}
.input_wrap .list{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.input_wrap .list li{
  padding-left: 10px;
  position:relative;
  top:0;
  left:0  
}
.input_wrap .list li:after{
  display:block;
  content:"";
  clear:both;
  width: 5px;
  height:2px;
  border-radius:50%;
  background-color: #000;
  position:absolute;
  top:15px;
  left:0;
}

input[type="text"],
input[type="tel"],
input[type="number"] {
  width: 100%;
  border: none;
  border-bottom: 1px solid #000;
  padding: 8px 0;
  font-size: 23px;
  line-height: 1.5;
  outline: none;
  background: transparent;
}

input[type="text"]::placeholder,
input[type="tel"]::placeholder {
  color: #999;
}

ul, li{
  margin: 0;
  padding: 0;
  list-style: none;
}
button{
  border:0;
  background:transparent;
  border:0;
}
.m_block{
  display:none;
}
/* 버튼1 - 검정 */
.btn1 {
  width: 100%;
  padding: 14px 0;
  background-color: #000;
  color: #fff;
  font-size: 23px;
  font-weight: 400;
  line-height: 1.5;
  cursor: pointer;
  text-align: center;
  display: block;
  border: 1px solid #000;
}
.btn1:hover {
  background-color: #fff;
  color: #000;
}
.btn1:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}
.btn1:disabled:hover{
  background-color: #000;
  color: #fff;
}
/* 버튼2 - 아웃라인 */
.btn2 {
  width: 100%;
  padding: 14px 0;
  background-color: #fff;
  color: #000;
  border: 1px solid #000;
  font-size: 23px;
  font-weight: 400;
  line-height: 1.5;
  cursor: pointer;
  text-align: center;
  display: block;
}
.btn2:hover {
  background-color: #000;
  color: #fff;
}
.long_btn{
  width: 540px;
}
.small_btn{
  width: 200px
}
.search_btn{
  width: 100px;
}
.btn2.active {
  background-color: #000;
  color: #fff;
}

/* 체크박스 */
.checkbox_item {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 23px;
  line-height: 1.5;
  text-align: left;
}

.checkbox_item input[type="checkbox"] {
  display: none;
}

.checkbox_item .checkbox_box {
  width: 15px;
  height: 15px;
  border: 2px solid #534F66;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.checkbox_item input[type="checkbox"]:checked + .checkbox_box {
  background-color: #ffffff;
  border-color:#000000;
  position:relative;
  top:0;
  left:0;
}

.checkbox_item input[type="checkbox"]:checked + .checkbox_box::after {
  content: '';
  width: 10px;
  height: 10px;
  background-color: #000000;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* 라디오 */
.radio_item {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 23px;
  line-height: 1.5;
  text-align: left;
}

.radio_item input[type="radio"] {
  display: none;
}

.radio_item .radio_circle {
  width: 15px;
  height: 15px;
  border: 2px solid #534F66;
  border-radius: 50%;
  display: block;
  background-color: #ffffff;
  position:relative;
  top:0;
  left:0;
  box-sizing:border-box;
}

.radio_item input[type="radio"]:checked + .radio_circle::after {
  content: '';
  width: 7px;
  height: 7px;
  background-color: #534F66;
  border-radius: 50%;
  display: block;
  clear: both;
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
}
.input_wrap .input_box .row_box{
 display: flex; 
 gap: 20px;
 flex-direction: row;
}
.input_wrap.description .input_box.border_none{
  border-bottom:0
}
.input_wrap .input_box .list_btn_box{
  display: flex;
  gap:10px;
  margin-top:10px;
}
.container{
  text-align: center;
  max-width: 1200px;
  margin: 0 auto;
}
.border_box{
  border: 1px solid #000;
  padding: 40px;
  display: flex;
}

.file_preview > div{
    padding: 14px 20px;
    background-color: #EDEDED;
    color: #000;    
    font-size: 23px;
    position:relative;
    top:0;
    left:0;
    width: 100%;
}
.file_preview .file_remove{  
  position:absolute;
  top:50%;
  right:10px;
  transform: translateY(-50%);
  cursor: pointer;
}

.terms_toggle svg {
    transition: transform 0.3s ease;
}
.terms_toggle.is-open svg {
    transform: rotate(180deg);
}
.terms_box {
  margin-top:30px;
}
.terms_box .terms_all{
  background-color: #000;
  color: #fff
}
.terms_box .terms_all, .terms_box .terms_list .terms_item_header{
  display: flex;
  padding:20px;
  align-items: center;
  justify-content: space-between;
}
.terms_list .terms_item_header{
  border-bottom:1px solid #000;
}
.terms_list .terms_content{
  padding:20px;  
  border-bottom:1px solid #000;
}
#success-modal{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
.modal_backdrop{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 0
}
.modal_box{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  z-index:1;
  width:500px;
}
.modal_tit{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding:20px 30px;
  background-color: #000;
  color: #fff;
}
.modal_inner{
  padding:30px;
  background: #fff;
}

@media (max-width:1200px) {
    .container{
      padding: 0 15px;
      max-width: 100%;
    }
}

@media (max-width: 768px) {
    body, html {
      font-size: 20px;
    }
    b, strong, p {
        font-size: 20px;
    }
    .btn2, .btn1{
        font-size: 20px;
    }
    .long_btn{
      width:100%
    }
    .input_wrap.description .input_box, .border_box, .input_wrap .input_box{
      flex-wrap:wrap;
    }
    .input_wrap .label{
      width:100%;
      margin-bottom:10px;
    }
    .small_btn{
      width:100%
    }
    .m_block{
      display:block
    }
    .border_box{
        padding: 30px;
    }
    .tit{
        padding:80px 0
    }
    .radio_item, .checkbox_item{
        font-size:20px
    }
    .file_preview > div{
        font-size: 20px;
    }
    .tit_top{
        font-size:20px
    }

    input[type="text"], input[type="tel"], input[type="number"]{
        font-size: 20px;
    }
    .modal_box{
        width: 90%;
        max-width: 500px;
    }
}

@media (max-width: 480px) {
  .input_wrap .input_box .list_btn_box{
    flex-wrap: wrap;
  }
  .input_wrap .input_box .list_btn_box button{
    width: 100%;
  }
}