@charset "UTF-8";

/********************************************************
■ Quick Menu : 퀵메뉴 부분
********************************************************/
/* 상단/하단 이동버튼 & 클릭시 퀵메뉴 */
.at-go { position: fixed; right:20px; bottom:0px; z-index:99; --btn-size:60px; --btn-color:#ddd; --btn-radius:99px; --btn-margin:10px; transition-duration:600ms; }
.scrolled .at-go { bottom:50px; }
.at-go .go-btn { display:flex; flex-direction:column; align-items:flex-end; }

.at-go .go-btn li { border-radius:var(--btn-radius); width:var(--btn-size); height:var(--btn-size); margin-top:var(--btn-margin); cursor:pointer; transition-duration:500ms; color:#fff; }
.at-go .go-btn li:nth-last-of-type(n+3) { backdrop-filter:blur(10px); background:rgba(0,0,0,.2); }
.at-go .go-btn li:nth-last-of-type(n+4) { backdrop-filter:blur(10px); background:rgba(0,0,0,.2); }

.at-go .go-btn li:not(:last-child):hover { width:calc(2.5 * var(--btn-size)); }
.at-go .go-btn li:nth-last-of-type(n+3):hover { backdrop-filter:blur(0px); }
.at-go .go-btn li:nth-last-of-type(n+4):hover { backdrop-filter:blur(0px); }

.at-go .go-btn .kakao:hover { background:var(--kakao-color); color:#333; }
.at-go .go-btn .kakao:hover img { filter:invert(1); }
.at-go .go-btn .insta:hover {background: radial-gradient(circle farthest-corner at 32% 106%,#ffe17d 0%,#ffcd69 10%,#fa9137 28%,#eb4141 42%,transparent 82%) , linear-gradient(135deg,#234bd7 12%,#c33cbe 58%); color:#fff; }
.at-go .go-btn .naver:hover { background:var(--naver-color); }
.at-go .go-btn .go-inquiry {backdrop-filter: blur(10px); background: rgba(0,0,0,.2);}

.at-go .go-btn .go-top { position:relative; display:flex; justify-content:center; align-items:center; border:1px solid var(--btn-color); overflow:hidden; z-index:2; transform:translateY(150px); transition-duration:600ms; transition-delay:400ms; box-shadow:2px 2px 5px rgba(0,0,0,.2); background:rgba(255,255,255,.9); }
.at-go .go-btn .go-top:before { content:""; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); border-radius:var(--btn-radius); width:0; height:0; background:var(--main-color4, var(--main-color2)); transition-duration:600ms; z-index:-1; }

.scrolled .at-go .go-btn .go-top { transform:translateY(0); transition-delay:0ms; }

.at-go .go-btn .go-top span { position:absolute; left:calc(50% - 1px); top:calc(50% - var(--arrow-height)/2); width:2px; height:var(--arrow-height); background:#111; --arrow-height:12px; }
.at-go .go-btn .go-top span:before,
.at-go .go-btn .go-top span:after { content:""; position:absolute; width:2px; height:8px; border-radius:2px; background:#111; }
.at-go .go-btn .go-top span:before { right:100%; top:-3px; transform:rotate(45deg); }
.at-go .go-btn .go-top span:after { left:100%; top:-3px; transform:rotate(-45deg); }

.at-go .go-btn .go-top:hover { border-color:var(--main-color4, var(--main-color2)); }
.at-go .go-btn .go-top:hover:before { width:120%; height:120%; }
.at-go .go-btn .go-top:hover b { color:#fff; }
.at-go .go-btn .go-top:hover span,
.at-go .go-btn .go-top:hover span:before,
.at-go .go-btn .go-top:hover span:after { background:#fff; }



.at-go .go-btn .btn { display:flex; justify-content:center; align-items:center; width:100%; height:100%; color:inherit; text-align:left; }
.at-go .go-btn .btn b { opacity:0; visibility:hidden; width:0; font-size:.875rem; transition:opacity 400ms 300ms, width 400ms; }
.at-go .go-btn .btn img { width:26px; }
.at-go .go-btn .btn .fa-solid { font-size:1.3rem; }

.at-go .go-btn li:hover .btn b { opacity:1; visibility:visible; width:calc(100% - var(--btn-size)); padding-left:10px; }




.m-link {position: fixed; left: 0; bottom: 0; right: 0; background: #021810e0; display: flex; z-index: 50; overflow: hidden; height: 100px;}
.m-link a { position:relative; flex:1; padding:12px; color:#fff; text-align:center; font-size:.625rem; }
.m-link a:not(:first-child):before { content:""; position:absolute; top:15px; left:0; bottom:15px; width:1px; background:rgba(255,255,255,.5); }

.m-link a span { display:inline-block; width:25px; height:25px; border-radius:5px; background:none no-repeat center/20px; vertical-align:middle; margin:-2px 5px 0; }
.m-link a:nth-child(1) span { background-image:url('../img/m-btm-quick-icon1.png'); }
.m-link a:nth-child(2) span { background-image:url('../img/m-btm-quick-icon2.png'); }
.m-link a:nth-child(3) span { background-image:url('../img/m-btm-quick-icon3.png'); background-color:var(--kakao-color); }


.inquiry-box { position:fixed; opacity:0; visibility:hidden; left:50%; top:50%; transform:translate(-50%, -50%); width:90%; max-width:380px; }
.inquiry-box.on { opacity:1; visibility:visible; z-index:99; }
.inquiry-box.on:before { content:""; position:fixed; left:50%; top:50%; width:100vw; height:100vh; transform:translate(-50%, -50%); background:rgba(0,0,0,.7); z-index:-1; }

.inquiry-box .close-btn { position:absolute; right:10px; top:10px; font-size:20px; z-index:9; width:30px; text-align:center; color:#111; }

.inquiry-box .c { position:relative; z-index:2; border-radius:20px; background:#fff; padding:30px;  }
.inquiry-box .header { margin-bottom:20px; text-align:center; font-weight:700; font-size:1.25rem; }

.inquiry-box .form-list { --li-height:45px; --li-margin:5px; }
.inquiry-box ul li { position:relative; border-radius:25px; border:1px solid #ddd; display:flex; align-items:center; min-height:var(--li-height); margin:var(--li-margin) 0; }
.inquiry-box ul li span { width:80px; padding-left:20px; font-weight:600; font-size:.875rem; }

.inquiry-box input,
.inquiry-box textarea,
.inquiry-box select { background:none; border:none; outline:none; }

.inquiry-box input,
.inquiry-box select { width:calc(100% - 90px); height:100%; padding:5px 10px; }
.inquiry-box textarea { width:100%; height:calc(var(--li-height)*3 + var(--li-margin)*2); padding:15px 20px; resize:none; }
.inquiry-box input[type="file"] { display:none; }

.inquiry-box .add-btn,
.inquiry-box .delete-btn { position:absolute; top:calc(50% - var(--li-height)/2 + 7px); right:7px; width:90px; font-size:.875rem; border-radius:99px; background:#fff; height:calc(var(--li-height) - 14px); line-height:calc(var(--li-height) - 14px); color:#111; text-align:center; font-weight:600; cursor:pointer; }

.inquiry-box .delete-btn { display:none; }
.inquiry-box .privacy-box { text-align:center; margin:15px 0 20px; display:flex; justify-content:center; align-items:center; }
.inquiry-box .privacy-box .fa-check-square-o { color:var(--main-color2); }
.inquiry-box .privacy-box .fa-square-o { color:#ddd; }
.inquiry-box input[type="checkbox"],
.inquiry-box .fa-check-square-o { display:none; }
.inquiry-box input[type="checkbox"]:checked + label { color:#000; }
.inquiry-box input[type="checkbox"]:checked + label .fa-check-square-o { display:inline-block; }
.inquiry-box input[type="checkbox"]:checked + label .fa-square-o { display:none; }
.inquiry-box label i { margin-right:2px; }

.inquiry-box .view-agreement { margin-left:10px; width:30px; height:30px; line-height:30px; font-size:.75rem; border-radius:99px; background:#444; color:#fff; }
.inquiry-box #quick_submit { width:200px; margin:0 auto; display:block; background:#111; color:#fff; padding:10px; font-size:1.125rem; font-weight:600; border-radius:99px; transition-duration: 500ms; --effect-size:300px; --effect-color:var(--main-color1); }
.inquiry-box #quick_submit:before { left:50%; top:50%; }
.inquiry-box #quick_submit:hover { background:var(--main-color1); }

.inquiry-box input:-ms-input-placeholder, .inquiry-box textarea:-ms-input-placeholder { color:#aaa; font-size:.875rem; }
.inquiry-box input::-ms-input-placeholder, .inquiry-box textarea::-ms-input-placeholder { color:#aaa; font-size:.875rem; }
.inquiry-box input::-webkit-input-placeholder, .inquiry-box textarea::-webkit-input-placeholder { color:#aaa; font-size:.875rem; }
.inquiry-box input::-moz-placeholder, .inquiry-box textarea::-moz-placeholder { color:#aaa; font-size:.875rem; }

#modal-siteinfo .btns { display:flex; justify-content:center; margin-top:20px; }
#modal-siteinfo .btns button { position:relative; width:120px; height:auto; padding:10px 0; margin:0 2px; border-radius:99px; text-align:center; cursor:pointer; color:#fff; }
#modal-siteinfo .btns button:before,
#modal-siteinfo .btns button:after { display:none; }
#modal-siteinfo .btns button.btn-cancel { background:#333; border:2px solid #333; }
#modal-siteinfo .btns button.btn-ok { background:var(--main-color1); border:2px solid var(--main-color1); }
#modal-siteinfo .btns button:hover { background:none; }
#modal-siteinfo .btns button.btn-cancel:hover { color:#333; }
#modal-siteinfo .btns button.btn-ok:hover { color:var(--main-color1); }

	
#main-search {position: absolute !important; left: 50%; right: 50%; bottom: 0px; display: flex; color: #fff; align-items: center; z-index: 2; font-size: 1.1rem; width: 100%; transform: translate(-50%, -50%); max-width: 1400px; gap: 10px;}
#main-search .title {width: 209px; text-align: left; font-weight: bold; background: url('../img/m-btm-quick-icon1.png') no-repeat; height: 40px; line-height: 37px; padding: 0 30px 0 52px; font-size: 30px; color: #30c48c; font-family: 'Paperlogy';}
#main-search .input_wr {display:block}
#main-search .input_wr input {width:150px;text-align: left; height: 50px; font-size: 1em; color: #000; padding: 10px;}
#main-search .input_wr input::placeholder {color:#000}
#main-search button {width: 200px; text-align: center; background: #086342; height: 50px; font-size: 1.5em; font-weight: 600; font-family: 'Paperlogy'; margin-left: 20px;}
#main-search .qs-btn-wrapper {font-size:0.8rem}


@media (max-width: 1400px) {
	.inquiry-box .form-list { padding:0 5%; }
}

@media (max-width: 1200px) {
    .at-go { right:10px !important; bottom:30px; }

	.inquiry-box .form-list { padding:0; }
	#main-search {width: 96%; max-width: 100%; bottom: -27px;}
	#main-search .title {width: 150px; padding-left: 32px; font-size: 20px; background-size: 17% 60%; background-position: 0 50%;}
	#main-search .input_wr input  {width: 200px; height: 35px; font-size: 0.8em; margin: 2px;}
	#main-search button {margin-left:0;margin-top:10px;height:35px}
}


@media (max-width: 1024px) {
	#main-search .title {display:block}
	#main-search .qs-btn-wrapper {}
	#main-search label {}



	.inquiry-box .header { margin-bottom:30px; }
	.inquiry-box .header .head { margin-bottom:15px; }

	.inquiry-box .form-list { flex-wrap:wrap; --li-height:40px; --li-margin:10px; }
	.inquiry-box ul { width:100%; }

	.inquiry-box .privacy-box { margin:20px 0; }
	.inquiry-box #quick_submit { width:180px; }

}

@media (max-width: 768px) {
	.d-ele { display: block !important; }

	.at-go { right:15px; --btn-size:40px; --btn-margin:5px; }
	.scrolled .at-go { bottom:60px; }
	.at-go .go-btn { bottom: 0px; right: 5px; }

    .at-go .go-btn .go-plus:before,
    .at-go .go-btn .go-plus:after { height:15px; }

    .at-go .quick-links i { font-size:.875rem; }

    .at-go .go-btn [class^="go-"] span { --arrow-height:15px; }
    .at-go .go-btn [class^="go-"] span:before,
    .at-go .go-btn [class^="go-"] span:after { height:9px; }
    .at-go .go-btn .go-top span:before { left:-3px; top:-1px; }
    .at-go .go-btn .go-top span:after { right:-3px; top:-1px; }

	#main-search { flex-wrap: wrap; bottom: -43px !important; }
	#main-search .title {display:none}
	#main-search .input_wr {width: 50%; margin-bottom: 10px; float: left; display: block;}
	#main-search .input_wr input  {width: 46%; float: left;}
	#main-search .qs-btn-wrapper { width: 40% !important; }
	#main-search label { width: 80%; }
	
	.inquiry-box ul li span { width:100px; padding-left:20px; }
	.inquiry-box input { width:calc(100% - 100px); }
	.inquiry-box textarea { padding:15px 20px; }
}