.header {position: fixed; top: 0; left: 0; width: 100%; box-sizing: border-box; z-index: 10; display: flex; align-items: center; justify-content: space-between; padding: 20px 10% 15px 10%; transition: background-color 0.5s ease;}
.header.scrolled {background-color: #f5f5f3;}
.logo {text-decoration: none; cursor: pointer;}
.logo img {width: 170px; height: auto;}
.header .icon {border: 0;background: none;padding: 0; margin: 0;cursor: pointer; display: flex; align-items: center;}
.header .icon img {width: 25px; height: auto; display: block;}

.menu_overlay_inner .logo {position: absolute; top: 20px; left: 10%;}
.menu_overlay {position: fixed;inset: 0; width: 100%; height: calc(100vh + 1px); background-color: #f5f0e7; background-image: url('/images/dameun_sidebar_pc_001.jpg');
               background-size: cover; background-position: center; background-repeat: no-repeat; z-index: 999; opacity: 0; visibility: hidden; pointer-events: none;
               transition: opacity 0.45s ease, transform 0.45s ease, visibility 0.45s ease;}
.menu_overlay.active {opacity: 1;visibility: visible; pointer-events: auto; transform: translateY(0);}
.menu_overlay_inner {position: relative; width: 100%; height: 100%; box-sizing: border-box; overflow-y: auto;}

.menu_close {position: absolute; top: 32px;right: 10%; border: 0; background: none; padding: 0; margin: 0; cursor: pointer;}
.menu_close img { width: 26px; height: auto; display: block;}

.menu_contents {width: 100%; height: 100%; box-sizing: border-box; padding: 0 10%; text-align: right; display: flex; flex-direction: column; justify-content: center;
    /*width: 100%;min-height: 100vh; box-sizing: border-box; padding: 120px 10% 60px 10%; text-align:right;*/}
.menu_li {margin-bottom:50px;}
.menu_contents ul {list-style: none; padding: 0; margin: 0;}
.menu_list,
.menu_list_last,
.menu_list:visited,
.menu_list:active,
.menu_list:hover,
.menu_list_last:visited,
.menu_list_last:active,
.menu_list_last:hover {font-weight: 500; font-size: 32px; text-decoration: none; color: #46342a;}
.menu_copyright {position: absolute; bottom: 40px; right: 10%; border: 0; background: none; padding: 0; margin: 0;}
.menu_copyright img {width: 220px; height: auto;}

/* body 스크롤 막기 */
body.menu_opened { width: 100%; overflow-y: scroll;}

/* MOBILE */
@media (max-width: 767px) {
.header {position: fixed; top: 0; left: 0; width: 100%; box-sizing: border-box; z-index: 10; display: flex; align-items: center; justify-content: space-between; padding: 15px 20px 10px 20px;
         transition: background-color 0.5s ease;}
.header.scrolled { background-color: #f5f5f3; }
.logo { text-decoration: none; cursor: pointer;}
.logo img { width: 120px; height: auto; }
.header .icon {border: 0;background: none;padding: 0; margin: 0;cursor: pointer; display: flex; align-items: center;}
.header .icon img { width: 20px; height: auto; }
.menu_overlay_inner .logo {position: absolute; top: 15px; left: 20px;}
.menu_close {top: 22px;right: 21px;}
.menu_close img {width: 22px; height: auto;}
.menu_contents {padding: 0px 20px 60px;}
.menu_li {margin-bottom:30px;}
.menu_list,
.menu_list_last,
.menu_list:visited,
.menu_list:active,
.menu_list:hover,
.menu_list_last:visited,
.menu_list_last:active,
.menu_list_last:hover {font-weight: 500; font-size: 24px; text-decoration: none; color: #46342a;}
.menu_copyright {position: absolute; bottom: 70px; left: calc(50% - 5%); transform: translateX(-50%); border: 0; background: none; padding: 0; margin: 0;}
.menu_copyright img {width: 220px; height: auto;}
}

/* PC */
@media (min-width: 768px) {

}