@charset "utf-8";

@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}


@font-face {
    font-family: 'Montserrat-Medium';
    font-style: normal;
    font-weight: 500;
    src:url('font/Montserrat-Medium.woff2') format('woff2');
}

@font-face {
    font-family: 'TAEBAEKmilkyway';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2310@1.0/TAEBAEKmilkyway.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}



.hidden { position:absolute; width:0; height:0; line-height:0; font-size:0; visibility:hidden; text-indent:-9999em;}
.cb { clear:both;}
.fl { float:left;}
.fr { float:right;}
.dn { display:none;}

.next-line-pc { display:block; }

input{font-size:16px;}
select{font-size:16px;}
/*.hideme1 { position:relative; top:150px}
.hideme2 { position:relative; top:150px}
.hideme3 { position:relative; top:150px}
.hideme4 { position:relative; top:150px}
.hideme5 { position:relative; top:150px}
.hideme6 { position:relative; top:150px}*/

/*#header { position: absolute; width:100%; top:0; left:0; z-index:10}*/


#header {height: var(--hd_h); position: fixed; z-index: 110; width: 100%; transition: 0.3s ease-in-out}
#header.relative {position: relative !important;}
#header.down {  }
#header.top h2 .svg { transform: unset; }
#header.top .nav { transform: unset }
#header.down .nav { transform: translateY(-140%) }

/* #header h2 { position:absolute; top: 28px; left: 3%; pointer-events: none; transition: opacity 0.3s ease-in-out} */
#header h2 { position:absolute; top: 25px; left: 3%; transition: opacity 0.3s ease-in-out}

/*#header h2 .svg {position: absolute;left: 0;top: 0px;z-index: 200;width: calc(100vw - 4.4vw);height: calc(100vh - 56px);display: flex;align-items: center;justify-content: center; transition: width 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 3s, height 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 3s;}*/
#header h2 .svg {position: absolute;left: 0;top: 0;display: flex;align-items: center;justify-content: center;width: 10.8vw;height: 1.9vw;transform: translateY(-190%);transition: 0.3s ease-in-out;z-index: 200;}
#header h2 .svg svg { width: 100%; height: 100%; object-fit: contain; }
#header h2 .svg svg .cls-1 {fill: var(--purp)}
/*#header h2 .svg svg {width: 9vw; opacity: 0; transition: opacity .3s ease-in-out, width 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 3s}*/

.main #header h2 .load_svg { position: absolute; left: 0; top: -0.8rem; display: flex; align-items: center; justify-content: center; width: calc(100vw - 4.4vw); height: calc(100vh - 56px); z-index: 220; transition: width 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99), opacity 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 0.2s ,height 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99)}
.main #header h2 .load_svg img { width: 9vw; opacity: 1; transition: opacity .3s ease-in-out, width 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 3s}
.main #header h2 .load_svg img * {transition: fill 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 3s }
.main #header h2 .load_svg svg {width: 9vw; opacity: 1; transition: opacity .3s ease-in-out, width 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 3s}
.main #header h2 .load_svg svg * {transition: fill 0.7s cubic-bezier(0.67, 0.02, 0.2, 0.99) 3s }

.main #header h2 .cls-1{fill:#fff; transition: 1s ease-in-out 3s}

/*.main #header h2 .svg {width: 20rem;height: 5rem;}
.main #header h2 .svg svg {opacity: 1; width: 20rem}
.main #header h2 .cls-1 {fill: var(--purp)}*/

.main.active #header h2 .load_svg {width: 20rem;height: 5rem; opacity: 0}
/*.main.active #header h2 .load_svg svg * {fill: var(--purp)}*/

.main.active2 #header h2 .load_svg {display: none}


/*.main.active2 #header h2 .svg {width: 20rem;height: 5rem; transition: none}*/
/*.main.active2 #header h2 .svg svg {opacity: 1; width: 20rem; transition: none}*/
/*.main.active2 #header h2 .cls-1 {fill: var(--purp); transition: none}*/

