/* 친구알바 모바일 햄버거·바로가기 설치 */
#hd, #hd_wrapper{position:relative}
.fa-mnav-actions{
  position:absolute;
  top:8px;
  right:8px;
  z-index:10050;
  display:flex;
  align-items:center;
  gap:6px;
}
.fa-mnav-install-hd{
  height:40px;
  padding:0 10px;
  border-radius:12px;
  font-size:13px;
  white-space:nowrap;
}
.fa-mnav-install-hd .fa-install-short{display:none}
.fa-mnav-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:44px;
  height:44px;
  padding:0 10px;
  border:0;
  border-radius:12px;
  background:#2d6bff;
  color:#fff;
  box-shadow:0 6px 16px rgba(45,107,255,.28);
  cursor:pointer;
}
.fa-mnav-toggle-txt{
  font-size:12px;
  font-weight:800;
  letter-spacing:-.3px;
}
.fa-mnav-bars{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
  width:18px;
  height:14px;
}
.fa-mnav-bars i{
  display:block;
  height:2px;
  border-radius:2px;
  background:#fff;
}
.fa-mnav-dim{
  display:none;
  position:fixed;
  inset:0;
  z-index:10060;
  background:rgba(16,24,40,.45);
}
body.fa-mnav-open .fa-mnav-dim{display:block}
.fa-mnav-drawer{
  position:fixed;
  top:0;
  right:0;
  z-index:10070;
  width:min(86vw,360px);
  height:100%;
  overflow-y:auto;
  background:#fff;
  box-shadow:-12px 0 40px rgba(16,24,40,.18);
  transform:translateX(100%);
  visibility:hidden;
  pointer-events:none;
  transition:transform .22s ease,visibility .22s ease;
  -webkit-overflow-scrolling:touch;
}
body.fa-mnav-open .fa-mnav-drawer{
  transform:translateX(0);
  visibility:visible;
  pointer-events:auto;
}
body.fa-mnav-open{overflow:hidden}
.fa-mnav-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 16px 10px;
}
.fa-mnav-head strong{font-size:18px;letter-spacing:-.4px}
.fa-mnav-close{
  width:40px;
  height:40px;
  border:0;
  border-radius:10px;
  background:#f2f4f7;
  color:#101828;
  font-size:18px;
}
.fa-mnav-install{
  display:flex;
  width:calc(100% - 32px);
  margin:0 16px 12px;
  height:46px;
  justify-content:center;
  font-size:15px;
}
.fa-mnav-list{padding:4px 10px 28px}
.fa-mnav-list a{
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 12px;
  border-radius:12px;
  font-size:16px;
  font-weight:800;
  color:#101828;
  letter-spacing:-.3px;
}
.fa-mnav-list a i{width:20px;color:#2d6bff;text-align:center}
.fa-mnav-list a:active{background:#f2f6ff}

/* 모바일 테마 기본 햄버거는 우리 버튼으로 대체 */
body.fa-is-mobile #gnb_open{display:none!important}
body.fa-is-mobile #user_btn{left:8px;right:auto;color:#2d6bff;z-index:10040}
body.fa-is-mobile #hd{
  background:#fff!important;
  border-bottom:1px solid #e8ebf0;
  min-height:60px;
}
body.fa-is-mobile #logo{
  text-align:left;
  padding:10px 148px 10px 52px;
  height:auto;
  min-height:60px;
}
body.fa-is-mobile .alba-brand,
body.fa-is-mobile .alba-brand em{color:#172033}
body.fa-is-mobile .alba-brand b{color:#2d6bff}

.friend-quick [data-install]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:0 16px;
  border:0;
  border-radius:14px;
  background:#2d6bff;
  color:#fff;
  font-weight:800;
  font-size:15px;
}
body.fa-standalone .fa-install-btn,
body.fa-standalone [data-install],
[data-install].is-installed{display:none!important}

@media (max-width:420px){
  .fa-mnav-install-hd .fa-install-full{display:none}
  .fa-mnav-install-hd .fa-install-short{display:inline}
  .fa-mnav-toggle-txt{display:none}
  body.fa-is-mobile #logo{padding-right:118px}
}

/* PC 테마를 좁은 화면으로 볼 때도 헤더 우측에 햄버거 */
@media (max-width:1024px){
  #hd #hd_wrapper{position:relative;padding-right:8px}
  .fa-mnav-actions{display:flex}
  #gnb.fa-gnb .gnb_mnal{display:none}
  body.fa-is-pc .hd_login{display:none}
  body.fa-is-pc .hd_sch_wr{margin-right:150px}
}
@media (min-width:1025px){
  body.fa-is-pc .fa-mnav-actions{display:none}
}
