
.no-scroll {overflow: hidden; height: 100%;}

/* header */
#header {transition: all 0.5s; height: 10rem; z-index: 99;}
#header .in_header {max-width: 160rem;}
#header .logo {display: block; width: 32.2rem; height: 5.3rem; background-image: url('../img/logo.png'); background-repeat: no-repeat;}
#header .nav_wrap {gap: 5rem;}
#header .nav {width: 60.4rem;}
#header .call {width: 21.8rem; height: 4rem; background-image: url('../img/header_call.png'); background-repeat: no-repeat;}
#header.act, #header.sub {background: #fff; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16);}
#header.act .logo, #header.sub .logo {background-image: url('../img/logo_on.png');}
#header.act .nav a, #header.sub .nav a {color: #1D1D1D;}
#header.act .call {background-image: url('../img/header_call_on.png');}

@media screen and (max-width: 880px) {
    #header {height: 6.4rem; padding: 0 3rem;}
    #header .in_header {max-width: 100%;}
    #header .logo {width: 19.6rem; height: 3.2rem; background-image: url('../img/logo_mo.png'); background-size: 100%;}
    #header .menu {width: 3rem; height: 2rem; background-image: url('../img/mo_menu.png'); background-repeat: no-repeat; background-size: 100%;}
    #header .mo_nav {z-index: 10; top: 0; right: -30.1rem; width: 30.1rem; height: 100vh; padding: 2.5rem; background: #fff; transition: all 0.3s;}
    #header .mo_nav.on {right: 0;}
    #header .mo_nav .close_btn {margin-bottom: 2.5rem;}
    #header .mo_nav .close_btn img {width: 1.4rem;}
    #header .mo_nav .logo2 {display: block; width: 19.6rem; height: 3.2rem; background: url('../img/logo_on_mo.png') no-repeat; background-size: 100%; margin-bottom: 4.3rem;}
    #header .mo_nav .nav li:not(:last-child) {margin-bottom: 3.4rem;}
    #header.act .menu, #header.sub .menu {background-image: url('../img/mo_menu_on.png');}
    #header.act .logo, #header.sub .logo {background-image: url('../img/logo_on_mo.png');}
}

/* footer */
#footer .text_area {width: calc(100% - 95.1rem); padding: 12.6rem 0 12.6rem 20.9rem; background: #FFFCF8;}
#footer .logo {margin-bottom: 3rem;}
#footer .address {line-height: 5.5rem; margin-bottom: 2.2rem;}
#footer .call {gap: 1.2rem; margin-bottom: 2.5rem; padding-bottom: 2rem;}
#footer .call::before {content: ''; position: absolute; bottom: 0; left: 0; width: 52.4rem; height: 0.1rem; background: #A2A2A2;}
#footer .parking {gap: 1.8rem; margin-bottom: 3.5rem;}
#footer .list {margin-bottom: 3.1rem;}
#footer .list li {gap: 2.7rem;}
#footer .list li .tit {min-width: 17.2rem;}
#footer .list li:not(:last-child) {margin-bottom: 1.5rem;}
#footer .kakao {width: 60rem; height: 4.6rem; border-radius: 2.4rem; gap: 1.5rem; background: #F3EFEA; margin-bottom: 5.9rem;}
#footer .kakao .icon {gap: 0.6rem; width: 22rem; height: 4.6rem; border-radius: 2.4rem; background: #FFEC41;}
#footer .ft_info {line-height: 3rem;}
#footer .ft_info .pc_view {display: inline-block;}
#footer .map_area .root_daum_roughmap {width: 95.1rem; height: 100%;}
#footer .map_area .root_daum_roughmap .wrap_map {height: 100%;}

