@charset "utf-8";
body {overflow-y:scroll;margin-top: 120px;}
body.modal-open, .modal.show {overflow: auto !important;padding-right: 0 !important;}
header {position: fixed;top: 0;left: 0;width: 100%;height: 120px;background-color: #000;border-bottom: 4px solid;border-image: var(--bmw-head-border-bottom-gradient);z-index: 1001;}
header .gnbWrap {height: 40px;line-height: 40px;background: var(--bmw-head-bg-gradient);padding-right: 10px;text-align: right;}
header .btns {height: 28px;padding: 0 10px;margin: 6px;border-radius: 4px;color: #000000;border: none;font-weight: 600;}
header .btnLogin {background-image: var(--bmw-head-btn-bg1);}
header .btnJoin {background-image: var(--bmw-head-btn-bg2);}
header .btns:hover {color:#fff;text-shadow: 0px 0 1px #000; background-image: var(--bmw-head-btn-bg-hover);}
.headerWrap {display: flex;align-items: center;justify-content: space-between;height: 80px;padding: 0 20px;}
.headerWrap a {width: 220px; text-align: center}
.headerWrap .mainLogo:hover {transform: scale(1.1);}
.sideGnb,
.headerGnb {list-style:none;margin:0;padding:0;}
.headerGnb li {float: left;}
.headerGnb li a {text-decoration: none;font-size: 16px;margin: 0 12px;color: var(--bmw-head-link);font-weight: 600;letter-spacing: -1px;cursor: pointer;}
.headerGnb li.subGnb a {color: var(--bmw-head-link-sub);}
.headerGnb li a.active,
.headerGnb li a:hover {color: var(--bmw-head-link-hover);text-shadow: 0 0 5px #fff, 0 0 10px #ff8100, 0 0 15px #f00, 0 0 5px #ef7c00, 0 0 5px #ef7c00, 0 0 10px #f92552, 0 0 20px #ef7c00, 0px 0 20px #ef7c00;transition: all 300ms;}
main {display: flex;width: 100%;height: calc(100% - 120px);position:relative;}
.leftSidebar {flex: 0 0 260px; /* 고정 너비 300px */width: 260px;padding: 10px;position: fixed;left: 0; /* 고정 */top: 120px; bottom: 0;border-right: 1px solid var(--bmw-left-border-color);background-color: var(--bmw-left-bg);;}
.contents {margin-left: 260px;padding: 20px;flex: 1; /* 가변 너비 */position:relative;}
.rightSidebar {flex: 0 0 300px; /* 고정 너비 260px */width: 300px;position: fixed;top: 120px; bottom: 0;right: 0; /* 고정 */border-left: 1px solid var(--bmw-right-border-color);background-color: var(--bmw-right-bg);}
.contents.level3 {margin-right: 300px;}
.leftSidebar .sideGnb li {display: flex;align-items: center;height: 40px;margin-bottom: 2px;border-radius: 5px;}
.leftSidebar .sideGnb li.title {font-size: 14px;margin-bottom: 5px;font-weight: 600;background: var(--bmw-left-title-gradient);color: var(--bmw-left-title);text-shadow: 1px 1px rgba(255,255,255,0.2);}
.leftSidebar .sideGnb li.title i {text-shadow: none;}
.leftSidebar .sideGnb li i {width: 44px;display: flex;align-items: center;justify-content: center;background-image: var(--bmw-left-icon-gradient);-webkit-text-fill-color: transparent;-webkit-background-clip: text;font-size: 28px;transition: transform 0.6s ease; /* 회전 애니메이션 속도와 효과 */}
.leftSidebar .sideGnb li a {flex-grow: 1;display: block;text-decoration: none;font-weight: 600;color: var(--bmw-left-link);}
.leftSidebar .sideGnb li:not(.title):hover {background-color: var(--bmw-left-link-hover);}
.leftSidebar .sideGnb li a:hover {color: #fff0c8;text-shadow: 0 0 5px #fff, 0 0 10px #ff8100, 0 0 15px #f00, 0 0 5px #ef7c00, 0 0 5px #ef7c00, 0 0 10px #f92552, 0 0 20px #ef7c00, 0px 0 20px #ef7c00;}
@keyframes smooth-swing {0% {transform: rotate(0deg);}25% {transform: rotate(20deg);}50% {transform: rotate(-10deg);}75% {transform: rotate(10deg);}100% {transform: rotate(0deg);}}
.leftSidebar .sideGnb li:not(.title):hover i {background-image: var(--bmw-left-icon-gradient-hover);animation: smooth-swing 0.6s cubic-bezier(0.5, 0.05, 0.1, 1);}
/* 푸터 */
.footer {text-align: center;margin-top: 100px;padding-top: 30px;text-align: center;border-top: 1px solid var(--bmw-foter-border);}
.detail {padding: 40px 10px 10px 10px;margin-top: 5px;background: url('/common/img/common/footer_bg.jpg') top center no-repeat;background-size: 100% 100%;color: var(--bmw-foter-color);text-align: center;height: 240px;}
/* 상단 트리메뉴 */
.contentTree {position: sticky;display: flex;flex-wrap: wrap;align-items: flex-start;justify-content: flex-start;width: 100%;}
.contentTree li {flex: 1 1 0;}
.contentTree li a {font-size: 1.1em;padding: 1em 0;display: block;text-align: center;border: 1px solid var(--bmw-tree-border);border-bottom-color: var(--bmw-tree-border-bottom);background-color: var(--bmw-tree-bg);}
.contentTree li a.active,.contentTree li a:hover {background-color: var(--bmw-tree-active-bg);border-color: var(--bmw-tree-bottom);border-bottom-color: var(--bmw-tree-active-border-bottom);color: var(--bmw-tree-link);font-weight: 600;}
/* 우측 사이드바 */
/* 상단 로그인 후 */
.memberInfos {font-family: "나눔고딕";width: 100%;display: flex;justify-content: flex-end;}
.memberInfos li {font-size: 16px;padding-left: 4px;margin-left: 10px;}
.memberInfos li a {padding: 4px 10px;font-size: 16px;color: var(--bmw-head-login-link);text-shadow: 1px 1px rgba(0,0,0,0.5);}
.memberInfos li a.color {background-color: rgba(255,255,255,.15);}
.memberInfos li a:hover {color: var(--bmw-head-login-link-hover);background-color: rgba(0,0,0,0.6);border-radius: 0.5em;transition: background-color 0.4s;}
.memberInfos .icons {margin-right: 5px; vertical-align: -3px;}
.memberInfos .goldlevel {margin-right: 6px; width: 44px; height: 25px; vertical-align: -6px;}