@charset "utf-8";

/* layout */
.inner {	width: 100%; max-width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;  }
.s-inner {	width:100%; max-width:1400px;	position:relative;	margin-left:auto;	margin-right:auto; }
#wrap { /* overflow-x: hidden; */ /*scroll-behavior:smooth;*/ }

br.br1280{display: none;}
br.br980{display: none;}
br.br768{display: none;}
br.mo{display: none;}


/* 타블렛 가로 */
@media all and (max-width:1620px) {
    .inner {	width:90%; }
}
@media all and (max-width:1420px) {
    .s-inner {	width:90%; }
}
@media all and (max-width:1280px) {
    html { font-size: 60% !important; }
    br.br1280{display: block !important;}
}
@media all and (max-width:980px) {
    html { font-size: 60% !important; }
    br.br980{display: block !important;}
}
@media all and (max-width:768px) {
    html { font-size: 0.55rem !important; }
    br.br768{display: block !important;}
}
@media all and (max-width:480px) {
    html { font-size: 2.2vw !important; }
    br.mo{display: block !important;}
}


#header {position:fixed;width:100%; height:140px; box-sizing:border-box; z-index:300; display:flex; justify-content:space-between; align-items:center; transition:all 0.2s ease-out;padding: 0 7rem;}

#header .hd_mbx { display: none; }

#logo { font-size:0; z-index:103; position:relative}
#logo a { width:300px; height:66px;}
#logo a.logo { display: block; background:no-repeat left center / 100% auto; background-image:url("/images/common/logo.png")  }




