@charset "utf-8";
/* CSS Document */

/* 영역구분 */
#wrap {position:relative; min-width:320px; width:100%; margin:0 auto;}
.wrap {position:relative; box-sizing:border-box; width:100%; height:100%; max-width:1520px; padding:0 40px; margin:0 auto}
.c_title {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; margin-bottom:45px}
.c_title mark {font-size:22px; font-weight:700; font-family:"open-sans"; line-height:30px}
.c_menu {display:flex; justify-content:center; position:relative;}
.c_menu.scroll > button {opacity:1; content:""; display:block; position:absolute; right:0; bottom:0; width:30px; aspect-ratio:1/1; border-radius:100%; background:url("../img/icon_arrow_right_w.svg") center center no-repeat var(--brown); background-size:20px; transition:0.3s; pointer-events:auto}
.c_menu.end > button {opacity:0; pointer-events:none}
.c_menu ul {overflow-x:auto; display:flex; justify-content:center; column-gap:51px; width:100%;}
.c_menu li {position:relative; color:#787674; line-height:30px; cursor:pointer;}
.c_menu li:hover {color:var(--brown)}
.c_menu li + li:before {content:""; display:block; position:absolute; left:-26px; top:50%; width:1px; height:16px; margin-top:-8px; background:var(--black-20)}
.c_menu li.on {color:var(--brown); font-weight:700;}
.c_menu li.on:after {content:""; display:block; position:absolute; bottom:0; left:0; width:100%; height:2px; background:var(--brown)}
.c_wrap {display:flex; align-items:flex-start; gap:40px; padding-top:100px; padding-bottom:150px}
.c_area {width:100%}

/* 스크롤 */
body::-webkit-scrollbar {width:8px;}
body::-webkit-scrollbar-thumb {background-color:var(--brown); border-radius:10px; background-clip:padding-box; border:2px solid transparent;}
body::-webkit-scrollbar-thumb:hover {background-color:var(--brown);}
body::-webkit-scrollbar-track {background-color:#F0EFEA}

section {overflow:hidden; padding:150px 0}

/* 컬러 */
.cm {color:var(--brown) !important;}	/* 메인 */
.ck {color:var(--brown) !important;}	/* 검은색 */
.cw {color:var(--white) !important;}	/* 흰색 */
.cb60 {color:var(--black-60) !important;}	/* 흰색 */

/* 배경 */
.bgcw {background-color:var(--white)}
.bgcm {background-color:rgba(179, 167, 121, 0.1)}

:root {--brown:#B2A779; --black:#231F20; --black-5:#F4F3F4; --black-10:#EBEBEB; --black-20:#D5D5D5; --black-30:#BDBCBD; --black-40:#A3A09E; --black-60:#787878; --black-80:#414042; --white:#fff;}


/* 타이틀 */
.title {font-size:40px; font-weight:700; letter-spacing:-0.4px; line-height:50px; word-wrap:normal; word-break:keep-all;}
.title.small {font-size:50px;}
.title span {display:inline-block;}
.title > span {width:100%;}


/* 텍스트 */
.text {font-size:18px; font-weight:400; line-height:40px; word-wrap:normal; word-break:keep-all; letter-spacing:-0.18px;}
.text.inline {display:inline}
.text.thin, .text .thin {font-weight:100;}
.text.light, .text .light {font-weight:300;}
.medium {font-weight:500;}
.semibold {font-weight:600;}
.bold {font-weight:700;}
.exbold {font-weight:800;}
.black {font-weight:900;}
.text.small, .text .small {font-size:15px; line-height:30px; letter-spacing:-0.15px;}
.text.regular, .text .regular {font-size:18px; line-height:30px; letter-spacing:-0.18px;}
.text.middle, .text .middle {font-size:22px; line-height:40px; letter-spacing:-0.18px;}
.text.big, .text .big {font-size:26px; line-height:40px; letter-spacing:-0.26px;}
.text.huge, .text .huge {font-size:30px; letter-spacing:-0.3px; line-height:40px}
.text span {display:inline-block;}
.text > span {width:100%;}
.text > span.inline {display:inline; width:auto}
.text > span.nowrap {white-space:nowrap;}
.text br.mo {display:none;}
.txt_center {text-align:center;}
.txt_deco {display:inline-block; padding:0 10px; border-radius:5px; font-weight:800}
.txt_deco.semibold {font-weight:600}

/* font-family */
.font.t1 {font-family:"Pretendard"}
.font.t2 {font-family:"Black Han Sans"}

/* 폼태그 */
.form {display:inline-block; vertical-align:middle; width:100%; text-align:left;}
.form .f_wrap {display:inline-block; vertical-align:middle; width:100%; padding:5px 0;}
.form .f_wrap:last-child,
.form .f_wrap.f_contents{margin-top:10px;}
.form .f_field {display:flex; align-items:center; position:relative; width:100%;}
.form .f_field.div1 {width:100%;}
.form .f_field.div2 {width:50%;}
.form .f_field.div3 {width:33.333333%;}
.form .f_field.div4 {width:25%;}
.form .f_field.div5 {width:20%;}
.form .f_field.div6 {width:16.666666%;}
.form .f_field.div7 {width:14.285714%;}
.form .f_field.div8 {width:12.5%;}
.form .f_field.div9 {width:11.111111%;}
.form .f_field.div10 {width:10%;}

.form .f_field .ff_wrap {display:inline-block; float:left; position:relative; box-sizing:border-box; width:100%;}
.form .f_field .ff_wrap .tiny {margin-left:15px; text-align:right}
.form .f_field .ff_wrap .tiny span {display:inline}
.form .f_field .ff_wrap.checkbox {margin-top:10px}
.form .f_field .ff_wrap.checkbox .tiny {margin:0; padding-left:5px}
.form .f_field .ff_wrap.phone .input,
.form .f_field .ff_wrap.phone .select {float:left; width:calc(33.333% - 6.666px);}
.form .f_field .ff_wrap.phone .input {margin-left:10px;}
.form .f_field .ff_comment {display:inline-block; box-sizing:border-box; width:100%; margin-top:10px; padding-left:100px; font-family:'Pretendard Variable', sans-serif; font-size:14px; font-weight:400; line-height:20px; letter-spacing:-0.5px; opacity:0.6;}
.form .f_field .ff_comment span {display:inline-block;}
.form .f_field .ff_more {position:relative; font-weight:600; text-decoration:underline; text-underline-offset:3px}
.form .f_field .ff_count  {display:inline-block; position:relative; float:right; margin-top:10px; font-family:'Pretendard Variable', sans-serif; font-size:14px; font-weight:400; letter-spacing:-0.5px; line-height:20px; opacity:0.6;}
.form .f_field input {display:inline-block; vertical-align:middle;}
.form .f_check {margin-top:15px; padding-left:10px}
.form .button {width:100%}


/* form */
.form .f_title {display:block; margin-bottom:13px; font-size:22px; font-weight:700; line-height:30px}
.form .f_title:not(:first-child) {margin-top:60px}
.form .f_must {position:relative; right:-5px; color:var(--brown)}
.form .f_area {border-top:2px solid var(--black)}
.form .f_field {border-bottom:1px solid var(--black-20)}
.form .f_field.t1 {align-items:flex-start}
.form .f_field .ff_title {flex-shrink:0; width:200px; padding:30px 20px; }
.form .f_field .ff_title span {display:block; line-height:30px}
.form .f_field .ff_content {width:100%; padding:20px}
.form .f_input {box-sizing:border-box; border:1px solid var(--black-40); border-radius:10px; padding:11.5px 14px; font-size:16px; line-height:25px;}
.form .f_input:hover {border-color:var(--black)}
.form textarea:hover {border-color:var(--black)}
.form .f_input::placeholder {color:var(--black-60)}
.form .f_select {height:auto; box-sizing:border-box; border:1px solid var(--black-40); border-radius:10px; padding:11.5px 14px; font-size:16px; line-height:25px;}
.form .f_select:hover {border-color:var(--black)}
.form .ff_tel {display:flex; align-items:center; gap:10px;}
.form .ff_address > div {display:flex; flex-direction:column;}
.form .ff_address .fa_btn {background-position:right 10px center;}
.form .ff_address .fa_btn i {width:20px; background-image:url("../img/icon_search_w.svg");}
.form .ff_address > div > div {display:flex; align-items:center; gap:10px}
.form .ff_address > div > div input {width:180px;}
.form .ff_address > div > div:nth-child(2) {margin-top:10px!important;}
.form .ff_address .fa_input {margin-top:10px}
.form .ff_email {display:flex; align-items:center; gap:10px;}
.form textarea {height:130px; padding:14px; box-sizing:border-box; border:1px solid var(--black-40); border-radius:10px; font-size:16px; line-height:25px; }
.form .f_btn button[type="submit"] {width:330px}
.form .f_file .ff_title {display:flex; flex-direction:column; gap:10px;}
.form .f_file .ff_title > div {display:flex; align-items:center; gap:5px;}
.form .f_file button {display:flex; align-items:center; justify-content:center; width:30px; aspect-ratio:1/1}
.form .f_file button img {width:24px; aspect-ratio:1/1}
.form .f_file .ff_note {display:block; font-size:16px; line-height:30px; color:var(--black-60)}
.form .f_file .ff_note i {padding-right:5px; color:var(--brown)}
.form .f_file #variableFiles {display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-top:10px}
.form .f_file .ff_filebox {display:flex; align-items:center; gap:10px;}
.form .f_file .ff_filebox .f_input {width:500px}
.form .f_file .ff_filebox label i {width:20px; background-image:url("../img/icon_file.svg")}
.form .f_file .ff_filebox input[type="file"] {overflow:hidden; position:absolute; width:0; height:0; padding:0; border:0;}
.form .f_file .ff_title button i {display:block; width:24px; aspect-ratio:1/1; background:url("../img/icon_plus.svg") center center no-repeat; background-size:100%;}
.form .f_file .ff_title button:hover i {background-image:url("../img/icon_plus_b.svg")}
.form .f_file .ff_title .fft_minus i {background-image:url("../img/icon_minus.svg")}
.form .f_file .ff_title .fft_minus:hover i {background-image:url("../img/icon_minus_b.svg")}
.form .f_privacy {margin-top:60px}
.form .f_privacy .fp_agree {height:250px; overflow:auto; padding:20px; border-radius:10px; border:1px solid var(--black-20); background:var(--black-5);}

.form .f_privacy .fp_agree::-webkit-scrollbar {width:13px;}
.form .f_privacy .fp_agree::-webkit-scrollbar-thumb {background-color:var(--black); border-radius:10px; background-clip:padding-box; border:4px solid transparent;}
.form .f_privacy .fp_agree::-webkit-scrollbar-thumb:hover {background-color:#241a13;}
.form .f_privacy .fp_agree::-webkit-scrollbar-track {background-color:#fff0;}
.form .f_privacy .fp_agree + .checkbox {margin-top:15px}
.form .f_btn:last-child {display:flex; justify-content:center; margin-top:60px}
.form .f_btn button[type="submit"] i {width:24px; background-image:url("../img/icon_write.svg")}

    /* paging */
.paging {margin-top:60px}
.paging > ul {display:flex; justify-content:center; gap:60px; width:100%;}
.paging li ul, .paging ol {display:flex; justify-content:center; gap:10px;}
.paging li li {display:flex; align-items:center; justify-content:center; width:50px; aspect-ratio:1/1;}
.paging li a:hover {border:1px solid var(--brown); color:var(--brown); font-weight:700}
.paging li a {display:flex; align-items:center; justify-content:center; width:100%; height:100%; border:1px solid var(--black-20); border-radius:10px; font-weight:500}
.paging li.disabled {opacity:1}
.paging li.disabled a {pointer-events:none}
.paging .p_current a {border-color:var(--brown); background:var(--brown); color:var(--white); font-weight:700}
.paging .p_current a:hover {color:var(--white)}
.paging .p_prev a {background:url("../img/icon_arrow_left.svg") center center no-repeat; background-size:32px}
.paging .p_prev a:hover {border-color:var(--brown); background:url("../img/icon_arrow_left.svg") center center no-repeat; background-size:32px}
.paging .p_prev.disabled a {background-image:url("../img/icon_arrow_left_g_t2.svg")}
.paging .p_start a {background:url("../img/icon_arrow_left_t1.svg") center center no-repeat; background-size:32px}
.paging .p_next a {background:url("../img/icon_arrow_right.svg") center center no-repeat; background-size:32px}
.paging .p_next a:hover {border-color:var(--brown); background-image:url("../img/icon_arrow_right.svg");}
.paging .p_end a {background:url("../img/icon_arrow_right_t1.svg") center center no-repeat; background-size:32px}
.paging .p_end.disabled a {background-image:url("../img/icon_arrow_right_g_t3.svg")}
.paging .p_next.disabled a {background-image:url("../img/icon_arrow_right_g_t2.svg")}
.paging .p_start.disabled a {background-image:url("../img/icon_arrow_left_g_t3.svg")}

/* 폼스타일 */
.input {display:block; vertical-align:middle; box-sizing:border-box; width:100%; height:50px; margin:0; padding:0 2px; border-radius:5px; border:#d0d2d7 solid 1px; background-color:#e8eaf0; font-family:'Pretendard Variable', sans-serif; font-size:20px; font-weight:400; color:var(--dark); letter-spacing:-0.8px; line-height:40px; text-align:left; text-indent:13px;}
.input::placeholder {color:var(--dark);}
.select {display:block; vertical-align:middle; box-sizing:border-box; width:100%; height:40px; margin:0; padding:0; border-radius:5px; border:rgba(36, 26, 19, 0.3) solid 1px; background-color:transparent; appearance:none; background:url('../images/icon_arrow.svg') no-repeat right 13px center; background-size:12px;  font-family:'Pretendard Variable', sans-serif; font-size:16px; font-weight:400; letter-spacing:-0.5px; line-height:40px; text-align:left; text-indent:15px;}
.textarea {display:block; vertical-align:middle; box-sizing:border-box; width:100%; min-height:130px; margin:0; padding:10px 15px;  border-radius:5px; border:rgba(36, 26, 19, 0.3) solid 1px; background-color:transparent; font-family:'Pretendard Variable', sans-serif; font-size:16px; font-weight:400; letter-spacing:-0.5px; line-height:25px; text-align:left; resize:none;}
.textarea::placeholder {color:var(--dark);}
/*.input.w50p {width:50%;}*/

/* 버튼 */
.btn {display:flex; align-items:center; justify-content:center; gap:10px; width:160px; box-sizing:border-box; padding:12.5px 0; color:var(--white); border-radius:10px; font-size:16px; letter-spacing:-0.16px; font-weight:700; line-height:25px}
.btn:hover {text-decoration:underline; text-underline-position:under}
.btn.br {background-color:var(--brown);}
.btn.b80 {background-color:var(--black-80); color:var(--white)}
.btn.b30 {background-color:var(--black-30);}
.btn.b5 {background-color:var(--black-5); color:var(--black)}
.btn.small {width:100px; padding:7.5px 0; font-size:15px; letter-spacing:-0.15px}
.btn.big {padding:15px 0; font-size:22px; line-height:30px; letter-spacing:-0.22px}
.btn.radius {border-radius:30px}
.btn > i {width:20px; aspect-ratio:1/1; margin-right:-5px; background-position:center center; background-repeat:no-repeat; background-size:100%; }
.btn.left > i {margin-right:0; margin-left:-5px}
.btn.big > i {width:24px;}

.checkbox input[type='checkbox'] {position:absolute; left:0; top:50%; z-index:-1; width:20px; aspect-ratio:1/1; margin-top:-10px; opacity:0;}
.checkbox label {display:flex; align-items:center; position:relative; cursor:pointer;}
.checkbox label span {font-size:16px; line-height:25px}
.checkbox label:hover span {font-weight:700; text-decoration:underline; text-underline-position:under}
.checkbox label i {flex-shrink:0; position:relative; box-sizing:border-box; width:20px; aspect-ratio:1/1; margin-right:10px; overflow:hidden; border-radius:3px; background-color:var(--white); border:1px solid var(--black-30);}
.checkbox label i:before {content:""; display:inline-block; vertical-align:middle; position:absolute; left:50%; top:50%; box-sizing:border-box; width:10px; height:6px; margin-left:-5px; margin-top:-5px; border-bottom:solid 2px var(--white); border-left:solid 2px var(--white); opacity:0; transform:rotate(-45deg); -webkit-transform:rotate(-45deg);}
.checkbox input:checked + i {background-color:var(--brown); border-color:var(--brown); border-radius:4px}
.checkbox input:checked + i:before {opacity:1;}
.checkbox input:checked ~ .input {display:block !important;}
.checkbox input:checked ~ span {font-weight:700}

.radio_wrap {display:flex; align-items:center; gap:20px}
.radiobox input[type='radio'] {position:absolute; left:0; top:50%; z-index:-1; width:20px; aspect-ratio:1/1; margin-top:-10px; opacity:0;}
.radio input[type="radio"] {appearance:none}
.radio label {display:flex; align-items:center; position:relative; font-size:16px; line-height:25px; cursor:pointer;}
.radio label span {font-size:16px; line-height:25px; letter-spacing:-0.16px;}
.radio label:hover span {font-weight:700; letter-spacing:-0.5px; text-decoration:underline; text-underline-position:under;}
.radio label i {display:flex; align-items:center; justify-content:center; flex-shrink:0; box-sizing:border-box; width:20px; aspect-ratio:1/1; margin-right:10px; border-radius:100%; background-color:var(--white); border:1px solid var(--black-30);}
.radio label i::before {content:""; opacity:0; flex-shrink:0; width:8px; aspect-ratio:1/1; border-radius:100%; background-color:var(--brown);}
.radio input:checked + i::before {opacity:1;}
.radio input:checked + i {border-color:var(--brown);}


/* 팝업 */
.popup {display:flex; align-items:center; justify-content:center; position:fixed; left:0; right:0; top:-100%; bottom:100%; z-index:98; width:auto !important; height:auto !important; background-color:rgba(53, 63, 93, 0.9); opacity:0; pointer-events:none;}
.popup.on {top:0; bottom:0; opacity:1; pointer-events:auto;}
.popup .p_box {position:relative; z-index:2; width:770px; padding:120px 75px 130px 105px; box-sizing:border-box; border-radius:5px; background:var(--white);  transform:scale(0.8); box-shadow:0 40px 80px rgba(0, 0, 0, 0.2); transition:0.4s; -webkit-transition:0.4s;}
.popup.on .p_box {transform:scale(1);}
.popup .p_out {position:absolute; left:0; right:0; top:0; bottom:0; z-index:1; cursor:default;}
.popup .p_head{position:relative;}
.popup .p_body {position:relative; width:100%; height:calc(100% - 50px);}
.popup .p_title {display:inline-block; vertical-align:middle; position:relative; height:50px; font-size:0; line-height:0; word-break:keep-all;}
.popup .p_title img {width:auto; height:100%;}
.popup .p_body .pb_wrap {overflow:auto; font-family:'Pretendard Variable', sans-serif; font-size:15px; font-weight:400; line-height:25px; text-align:left;}
.popup.p_more li {display:flex; align-items:flex-start; gap:10px}
.popup.p_more li::before {content:"-"; margin-top:-2px;}
.popup.p_more li + li {margin-top:15px}
.popup .p_body .pb_wrap > strong > span {display:inline-block; width:100%;}
.popup .p_body .pb_wrap > strong .p_title {float:left; width:100%;}
.popup .p_body .pb_wrap > h4 {font-family:'Pretendard Variable', sans-serif; font-size:20px; font-weight:500;  line-height:50px;}
.popup .p_body .pb_wrap > b{font-weight:bold;display:inline-block;}
.popup .p_body .pb_wrap > b:not(:first-child){margin-top:30px;}
.popup .p_body .pb_wrap > p {word-break:keep-all;}
.popup .p_body .pb_wrap > p span{padding-left:10px;display:inline-block;}
.popup .p_body .pb_wrap > table{margin:10px 0;}
.popup .p_body .pb_wrap th {font-weight:bold;padding:5px;border:1px #c5c5c5 solid;word-break:keep-all;}
.popup .p_body .pb_wrap td {padding:5px;border:1px #c5c5c5 solid;}
.popup .button {width:100%; max-width:260px; padding:11px 0; padding-top:14px; font-size:25px; line-height:1; letter-spacing:-0.625px}

.popup.w400 .p_box {width:400px; margin-left:-200px;}.popup.w450 .p_box {width:450px; margin-left:-225px;} .popup.w500 .p_box {width:500px; margin-left:-250px;} .popup.w550 .p_box {width:550px; margin-left:-275px;} .popup.w600 .p_box {width:600px; margin-left:-300px;} .popup.w650 .p_box {width:650px; margin-left:-325px;} .popup.w700 .p_box {width:700px; margin-left:-350px;} .popup.w750 .p_box {width:750px; margin-left:-375px;} .popup.w800 .p_box {width:800px; margin-left:-400px;} .popup.w850 .p_box {width:850px; margin-left:-425px;} .popup.w900 .p_box {width:900px; margin-left:-450px;} .popup.w950 .p_box {width:950px; margin-left:-475px;} .popup.w1000 .p_box {width:1000px; margin-left:-500px;}
.popup.w50p .p_box {left:25%; right:25%; width:auto; margin-left:0;} .popup.w60p .p_box {left:20%; right:20%; width:auto; margin-left:0;} .popup.w70p .p_box {left:15%; right:15%; width:auto; margin-left:0;} .popup.w80p .p_box {left:10%; right:10%; width:auto; margin-left:0;} .popup.w90p .p_box {left:5%; right:5%; width:auto; margin-left:0;}
.popup.h300 .p_box {height:300px; margin-top:-150px;} .popup.h350 .p_box {height:350px; margin-top:-175px;} .popup.h400 .p_box {height:400px; margin-top:-200px;} .popup.h450 .p_box {height:450px; margin-top:-225px;} .popup.h500 .p_box {height:500px; margin-top:-250px;} .popup.h550 .p_box {height:550px; margin-top:-275px;} .popup.h600 .p_box {height:600px; margin-top:-300px;} .popup.h650 .p_box {height:650px; margin-top:-325px;} .popup.h700 .p_box {height:700px; margin-top:-350px;} .popup.h750 .p_box {height:750px; margin-top:-375px;} .popup.h800 .p_box {height:800px; margin-top:-400px;}
.popup.h50p .p_box {top:25%; bottom:25%; height:auto; margin-top:0;} .popup.h60p .p_box {top:20%; bottom:20%; height:auto; margin-top:0;} .popup.h70p .p_box {top:15%; bottom:15%; height:auto; margin-top:0;} .popup.h80p .p_box {top:10%; bottom:10%; height:auto; margin-top:0;} .popup.h90p .p_box {top:5%; bottom:5%; height:auto; margin-top:0;}
.popup.popup_privacy .p_box {border-radius:15px;}

.popup.p_commentwrite .p_box {height:680px; margin-top:-340px;}

.popup .p_bg {position:fixed; left:0; right:0; top:0; bottom:0; pointer-events:none;}
.popup.on .p_bg {pointer-events:auto;}

.closebtn {display:inline-block; position:absolute; right:30px; top:30px; z-index:2; box-sizing:border-box; width:60px; border-radius:50%; border:var(--dark) solid 1px; background:var(--white); aspect-ratio:1/1; transition:0.3s;}
.closebtn i {position:absolute; left:50%; top:50%; width:28px; height:28px; margin-left:-14px; margin-top:-14px; color:var(--dark); transition:0.3s; transform:rotate(45deg);}
.closebtn i:before {content:""; position:absolute; left:0; right:0; top:50%; height:2px; margin-top:-1px; background-color:currentColor;}
.closebtn i:after {content:""; position:absolute; left:50%; top:0; bottom:0; width:2px; margin-left:-1px; background-color:currentColor;}
.closebtn:hover i {transform:rotate(135deg);}

.w100p {width:100%}



@media all and (min-width:768px) {
    div::-webkit-scrollbar {width:8px;}
    div::-webkit-scrollbar-thumb {background-color:var(--black); border-radius:10px; background-clip:padding-box; border:2px solid transparent;}
    div::-webkit-scrollbar-thumb:hover {background-color:#241a13;}
    div::-webkit-scrollbar-track {background-color:#fff0;}

    textarea::-webkit-scrollbar {width:8px;}
    textarea::-webkit-scrollbar-thumb {background-color:var(--black); border-radius:10px; background-clip:padding-box; border:2px solid transparent;}
    textarea::-webkit-scrollbar-thumb:hover {background-color:#241a13;}
    textarea::-webkit-scrollbar-track {background-color:#fff0;}
}





@media all and (max-width:1440px) {

}





@media all and (max-width:1280px) {
    .title {font-size:35px;}
    .c_title {gap:5px}
    .c_title mark {font-size:20px}
    .title.small {font-size:40px; line-height:50px}
    .text.tiny, .text .tiny {font-size:14px; line-height:20px}
    .button {font-size:32px; line-height:40px}
    .input {font-size:18px}
    .input {font-size:18px}
    .popup.p_more .p_box {max-width:600px}

    .paging > ul {gap:40px}
    .paging li li {width:45px}

    .form .f_file .ff_filebox .f_input {width:70%}
    .form .f_field .ff_title {width:130px}
    .form .ff_email .f_input, .form .ff_email .f_select {width:150px !important;}

}





@media all and (max-width:1024px) {
    /* 텍스트 */
    .title {font-size:32px; line-height:40px}
    .c_title {gap:5px; margin-bottom:30px}
    .c_title mark {font-size:18px}
    .text > span.nowrap {white-space:normal;}
    .button.small {font-size:30px; line-height:30px}
    .text.huge, .text .huge {font-size:26px; letter-spacing:-0.26px}
    .text.middle, .text .middle {font-size:20px; line-height:30px}


    /* 팝업 */
    .popup .p_box {width:auto; padding:120px 60px;}
    .popup.p_more .p_box {max-width:500px}
    .closebtn {width:50px;}
    .closebtn i {width:22px; height:auto; aspect-ratio:1/1; margin-left:-11px; margin-top:-11px;}

    .c_wrap {flex-direction:column; gap:20px; padding-top:30px; padding-bottom:80px}

    .form .f_field .ff_title {width:120px;}
    .form .f_field .ff_title {padding:20px 15px}

}





@media all and (max-width:768px) {
    body {font-size:16px}
    .wrap {padding:0 30px}
    /*.c_wrap {gap:30px; padding-top:20px}*/
    .c_menu {width:calc(100% - 30px)}
    .c_menu ul {justify-content:flex-start; column-gap:31px; padding:0 30px}
    .c_menu li {width:100%; min-width:70px; text-align:center}
    .c_menu li + li:before {left:-16px}

    /* 텍스트 */
    .c_title mark {font-size:16px; line-height:20px}
    .title {font-size:26px; line-height:35px}
    .text {font-size:16px;}
    .text.small, .text .small {font-size:14px; line-height:25px;}
    .text.middle, .text .middle {font-size:18px; line-height:25px}
    .text.big, .text .big {font-size:20px; line-height:30px}
    .text.huge, .text .huge {font-size:22px}


    .title.small {font-size:32px; line-height:44px}
    .title.t1 {height:50px;}


    .popup .p_body .pb_wrap {bottom:80px;}
    .popup .p_box {width:90%; padding-right:30px}
    .popup.p_more .p_box {max-width:445px; padding:100px 40px}

    .paging {margin-top:40px}
    .paging ul {gap:10px}
    .paging > ul {gap:30px}
    .paging li li {width:40px}
    .paging li a {font-size:15px; background-size:28px!important;}

    .btn {width:150px; font-size:15px; line-height:22px}
    .btn.big {font-size:20px; line-height:26px}

    .form .f_title {font-size:20px;}
    .form .f_input, .form .f_select, .form textarea, .form .f_file .ff_note {font-size:15px; line-height:22px}
    .form .f_title:not(:first-child), .form .f_privacy, .form .f_btn:last-child {margin-top:40px}
    .form .f_field .ff_content {padding:15px;}
    .form .ff_email {flex-wrap:wrap}
    .form .ff_email .f_select {width:100%!important;}
    .form .ff_email .f_select.on {width:calc(50% - 17px)!important;}
    .form .ff_email .f_input {width:calc(50% - 17px)!important}
}





@media all and (max-width:600px) {
    .c_wrap {gap:15px; padding-top:20px}

    .text br.mo {display:block;}

    .form .f_field {flex-direction:column; align-items:flex-start!important; gap:10px; padding:20px 0}
    .form .f_field .ff_title {width:100%}
    .form .f_file .ff_title {flex-direction:row; justify-content:space-between}
    .form .f_field .ff_title, .form .f_field .ff_content {padding:0}
    .form .f_btn button[type="submit"] {width:100%;}
    .form .ff_tel .f_select, .form .f_field .ff_tel input {width:calc((100% - 54px) / 3)!important;}
    .form .f_input {width:100%!important;}

    .input {height:38px; font-size:14px; line-height:38px; text-align:left; text-indent:10px;}
    select {padding-right:20px; background-size:20px;}
    .textarea {min-height:100px; font-size:14px; line-height:25px;}

    .form .ff_address > div > div:nth-child(2) {margin-top:30px!important;}

    .checkbox input[type='checkbox'] {position:absolute; left:0; z-index:-1; width:20px; margin-top:-10px}
    .checkbox label i {width:20px; margin-right:7px;}
    .checkbox label i:before {width:10px; height:6px; margin-left:-5px; margin-top:-5px; border-width:2px;}
    .checkbox label span {font-size:14px; line-height:30px;}

    .title.small {font-size:28px; line-height:36px}

    .paging > ul {flex-wrap:wrap; gap:10px;}
    .paging > ul > li {width:calc(50% - 5px);}
    .paging > ul > li:nth-child(2) {width:100%; order:3}
    .paging li a {height:40px; box-sizing:border-box; padding:5px 0; line-height:30px}
    .paging li li {width:100%; height:auto; aspect-ratio:inherit}

    .btn.big {font-size:18px}
    .form .f_btn button[type="submit"] i {width:22px}

}

@media all and (max-width:430px) {
    .checkbox label span {line-height:14px}
    .form .f_field.t1 .checkbox label span {display:flex; flex-direction:column}
    .form .f_field .ff_wrap.checkbox .tiny {padding-left:0; margin-top:5px}
    .checkbox label i {margin-right:10px; margin-top:0}
    .form .f_field.t1 .checkbox label i {margin-top:-10px}
    .form .f_check {padding-left:5px}
}


@media all and (max-width:425px) {
    .title {font-size:24px; line-height:30px}
    .title.small {font-size:27px}
    .text.middle, .text .middle {font-size:16px;}
    .text.huge, .text .huge {font-size:20px; line-height:30px}
    .text.tiny, .text .tiny {font-size:12px}
    .btn {gap:5px; padding:10px 0}
    .form .ff_address .fa_btn {padding:12.5px 0; gap:10px}


    .form .f_field .ff_content .radio_wrap {flex-direction:column; align-items:flex-start}
    .form .ff_email {flex-wrap:wrap}
    .form .ff_email .f_input {width:calc(50% - 17px)!important;}
    .form .ff_email .f_select {width:100%!important;}

    .popup.p_more .p_box {padding:75px 20px 40px 20px}
}

@media screen and (max-width:375px) {

}

@media all and (max-width:360px) {
    /*.c_wrap {padding-top:10px;}*/
    .form .f_field {padding:15px 0}
    .form .ff_tel {gap:5px}
    .form .ff_tel .f_select, .form .f_field .ff_tel input {width:calc((100% - 34px) / 3)!important}
    .form .ff_address > div > div {flex-direction:column}
    .form .ff_address > div > div > * {width:100%!important;}
    .form .ff_address > div > div > img {width:auto!important;}
    .form .f_file .ff_filebox {flex-direction:column; width:100%}
    .form .f_file .ff_filebox > * {width:100%!important;}
}