.page-inquiry.footer_white { background-color: #FDFBF4; }
.page-inquiry * {font-family: "FFF Acid Grotesk" ,"Pretendard Variable", sans-serif;
user-select: none;     /* 텍스트 선택 방지 */
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none;    /* Firefox */
  -ms-user-select: none;
}
.page-inquiry input[type="text"], .page-inquiry input[type="tel"], .page-inquiry input[type="email"], .page-inquiry input[type="url"]
{outline: none; border: 0px solid #C4C4C4; border-bottom: 1px solid #000; background-color: unset; line-height: 1.6; font-size:16px; padding:16px 0 2px; max-width: 346px; width: 100%;}
  
.page-title { padding: 9.25vw /*3.753vw*/56px 4.022vw; }
.page-title .title-h1 *{ font-size: 5.698vw; font-weight: 500; line-height: 105%; }

.page-title .title-h1 {width: 100%!important;}
.page-title .sub_title{margin-bottom: 1.072vw;}
.page-title .sub_title *{font-size: 1.609vw; line-height: 1.3; font-weight: 500;}
.page-title .fade-slice { width: calc((100% / 12) * 5.5); display: block; }
/*.page-title > .fade-slice .line{width: fit-content;}*/
.page-title span { font-size: 1.072vw; font-style: normal; font-weight: 400; line-height: 160%; }
.page-title .title-span span{opacity: 0.5;}

.flex{display: flex; position: relative;}
.flex::before{content: ''; width: 0%; height: 1px; background-color: #000; position: absolute; left: 00%; transform: translateX(-00%); top: 0; transition: width 1s cubic-bezier(0, 0, 0.43, 1);}
.ani.active .flex::before{width: 100%;}

.flex_left{width: calc((100% / 12) * 4); padding: 60px calc((100% / 12) * 1) 0 56px; display: flex; flex-direction: column; gap: 24px;  position: relative;}
.flex_left::after{content: ''; width: 1px; height:0; background-color: #000; position: absolute; right:0; top: 0; transition: height 1s cubic-bezier(0, 0, 0.43, 1), width 1s cubic-bezier(0, 0, 0.43, 1); transition-delay: 0.3s;}
.ani.active .flex_left::after{height: 100%;}
.flex_left input{display: block;}

.txt_label{font-size: 16px; line-height: 1.6; position: relative; /*font-weight: 300;*/}
.txt_label span{display: flex; align-items: center; position: absolute; left: 0; top:11px; transition: ease 0.3s all;}
.txt_label span p{font-size: 12px; transition: ease 0.3s all;}
.txt_label input:focus + span,
.txt_label input:not(:placeholder-shown) + span {
  top: -8px;
  font-size: 11px;
  color: #AAA89E;
}

.txt_label input:focus + span p,
.txt_label input:not(:placeholder-shown) + span p {font-size: 8px;}

.cate_input_w{margin-top: 50px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-column-gap: 40px; grid-row-gap: 24px; padding-right: 52px;}
.cate_input_w .chbx_label{margin-top: 16px;}

.date_input{color: #00000000; border-color: #000;}
.date_input::placeholder{opacity: 0;}
/*.cate_input_w input::placeholder{opacity: 0; transition: ease 0.3s opacity;}
input:focus::placeholder{opacity: 1;}*/

.date_change {position: absolute; bottom: 3px; left: 0; z-index: 1; pointer-events: none; color: #AAA89E; font-family: inherit; font-size: inherit;  white-space: nowrap; opacity: 0; transition: ease 0.3s opacity, ease 0.3s color;}
input:focus + span + .date_change, input:not(:placeholder-shown) + span + .date_change {position: absolute; bottom: 3px; left: 0; z-index: 1; pointer-events: none; color: #000; font-family: inherit; font-size: inherit;  white-space: nowrap; opacity: 1;}
input:focus + span + .date_change{color: #AAA89E;}
input:not(:placeholder-shown) + span + .date_change{color: #000;}

.flex_right{width: calc((100% / 12) * 8); padding: 60px 0 60px calc((100% / 12) * 1); }

.form_type{margin-top: 60px;}
.chbx{width: 20px; height: 20px; border: 1px solid #000; margin-right: 12px; position: relative; flex-shrink: 0; display: flex; align-items: center; justify-content: center;}
.chbx::after{content: ''; display: block; width: 14px; height: 14px; background-color: #00000000; transition: ease 0.3s all; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0.7);}
input[type="checkbox"]:checked + .chbx::after, input[type="radio"]:checked + .chbx::after{background-color: #000; transform: translate(-50%, -50%) scale(1)}
label{cursor: pointer;}
.chbx_label{cursor: pointer; display: flex; align-items: center;}
.chbx_label input[type="checkbox"],.chbx_label input[type="radio"]{display: none;}
.chbx_label span{padding-top:0.25rem; font-size: 16px; line-height: 1.6;}

.cate_w:not(:first-child){margin-top: 60px;}

.input_w{display: grid; padding-right: calc((100% / 8) * 1); grid-row-gap: 20px;}
.input_w_1{grid-template-columns: repeat(1, minmax(0, 1fr));}
.input_w_2{grid-template-columns: repeat(2, minmax(0, 1fr)); grid-column-gap: calc(100% / 7); }
.input_w_3{grid-template-columns: repeat(3, minmax(0, 1fr)); grid-column-gap: 24px;}
.input_w_2.chbx_txt{grid-column-gap: 50px;}
.cate_title{font-size:16px; font-weight:700; margin-bottom:20px; line-height: 1.6;}

.chbx_txt span{margin-right: 24px;  min-width: 60px;} /*width: calc((100vw / 12) - 56px);*/
.chbx_txt input[type="text"]{width: 100%; max-width: 180px; height: 28px; border: 1px solid #dedbcf; padding: 0 8px;}
.chbx_txt input[type="checkbox"]:not(:checked) + .chbx + span + input[type="text"]{pointer-events: none;}
.chbx_txt input[type="text"], .chbx_txt input[type="text"]::placeholder{font-size: 13px;}

.file_span{font-size: 12px; margin-bottom: 8px; display: block;}
.file_w{display: flex;}

.file_w label div{width: 88px; height: 32px; border: 1px solid #000; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 12px; font-weight: 500; margin-right: 30px;}
.file_w input[type="file"]{display: none;}
.file_w li{display: inline-flex; align-items: center; height: 32px;}
.file_w li:not(:last-child){margin-right: 40px;}
.file_w .file_delete_btn{width: 20px; height: 20px; border-radius: 100%; background-color: #dedbcf; cursor: pointer; margin-left: 12px; position: relative;}
.file_w .file_delete_btn::before, .file_w .file_delete_btn::after{content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 1px; background-color: #000;}
.file_w .file_delete_btn::before{transform: translate(-50%, -50%) rotate(225deg);}
.file_w .file_delete_btn::after{transform: translate(-50%, -50%) rotate(-45deg);}

.flex_end{display: flex; justify-content: flex-end; margin-top: 74px; padding-right: 52px;}
.flex_end input{font-size:64px; font-weight: 500; font-family: 'FFF Acid Grotesk'; outline: none; background-color: unset; border: 0; cursor: pointer;}

.footer_icon{pointer-events: none;}
@media(min-width:1920px){
  .page-title{padding:156px 56px 100px; position: relative; margin:auto;}
  .page-title .title-h1 { margin-bottom: 0px; width: 100%!important;}
  .page-title .title-h1 *{font-size:110px; font-weight:500; line-height:105%;}
  .page-title .fade-cw{margin-bottom:77px;}
  .page-title .fade-slice{width:calc((100% / 12) * 5.5); display:block;}
  .page-title .fade-cw.sub_title{margin-bottom:21px;}
  .page-title .fade-cw.sub_title *{font-size:31px;}
  .page-title span{font-size:21px; font-style:normal; font-weight:400; line-height:160%;}


}

@media(min-width:1025px){

  
}
@media(max-width:1200px) and (min-width:1025px){
  .chbx_txt input[type="text"], .chbx_txt input[type="text"]::placeholder{font-size: 10px;}
}
@media(max-width:1024px){
  .page-title { padding: 27.778vw 5.556vw 6.556vw; }
  .page-title .title-h1 { margin-bottom: 5.556vw; }
  .page-title .title-h1 *{ font-size: 11.111vw; }
  .page-title .fade-slice { width: calc(75% + (5.556vw * 2)); display: block; }
  .page-title .sub_title{margin-bottom: 3.333vw; }
  .page-title .sub_title *{font-size: 3.611vw;}
  .page-title span { font-size: 3.611vw; }

  .page-inquiry input[type="text"], .page-inquiry input[type="tel"], .page-inquiry input[type="email"], .page-inquiry input[type="url"]{font-size: 13px; padding: 16px 0 2px;}
  .flex{flex-direction: column;}
  .flex_left{width: 100%; padding: 24px 20px 60px; gap: 16px;}
  .flex_left::after{height: 1px; width: 0; bottom: 0; top: unset; right: unset; left: 0;}
  .ani.active .flex_left::after{width: 100%; height: 1px;}
  .flex_right{width: 100%; padding: 40px 20px 60px; max-width: unset;}
  .txt_label{font-size: 13px;}
  .txt_label span{top: 16px;}
  .txt_label input:focus + span,
  .txt_label input:not(:placeholder-shown) + span {top: 0px; font-size: 8px;}

  .cate_w{max-width: 500px;}
  .cate_w:not(:first-child){margin-top: 40px;}
/*서연추가*/
.cate_input_w{margin-top: 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-column-gap: 40px; grid-row-gap: 24px; padding-right: 52px;}

  .form_type{margin-top: 40px;}
  .cate_title{font-size: 13px;}
  .input_w{display: flex; flex-direction: column; padding-right: 0; gap: 20px;}

  .cate_input_w{display: flex; flex-direction: column; padding-right: 0; gap: 16px;}
  .chbx_label span{font-size: 13px;}
  .chbx_txt span{width: calc(50% - 36px); margin-right: 0;}
  .chbx_txt input[type="text"]{padding: 0 8px; width: 50%; max-width: unset;}


  .cate_w_file .cate_title{margin-bottom: 16px;}
  
  .file_w{justify-content: space-between;}
  .file_span{font-size: 10px; margin-bottom: 12px;}

  .file_w li:not(:last-child){margin-right: 0;}
  .file_w li{height: 32px; font-size: 12px;}
  .file_w ul{display: flex; flex-direction: column; align-items: flex-end; gap: 8px;}
  
    

  .flex_end{margin-top: 60px; padding-right: 0;}
  .flex_end input{font-size: 40px;}

  .fade-slice.title-span{font-size: 3.2vw; width: 100%;}
  .fade-slice.title-span *{font-size: 3.2vw;}
}
.flex_end input{color: #000;}

.textarea_w{width: calc((100% / 8) * 7); height: 360px; padding: 6px; border: 1px solid #000; margin-bottom:50px;}
textarea{width: 100%; background-color: unset; resize: none; height: 100%;   cursor: pointer; overscroll-behavior: contain; border: 0; outline: unset; font-size: 14px;}
textarea::-webkit-scrollbar {    width: 4px;  }
textarea::-webkit-scrollbar-thumb {   background: #DEDBCF;    border-radius: 2px;}
textarea::-webkit-scrollbar-track {    background: rgba(255, 255, 255, 0);}
.end_logo{border-top: 1px solid #000;}
@media(max-width:1024px){
  .textarea_w{width: 100%; height: 240px;}

  .file_w{position: relative;}
  .file_w ul{position: absolute; top: calc(100% + 10px);}
  .flex_end{ position: absolute; right: 20px; bottom: 114px; margin-top: 0; line-height: 1;}
  .flex_end *{line-height: 1;}

  .flex_right{padding-bottom: 120px; position: relative;}
}