@charset "utf-8";
/* CSS Document */

.dlt_leadtxt{
  border-bottom: 1px solid #E5E5E5;
  padding-bottom: 64px;
  margin-bottom:56px;
}

.dlt_foam {
  text-align: left;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 92px;
  line-height: 1.8;
  color: #1f2022;
}
.dlt_foam dt{
  max-width: 300px;
  width: 100%;
  font-weight: 500;
  letter-spacing: 0.1em;
}
.dlt_foam dd{
  width: calc(100% - 300px);
}
.dlt_foam dt:nth-last-of-type(n+2),
.dlt_foam dd:nth-last-of-type(n+2){margin-bottom:64px;}

.dlt_required{
  display: inline-block;
  margin-top: -6px;
  margin-left: 8px;
}
.dlt_required img{
  max-width: 11px;
  width: 100%;
}

.dlt_checkwrap{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
.dlt_foam input[type="checkbox"],
.dlt_foam input[type="radio"]{
  position: absolute;
  visibility: hidden;
  width: auto;
  min-height: 0;
}
.dlt_checkwrap label{
  display: flex;
  align-items: center;
  width: 312px;
  height: 50px;
  padding-left: 18px;
  background-color: #F5F5F5;
}
.dlt_checkwrap label div{
  display: flex;
  align-items: center;
  gap: 10px;
}
.dlt_checkbox{
  position: relative;
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 2px;
  background-color: #FFFFFF;
}
input[type="checkbox"]:checked + div .dlt_checkbox{background-color: #523997;}
input[type="checkbox"]:checked + div .dlt_checkbox::after{
  content: "";
  position: absolute;
  display: block;
  width: 11px;
  height: 6px;
  left: 3px;
  top: 3px;
  border-bottom: 2px solid #FFFFFF;
  border-left: 2px solid #FFFFFF;
  transform: rotate(-45deg);
}
.dlt_radio label{
  display: flex;
  align-items: center;
  gap: 8px;
}
.dlt_radio label span{
  position: relative;
  display: block;
  width: 24px;
  height: 24px;
  border-radius: 100%;
  border: 1px solid #CBCBCB;
}
input[type="radio"]:checked + span::after{
  content: "";
  position: absolute;
  display: block;
  width: 12px;
  height: 12px;
  left: 5px;
  top: 5px;
  border-radius: 100%;
  background-color: #523997;
}
.dlt_foam input{
  max-width: 592px;
  width: 100%;
  min-height: 50px;
  padding: 12px;
  font-size: 1.125rem;
  border: none; 
  background-color: #F5F5F5;
}
.dlt_foam select{
  max-width: 160px;
  width: 100%;
  min-height: 50px;
  padding: 12px;
  font-size: 1.125rem;
  border: none; 
  background-color: #F5F5F5;
}
.dlt_foam textarea{
  max-width: 592px;
  min-height: 250px;
  width: 100%;
  background-color: #F5F5F5;
  padding: 12px;
  border: none; 
}

.dlt_foam checkbox:focus,
.dlt_foam select:focus,
.dlt_foam input:focus,
.dlt_foam textarea:focus{
  background-color:#f5f6ff;
  box-shadow: 0px 0px 3px 0px #8276DC;
}

.dlt_subtxt{
  letter-spacing: 0.1em;
  line-height: 28.8px;
  text-align: center;
  color: #5a5a5a;
  margin-bottom: 32px;
}
.dlt_subtxt a{
  color: #63A0E6;
}
.dlt_agree{
  font-size: 0.875rem;
  letter-spacing: 0.1em;
  line-height: 1.8;
  color: #5a5a5a;
  margin-bottom: 56px;
}
.dlt_agree input[type="checkbox"]{
  position: absolute;
  visibility: hidden;
  width: auto;
  min-height: 0;
}
.dlt_agree label div{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
}
.dlt_agree .dlt_checkbox{
  width: 16px;
  height: 16px;
  border-radius: 2px;
  background-color: #F5F5F5;
  border: 1px solid #CBCBCB;
}
.dlt_agree input[type="checkbox"]:checked + div .dlt_checkbox::after{
  width: 8px;
  height: 4px;
  left: 2px;
}


.dlt_error{
  font-size: 0.875rem;
  color: #f5382b;
}


.dlt_decide{text-align: center}
.dlt_decide button{
  max-width: 260px;
  width: 100%;
  padding: 20px;
  letter-spacing: 0.04em;
  font-size: 0.875rem;
  font-weight: 500;
  color: #FFFFFF;
  background-color: #1F2022;
  border: 1px solid transparent;
  border-radius: 9999px;
  cursor: pointer;
}
.dlt_back{margin-top: 80px;}
.dlt_back button{
  max-width: 200px;
  width: 100%;
  padding: 20px;
  letter-spacing: 0.04em;
  font-size: 0.875rem;
  font-weight: 500;
  color: #FFFFFF;
  background-color: #939393;
  border: 1px solid transparent;
  border-radius: 9999px;
  cursor: pointer;
}




.dlt_complete{text-align: left;}
.dlt_complete h2{
  margin-bottom: 40px;
  text-align: center;
  font-size: 1.25rem;
  color: #1F2022;
}
.dlt_complete p:nth-last-of-type(n+2){margin-bottom: 16px;}









@media screen and (min-width:821px){
  .dlt_subtxt a:hover{
    text-decoration: underline;
  }
  .dlt_decide button:hover{
    background-color: #FFFFFF;
    border: 1px solid #1F2022;
    color: #1F2022;
  }
  .dlt_back button:hover{
    background-color: #DADADA;
    border: 1px solid #DADADA;
  }
}





@media screen and (max-width:820px){
  .dlt_foam dt{
    max-width: none;
    margin-bottom: 8px;
  }
  .dlt_foam dd{width: 100%;}
  .dlt_foam dt:nth-last-of-type(n+2){margin-bottom: 8px;}
  .dlt_foam dd:nth-last-of-type(n+2){margin-bottom: 32px;}
  .dlt_foam input{max-width: none;}
  .dlt_foam textarea{max-width: none;}
}
@media screen and (max-width:430px){
  .dlt_leadtxt{
    padding-bottom: 32px;
    margin-bottom: 24px;
    font-size: 0.875rem;
  }
  .dlt_foam dt{font-size: 0.875rem;}
  .dlt_subtxt{font-size: 0.875rem;}




  .dlt_completetxt{font-size: 0.875rem;}
}