.sub #header h2 {pointer-events: auto}

#header h2 img {width: 100%;height:auto;max-width: 200px;}
#header .nav {position: fixed;top: 15px;right: var(--grid_pd1);z-index: 50;transition: 0.3s ease-in-out}
#header .nav:before {content: "";position: absolute; right: 50%; top: 50%; transform: translate(50%,-50%); width: 100%; height: 100%; background-color: var(--purp); border-radius: 50%; transition: 0.6s cubic-bezier(0.77, 0.02, 0.58, 1); transform-origin: right top; }
#header .nav .nav_box {z-index: 200; background:--purp; width:70px; height:70px; line-height:70px; border-radius:100%; display:block; text-align:center; position:relative;-webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear;transition: all 0.3s; }
#header .nav .nav_box:hover { background: --purp; }

#header.open .nav a,
#header.open h2 {opacity: 0}
#header.open .nav:before {background-color: #151515; width: 200vw; height: 200vw; transform: translate(20%,-20%)}

.hbgOpen { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
.hbgOpen {display: block;width: 27px;height: 32px;position: relative;cursor: pointer;}
.hbgOpen div {position: absolute;height: 2px;border-radius: 2px;background: #fff;transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6), width 0.2s ease 0.2s;}
.hbgOpen div:nth-child(1) {top: 50%;left: 0;margin: -2px 0 0 0;width: 27px;transform-origin: 50% 50%;}
.hbgOpen div:nth-child(2) {top: 7px;left: 0;width: 15px;transform-origin: 0 50%;}
.hbgOpen div:nth-child(3) {bottom: 9px;right: 0;width: 20px;transform-origin: 100% 50%;transform: translate(-7px, 0);}

.hbgOpen.active div:nth-child(2) {transform: rotate(-45deg);transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s;}
.hbgOpen.active div:nth-child(2) {width: 19px;transform: translate(6px, 0) rotate(45deg);transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s, width 0.2s ease;}
.hbgOpen.active div:nth-child(3) {width: 19px;transform: translate(-6px, 0) rotate(45deg);transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s, width 0.2s ease;}

.hbgClose { position:absolute; top:50%; left:50%; transform:translate(-44%, -50%);}
.hbgClose {display: block;width: 34px;height: 30px;position: relative;cursor: pointer;}
.hbgClose div {position: absolute;height: 2px;border-radius: 2px;background: #fff;transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6), width 0.2s ease 0.2s;}
.hbgClose div:nth-child(1) {top: 50%;left: 0;margin: -2px 0 0 0;width: 29px;transform-origin: 50% 50%;}
.hbgClose div:nth-child(2) {top: 3px;left: 0;width: 20px;transform-origin: 0 50%;}
.hbgClose div:nth-child(3) {bottom: 4px;right: 0;width: 22px;transform-origin: 100% 50%;transform: translate(-12px, 0);}
.hbgClose.active div:nth-child(1) {transform: rotate(-45deg);transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s; transition-delay: 0.3s}
.hbgClose.active div:nth-child(2) {width: 15px;transform: translate(4px, 0) rotate(45deg);transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s, width 0.2s ease; transition-delay: 0.3s}
.hbgClose.active div:nth-child(3) {width: 15px;transform: translate(-9px, 0) rotate(45deg);transition: transform 0.45s cubic-bezier(0.9, -0.6, 0.3, 1.6) 0.1s, width 0.2s ease; transition-delay: 0.3s}


.sticky {position: inherit !important; top: 0;width: 100%;}
.sticky + .content { }

.overlay { position: fixed;top: 0; left: 0%; height: 100%; width: 100%; overflow:hidden; z-index: 200 ; pointer-events: none}
.overlay-content {position: relative;top: 25%;width: 75%;max-width: 1300px;text-align: center;margin: 30px auto 0;opacity: 0;transition: opacity 0.6s ease-in-out 0s;}
.overlay a {padding:0 0 30px;text-decoration: none;font-size: 5.5rem; color: #ffffff;display: block;transition: 0.3s; font-weight: 100; }

.overlay.open { pointer-events: auto;}
.overlay.open .closebtn {display: block}
.overlay.open .overlay-content { opacity: 1; transition: opacity 0.6s ease-in-out 0.6s; }

.overlay .nav_box > ul > li > a { position: relative; display:inline; padding:0; font-weight: 700; font-size: var(--sub_h4); font-family: var(--pop); color: var(--purp); }
.overlay .nav_box > ul > li > a:before { content: ''; position: absolute; left: -0.5em; top: 0; width: 0; height: 100%; background-color: var(--purp); mix-blend-mode: difference; z-index: 10; }
.overlay .nav_box > ul > li > a:hover:before { animation: depthEffect 1s forwards; }

@keyframes depthEffect {
    0% { left: -0.5em; }
    40% { width: calc(100% + 1em); left: -0.5em; }
    45% { width: calc(100% + 1em); left: unset; right: -0.5em; }
    100% { width: 0; left: unset; right: -0.5em; }
}

/*depth2*/
.overlay .nav_box .depth2 { margin-top:/* 5em*/1.5em; font-family: 'Pretendard', Sans-Serif !important; }
.overlay .nav_box .depth2 li {margin: 1.1em 0;opacity: 0;transition: opacity 0.6s;}

.overlay .nav_box .depth2 li:nth-of-type(1) { transition-delay: unset; }
.overlay .nav_box .depth2 li:nth-of-type(2) { transition-delay: unset; }
.overlay .nav_box .depth2 li:nth-of-type(3) { transition-delay: unset; }
.overlay .nav_box .depth2 li:nth-of-type(4) { transition-delay: unset; }
.overlay .nav_box .depth2 li:nth-of-type(5) { transition-delay: unset; }

.overlay.open .nav_box .depth2 li:nth-of-type(1) { transition-delay: 0.8s }
.overlay.open .nav_box .depth2 li:nth-of-type(2) { transition-delay: 0.9s }
.overlay.open .nav_box .depth2 li:nth-of-type(3) { transition-delay: 1s }
.overlay.open .nav_box .depth2 li:nth-of-type(4) { transition-delay: 1.1s }
.overlay.open .nav_box .depth2 li:nth-of-type(5) { transition-delay: 1.2s }

.overlay.open .nav_box .depth2 li { opacity: 1; }

.overlay .nav_box .depth2 li a { position: relative; font-size: 1.2vw; font-weight: 500; color: #fff; }
.overlay .nav_box .depth2 li a span { position: relative; fill: #fff; }
.overlay .nav_box .depth2 li a span svg {margin-left: 0.4em;height: 0.8em;transform: translateY(0.05em);}
.overlay .nav_box .depth2 li a span:before {content: '';position: absolute;left: -0.3em;top: 15%;width: 0.35em;height: 0.35em;border-radius: 100%;background-color: var(--purp);transform: translate(-100%, 0);opacity: 0;transition: opacity 0.3s;}
/* .overlay .nav_box .depth2 li a span:after { content: ''; position: absolute; right: -0.9em; top: 50%; transform: translateY(-50%); width: 0.6em; height: 0.6em; background: url('/inc/img/common/new_ico2.svg')center/contain no-repeat; opacity: 0; } */
/* .overlay .nav_box .depth2 li.new_post a span:after { opacity: 1; } */
.overlay .nav_box .depth2 li:hover a span:before { opacity: 1; }
.overlay .nav_box .depth2 li a span.active:before { opacity: 1; }


.overlay .closebtn {position: absolute;top: 15px;right: var(--grid_pd1);background: var(--purp); padding:0 0 0 0 !important; font-size: 1.6rem; width: 70px;height: 70px;line-height: 70px;border-radius: 150px;display: none;text-align: center;-webkit-transition: all 0.3s linear;-moz-transition: all 0.3s linear;-o-transition: all 0.3s linear;transition: all 0.3s linear;transition: all 0.3s;}
.overlay .closebtn img {position:relative; top:24px;}
/*.overlay .closebtn:hover {background:#000;}*/

.nav_box::after {
	clear:both;
	display:block;
	content:'';
}

.nav_box .left {float:left; display:inline-block; width:50%; box-sizing:border-box; color:#ffffff; text-align:left; padding-right:20px; box-sizing:border-box; margin-right: -1px; border-right: 1px solid #cdb2a7;}
.nav_box .left h2 { font-size: calc(2vw + 25px) !important; font-weight:900; line-height:1em; margin-bottom:60px; color:#ffffff; }
.nav_box .left p {font-size:20px; line-height:1.5em; margin-bottom:25px; text-align:left; font-weight:100; position:relative; padding-left:100px; }
.nav_box .left p strong { display: inline-block; position:absolute; top:1px; left:0; }
.nav_box .left .n_sns a { vertical-align: middle; font-size: 26px; }
/*.nav_box .left .n_sns a:nth-of-type(3) {
    background: url(../img/common/ocon_mo02.png) no-repeat center top;
    width: 23px;
    height: 25px;
    background-size: 23px;
    display: inline-block;
}*/
.cof_down {position: absolute; top:885px; left:30px; background:url(../img/common/icon_down.png) no-repeat left top; background-size:50px; padding-left: 60px;text-align: left; height: 55px;}
.cof_down a {color:#fff; font-size:16px; padding-bottom:0}
.cof_down span {display:block; margin-top:5px; font-size:20px; font-weight:800;}
.n_sns a {display:inline-block;margin-right:20px;}
.n_sns a i {font-size:25px; color:#fff; position:relative; top:1px }
.nav_box .right { display: flex; align-items: flex-start; justify-content: space-between; width:100%; text-align:left;box-sizing: border-box; }
.nav_box .right li { text-align: center; }
/*.nav_box .right li + li { margin-left: 3rem; }*/
.nav_box .right a:last-child {padding-bottom: 0;}

/* footer */
#footer .footer p strong {font-weight:600; font-size:17px;}
#footer .footer p span {display:inline-block; margin:0 26px 0 0; }
#footer .footer p span:last-child {margin: 0;}
#footer .footer .f_desc {overflow:hidden; border-bottom:1px solid #d2b9b0; padding-bottom:16px;}
#footer .footer .f_desc p {float:left; display:inline-block; font-size: 18px; }
#footer .footer .f_bottom {overflow:hidden; padding-top:50px;}
#footer .footer .f_bottom .cp { float:left; margin-top: 20px;}
#footer .footer .f_bottom .cp img {display:inline-block; margin-right:15px; position:relative; top:-10px; width:172px; }
#footer .footer .f_bottom .f_sns { float:right;}
#footer .footer .f_bottom .f_sns a {border:1px solid #ffffff; width:53px; height:53px; border-radius: 150px; text-align: center;display:inline-block; margin-left:15px;color:#ffffff;-webkit-transition:all 0.3s linear; -moz-transition:all 0.3s linear; -o-transition:all 0.3s linear; transition:all 0.3s linear;transition: all 0.3s; vertical-align:bottom}
#footer .footer .f_bottom .f_sns a.way { width: 110px; line-height: 53px; }
#footer .footer .f_bottom .f_sns a.way.ft_pc { width: 53px; line-height: 53px; }
#footer .footer .f_bottom .f_sns a.way i { position: relative; top: 2px; margin-right: 5px; }
#footer .footer .f_bottom .f_sns a.way.ft_pc i { margin-right: 0; }
#footer .footer .f_bottom .f_sns a:first-of-type { margin-left:0; }
/*#footer .footer .f_bottom .f_sns a:nth-child(3) {background:url(../img/common/ocon_mo02.jpg) no-repeat center 17px; background-size:25px}*/
/*#footer .footer .f_bottom .f_sns a:nth-child(3):hover {background:#ffffff url(../img/common/ocon_mo02_on.jpg) no-repeat center 17px; background-size:25px}*/
#footer .footer .f_bottom .f_sns a { position: relative; }
#footer .footer .f_bottom .f_sns a i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 20px; }

#footer .footer .f_info {overflow: hidden;margin-top: 30px;}
#footer .footer .f_info .left {float: left;}
#footer .footer .f_info .right {float: right;}
#footer .footer .f_info p {margin-bottom: 0;}


/* skipToContent */
#skipToContent { position:absolute; top: 0; left:0; width:100%; z-index:999; }
#skipToContent a { display:block; height: 0; width: 0; margin-bottom:-1px; overflow:hidden; text-align:center; color:#fff; white-space:nowrap; background:#001; }
#skipToContent a:focus, #skipToContent a:active { height:auto; width:auto; padding:5px; margin-bottom:10px; }

#returnToPageTop { position:absolute; bottom: 0; left:0; width:100%; z-index:999; }
#returnToPageTop a { display:block; height: 0; width: 0; margin-bottom:-1px; overflow:hidden; text-align:center; color:#fff; white-space:nowrap; background:#001; }
#returnToPageTop a:focus, #returnToPageTop a:active { height:auto; width:auto; padding:5px; margin-bottom:10px; }


.ml0 {margin-left:0 !important;}



.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
/*    clip: rect(0,0,0,0);*/
    white-space: nowrap;
    border: 0;
}



/*호버 디자인*/
@media only screen and (min-width:1024px){
    #footer .footer .f_bottom .f_sns a:hover { background:#fff; color:#b18978}
}
@media only screen and (max-width:1940px){
    #header {height: 80px}
}


@media only screen and (max-width:1900px){
    #header h2 { right: 50px; }
}

@media screen and (max-width:1600px){
    #header { height: 80px; }
   /* #header h2 { top: 21px; }*/
    #header .nav .nav_box { width: 55px; height: 55px; }
    .overlay .closebtn{width: 55px; height: 55px;}
}

@media screen and (max-width:1200px){
    #header h2 { left: 30px; }
	 #header h2 img { width: 150px; }
    #header .nav {/* right: 30px; */}

    #footer .footer .f_top p.left {float:none; display:block; width:100%; box-sizing:border-box; padding-left:45px; position:relative; font-size:12px}
    #footer .footer .f_top p.left strong {position:absolute; top:1px; left:0; font-size:13px}
    #footer .footer .f_top p.right {float:none; display:block; width:100%; text-align:left;font-size:12px}
    #footer .footer .f_top p.right strong { font-size:13px;}
    .overlay a { font-size: calc(1.5vw + 22px); }
    .nav_box .left p { margin-bottom: 16px; }
}

@media screen and (max-width:1050px){
    #footer .footer .f_info .left {float: none;margin-bottom: 10px;}
    #footer .footer .f_info .right {float: none; }

}


@media only screen and (max-width: 768px){
	#header {
		height: 60px;
	}
	.next-line-mo { display:block; }
	.next-line-pc { display:inline; }
	.nav_box .left { display:none}
	.nav_box .right {float:none; display:block; width:100%; padding-left:0; text-align:left; border: none;}

    .overlay .nav_box .depth2 { justify-content: flex-start; }
    .overlay .nav_box .depth2 li + li { margin-left: 15px; }
    .overlay .nav_box .depth2 li a {font-size: 16px;}

	.overlay a {/*display: inline-block; width: 50%; float:left;*/ font-size:28px; padding:0 0 30px;}
	.overlay-content { width:100%; margin:0; position:inherit; top: 12%;}
	.cof_down {/*text-align: left;width: 170px; margin-left:-85px;bottom: 20px;left: 50%;background-size:40px; padding-left:50px*/ display:none}
	.cof_down a {font-size:14px;}
	.cof_down span {line-height:1em; font-size:15px; margin-top:3px;}
	.overlay .closebtn {width:40px;height:40px;top: 15px;box-sizing: border-box;padding-left: 11px !important;}
	.overlay .closebtn img {width:15px; height:15px; top:18px;}
	
	/*.location_data {position:inherit !important;}*/
	#footer {padding:20px 15px 25px;}
	#footer .footer .f_top {padding-bottom:40px;}
	#footer .footer .f_bottom {padding-top:10px;}
	#footer .footer .f_bottom .f_sns a {width:50px; height:50px; border:none; margin:0; }
    #footer .footer .f_bottom .f_sns a.way { height: 30px; line-height: 30px; margin-bottom: 9px; margin-left: 10px; border: 1px solid #fff; }
	#footer .footer .f_bottom .f_sns a i { font-size: 20px; }
    #footer .footer .f_bottom .f_sns a.call i { font-size: 16px; }
	#footer .footer .f_info { margin-top: 13px; }
	#footer .footer .f_desc { padding-bottom: 8px; }
	#footer .footer .f_desc p {float: none; width: 100%; position:relative; font-size:11px; }
	#footer .footer .f_desc p strong { font-size:11px; }
	#footer .footer .f_info .left {float: none;margin-bottom: 10px;word-break: keep-all; font-size:13px; }
	#footer .footer .f_info .right {float: none;  font-size:13px; }
	#footer .footer .f_bottom .cp img { display:none; }  
	#footer .footer p strong { font-size:13px; }
	#footer .footer p span { font-size:13px; } 

	.overlay .nav_box .depth2 li{margin:15px0;}
}

.ft_mo { display: none !important; }
.ft_pc { display: inline-block !important; }
@media only screen and (max-width:768px){
    .ft_mo { display: inline-block !important; }
    .ft_pc { display: none !important; }
    .footer .cp {position: inherit;transform: inherit; display:block; text-align:center; margin-top:15px;font-size: 14px;}
    .footer .cp img {top: 0 !important;}
    .footer .box {display:block; margin-bottom:5px;}

    #header h2 {top: 0;left:10px;}
    #header h2.sub {top: 16px;}
    #header h2 img {width: 120px;}
    #header .nav .nav_box {width:40px; height:40px; box-sizing: border-box;}
    #header .nav {/* right:10px; *//* top: 15px; */}
    .hbgOpen { left: 57%; height: 21px; }
    .hbgOpen div { height: 2px; }
    .hbgOpen div:nth-child(1) { width: 23px; }
    .hbgOpen div:nth-child(2) { width: 12px; top: 4px; }
    .hbgOpen div:nth-child(3) { width: 17px; right: 3px; bottom: 5px; }


    .hbgClose { width: 40px;height: 23px; }
    .hbgClose div { height: 2px; }
    .hbgClose div:nth-child(1) { width: 27px; margin: -1px 0px 0px 2px; }
    .hbgClose div:nth-child(2) { width: 13px; }
    .hbgClose div:nth-child(3) { width: 21px; right: 7px; }

    .hbgClose.active div:nth-child(1) { width: 20px; }
    .hbgClose.active div:nth-child(2) { width: 10px; }
    .hbgClose.active div:nth-child(3) { width: 11px; transform: translate(-14px, 0) rotate(45deg); }
}

@media only screen and (max-width:680px){
	#footer .footer .f_bottom .f_sns {float:none; display: block;text-align: center;}
	#footer .footer .f_bottom .cp {float:none; display:block; text-align:center; margin-top:0;}

}



.seo-only {
   position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
/*   clip: rect(0, 0, 0, 0);*/
   white-space: nowrap;
   border: 0;
}

/*select {
    &, &::picker(select) {
        appearance: base-select;
    }
}*/


/* ===== Forms ===== */
.input, .select, .textarea,
input[type="text"], input[type="search"], input[type="password"],
select, textarea {
  font: inherit;
  padding: .8rem 2.2rem;
  border-radius:10px;
  /* min-width:0; */
  border:1px solid #efefef;
  background:#fff;
  color:var(--ink);
  outline:none;
}
.input:focus, .select:focus, .textarea:focus,
input:focus, select:focus, textarea:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px color-mix(in oklab, var(--primary) 20%, transparent);
}
.textarea{ width:100%; }