/* 헤더 */
.header {
    position: fixed;
    width: 100%;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000; /*정산서 모달 오류로 9999에서 변경*/
    margin: 0 auto;
    max-width: 480px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ddd;
    align-items: center;
    height: 80px;
    padding-left: 16px;
    padding-right: 16px;
    background: #ffffff;
}
.header button{
    padding: 0 5px;
}






/* 앱 패딩 + 헤더 기본값 */
:root{
  --header-base: 80px;                 /* 헤더 기본 높이(필요 시 80px로 변경) */
  --sat: 0px;                          /* safe-area top */
  --sab: 0px;                          /* safe-area bottom */

  /* iOS 구형/신형 모두 대응 */
  --sat: constant(safe-area-inset-top);
  --sat: env(safe-area-inset-top);
  --sab: constant(safe-area-inset-bottom);
  --sab: env(safe-area-inset-bottom);
}

/* 헤더: 1rem 제거, TOP 안전영역만 반영 */
.header{
  height: calc(var(--header-base) + var(--sat));
  padding-top: var(--sat);             /* ← 추가 여백 없이 safe-area만 */
  box-sizing: border-box;
  /* 기타 스타일… */
}

/* 본문: 헤더 실제 차지 높이만큼 띄우기(겹침 방지) */
.wrap{
  min-height: 100vh;
  padding-top: calc(var(--header-base) + var(--sat));
}

/* 하단 네비: 1rem 제거, BOTTOM 안전영역만 반영 */
.bottom_nav{
  padding-bottom: calc(12px + var(--sab));
}




/* 클릭/탭 시 파란/회색 배경 하이라이트 제거 */
* {
  -webkit-tap-highlight-color: transparent; /* 모바일 사파리, 크롬 */
  -webkit-focus-ring-color: transparent;    /* 포커스 테두리 제거 */
  outline: none;                            /* 포커스 아웃라인 제거 */
}



.logo {
    /*height: 62px;*/
    height: 53px;
}
.bottom_nav_wrap{
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 1000; /*정산서 모달 오류로 9999에서 변경*/
}
.bottom_nav {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  column-gap: 10px;
  align-items: center;
  background: #ffffff;
  width: 100%;
  max-width: 480px;
  border-top: 1px solid #eee;
  margin: 0 auto;
  padding-top: 1rem;

  /* 안전영역 보정 */
    padding-bottom: calc(1rem + constant(safe-area-inset-bottom));
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
}
.bottom_nav .nav_item {
  text-align: center;
  font-size: .87rem;
}
.bottom_nav .nav_item .icon {
  width: 1.6rem;
  height: 1.6rem;
  margin: 0 auto 6px auto;
  background-repeat: no-repeat;
  background-position: center;
  display: block;
}
.nav_item .label{
    color: #aeaeae;
}

.receipt span{
    color: #333;
    text-decoration: none;
}


/*프로필 이미지*/
.mypage{
        width: 40px;
        height: 40px;
        object-fit: cover;
    border-radius: 50%;
}



/* 기본 아이콘 배경 (비활성) */
.nav_item.home .icon       { background-image: url("/common/img/masterpage/bottom_nav/icon_home.svg"); }
.nav_item.tour .icon       { background-image: url("/common/img/masterpage/bottom_nav/icon_tour.svg"); }
.nav_item.receipt .icon    { background-image: url("/common/img/masterpage/bottom_nav/icon_receipt.svg"); }
.nav_item.settlement .icon { background-image: url("/common/img/masterpage/bottom_nav/icon_settlement.svg"); }
.nav_item.notice .icon     { background-image: url("/common/img/masterpage/bottom_nav/icon_notice.svg"); }

/* 활성화된 아이콘 */
/*
    .nav_item.active.receipt .icon    { background-image: url("/common/img/masterpage/bottom_nav/icon_receipt_active.svg"); }
.nav_item.active.settlement .icon { background-image: url("/common/img/masterpage/bottom_nav/icon_settlement_active.svg"); }
.nav_item.active.mypage .icon     { background-image: url("/common/img/masterpage/bottom_nav/icon_notice_active.svg"); }

*/

.bottom_nav .nav_item.active .label {
  font-weight: 600;
  color: #000;
}


/* 헤더 타입2 */
.header.type2,
.header.type5{
    background: var(--main-color);
    border-bottom: 0;
}
.header.type2>h2,
.header.type5>h2{
    color: #ffffff;
    font-weight: 500;
}
.header.type2 button,
.header.type5 button{
    color: #ffffff;
}

/*헤더 타입4 */
.header.type4{
    border: none;
}


.header_left{
    cursor: pointer;
}
.header_center{
    color: #4C4C4C;
    font-weight: 500;
}

.btn_back{
    padding-right: 1rem;
}

/*헤더 타입4 하단 변경 */
.type4_bottom{
  position: fixed;
  bottom: 76px;
  left: 50%;
  transform: translate(-50%);
  width: 100%;
  background: #ffffff;
  z-index: 999;
  display: flex;
  align-items: center;
  column-gap: 0.8rem;
  padding: 0 1rem;
  box-sizing: border-box;
  border-top: 1px solid #ddd;
  padding-top: 1rem;
  /* 안전영역 보정 */
    padding-bottom: calc(1rem + constant(safe-area-inset-bottom));
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
  max-width: 480px;
}
.type4_bottom label input{
    background: url(/common/img/masterpage/bottom_nav/unlock.svg) no-repeat 0 0;
    background-size: contain;
    border: none;
}
.type4_bottom label input[type="checkbox"]:checked{
    background: url(/common/img/masterpage/bottom_nav/lock.svg) no-repeat 0 0;
    background-size: contain;
}
.type4_bottom label input[type="checkbox"] {
    width: 20px;
    height: 25px;
}
.send_btn{
    width: unset;
    margin-left: auto;
}
.send_btn img{
    width: 28px;
    margin-bottom: 4px;
}
.lock_btn{
    position: absolute;
    right: 20px;
    cursor: pointer;
    top: 50%; 
    transform: translate(0, -60%); 

}
.comment_num {
    color: #9A9A9A;
}
}.comment, .recomment {
  width: 100%;
  min-height: 44px;
  padding: 10px 45px 10px 12px;
  max-height: 120px;
  height: auto;

  border-radius: 8px;
  font-size: 14px;
  line-height: 150%;
  resize: none;
  overflow-y: hidden;
  box-sizing: border-box;
}
textarea{
    line-height: 150%;
}




.title p:nth-of-type(1) {
    font-size: 1.2rem;
    margin: 1rem 0 .5rem 0;
}
.title p:nth-of-type(2){
    font-weight: 400;
    font-size: .93rem;
}
.title p:nth-of-type(3){
    margin-top: 1.5rem;
    font-size: .93rem;
}




.date{
    padding-left: 25px;
    background: url(/common/img/tour/calender.svg) no-repeat left 12px center;
    background-color: #F8F8F8;
    background-size: 18px 18px;
}



/* 영수증 업로드 */
/* 파일선택 버튼 숨기기 (화면에서만 안 보이게) */
#cameraInput, #preview {
    position: absolute;
    left: -9999px; /* display:none 대신 위치만 화면 밖으로 */
}