.menuToggle { position: relative; right:5px; top:0; width:70px; height:70px; cursor:pointer; z-index:101; }
.menuToggle span { display:block;  height:3px; border-radius:3px;   position:absolute; top: 50%; left:50%; margin-left: -13px; transition:all 0.5s; background:#FFF}
.menuToggle span.t { margin-top: -10px; width:26px;}
.menuToggle span.m { margin-top:-1px; width: 26px; }
.menuToggle span.b { margin-top: 8px; width:26px; }

#header.mo_on .menuToggle span.t {transform: rotate(45deg);  margin-top: 0;}
#header.mo_on .menuToggle span.m {width:0;}
#header.mo_on .menuToggle span.b {transform: rotate(-45deg); width:26px;  margin-top: 0;} 





#gnb_pc {margin: 0 auto 0 8rem;}
#gnb_pc > ul > li {display:inline-block; vertical-align:top; text-align:center; position:relative;}
#gnb_pc > ul > li > div {display:block; font-size:2rem; text-transform:uppercase; line-height:70px; position:relative; width: auto; padding: 0 30px; cursor: pointer;letter-spacing:0; }
#gnb_pc > ul > li > div  a { color:#FFF; }
#gnb_pc > ul > li > ul {padding:1.5em 0.5em; display: none; width:180px; background: #941414; position: absolute; top: 70px; left: 50%; margin-left: -90px; border-radius:5px; }
#gnb_pc > ul > li > ul > li > a {display:block; width:100%; color:#fff;box-sizing: border-box; font-size:1.8rem; padding:0.5em 0;}
#gnb_pc > ul > li > ul > li > a:hover {text-decoration:underline;}
#gnb_pc > ul > li > ul > li > ul {display:none}






#hd_tel dl { position:relative; border: 1px solid #fff; border-radius: 100px; padding: 1.2rem 2rem;}
#hd_tel dl:before { content:''; width:2.4rem; height: 2.4rem; position:absolute; left:2rem; top:50%; transform:translateY(-50%); background: url("/images/common/ico_tel_w.png") no-repeat center; background-size: 100% auto; }
#hd_tel dl dd {padding-left:3.5rem;  font-size:2rem; color:#FFF;  font-weight:600; font-family: 'paperlogy';}
#hd_tel a { display: none; width:40px; height:40px; background: #941414 url("/images/common/ico_tel_w.png") no-repeat center; background-size:2rem; font-size:0; border-radius:50px}


#header.scroll{height: 100px; background: #fff;}
#header.scroll #logo a.logo  {background-image:url("/images/common/logo_on.png")  }
#header.scroll #gnb_pc > ul > li > div  a { color:#333;}
#header.scroll #hd_tel dl{border: 1px solid #941414;}
#header.scroll #hd_tel dl:before {background: url("/images/common/ico_tel.png") no-repeat center; }
#header.scroll #hd_tel dl dd {color:#941414; }
#header.scroll .menuToggle span { background:#222; } 


#header.mo_on.scroll .menuToggle span { background:#FFF; } 



#gnb_mo { position:fixed; top:0; right:0; width:100%; height:100%; max-width:500px; padding: 80px 0; background:rgba(42,38,39, 0.90); overflow-y:scroll; -ms-overflow-style:none; z-index: 100; text-align: left; transition: all 0.4s ease; -webkit-transform: translateX(100%) rotate(0); -moz-transform: translateX(100%) rotate(0); -ms-transform: translateX(100%) rotate(0); -o-transform: translateX(100%) rotate(0); transform: translateX(100%) rotate(0); }
#gnb_mo > ul { border-top: 1px solid rgba(255,255,255,0.1); line-height:3.5em;}
#gnb_mo > ul > li > div {display:block; width:100%; font-size:1.8rem;  border-bottom:1px solid rgba(255,255,255,0.1); box-sizing:border-box; padding:0.7em 1.5em; position:relative; cursor: pointer; }
#gnb_mo > ul > li > div:after {content:''; display:block; width:11px; height:1px; background:#fff; position:absolute; right:1em; top:50%; margin-top:-1px;}
#gnb_mo > ul > li > div:before {content:''; display:block; width:1px; height:11px; background:#fff; position:absolute; right:calc(1em + 5px); top:50%; margin-top:-6px; transition:all 0.5s;}
#gnb_mo > ul > li > div > a { color:#fff; width: 100%; display: inline-block;}
#gnb_mo > ul > li > ul { display:none; }
#gnb_mo > ul > li > ul > li > a {display:block; width:100%; font-size:1.7rem; color:#4b4b4b;padding:0 2em; font-weight: 500; border-bottom:1px solid #e1e1e1; background:#fff; box-sizing:border-box; line-height:3.5em;}
#gnb_mo > ul > li > div.on { background: #941414; }
#gnb_mo > ul > li > div.on:before {transform:rotate(90deg)}
#gnb_mo > ul > li:not(:has(ul)) > div:before, #gnb_mo > ul > li:not(:has(ul)) > div:after { display: none; }

#header.mo_on #gnb_mo {display:block;}
#gnb_mo.m_menuOn{	-webkit-transform: translateX(0) rotate(0); -moz-transform: translateX(0) rotate(0);	-ms-transform: translateX(0) rotate(0);	-o-transform: translateX(0) rotate(0);	transform: translateX(0) rotate(0); }






@media all and (max-width:1600px){
    #logo a { width:270px;}
    #gnb_pc > ul > li > div { padding: 0 15px; }
}
@media all and (max-width:1400px){
    #header {padding: 0 5rem;}
}
@media all and (max-width:1280px){
    #header {padding:0; height:100px;}
    #header .hd_mbx { display: block; }
    
    #header.scroll { height:80px;}
    
    #gnb_pc {display:none;}
    #gnb_mo { text-align: left; }
    
    #logo {order:2}
    
    #hd_tel {order:1; margin-left:12px}
    #hd_tel dl {display:none}
    #hd_tel a { display: block;}
    
    .menuToggle {order:3; width:60px; height:60px }
}

@media all and (max-width:768px) {
    #header {padding:0; height:80px;}
    #gnb_mo { max-width: 100%; padding: 80px 0; }
    #header.scroll { height:60px;}
}
@media all and (max-width:480px) {
    #header #logo a {width:43vw;}
}



/* footer */
#footer{background: #202020; padding: 7rem 0 17rem;}
#footer .top{display: flex; align-items: end; color: #fff; gap: 6rem; justify-content: space-between;}
#footer .top h3{font-size: 5rem;font-family: 'paperlogy';}
#footer .top .line{width: calc(100% - 84rem); background: #fff; height: 1px; opacity: 0.09;}
#footer .bottom{display: flex; align-items: end; color: #fff; gap: 2rem; justify-content: space-between; flex-wrap: wrap;margin-top: 4rem;}
#footer .bottom .lt ul{display: flex; gap: 1rem 3rem; color: #9b9b9b;font-size: 1.6rem; flex-wrap: wrap;}
.red{color: #a21a1a;}
#footer .bottom .lt p{display: flex; gap: 2rem; font-size: 1.4rem; color: #9b9b9b; align-items: center; margin-top: 1rem; opacity: 0.5;}
#footer .bottom .lt p a{display: inline-block;padding-top: 0.2rem;}
#footer .bottom .rt ul{display: flex; gap: 2rem; color: #fff;font-size: 1.4rem; opacity: 0.3; }
#footer .bottom .rt ul a{color: #fff;font-family: 'paperlogy';font-weight: 500;}
#footer .bottom .rt ul li{position: relative;}
#footer .bottom .rt ul li:after{position: absolute; content: '·'; top: 50%; right: -1.1rem; transform: translateY(-50%);}
#footer .bottom .rt ul li:last-child:after{display: none;}


@media all and (max-width:1280px){
    #footer .top h3{font-size: 4rem;}
    #footer .top img{width: 25rem;}
    #footer .top .line{width: calc(100% - 63rem);}
    #footer .bottom .lt ul{gap: 1rem 2rem; font-size: 1.4rem;}
}
@media all and (max-width:976px){
    #footer{padding: 7rem 0 23rem;}
}
@media all and (max-width:768px){
    #footer .top{gap: 1.5rem;}
    #footer .top h3{font-size: 3rem;}
    #footer .top img{width: 20rem;}
    #footer .top .line{width: calc(100% - 45rem);}
}
@media all and (max-width:480px){
    #footer{padding: 5rem 0 25rem;}
    #footer .top{gap: 1rem;}
    #footer .top h3{font-size: 2.5rem;}
    #footer .top img{width: 15rem;}
    #footer .top .line{width: calc(100% - 35rem);}
}


#quickContact { position: fixed; left: 0; bottom: 0; z-index: 999999; display: flex; align-items: flex-end; width: 100%; height: 10rem; background: linear-gradient(to bottom, transparent 0 2rem, #310000 2rem 100%); }
#quickContact .quick_tel { position: relative; z-index: 2; display: flex; align-items: center; flex-shrink: 0; width: 35rem; height: 10rem; padding-left: 7rem; box-sizing: border-box; background: url('/images/common/quick_bg.png') no-repeat left bottom / 100% 100%; }
#quickContact .quick_tel a { position: relative; z-index: 2; color: #fff;}
#quickContact .quick_tel_info { display: flex; flex-direction: column; gap: 0.5rem; }
#quickContact .quick_tel_info > span { display: flex; align-items: center; gap: 1rem; font-size: 1.6rem; font-weight: 400; font-family: 'paperlogy';}
#quickContact .quick_tel_info > span img { display: block; width: 2.5rem; height: 2.5rem; object-fit: contain; }
#quickContact .quick_tel_info strong { font-family: 'paperlogy'; font-size: 3.5rem; font-weight: 700; line-height: 1; letter-spacing: -0.03em; }

#quickContact .quick_form { display: flex; align-items: center; flex: 1; min-width: 0; height: 8rem; padding: 0 7rem 0 8rem; box-sizing: border-box; background: #310000; }
#quickContact #quickContactForm { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
#quickContact .quick_fields { display: flex; align-items: center; gap: 1rem; flex: 1; min-width: 0; }
#quickContact .quick_fields input, #quickContact .quick_fields select { width: 100%; min-width: 0; height: 4.8rem; padding: 0 1.5rem; border: 0; border-radius: 0.5rem; background: #fff; box-sizing: border-box; font-family: inherit; font-size: 1.6rem; color: #333; outline: none; }
#quickContact .quick_fields input::placeholder { color: #777; }
#quickContact .quick_fields select { appearance: none; -webkit-appearance: none; background: #fff url('/images/common/quick_arrow.png') no-repeat right 1rem center; cursor: pointer; }
#quickContact .quick_fields input:focus, #quickContact .quick_fields select:focus { outline: 2px solid #ffbc00; outline-offset: -2px; }

#quickContact .quick_agree { display: flex; align-items: center; justify-content: center; gap: 1rem; flex-shrink: 0; }
#quickContact .quick_agree label { display: flex; align-items: center; gap: 1rem; cursor: pointer; }
#quickContact .quick_agree label input { position: absolute; width: 1px; height: 1px; opacity: 0; }
#quickContact .quick_check { position: relative; display: block; width: 1.8rem; height: 1.8rem; flex-shrink: 0; border: 1px solid #fff; border-radius: 50%; box-sizing: border-box; }
#quickContact .quick_agree input:checked + .quick_check { background: #fff; }
#quickContact .quick_agree input:checked + .quick_check:after { content: ''; position: absolute; top: 0.2rem; left: 0.5rem; width: 0.5rem; height: 0.8rem; border-right: 2px solid #310000; border-bottom: 2px solid #310000; transform: rotate(45deg); }
#quickContact .quick_agree input:focus-visible + .quick_check { outline: 2px solid #ffbc00; outline-offset: 3px; }
#quickContact .quick_agree label span:last-child { font-size: 1.5rem; font-weight: 500; color: #fff; white-space: nowrap; }
#quickContact .quick_privacy_view { padding: 0; border: 0; border-bottom: 1px solid #fff; background: transparent; font-size: 1.5rem; font-weight: 500; color: #fff; white-space: nowrap; cursor: pointer; }

#quickContact .quick_submit { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 17rem; height: 4.8rem; padding: 0; border: 0; border-radius: 5rem; background: #ffbd00; font-size: 2rem; font-weight: 400; color: #222; cursor: pointer; transition: all 0.3s; font-family: 'ONE-Mobile-Title'; margin-left: 20rem;}
#quickContact .quick_submit:hover { background: #fff; }

@media all and (max-width:1680px){
    #quickContact .quick_tel{width: 30rem; padding-left: 3rem;}
    #quickContact .quick_form {padding: 0 5rem 0 4rem;}
    #quickContact .quick_submit{margin-left: 0;}
}
@media all and (max-width:1280px){
    #quickContact #quickContactForm{flex-wrap: wrap; gap: 0.7rem 2rem;}
    #quickContact .quick_agree{order: 3; width: 100%;justify-content: flex-start}
    #quickContact .quick_fields input, #quickContact .quick_fields select{height: 4rem;}
    #quickContact .quick_submit{height: 4rem;}
    #quickContact .quick_agree label span:last-child{font-size: 1.4rem;}
    #quickContact .quick_check{width: 1.4rem; height: 1.4rem;}
    #quickContact .quick_privacy_view{font-size: 1.4rem;}
}
@media all and (max-width: 976px) {
    #quickContact { flex-wrap: wrap; height: auto; }
    #quickContact .quick_tel { width: 100%; height: 6rem; background: linear-gradient(to right, #dd6405, #9d0f17); justify-content: center; padding: 0; }
    #quickContact .quick_tel_info { flex-direction: row; align-items: center; gap: 2rem; }
    #quickContact .quick_tel_info > span { font-size: 1.8rem; }
    #quickContact .quick_form { width: 100%; height: auto; padding: 2rem; }
    #quickContact #quickContactForm { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 0; width: 100%; }
    #quickContact .quick_fields { display: flex; flex: 0 0 100%; width: 100%; order: 1; }
    #quickContact .quick_agree { display: flex; justify-content: flex-start; width: auto; order: 2; }
    #quickContact .quick_submit { display: flex; height: 4.5rem; order: 3; }
}