@media screen and (max-width: 880px) {
    #footer .inner {flex-direction: column-reverse;}
    #footer .text_area {width: 100%; padding: 6rem 2.4rem 7.9rem 2.4rem; letter-spacing: -0.06rem;}
    #footer .logo {margin-bottom: 2.2rem; padding-left: 2rem;}
    #footer .logo img {width: 22.2rem;}
    #footer .address {font-size: 2.6rem; line-height: 3.6rem; margin-bottom: 1rem; padding-left: 2rem;}
    #footer .call {gap: 2rem; padding-left: 2rem;}
    #footer .call::before {width: 38.3rem; left: 0;}
    #footer .call img {width: 2.6rem;}
    #footer .call p {font-size: 3rem;}
    #footer .parking {margin-bottom: 2.5rem; padding-left: 2rem;}
    #footer .parking img {width: 2.6rem;}
    #footer .parking p {font-size: 2rem; line-height: 3rem;}
    #footer .list {position: relative; margin-bottom: 2.2rem; padding-bottom: 2.5rem; padding-left: 2rem;}
    #footer .list::before {content: ''; position: absolute; bottom: 0; left: 0; width: 38.3rem; height: 0.1rem; background: #A2A2A2;}
    #footer .list li {gap: 2rem;}
    #footer .list li:not(:last-child) {margin-bottom: 0.8rem;}
    #footer .list li .tit {min-width: 12.6rem;}
    #footer .list .fs24 {font-size: 1.8rem;}
    #footer .list .fs22 {margin-top: 1.4rem; font-size: 1.8rem;}
    #footer .kakao {flex-direction: column; width: 100%; height: auto; gap: 1rem; background: transparent; margin-bottom: 4.9rem;}
    #footer .kakao .icon {gap: 0.6rem;}
    #footer .kakao .icon img {width: 2.4rem;}
    #footer .ft_info {text-align: center; font-size: 1.6rem; line-height: 2.6rem;}
    #footer .ft_info .pc_view {display: none;}
    #footer .map_area {height: 32rem;}
}
/* footer */

/* side */
#side {right: 3.6rem; bottom: 7rem; z-index: 99;}
#side .snsList {width: 10.4rem; padding: 2.2rem 1.6rem; border-radius: 2rem; background: #21391A; margin-bottom: 1.6rem; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16);}
#side .snsList a:not(:nth-child(3), .call) {margin-bottom: 1.6rem;}
#side .snsList a.call {margin-top: 2rem; padding-top: 2.4rem; border-top: 1px solid #fff;}
#side .snsList a.call p {line-height: 2.8rem; margin-top: 0.7rem;}
#side .reserve {width: 10.4rem; height: 10.5rem; border-radius: 2rem; box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16);}
#side .reserve.naver {background: #00C300; gap: 0.6rem;}
#side .reserve.kakao {background: #FAE100; gap: 0.3rem; margin-top: 1.6rem; margin-bottom: 4.5rem;}
#side .top_btn {gap: 1rem;}
#side .top_btn .img_area {box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16); border-radius: 50%;}
#side .top_btn img {transform: rotate(-180deg); transition: all 0.3s;}
#side .top_btn p {text-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16);}
#side.act .top_btn img {transform: rotate(0);}
#side.act .top_btn p {display: none;}

@media screen and (max-width: 880px) {
    #side_mo {bottom: 4rem; right: 0; z-index: 10; padding: 2.2rem 0; gap: 2rem; width: 6.4rem; border-radius: 2rem 0 0 2rem; background: #FFFCF6;}
    #side_mo a img {width: 3.2rem;}
}
/* side */

/* side 수정 */
#side_new {right: -12rem; top: 50%; transform: translateY(-50%); transition: all 0.3s;}
#side_new.on {right: 0;}
#side_new .snsList {width: 12.6rem; padding: 5.1rem 0; background: #fff; border-radius: 3rem 0 0 3rem; margin-bottom: 4.5rem; box-shadow: 0 0.3rem 0.6rem rgba(0, 0, 0, 0.16);}
#side_new .snsList a:not(:nth-child(4), .side_btn) {position: relative; margin-bottom: 2.5rem; padding-bottom: 2.5rem;}
#side_new .snsList a:not(:nth-child(4), .side_btn)::before {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 4rem; height: 0.1rem; background: #C9CDD2;}
#side_new .snsList a p {margin-top: 1.2rem;}
#side_new .side_btn {left: -2.8rem; width: 5.6rem; height: 5.6rem; border-radius: 50%; background: #fff;}
#side_new .side_btn img {left: 1.1rem; width: 1.1rem; transition: transform 0.3s;}
#side_new.on .side_btn img {transform: rotate(180deg); left: 1.5rem;}
#side_new .top_btn {gap: 1rem;}
#side_new .top_btn .img_area {box-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16); border-radius: 50%;}
#side_new .top_btn img {transform: rotate(-180deg); transition: all 0.3s;}
#side_new .top_btn p {text-shadow: 0 0.3rem 0.6rem rgba(0,0,0,0.16);}
#side_new.act .top_btn img {transform: rotate(0);}
#side_new.act .top_btn p {display: none;}