@charset "UTF-8";

/*pc메뉴*/
nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: .75rem 0; }
    nav .logo { display: flex; align-items: center; gap: 20px; } 
    nav .logo img { width: 62px; }
    nav .logo p { padding: 5px 10px; border-radius: 100px; color: var(--white); background: #134e4a; }
    nav .menu { display: flex; align-items: center; gap: 20px; }
    nav .menu a { font-weight: 600; }

/*모바일메뉴*/
.mob_nav { display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
           position: fixed; width: 100%; top: 0; z-index: 999; padding: 10px 0 0 0 ; border-bottom: 1px solid var(--BK-E5); background: var(--white); }
    .mob_nav a img { width: auto; height: 50px; margin: 0 0 0 10px; }
    .mob_nav p { padding: 5px 10px; border-radius: 100px; color: var(--white); background: #134e4a; }
    .mob_nav ul { display: flex; width: 100%; border-top: 1px solid var(--BK-E5); }
    .mob_nav ul li { width: 25%; }
    .mob_nav ul a { display: block; padding: 15px 0; font-size: 1.1em; font-weight: 500; text-align: center; }

.mob_btn { width: 28px; height: 28px; margin: 0 10px 0 auto; cursor: pointer; }/*메뉴 버튼*/
.close { position: absolute; right: 10px; top: 10px; width: 50px; height: 50px; cursor: pointer; color: var(--white);  opacity: 1; display: flex;  justify-content: center; align-items: center; font-size: 1.9em;}/*닫기 버튼*/

html.open { overflow: hidden; } /*메뉴가 열렸을때 본문이 스크롤 되지 않는다.*/
#menu { width: 100%; max-width: 520px; height: 100%; padding: 7rem 1rem 0 1rem;
    position: fixed; top: 0px; right: -100%; z-index: 999999; font-size: 14px; color: var(--white); background: #11312d; overflow-x: scroll;
	transition: All 0.2s ease; -webkit-transition: All 0.2s ease; -moz-transition: All 0.2s ease; -o-transition: All 0.2s ease; } /*메뉴 영역*/

/* 모바일 메뉴 */
.mob_menu { display: flex; flex-direction: column; gap: 30px; }
.mob_menu li  { position: relative;  text-align: center; }
.mob_menu li a { display: inline-block; font-size: 1.3em; }
.mob_menu li a:after{ content: ""; display: block; width: 2.5rem; height: 1px; margin: 1.75rem auto 0; background-color: hsla(0, 0%, 100%, .3); }

/* 모바일 예약 */
.img_btn { position: relative; width: 140px; margin: 40px auto; padding: 15px 0px; font-size: 12px; text-align: center; line-height: 20px; color: #999; border-bottom: 1px solid #019e97; }
.img_btn p.cir { position: absolute; right: 20px; top: 0; width: 25px; height: 25px; border-radius: 50px; font-weight: 500; font-size: 11px; text-align: center; line-height: 22px;  color: #fff; background: #019e97; }
.img_btn p span { display: block; padding: 10px 0 0 0; font-size: 15px; font-weight: 300; color: #000; }

#menu.open { right: 0px; }

.page_cover.open { display: block; }

.page_cover { width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; background-color: rgba(0, 0, 0, 0.4); z-index: 99999; display: none; }

/*하단*/
footer { position: relative; padding: 3rem 0; font-size: 0.9em; color: #e5e7eb; background: #1a1a1a; }
    footer .box { display: flex; align-items: center; gap: 20px; }
    footer .info p { padding: .25rem 0; line-height: 1.5em; }

    footer .info ul { display: flex; gap: 10px; padding-top: 10px; }
    footer .info ul a { padding: 5px 10px; color: var(--white); border-radius: .375rem; background: #6b7280; }

/* top메뉴 */
footer .top { position: absolute; bottom: 15px; right: 15px; }
    footer .top i { border-radius: 30px; width: 30px; height: 30px; font-size: 1.3em; line-height: 30px; text-align: center; border: 1px solid #b5bccf;}

@media (max-width:991px) {
    footer { padding: 2rem 0 5rem 0; font-size: 1em; }
    footer .box { flex-direction: column; gap: 10px; text-align: center; }
    footer .info p { padding: 0; line-height: 1.7em; }
    footer .info span { display: none; }
    footer .info ul { justify-content: center; }
}
@media (max-width:767px) {

}