/* 헤더높이 pc */
#container {
  background: none;
  padding-top: 189px;
  padding-bottom: 0;
}

#header.fixed {
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
}

/* ================= top 영역 */
#header .top {
  background: #fff;
  border-bottom: 1px solid rgba(153, 153, 153, 0.8);
}

/* ================= util 영역 */

#header .top .util li + li::before {
  background: var(--gray-600);
}
#header .top .util a {
  color: var(--gray-600);
}

/* ================= lang 언어 영역 */
#header .top .lang-wrap::before {
  background: var(--gray-600);
}
#header .top .lang-btn {
  color: var(--gray-600);
}
#header .top .lang-btn::after {
  background: url(../images/arrow-right-s-line.svg) no-repeat center center/
    100%;
}
#header .top .lang {
  background: #fff;
  border: 1px solid var(--point-color5);
}
#header .top .lang > li > a {
  color: var(--gray-600);
}
#header .top .lang > li > a:hover {
  background: var(--gray-400);
}
/* ================= gnb 영역 depth1 */
#header .gnb-wrap {
  background: #fff;
  border-bottom: 1px solid rgba(153, 153, 153, 0.8);
}
/* gnb depth1 링크 */
#header .gnb-wrap .gnb > li > a {
  color: var(--gray-600);
}

/* gnb 1depth hover, 활성화 */
#header .gnb-wrap .gnb > li:hover > a,
#header .gnb-wrap .gnb > li.on > a {
  background: var(--gray-400);
}

/* ================= gnb 영역  depth2 */
#header .gnb .depth2-wrap {
  background: var(--gray-400);
}

/* PC depth2 왼쪽 제목 : 클릭불가 */
#header .gnb .depth2-tit {
  color: var(--gray-600);
}

/* PC depth2 왼쪽 세로선 */
#header .gnb .depth2::before {
  background: var(--gray-600);
}

/* PC depth2 제목 링크 */
#header .gnb .depth2-item > a {
  color: var(--gray-600);
}

/* PC depth2 제목 화살표 */
#header .gnb .depth2-item > a::after {
  background-color: var(--gray-600);
  -webkit-mask: url(../images/arrow-right-s-line.svg) no-repeat center center /
    100%;
  mask: url(../images/arrow-right-s-line.svg) no-repeat center center / 100%;
}
/* PC depth2 hover 시 화살표 색상 */
#header .gnb .depth2-item > a:hover::after {
  background-color: var(--point-color3);
}

#header .gnb .depth3 a {
  color: var(--gray-600);
}

/* PC depth2, depth3 hover 색상 */
#header .gnb .depth2-item > a:hover,
#header .gnb .depth3 a:hover {
  color: var(--point-color3);
}

/* 헤더 푸터 제외하고 전체 상자 사이즈 */
.content {
  padding: 60px 0 160px;
}
.content .inner {
  max-width: 1440px;
  padding: 0 20px;
  margin: 0 auto;
}

/* ====================== 로그인 페이지 ======================*/
.login .inner {
  /* 로그인 상자 사이즈 700에 좌우패딩 +20 */
  max-width: 740px;
}
/* 로그인 텍스트 상자 */
.login .top {
  margin-bottom: 23px;
}
/* 로그인 텍스트*/
.login .top h2 {
  text-align: center;
  font-size: 48px;
  font-weight: 700;
  color: var(--point-color1);
}
/* 아이디 패스워드 전체 상자 */
.login .login-wrap {
  border-radius: 10px;
  /* 전체 상자 안에서 위아래 좌우패딩 한번에 잡아주고 시작 */
  padding: 62px 50px 44px;
  border: 1px solid var(--point-color1);
}
/* 아이디 패스워드 입력창 */
.login .input-wrap input {
  height: 60px;
  /* login-wrap에서 좌우패딩 잡아놨으니까 100%하면 사이즈 알아서 잡힘 */
  width: 100%;
  border-radius: 30px;
  border: 1px solid var(--point-color1);
  /* ID에 글씨 적었을때 왼쪽 간격 */
  padding-left: 30px;
}
/* 아이디 입력창에서 패스워드 입력창 내리기 */
.login .input-wrap:nth-of-type(1) {
  margin-bottom: 25px;
}
/* 입력창 안에 텍스트 */
.login .input-wrap input::placeholder {
  font-weight: 700;
  color: #947765;
  opacity: 0.65;
}
/* 비밀번호는 대소문자를 구분합니다 */
.login .input-wrap p {
  font-size: 15px;
  margin-top: 8px;
  margin-left: 30px;
  color: var(--point-color1);
}
/* 로그인 버튼 부모상자 */
.login .btn-wrap {
  padding: 35px 0 20px;
  text-align: center;
}
/* 로그인 버튼 */
.login .btn-wrap .login-btn {
  width: 250px;
  height: 50px;
  border-radius: 5px;
  background: var(--point-color1);
  border: none;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
}
/* 회원가입 아이디 비밀번호 찾기 전체 상자 */
.login .login-link {
  display: flex;
  justify-content: center;
  margin-bottom: 25px;
  gap: 0 40px;
}
/* 텍스트 공통 부모 */
.login .login-link li {
  position: relative;
  font-size: 18px;
}
/* 텍스트 */
.login .login-link a {
  font-size: 18px;
  font-weight: 500;
  color: var(--point-color1);
}
/* 아이디 찾기 + 비밀번호 재설정 사이 간격 */
.login .login-link a + a {
  margin-left: 40px;
}
/* 텍스트 사이 구분점 */
.login .login-link li + li::before {
  content: '';
  position: absolute;
  /* 사이간격 40px이라서 -20이 중간, 점 사이즈 4px이라서 -2만큼 + */
  left: -22px;
  /* 위아래 중심잡기 */
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #efefef;
}
/* 구분선, 네이버 카카오톡 전체 상자 */
.login .sns {
  border-top: 1px solid #d9d9d9;
  padding-top: 30px;
  display: flex;
  justify-content: center;
  gap: 0 50px;
}
/* 네이버 카카오 공통 상자 */
.login .sns a {
  /* 백그라운드에 칼라 있을때는 이미지로 넣지말고 백그라운드로 같이 넣기 */
  background: #36c413 url(../images/room/naver.png) no-repeat center center;
  border-radius: 50%;
  width: 50px;
  height: 50px;
}
/* 카카오만 따로 클래스로 빼기 */
.login .sns .kakao {
  background: #ffc947 url(../images/room/kakao.png) no-repeat center center;
}

/* ====================== 객실 페이지 ====================== */
/* 객실 페이지 전체 상자 사이즈 달라짐 */
.room .content {
  padding: 100px 20px 130px;
}
/* 그랜드호텔(메인타워) 전체 상자 */
.room .top {
  padding-bottom: 100px;
}
/* 올드&뉴를 겸비한 휴식처 텍스트 */
.room .top p {
  font-size: 20px;
  font-weight: 500;
  color: var(--gray-600);
  text-align: center;
}
/* 그랜드호텔(메인타워) 텍스트 */
.room .top h2 {
  font-size: 50px;
  font-weight: 700;
  color: var(--gray-600);
  text-align: center;
  margin-bottom: 30px;
}
/* 호텔, 객실타입 선택 버튼 전체 상자 */
.room .filter-wrap {
  position: relative;
  border: 10px solid #eae5e1;
  border-radius: 20px;
  padding: 47px 73px;
}
/* 버튼 상자 공통 리스트  */
.room .filter-wrap .filter li {
  display: flex;
  align-items: center;
}
/* 객실 타입, 호텔&콘도 텍스트 */
.room .filter h3 {
  font-size: 20px;
  font-weight: 500;
  color: var(--gray-600);
  margin-right: 20px;
  white-space: nowrap;
}
/* 각각의 객실 타입 상자 */
.room .filter li.type {
  margin-top: 30px;
}
/* 객실타입 텍스트 */
.room .filter li.type > h3 {
  margin-right: 87px;
}
/* 지도팝업 클릭 아이콘 */
.room .map-wrap .map {
  width: 40px;
  height: 40px;
  margin-right: 20px;
  background: url(../images/room/map-pin-line.png) center center no-repeat;
  border: none;
  /* 창이 작아질때 아이콘이 작아지지않게 크기 고정 */
  flex-shrink: 0;
  display: inline-block;
  position: relative;
}
/* 위치보기  */
.room .map-wrap em {
  display: none;
  width: 90px;
  line-height: 40px;
  background: #000;
  border-radius: 7px;
  text-align: center;
  font-size: 15px;
  position: absolute;
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s;
  color: #ffffff;
  font-weight: 700;
}
/* 위치보기 삼각형 꼬리 */
.room .map-wrap em::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 12px 6px 0 6px;
  border-style: solid;
  /* #000은 위 색깔 좌우 아래는 투명하게 해서 말풍선 아이콘 삼각형꼬리 만들어주기 */
  border-color: #000 transparent transparent transparent;
}
/* 마우스 올렸을 때 위치보기 나오기 */
.room .map-wrap .map:hover em {
  opacity: 1;
  visibility: visible;
  top: -50px;
  display: block;
}
/* 지도팝업 전체 부모 */
.room .map-wrap .map-popup {
  display: none;
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  max-width: 1040px;
  width: 100%;
  z-index: 1000;
  background: #fff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
}
/* 지도팝업 이미지 */
.room .map-wrap .map-popup img {
  display: block;
  width: 100%;
  height: auto;
}
/* 지도팝업 액티브 */
.room .map-wrap .map-popup.active {
  display: block;
}
/* 지도팝업 안에 텍스트 */
.room .map-wrap .map-popup p {
  position: absolute;
  font-size: 18px;
  font-weight: 500;
  color: #65655e;
  top: 20px;
  left: 20px;
}
/* 지도팝업 닫기버튼 */
.room .map-popup .close-btn {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 10;
  cursor: pointer;
  border: none;
}
/* 지도팝업 안에 위치 아이콘 띄우기*/
.room .map-popup .grand-hotel,
.room .map-popup .grand-hotel-convention,
.room .map-popup .palace-hotel,
.room .map-popup .mountain-condo,
.room .map-popup .valley-condo,
.room .map-popup .hill-condo {
  position: absolute;
}
/* 지도팝업 안에 위치 아이콘 */
/* 테블릿 모바일에서 사이즈 다시 잡아야됨 호버효과 디자인 수정해야됨 */
.room .map-popup .pin-btn {
  width: 35px;
  height: 35px;
  background: url(../images/room/map-icon.svg) center center no-repeat;
  border: none;
  cursor: pointer;
}
/* 지도팝업 안에 위치 텍스트 */
.room .map-popup .tooltip {
  display: none;
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  /* 상자 사이즈 */
  padding: 9px 16px 10px 16px;
  background: #63388c;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  border-radius: 5px;
  white-space: nowrap;
  margin-bottom: 8px; /* 핀과의 미세 여백 */
}
/* 삼각형꼬리 */
.room .map-popup .tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 10px 5px 0 5px;
  border-style: solid;
  /* #000은 위 색깔 좌우 아래는 투명하게 해서 말풍선 아이콘 삼각형꼬리 만들어주기 */
  border-color: #63388c transparent transparent transparent;
}
/* 지도팝업 안에서 위치 아이콘에 마우스 올렸을때 텍스트 상자 띄우기 호버 */
.room .map-popup .grand-hotel:hover .tooltip,
.room .map-popup .grand-hotel-convention:hover .tooltip,
.room .map-popup .palace-hotel:hover .tooltip,
.room .map-popup .mountain-condo:hover .tooltip,
.room .map-popup .valley-condo:hover .tooltip,
.room .map-popup .hill-condo:hover .tooltip {
  display: block;
}
/* ====지도팝업 핀 위치==== */
.room .map-popup .grand-hotel {
  top: 61%;
  left: 78%;
}
.room .map-popup .grand-hotel-convention {
  top: 62%;
  left: 71%;
}
.room .map-popup .palace-hotel {
  top: 26%;
  left: 14%;
}
.room .map-popup .mountain-condo {
  top: 61%;
  left: 61%;
}
.room .map-popup .valley-condo {
  top: 69%;
  left: 46%;
}
.room .map-popup .hill-condo {
  top: 71%;
  left: 52%;
}
/* 리스트 버튼 */
.room .filter .filter-list {
  display: flex;
  gap: 10px 10px;
  /* 창이 작아질 때 리스트들이 하나씩 아래로 떨어지게 */
  flex-wrap: wrap;
}
/* 호텔&콘도 체크박스 */
.room .filter .filter-list .checkbox {
  padding: 0 27px;
}
/* 객실타입 체크박스*/
.room .type .filter-list .checkbox {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 32px;
}
/* 선택 초기화, 검색하기 부모상자 */
.room .filter-wrap .btn-wrap {
  margin-top: 19px;
  display: flex;
  justify-content: flex-end;
  gap: 0 20px;
}
/* 선택 초기화, 검색하기 버튼 공통 요소 */
.room .top .reset-btn,
.room .top .search-btn {
  width: 180px;
  height: 60px;
  border-radius: 12px;
  background: var(--point-color1);
  border: none;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}

/* ======================스탠다드 객실====================== */
/* 스탠다드 전체 상자 */
.room .standard {
  position: relative;
  padding-bottom: 94px;
}
/* 스탠다드 텍스트 */
.room .standard h3 {
  font-size: 50px;
  font-weight: 700;
  color: var(--gray-600);
  margin-bottom: 30px;
}
/* 객실 이미지 상자 */
.room .standard .img-wrap {
  display: block;
  position: relative;
}
/* 객실 이미지 */
.room .standard .swiper-slide img {
  border-radius: 20px;
  width: 100%;
  height: 100%;
  aspect-ratio: 1.15 / 1;
  object-fit: cover;
}
/* 이미지 상자 내부 텍스트 상자 */
.room .standard .swiper-slide .txt {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  min-height: 143px;
  background: rgba(255, 255, 255, 0.85);
  padding: 20px 0 20px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
/* 하이원 팰리스 호텔 뱃지 텍스트+상자 */
.room .standard .txt em {
  position: absolute;
  top: 0;
  right: 0;
  background: var(--point-color1);
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  padding: 6px 21px;
  border-radius: 0 0 0 10px;
}
/* 객실 이름 텍스트 */
.room .standard .txt strong {
  font-size: 30px;
  font-weight: 700;
  color: #000;
  margin-bottom: 5px;
}
/* 객실 부가설명 텍스트 */
.room .standard .txt p {
  font-size: 16px;
  font-weight: 500;
  color: #222;
  margin-bottom: 5px;
}
/* 객실 유형 텍스트 */
.room .standard .txt span {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: #63388c;
}
/* 스와이퍼 버튼 */
.room .standard .swiper-button-next,
.room .standard .swiper-button-prev {
  position: absolute;
  left: auto;
  right: 0;
  top: 0;
  width: 30px;
  height: 30px;
  background: url(../images/room/arrow-right.png) no-repeat center center;
  margin: 0;
  background-size: contain;
}
/* 페이지네이션, 스와이퍼 버튼 상자 */
.room .standard .btn-wrap {
  position: absolute;
  top: 27px;
  right: 0;
  display: flex;
  gap: 0 15px;
  align-items: center;
}
/* 스와이퍼 버튼 상자 기본 아이콘 제거 */
.room .standard .swiper-button-prev svg,
.room .standard .swiper-button-next svg {
  display: none;
}
/* 스와이퍼 왼쪽 버튼 */
.room .standard .swiper-button-prev {
  position: static;
  transform: rotate(180deg);
  /* 화살표 버튼 사이즈 작아지지않게 */
  flex-shrink: 0;
}
/* 스와이퍼 오른쪽 버튼 */
.room .standard .swiper-button-next {
  position: static;
  /* 화살표 버튼 사이즈 작아지지않게 */
  flex-shrink: 0;
}
/* 페이지네이션 */
.room .standard .swiper-pagination {
  position: static;
  font-size: 25px;
  font-weight: 500;
  color: var(--point-color1);
}

/* 스탠다드 스위트룸 구조 전부 동일 */
/* ====================== 스위트룸 객실 ====================== */
.room .suite {
  position: relative;
}
/* 스위트 텍스트 */
.room .suite h3 {
  font-size: 50px;
  font-weight: 700;
  color: var(--gray-600);
  margin-bottom: 30px;
}
/* 객실 이미지 상자 */
.room .suite .img-wrap {
  display: block;
  position: relative;
}
/* 객실 이미지 */
.room .suite .swiper-slide img {
  border-radius: 20px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 1.15 / 1;
}
/* 이미지 상자 내부 텍스트 상자 */
.room .suite .swiper-slide .txt {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  min-height: 143px;
  background: rgba(255, 255, 255, 0.85);
  padding: 30px 0 20px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
/* 하이원 팰리스 호텔 뱃지 텍스트+상자 */
.room .suite .swiper-slide .txt em {
  position: absolute;
  top: 0;
  right: 0;
  background: var(--point-color1);
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  padding: 6px 21px;
  border-radius: 0 0 0 10px;
}
/* 객실 이름 텍스트 */
.room .suite .txt strong {
  display: block;
  font-size: 30px;
  font-weight: 700;
  color: #000;
  margin-bottom: 5px;
}
/* 객실 부가설명 텍스트 */
.room .suite .txt p {
  font-size: 16px;
  font-weight: 500;
  color: #222;
  margin-bottom: 5px;
}
/* 객실 유형 텍스트 */
.room .suite .txt span {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: #63388c;
}
/* 스와이퍼 버튼 */
.room .suite .swiper-button-next,
.room .suite .swiper-button-prev {
  position: absolute;
  left: auto;
  right: 0;
  top: 0;
  width: 30px;
  height: 30px;
  background: url(../images/room/arrow-right.png) no-repeat center center;
  margin: 0;
  background-size: contain;
}
/* 페이지네이션, 스와이퍼 버튼 상자 */
.room .suite .btn-wrap {
  position: absolute;
  top: 27px;
  right: 0;
  display: flex;
  gap: 0 15px;
  align-items: center;
}
/* 스와이퍼 버튼 상자 기본 아이콘 제거 */
.room .suite .swiper-button-prev svg,
.room .suite .swiper-button-next svg {
  display: none;
}
/* 스와이퍼 왼쪽 버튼 */
.room .suite .swiper-button-prev {
  position: static;
  transform: rotate(180deg);
  width: 30px;
  height: 30px;
  /* 화살표 버튼 사이즈 작아지지않게 */
  flex-shrink: 0;
}
/* 스와이퍼 오른쪽 버튼 */
.room .suite .swiper-button-next {
  position: static;
  /* 화살표 버튼 사이즈 작아지지않게 */
  flex-shrink: 0;
}
/* 페이지네이션 */
.room .suite .swiper-pagination {
  position: static;
  font-size: 25px;
  font-weight: 500;
  color: var(--point-color1);
}

/* ====================== 공지사항 페이지 ======================*/
.notice .content {
  padding: 100px 0 120px;
}
/* 맨 위 텍스트 */
.notice .top p {
  font-size: 20px;
  font-weight: 500;
  text-align: center;
  color: var(--gray-600);
}
/* p 텍스트 띄어쓰기 x */
.notice .top br {
  display: none;
}
/* 공지사항 텍스트 */
.notice .top h2 {
  font-size: 50px;
  font-weight: 700;
  text-align: center;
  color: var(--gray-600);
  margin-bottom: 72px;
}
/* 체크박스 리스트 */
.notice .top .check-list {
  display: flex;
  justify-content: center;
  gap: 10px 10px;
  padding-bottom: 72px;
  flex-wrap: wrap;
}
/* 체크박스 가로 사이즈 잡아주기 */
.notice .check-list .checkbox {
  /* 상자 사이즈 잡지 말고 패딩으로 간격 주라고 하셔서 하긴 했는데 너무 큼
  체크하기 */
  padding: 13px 37px;
}
/* 검색 창 + select 묶기*/
.notice .top .search-wrap {
  display: flex;
  align-items: center;
  margin: 0 auto;
  max-width: 774px;
  background: #f2f2f2;
  border-radius: 37px;
  padding-left: 37px;
}
/* 검색창 부모*/
.notice .top .search-wrap form {
  /* select 제외한 나머지 부분 form이 전체 영역이 됨 */
  flex-grow: 1;
  height: 100%;
}
/* 검색창 */
.notice .top .search-wrap fieldset {
  display: flex;
  align-items: center;
  height: 100%;
  border: none;
}
/* select 기준 */
.notice .select-custom {
  position: relative;
  width: 93px;
  height: 100%;
  margin-right: 16px;
  border: none;
}
/* 제목+화살표 버튼*/
.notice .select-btn {
  width: 100%;
  line-height: 74px;
  color: var(--gray-600);
  font-size: 22px;
  font-weight: 500;
  text-align: left;
  /* 하얀배경 지우기 */
  background-color: transparent;
  border: none;
  cursor: pointer;
  background: url(../images/notice/arrow-down.png) no-repeat right center;
}
/* select 리스트 부모*/
.notice .select-custom .select-list-wrap {
  position: absolute;
  top: 62px;
  left: -15px;
  z-index: 100;
  display: none;
}
/* 제목창 열렸다 닫혔다 하기 */
.notice .select-custom.is-active .select-list-wrap {
  display: block;
}
/* select 리스트 */
.notice .select-custom .select-list {
  width: 110px;
  line-height: 53px;
  background: #fff;
  border: 1px solid #d9d9d9;
}
/* select 텍스트  */
.notice .select-custom .select-list a {
  display: block;
  text-align: center;
  color: var(--gray-600);
  font-size: 20px;
  font-weight: 500;
}
/* list 호버시 창 색 주기 */
.notice .select-custom .select-list a:hover {
  background: #efefef;
}
/* 입력창 및 구분선 */
.notice .search-wrap input[type='search'] {
  flex-grow: 1;
  width: 1px;
  height: 40px;
  /* 하얀 배경 투명으로 */
  background: transparent;
  border: none;
  font-size: 22px;
  padding-left: 24px;
  /* 구분선 넣기 */
  border-left: 1px solid #e0e0e0;
}
/* 돋보기 버튼 */
.notice .search-wrap .search-btn {
  background: url('../images/notice/search.png') center center no-repeat;
  width: 34px;
  height: 34px;
  border: none;
  cursor: pointer;
  margin-right: 23px;
}
/* ================== 테이블표 */
.notice table {
  /* 글씨 중앙 정렬 */
  text-align: center;
  margin-top: 60px;
  /* 표 맨 위 선 */
  border-top: 1px solid #000;
}
/* 테이블 col1-col5 위아래 간격 */
.notice table td {
  padding: 20px 0;
}
/* 섹션 하나마다의 아래 구분선(각 섹션별 부모) */
.notice table tr {
  border-bottom: 1px solid #e2e2e2;
}
/* 음성 이미지 아이콘 */
.notice table .col1 img {
  display: block;
  width: 27px;
  flex-shrink: 0;
  /* 이미지 가운데로 보내기 */
  margin: 0 auto;
}
/* 번호 */
.notice table .col1 {
  font-size: 20px;
  font-weight: 500;
  color: var(--gray-600);
  /* white-space: nowrap; */
}
/* 분류 */
.notice table .col2 {
  font-size: 20px;
  font-weight: 500;
  color: var(--gray-600);
}
/* 제목 */
.notice table .col3 a {
  display: block;
  width: auto;
  text-align: left;
  font-size: 20px;
  font-weight: 400;
  color: #323232;
}
/* 파일첨부 */
.notice table .col4 a {
  display: block;
  width: 27px;
  /* 이미지 사이즈 잡을때 세로는 잡지 않기 */
  flex-shrink: 0;
  /* 이미지 가운데로 보내기 */
  margin: 0 auto;
}
/* 작성일자 */
.notice table .col5 {
  font-size: 20px;
  font-weight: 500;
  color: #8e8e8e;
}
/* 테블릿이나 모바일로 창 줄였을 때 분기점 가기 전에 글씨가 두줄로 떨어지면 
데스크탑에서부터 %를 늘려서 가로 사이즈 잡아주면됨 */
/* 번호,파일첨부 가로 사이즈 % */
.notice .col1,
.notice .col4 {
  width: 10%;
}
/* 분류 가로 사이즈 % */
.notice .col2 {
  width: 15%;
}
/* 작성일자 가로 사이즈 % */
.notice .col5 {
  width: 15%;
}
/* 페이지네이션 */
.notice .pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 60px;
}
/* 맨처음 화살표 */
.notice .pagination .btn-first {
  width: 30px;
  height: 30px;
  background: url(../images/notice/btn-first.png) no-repeat center center;
}
/* 이전 화살표 */
.notice .pagination .btn-prev {
  width: 30px;
  height: 30px;
  background: url(../images/notice/btn-prev.png) no-repeat center center;
}
/* 다음 화살표 */
.notice .pagination .btn-next {
  width: 30px;
  height: 30px;
  background: url(../images/notice/btn-next.png) no-repeat center center;
}
/* 맨뒤로 화살표 */
.notice .pagination .btn-last {
  width: 30px;
  height: 30px;
  background: url(../images/notice/btn-last.png) no-repeat center center;
}
/* 페이지 숫자 묶음 */
.notice .pagination .num-wrap {
  display: flex;
  gap: 0 40px;
  margin: 0 25px;
}
/* 숫자 + 화살표 */
.notice .pagination a {
  display: block;
  font-size: 20px;
  color: #747474;
  font-weight: 500;
  text-align: center;
}
/* 페이지 숫자 클릭 칼라변경시 유지, +js */
.notice .pagination .page-num.active {
  color: #63388c;
}
/* 페이지 숫자에 마우스 올렸을때 */
.notice .pagination .page-num:hover {
  color: #63388c;
}

/* ============= 웰니스 페이지 ============= */
/* 서브비주얼 */
.wellness .sub-visual {
  background: url(../images/wellness/visual.jpg) no-repeat center center / cover;
  width: 100%;
  height: 600px;
}
/* 비주얼 배경 위 텍스트 묶음 */
.wellness .sub-visual .txt {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 179px 0;
}
/* 텍스트 */
.wellness .sub-visual h2 {
  font-size: 50px;
  font-weight: 700;
  color: #fff;
}
/* 텍스트 */
.wellness .sub-visual p {
  font-size: 18px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 30px;
  position: relative;
}
/* p왼쪽에 핀 아이콘 */
.wellness .sub-visual p::before {
  content: '';
  position: absolute;
  /* 아이콘 가로 사이즈 20px에 간격10px */
  left: -30px;
  top: 0;
  background: url(../images/wellness/map-pin.png) no-repeat center center;
  width: 20px;
  height: 20px;
}
/* 텍스트 */
.wellness .sub-visual strong {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 20px;
}
/* 리스트 텍스트 부모 */
.wellness .sub-visual .list {
  display: flex;
  gap: 0 15px;
}
/* 텍스트 */
.wellness .sub-visual .list span {
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  background: rgba(100, 121, 136, 0.6);
  width: 81px;
  height: 34px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
}

/* 웰니스 페이지 전체 상자 사이즈 */
.wellness .content {
  padding: 100px 0 130px;
}

/* ========================== 스와이퍼 */
/* 텍스트 */
.wellness .inner .program h3 {
  font-size: 50px;
  font-weight: 700;
  color: var(--gray-600);
  margin-bottom: 30px;
}
.wellness .program .swiper {
  height: 386px;
}
/* 슬라이더 */
.wellness .swiper-slide {
  display: flex;
}
.wellness .swiper-slide .img-wrap {
  width: 500px;
}
/* 왼쪽 이미지 */
.wellness .swiper-slide img {
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 오른쪽 텍스트 부모 */
.wellness .swiper-slide .txt {
  background: #f2f2f2;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  padding: 62px 65px;
  width: calc(100% - 500px);
  position: relative;
}
/* 시간 뱃지 */
.wellness .swiper-slide .txt em {
  position: absolute;
  right: 0px;
  top: 0;
  background: #bbbbbb;
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  padding: 9px 38px;
  border-radius: 0 20px 0 20px;
  width: 199px;
  height: 63px;
}
/* 텍스트 */
.wellness .swiper-slide .txt h4 {
  font-size: 35px;
  font-weight: 700;
  color: var(--gray-600);
  margin-bottom: 20px;
}
/* 텍스트 */
.wellness .swiper-slide .txt p {
  font-size: 18px;
  font-weight: 500;
  color: var(--gray-600);
  margin-bottom: 40px;
  word-break: keep-all;
}
/* 예약하기 버튼 */
.wellness .swiper-slide .txt a {
  font-size: 25px;
  font-weight: 700;
  color: #fff;
  background: #53117b;
  width: 174px;
  height: 68px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
}
/* 예약하기 아이콘 */
.wellness .swiper-slide .txt a::before {
  content: '';
  background: url(../images/wellness/reservatoin.png) no-repeat center center;
  width: 25px;
  height: 25px;
  margin-right: 10px;
}
/* 페이지네이션, 스와이퍼 버튼 상자 */
.wellness .program .btn-wrap {
  position: absolute;
  top: 30px;
  right: 0;
  display: flex;
  gap: 0 15px;
  align-items: center;
}
/* 스와이퍼 버튼 */
.wellness .program .swiper-button-prev,
.wellness .program .swiper-button-next {
  position: absolute;
  left: auto;
  top: 0;
  right: 0;
  width: 30px;
  height: 30px;
  background: url(../images/wellness/arrow-left.png) no-repeat center center;
  margin: 0;
  background-size: contain;
}
/* 스와이퍼 오른쪽 버튼 */
.wellness .program .swiper-button-next {
  position: static;
  transform: rotate(180deg);
  width: 30px;
  height: 30px;
  /* 화살표 버튼 사이즈 작아지지않게 */
  flex-shrink: 0;
}
/* 스와이퍼 오른쪽 버튼 */
.wellness .program .swiper-button-prev {
  position: static;
  /* 화살표 버튼 사이즈 작아지지않게 */
  flex-shrink: 0;
}
/* 스와이퍼 버튼 상자 기본 아이콘 제거 */
.wellness .program .swiper-button-prev svg,
.wellness .program .swiper-button-next svg {
  display: none;
}
/* 페이지네이션 */
.wellness .program .swiper-pagination {
  position: static;
  font-size: 25px;
  font-weight: 500;
  color: #94765e;
}

/* =============== info */
.wellness .info-wrap {
  margin: 100px 0 0 86px;
  word-break: keep-all;
}
.wellness .inner h5 {
  font-size: 25px;
  font-weight: 500;
  color: var(--gray-600);
  margin-bottom: 10px;
}
.wellness .time-info {
  display: flex;
  gap: 0 5px;
}
.wellness .info-wrap dt {
  font-size: 16px;
  font-weight: 500;
  color: #848484;
}
.wellness .info-wrap dd {
  font-size: 16px;
  font-weight: 500;
  color: #848484;
  margin-bottom: 10px;
}
.wellness .info-wrap .info {
  list-style-type: disc;
  list-style-position: inside;
  margin-bottom: 10px;
}
.wellness .info-wrap .info li {
  font-size: 16px;
  font-weight: 400;
  color: #848484;
}
.wellness .info-wrap .tit {
  font-size: 16px;
  font-weight: 400;
  color: #848484;
  margin-bottom: 30px;
}
.wellness .info-wrap strong {
  font-size: 20px;
  font-weight: 500;
  color: var(--gray-600);
}
/* ============= 요금할인 페이지 ============= */
.discount .content {
  padding: 100px 0 130px;
}
/* 요금할인 전체 상자 */
.discount .top {
  padding-bottom: 100px;
}
/* 텍스트 */
.discount .top p {
  font-size: 20px;
  font-weight: 500;
  color: var(--gray-600);
  text-align: center;
}
.discount .top p br {
  display: none;
}
/* 텍스트 */
.discount .top h2 {
  font-size: 50px;
  font-weight: 700;
  color: var(--gray-600);
  text-align: center;
  margin-bottom: 30px;
}
/* 객실시설, 요금할인 선택 버튼 전체 상자 */
.discount .filter-wrap {
  position: relative;
  border: 10px solid #eae5e1;
  border-radius: 20px;
  padding: 48px 20px 43px;
}
.discount .filter-wrap .filter {
  max-width: 914px;
  margin: 0 auto;
}
/* 버튼 상자 공통 리스트  */
.discount .filter-wrap .filter li {
  display: flex;
  align-items: center;
}
/* 텍스트 */
.discount .filter h3 {
  font-size: 20px;
  font-weight: 500;
  color: var(--gray-600);
  margin-right: 35px;
  /* 상자 사이즈 작아져도 글씨 떨어지지않게 */
  white-space: nowrap;
}
/* 리스트 버튼 */
.discount .filter .filter-list {
  display: flex;
  gap: 10px 15px;
  /* 창이 작아질 때 리스트들이 하나씩 아래로 떨어지게 */
  flex-wrap: wrap;
}
/* 객실시설 체크박스 */
.discount .filter .filter-list .checkbox {
  padding: 0 26px;
}

/* 요금할인 전체 부모 */
.discount .filter .txt-wrap {
  display: flex;
  align-items: center;
  margin-top: 38px;
  flex-wrap: wrap;
}
/* 텍스트 */
.discount .filter .txt-wrap h3 {
  margin-right: 43px;
}
.discount .radio,
.discount .radio2 {
  display: inline-flex;
  position: relative;
  gap: 0 8px;
}
.discount .radio {
  margin-right: 44px;
}
.discount .radio2 {
  margin-right: 20px;
}
.discount .txt-wrap label {
  font-size: 18px;
  font-weight: 500;
  color: var(--gray-600);
}
.discount .radio:has([type='radio']:checked)::after,
.discount .radio2:has([type='radio']:checked)::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 5px;
  width: 10px;
  height: 10px;
  background: #000;
  border-radius: 50%;
}

/* select 기준 */
.discount .select-custom {
  position: relative;
  width: 358px;
  height: 51px;
  /* margin-right: 16px; */
  border: none;
  border-radius: 40px;
  background: #f2f2f2;
}
/* 제목+화살표 버튼*/
.discount .select-btn {
  width: 100%;
  line-height: 51px;
  color: #777777;
  font-size: 18px;
  font-weight: 500;
  text-align: left;
  /* 하얀배경 지우기 */
  background-color: transparent;
  border: none;
  cursor: pointer;
  /* 화살표를 배경으로 넣어서 패딩으로 위치 조절 안됨 오른쪽에서 30px 밀어줌 */
  background: url(../images/discount/arrow-down.png) no-repeat right 30px center;
  padding: 0 30px;
}
/* select 리스트 부모*/
.discount .select-custom .select-list-wrap {
  position: absolute;
  top: 43px;
  left: 20px;
  z-index: 100;
  display: none;
}
/* 제목창 열렸다 닫혔다 하기 */
.discount .select-custom.is-active .select-list-wrap {
  display: block;
}
/* select 리스트 */
.discount .select-custom .select-list {
  width: 308px;
  line-height: 40px;
  background: #fff;
  border: 1px solid #d9d9d9;
}
/* select 텍스트  */
.discount .select-custom .select-list a {
  display: block;
  font-size: 16px;
  font-weight: 500;
  color: #222;
  margin-left: 25px;
  width: 100%;
}
/* list 호버시 창 색 주기 */
.discount .select-custom .select-list li:hover {
  background: #efefef;
}
/* 텍스트 */
.discount .bottom .txt h4 {
  font-size: 40px;
  font-weight: 700;
  color: var(--gray-600);
  text-align: center;
  margin-bottom: 38px;
}
/* 스크롤텍스트 */
.discount .bottom .txt p {
  font-size: 20px;
  font-weight: 400;
  color: #53117b;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0 10px;
  margin-bottom: 12px;
}
/* 스크롤 텍스트 왼쪽 아이콘 */
.discount .bottom .txt p::before {
  content: '';
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  background: url(../images/discount/information.png) no-repeat center center;
}
/* ============= 테이블표 */
/* 모바일에서 좌우컨트롤 되는데 데스크 테블릿에서는 원래 표 모양 고정 */
.discount .table {
  table-layout: fixed;
}
.discount .table thead th {
  padding: 20px 5px;
  border: 1px solid #cccccc;
  font-size: 18px;
  font-weight: 700;
  color: var(--gray-600);
  text-align: center;
  vertical-align: middle;
  word-break: keep-all;
  background: #fafafa;
}
.discount .table thead tr:first-child th {
  border-top: 1px solid #000;
}
.discount .table td {
  border: 1px solid #cccccc;
  font-size: 18px;
  font-weight: 400;
  color: var(--gray-600);
  text-align: center;
  vertical-align: middle;
  word-break: keep-all;
}
.discount .table .col1 {
  padding: 51px 5px;
}
.discount .table .col2 {
  text-align: left;
  padding-left: 25px;
}
.discount .table .col3 {
  padding: 28px 5px;
}
.discount .table .col4 {
  padding: 28px 5px;
}
.discount .table .col4 br {
  display: none;
}
.discount .bottom .tit p {
  font-size: 20px;
  font-weight: 400;
  color: #848484;
  padding-top: 30px;
}
/* ================= 테블릿 구분점 ================= */
@media (max-width: 1200px) {
  /* 헤더높이 분기점 */
  #container {
    padding-top: 120px;
  }

  /* 모바일 햄버거 버튼 선 */
  #header .top .open-btn i {
    background: var(--gray-600);
  }

  /* 전체 사이즈 */
  .content {
    padding: 100px 0 100px;
  }
  /* ============= 로그인 테블릿 페이지 ============= */
  /* 텍스트 */
  .room .filter h3 {
    font-size: 20px;
    margin: 11px 14px 0 0;
  }
  /* 아이디 패스워드 입력창 */
  .login .input-wrap input {
    height: 55px;
  }

  /* ============= 객실 테블릿 페이지 ============= */
  /* 객실 페이지 전체 상자 사이즈*/
  .room .content {
    padding: 100px 20px 146px;
  }
  /* 그랜드호텔(메인타워) 전체 상자 */
  .room .top {
    padding-bottom: 50px;
  }
  /* 올드&뉴를 겸비한 휴식처 텍스트 */
  .room .top p {
    font-size: 30px;
    margin-bottom: 6px;
  }
  /* 그랜드호텔(메인타워) 텍스트 */
  .room .top h2 {
    font-size: 36px;
    margin-bottom: 31px;
  }
  /* 호텔, 객실타입 선택 버튼 전체 상자 */
  .room .filter-wrap {
    border: 8px solid #eae5e1;
    padding: 43px 26px 30px 30px;
  }
  /* 버튼 상자 공통 리스트  */
  .room .filter-wrap .filter li {
    display: flex;
    align-items: flex-start;
  }
  /* 각각의 객실 타입 상자 */
  .room .filter li.type {
    margin-top: 38px;
  }
  /* 객실타입 텍스트 */
  .room .filter li.type > h3 {
    margin: 11px 17px 0 0;
    align-self: flex-start;
  }
  /* 선택 초기화, 검색하기 부모상자 */
  .room .filter-wrap .btn-wrap {
    margin-top: 67px;
  }
  /* 지도팝업 */
  .room .map-wrap {
    display: block;
    align-items: flex-start;
  }
  /* 지도팝업 클릭 아이콘 */
  .room .map-wrap .map {
    width: 34px;
    height: 34px;
    margin: 7px 14px 0 0;
  }
  /* 지도팝업 전체 부모 */
  .room .map-wrap .map-popup {
    box-shadow: none;
  }
  /* 지도팝업 안에 텍스트 */
  .room .map-wrap .map-popup p {
    font-size: 15px;
    top: 10px;
    left: 10px;
  }
  /* 지도팝업 닫기버튼 */
  .room .map-popup .close-btn {
    top: 10px;
    right: 10px;
    width: 35px;
    height: 35px;
  }
  /* 지도팝업 안에 위치 아이콘 */
  .room .map-popup .pin-btn {
    width: 35px;
    height: 35px;
    background: url(../images/room/map-icon.svg) center center no-repeat;
    border: none;
    cursor: pointer;
  }
  /* 지도팝업 안에 위치 텍스트 */
  .room .map-popup .tooltip {
    /* 상자 사이즈 */
    padding: 10px 34px 9px 34px;
    /* 핀과의 미세 여백 */
    margin-bottom: 8px;
  }

  /* ============= 스탠다드 객실 ============= */
  /* 스탠다드 전체 상자 */
  .room .standard {
    position: relative;
    padding-bottom: 50px;
  }
  /* 스탠다드 텍스트 */
  .room .standard h3 {
    font-size: 36px;
    margin-bottom: 20px;
  }
  /* 객실 이미지 상자 */
  .room .standard .img-wrap {
    position: relative;
  }
  /* 객실 이미지 */
  .room .standard .swiper-slide img {
    height: 100%;
    border-radius: 20px;
  }
  .room .standard .txt em {
    padding: 6px 18px 6px 24px;
  }
  /* 페이지네이션, 스와이퍼 버튼 상자 */
  .room .standard .btn-wrap {
    top: 8px;
  }

  /* ============= 스위트 객실 ============= */
  .room .suite {
    position: relative;
  }
  /* 스위트 텍스트 */
  .room .suite h3 {
    font-size: 36px;
    margin-bottom: 20px;
  }
  /* 객실 이미지 상자 */
  .room .suite .img-wrap {
    position: relative;
  }
  /* 객실 이미지 */
  .room .suite .swiper-slide img {
    height: 100%;
    border-radius: 20px;
  }
  .room .suite .txt em {
    padding: 6px 18px 6px 24px;
  }
  /* 페이지네이션, 스와이퍼 버튼 상자 */
  .room .suite .btn-wrap {
    top: 8px;
  }

  /* ============= 공지사항 테블릿 =============*/
  .notice .content {
    padding: 50px 20px 87px;
  }
  /* 맨 위 텍스트 */
  .notice .top p {
    font-size: 16px;
    margin-bottom: 4px;
  }
  /* 공지사항 텍스트 */
  .notice .top h2 {
    font-size: 36px;
    margin-bottom: 40px;
  }
  /* 체크박스 리스트 */
  .notice .top .check-list {
    gap: 13px 10px;
    padding: 0 10px 40px;
  }
  /* 체크박스 가로 사이즈 잡아주기 */
  .notice .check-list .checkbox {
    padding: 7px 32px;
  }
  /* 검색 창 + select 묶기*/
  .notice .top .search-wrap {
    max-width: 505px;
    padding-left: 32px;
  }
  /* select 기준 */
  .notice .select-custom {
    width: 76px;
    margin-right: 13px;
  }
  /* 제목 창 */
  .notice .select-btn {
    line-height: 60px;
    font-size: 16px;
    background-size: 28px 28px;
  }
  /* select 리스트 부모*/
  .notice .select-custom .select-list-wrap {
    top: 55px;
    left: -20px;
  }
  /* select 리스트 */
  .notice .select-custom .select-list {
    width: 88px;
    line-height: 43px;
  }
  /* select 텍스트  */
  .notice .select-custom .select-list a {
    display: block;
    font-size: 16px;
  }
  /* 돋보기 버튼 */
  .notice .search-wrap .search-btn {
    width: 28px;
    height: 28px;
    margin-right: 32px;
  }
  /* ============= 테이블표 */
  .notice table {
    margin-top: 51px;
  }
  /* 번호 */
  .notice table .col1 {
    font-size: 16px;
  }
  /* 분류 */
  .notice table .col2 {
    font-size: 16px;
  }
  /* 제목 */
  .notice table .col3 a {
    font-size: 16px;
    /* 한 줄 말줄임 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  /* 파일첨부 */
  .notice table .col4 a {
    width: 28px;
    /* 이미지 사이즈 잡을때 세로는 잡지 않기 */
  }
  .notice table .col5 {
    font-size: 16px;
  }
  /* col1-col5 위아래 간격 */
  .notice table td {
    padding: 25px 0;
  }

  /* 맨 아래 페이지네이션 */
  .notice .pagination {
    margin-top: 40px;
  }

  /* ============= 웰니스 테블릿 페이지 ============= */

  /* 웰니스 페이지 전체 상자 사이즈 */
  .wellness .content {
    padding: 100px 0 156px;
  }
  /* ========================== 스와이퍼 */
  /* 텍스트 */
  .wellness .inner .program h3 {
    font-size: 40px;
    margin-bottom: 40px;
  }
  /* 슬라이더 */
  .wellness .swiper-slide .img-wrap {
    width: 352px;
  }
  /* 오른쪽 텍스트 부모 */
  .wellness .swiper-slide .txt {
    padding: 92px 30px 40px;
    width: calc(100% - 352px);
  }
  /* 시간 뱃지 */
  .wellness .swiper-slide .txt em {
    font-size: 28px;
    padding: 10px 45px;
    width: 205px;
    height: 63px;
  }
  /* 텍스트 */
  .wellness .swiper-slide .txt h4 {
    font-size: 30px;
    margin-bottom: 19px;
  }
  /* 텍스트 */
  .wellness .swiper-slide .txt p {
    font-size: 16px;
    margin-bottom: 48px;
    /* 3줄 말줄임 */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }
  /* 예약하기 버튼 */
  .wellness .swiper-slide .txt a {
    font-size: 20px;
    width: 172px;
    height: 70px;
  }
  /* 예약하기 아이콘 */
  .wellness .swiper-slide .txt a::before {
    width: 24px;
    height: 24px;
    margin-right: 15px;
  }
  /* 페이지네이션, 스와이퍼 버튼 상자 */
  .wellness .program .btn-wrap {
    top: 21px;
  }

  /* =============== info */
  .wellness .info-wrap {
    margin: 50px 0 0 36px;
  }

  /* ============= 요금할인 테블릿 페이지 ============= */

  /* 요금할인 전체 상자 */
  .discount .top {
    padding-bottom: 80px;
  }
  /* 텍스트 */
  .discount .top p {
    font-size: 18px;
    padding-bottom: 3px;
  }
  /* 텍스트 */
  .discount .top h2 {
    font-size: 45px;
  }
  /* 객실시설, 요금할인 선택 버튼 전체 상자 */
  .discount .filter-wrap {
    position: relative;
    border: 10px solid #eae5e1;
    border-radius: 20px;
    padding: 43px 20px;
  }
  .discount .filter-wrap .filter {
    max-width: 700px;
  }
  /* 버튼 상자 공통 리스트  */
  .discount .filter-wrap .filter li {
    align-items: flex-start;
  }
  /* 객실시설 텍스트만 마진 */
  .discount .filter-wrap li:nth-child(1) h3 {
    margin-top: 11px;
  }
  /* 요금할인 전체 부모 */
  .discount .filter .txt-wrap {
    margin-top: 39px;
  }
  .discount .radio {
    margin-right: 0;
  }
  .discount .filter .price {
    width: calc(100% - 170px);
    margin-bottom: 13px;
  }
  .discount .radio2 {
    margin: 13px 20px 8px 119px;
  }
  /* ============ select */
  /* 제목+화살표 버튼*/
  .discount .select-btn {
    font-size: 16px;
    background-size: 24px 24px;
  }
  /* select 리스트 부모*/
  .discount .select-custom .select-list-wrap {
    position: absolute;
    top: 39px;
  }

  /* 텍스트 */
  .discount .bottom .txt h4 {
    font-size: 38px;
    margin-bottom: 48px;
  }
  /* ============= 테이블표 */
  .discount .table thead th {
    padding: 19px 5px;
    font-size: 16px;
  }
  .discount .table td {
    font-size: 16px;
  }
  .discount .table .col1 {
    padding: 52px 5px;
  }
  .discount .table .col2 {
    padding-left: 10px;
  }
  .discount .table .col3 {
    padding: 30px 5px;
  }
  .discount .table .col4 {
    padding: 30px 5px;
  }
  .discount .bottom .tit p {
    padding-top: 20px;
  }
}
@media (max-width: 1000px) {
  .discount .table .col4 {
    padding: 18px 5px;
  }
}
/* ================= 모바일 구분점 ==================*/
@media (max-width: 767px) {
  /* 헤더높이 분기점 */
  #container {
    padding-top: 90px;
  }

  /* 전체 사이즈 */
  .content {
    padding: 100px 0 150px;
  }

  /* ============= 로그인 모바일 페이지 =============*/
  /* 로그인 텍스트 상자 */
  .login .top {
    margin-bottom: 10px;
  }
  /* 로그인 텍스트*/
  .login .top h2 {
    font-size: 32px;
  }
  /* 텍스트 */
  .room .filter h3 {
    font-size: 16px;
    margin: 0;
  }
  /* 아이디 패스워드 전체 상자 */
  .login .login-wrap {
    padding: 40px 30px;
  }
  /* 아이디 패스워드 입력창 */
  .login .input-wrap input {
    height: 50px;
    padding-left: 23px;
  }
  /* 아이디input랑 비밀번호input창 사이 간격 주려고 아이디input에서 내려줌 */
  .login .input-wrap:nth-of-type(1) {
    margin-bottom: 20px;
  }
  /* 비밀번호는 대소문자를 구분합니다 */
  .login .input-wrap p {
    font-size: 14px;
    margin-top: 5px;
    margin-left: 0;
    text-align: center;
  }
  /* 로그인 버튼 부모상자 */
  .login .btn-wrap {
    padding: 35px 0 21px;
  }
  /* 회원가입 아이디 비밀번호 찾기 전체 상자 */
  .login .login-link {
    margin-bottom: 28px;
    gap: 0 20px;
  }
  /* 텍스트 공통 부모 */
  .login .login-link li {
    font-size: 14px;
  }
  /* 텍스트 */
  .login .login-link a {
    font-size: 14px;
  }
  /* 아이디 찾기 + 비밀번호 재설정 사이 간격 */
  .login .login-link a + a {
    margin-left: 20px;
  }
  /* 텍스트 사이 구분점 */
  .login .login-link li + li::before {
    left: -12px;
  }
  /* 구분선, 네이버 카카오톡 전체 상자 */
  .login .sns {
    padding-top: 20px;
    gap: 0 50px;
    margin-left: -10px;
    margin-right: -10px;
  }
  /* 네이버 카카오 공통 상자 */
  .login .sns a {
    width: 30px;
    height: 30px;
    background: #36c413 url(../images/room/naver1.png) no-repeat center center;
  }
  /* 카카오만 따로 클래스로 빼기 */
  .login .sns .kakao {
    background: #ffc947 url(../images/room/kakao1.png) no-repeat center center;
  }

  /* ============= 객실 모바일 페이지 ============= */
  .room .content {
    padding: 50px 20px 104px;
  }
  /* 그랜드호텔(메인타워) 전체 상자 */
  .room .top {
    padding-bottom: 30px;
  }
  /* 올드&뉴를 겸비한 휴식처 텍스트 */
  .room .top p {
    font-size: 14px;
    margin-bottom: 0;
  }
  /* 그랜드호텔(메인타워) 텍스트 */
  .room .top h2 {
    font-size: 24px;
    margin-bottom: 28px;
  }
  /* 호텔, 객실타입 선택 버튼 전체 상자 */
  .room .filter-wrap {
    border: 5px solid #eae5e1;
    padding: 28px 16px 32px 14px;
  }
  /* 호텔&콘도 부분의 li만  */
  .room .filter-wrap .filter > li {
    display: flex;
    flex-wrap: wrap;
  }
  /* 버튼 상자 공통 리스트  */
  .room .filter-wrap .filter li {
    display: flex;
    align-items: center;
  }
  /* 객실 타입, 호텔&콘도 텍스트 */
  .room .filter h3 {
    font-size: 16px;
    margin: 0px;
    margin: 0 0 10px 10px;
  }
  /* 각각의 객실 타입 상자 */
  .room .filter li.type {
    margin-top: 30px;
  }
  /* 객실타입 텍스트 */
  .room .filter li.type > h3 {
    margin: 0 0 10px 10px;
  }
  /* 지도팝업 전체 부모 */
  .room .filter .map-wrap {
    margin-left: auto;
  }
  /* 지도팝업 클릭 아이콘 */
  .room .map-wrap .map {
    width: 28px;
    height: 28px;
    margin: 0;
    position: relative;
    margin: 0 8px 8px 0;
  }
  /* 지도팝업 닫기버튼 */
  .room .map-popup .close-btn {
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
  }
  /* 호텔&콘도 체크박스 */
  .room .filter .filter-list .checkbox {
    height: 35px;
  }
  /* 선택 초기화, 검색하기 부모상자 */
  .room .filter-wrap .btn-wrap {
    margin-top: 20px;
    justify-content: center;
    gap: 0 10px;
  }
  /* 선택 초기화, 검색하기 버튼 공통 요소 */
  .room .top .reset-btn,
  .room .top .search-btn {
    width: 100px;
    height: 35px;
    border-radius: 5px;
    font-size: 14px;
  }
  .room .checkbox {
    height: 35px;
  }

  /* ============= 스탠다드 객실 ============= */
  /* 스탠다드 전체 상자 */
  .room .standard {
    position: relative;
    padding-bottom: 64px;
  }
  /* 스탠다드 텍스트 */
  .room .standard h3 {
    font-size: 24px;
    margin-bottom: 10px;
  }
  /* 객실 이미지 상자 비율*/
  .room .standard .img-wrap a {
    aspect-ratio: 1 / 1;
  }
  /* 이미지 상자 내부 텍스트 상자 */
  .room .standard .swiper-slide .txt {
    padding: 35px 0 20px 20px;
  }
  .room .standard .txt em {
    padding: 6px 12px 6px 16px;
  }
  /* 객실 이름 텍스트 */
  .room .standard .txt strong {
    font-size: 24px;
  }
  /* 객실 부가설명 텍스트 */
  .room .standard .txt p {
    font-size: 14px;
  }
  /* 객실 유형 텍스트 */
  .room .standard .txt span {
    font-size: 14px;
  }
  /* 스와이퍼 버튼 */
  .room .standard .swiper-button-next,
  .room .standard .swiper-button-prev {
    width: 23px;
    height: 23px;
    margin: 0;
  }
  /* 페이지네이션, 스와이퍼 버튼 상자 */
  .room .standard .btn-wrap {
    top: 6px;
    gap: 0 10px;
  }
  /* 페이지네이션, 스와이퍼 버튼 상자 */
  .room .standard .btn-wrap {
    top: 6px;
  }
  /* 페이지네이션 */
  .room .standard .swiper-pagination {
    font-size: 16px;
  }

  /* ============= 스위트 객실 =============*/
  .room .suite {
    position: relative;
  }
  /* 스위트 텍스트 */
  .room .suite h3 {
    font-size: 24px;
    margin-bottom: 10px;
  }
  /* 객실 이미지 상자 비율*/
  .room .suite .img-wrap a {
    aspect-ratio: 1 / 1;
  }
  /* 이미지 상자 내부 텍스트 상자 */
  .room .suite .swiper-slide .txt {
    padding: 35px 0 20px 20px;
  }
  /* 하이원 팰리스 호텔 뱃지 텍스트+상자 */
  .room .suite .txt em {
    padding: 6px 12px 6px 16px;
  }
  /* 객실 이름 텍스트 */
  .room .suite .txt strong {
    font-size: 24px;
  }
  /* 객실 부가설명 텍스트 */
  .room .suite .txt p {
    font-size: 14px;
  }
  /* 객실 유형 텍스트 */
  .room .suite .txt span {
    font-size: 14px;
  }
  /* 스와이퍼 버튼 */
  .room .suite .swiper-button-next,
  .room .suite .swiper-button-prev {
    width: 23px;
    height: 23px;
    margin: 0;
  }
  /* 페이지네이션, 스와이퍼 버튼 상자 */
  .room .suite .btn-wrap {
    top: 6px;
    gap: 0 10px;
  }
  /* 페이지네이션 */
  .room .suite .swiper-pagination {
    font-size: 16px;
  }

  /* ============= 공지사항 모바일 페이지 ============= */
  .notice .content {
    padding: 40px 20px 50px;
  }
  /* 맨 위 텍스트 */
  .notice .top p {
    font-size: 14px;
    margin-bottom: 0;
  }
  /* p 텍스트 띄어쓰기 o*/
  .notice .top br {
    display: block;
  }
  /* 공지사항 텍스트 */
  .notice .top h2 {
    font-size: 24px;
    margin-bottom: 30px;
  }
  /* 체크박스 리스트 전체 묶음 좌우 아래 간격*/
  .notice .top .check-list {
    gap: 10px 10px;
    padding: 0 10px 20px;
  }
  /* 체크박스 border 안에 간격 고정 */
  .notice .check-list .checkbox {
    padding: 7px 23px;
  }
  /* 검색 창 + select */
  .notice .top .search-wrap {
    max-width: 300px;
    padding-left: 18px;
  }
  /* select  */
  .notice .select-custom {
    width: 48px;
    margin-right: 4px;
  }
  /* 제목+화살표 버튼*/
  .notice .select-btn {
    line-height: 50px;
    font-size: 15px;
    background-size: 18px 18px;
  }
  /* select 리스트 부모*/
  .notice .select-custom .select-list-wrap {
    top: 40px;
    left: -11px;
  }
  /* select 리스트 */
  .notice .select-custom .select-list {
    width: 64px;
    line-height: 35px;
  }
  /* select 텍스트  */
  .notice .select-custom .select-list a {
    display: block;
    font-size: 15px;
  }
  /* 입력창 및 구분선 */
  .notice .search-wrap input[type='search'] {
    height: 20px;
    font-size: 15px;
    padding-left: 10px;
  }
  /* 돋보기 버튼 */
  .notice .search-wrap .search-btn {
    width: 15px;
    height: 15px;
    margin-right: 17px;
    /* 이미지가 작아져서 안보여서 사이즈 잡아줌 */
    background-size: contain;
  }

  /* ================== 테이블표 */
  .notice table {
    margin-top: 25px;
    /* 중앙정렬이였던거 왼쪽으로 붙히기 */
    text-align: left;
  }
  /* 섹션 하나마다의 아래 구분선(각 섹션별 부모) */
  .notice table tr {
    position: relative;
    /* 전체 높이가 70px라 중간인 35px로 조정 */
    padding: 0 8px 35px;
    display: flex;
    height: 70px;
    align-items: center;
  }
  /* 테이블 col1-col5 위아래 간격 */
  .notice table td {
    /* 데스크탑,테블릿에서 위아래 간격 잡아놨던거 0으로 없애기 */
    padding: 0;
  }
  /* 음성 이미지 아이콘 */
  .notice table .col1 img {
    /* 이미지 사이즈 잡아버리기 */
    width: 15px;
    margin: 0;
  }
  /* 번호 */
  .notice table .col1 {
    font-size: 15px;
    /* 이미지 사이즈 width:15에 왼쪽간격 10이라서 25으로 잡음 */
    width: 25px;
  }
  /* 분류 */
  .notice table .col2 {
    font-size: 15px;
    /* 창 줄일 때 글씨가 두 줄로 떨어져서 auto로 풀어주기 */
    width: auto;
  }
  /* 제목 */
  .notice table .col3 a {
    position: absolute;
    left: 10px;
    bottom: 14px;
    font-size: 15px;
  }
  /* 파일첨부 */
  .notice table .col4 a {
    position: absolute;
    right: 10px;
    bottom: 14px;
    width: 15px;
  }
  /* 작성일자 */
  .notice table .col5 {
    font-size: 15px;
    margin-left: auto;
    width: auto;
  }
  /* 페이지네이션 */
  .notice .pagination {
    margin-top: 30px;
  }
  /* 맨처음 화살표 */
  .notice .pagination .btn-first {
    width: 20px;
    height: 20px;
  }
  /* 이전 화살표 */
  .notice .pagination .btn-prev {
    width: 20px;
    height: 20px;
  }
  /* 다음 화살표 */
  .notice .pagination .btn-next {
    width: 20px;
    height: 20px;
  }
  /* 맨뒤로 화살표 */
  .notice .pagination .btn-last {
    width: 20px;
    height: 20px;
  }
  /* 페이지 숫자 묶음 */
  .notice .pagination .num-wrap {
    display: flex;
    gap: 0 25px;
    margin: 0 30px;
  }
  /* 숫자 + 화살표 */
  .notice .pagination a {
    font-size: 15px;
  }

  /* ============= 웰니스 모바일 페이지 ============= */
  /* 웰니스 페이지 전체 상자 사이즈 */
  .wellness .content {
    padding: 80px 0 130px;
  }
  /* 서브비주얼 */
  .wellness .sub-visual {
    background: url(../images/wellness/visual.jpg) no-repeat center center /
      cover;
    width: 100%;
    height: 483px;
  }
  /* 비주얼 배경 위 텍스트 묶음 */
  .wellness .sub-visual .txt {
    padding: 126px 10px 120px;
  }
  /* 텍스트 */
  .wellness .sub-visual h2 {
    font-size: 30px;
    margin-bottom: 1px;
  }
  /* 텍스트 */
  .wellness .sub-visual p {
    font-size: 15px;
    margin-bottom: 25px;
  }
  /* p왼쪽에 핀 아이콘 */
  .wellness .sub-visual p::before {
    /* 아이콘 가로 사이즈 17px에 간격 4px */
    left: -21px;
    width: 17px;
    height: 17px;
  }
  /* 텍스트 */
  .wellness .sub-visual strong {
    font-size: 15px;
    margin-bottom: 21px;
  }
  /* 리스트 텍스트 부모 */
  .wellness .sub-visual .list {
    gap: 15px 15px;
    margin: 0 23px;
    /* 꽉차면 한개씩 아래로 떨어지게 */
    flex-wrap: wrap;
    /* 떨어질 때 가운데로 오게 */
    display: flex;
    justify-content: center;
  }
  /* 텍스트 */
  .wellness .sub-visual .list span {
    font-size: 15px;
  }

  /* ========================== 스와이퍼 */
  /* 텍스트 */
  .wellness .inner .program h3 {
    font-size: 28px;
    margin-bottom: 20px;
  }
  .wellness .program .swiper {
    height: auto;
  }
  /* 슬라이더 */
  .wellness .program .swiper-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .wellness .swiper-slide .img-wrap {
    width: 100%;
  }
  /* 왼쪽 이미지 */
  .wellness .program .swiper-slide img {
    border-bottom-left-radius: 0;
    border-top-right-radius: 20px;
    aspect-ratio: 16 / 9;
  }
  /* 오른쪽 텍스트 부모 */
  .wellness .swiper-slide .txt {
    padding: 28px 20px 20px 15px;
    width: 100%;
    border-bottom-left-radius: 20px;
  }
  /* 시간 뱃지 */
  .wellness .swiper-slide .txt em {
    font-size: 15px;
    padding: 3px 14px;
    width: 90px;
    height: 28px;
    border-radius: 0 0 0 10px;
  }
  /* 텍스트 */
  .wellness .swiper-slide .txt h4 {
    font-size: 20px;
    margin-bottom: 10px;
  }
  /* 텍스트 */
  .wellness .swiper-slide .txt p {
    font-size: 15px;
    margin-bottom: 21px;
    /* 2줄 말줄임 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
  }
  /* 예약하기 버튼 */
  .wellness .swiper-slide .txt a {
    font-size: 18px;
    width: 165px;
    height: 53px;
    border-radius: 15px;
  }

  /* 페이지네이션, 스와이퍼 버튼 상자 */
  .wellness .program .btn-wrap {
    top: 15px;
    gap: 0 20px;
  }
  /* 스와이퍼 오른쪽 버튼 */
  .wellness .program .swiper-button-next {
    width: 28px;
    height: 28px;
  }
  /* 페이지네이션 */
  .wellness .program .swiper-pagination {
    font-size: 16px;
  }
  /* =============== info */
  .wellness .info-wrap {
    margin: 60px 0 0 0;
  }
  .wellness .inner h5 {
    font-size: 23px;
  }
  .wellness .info-wrap dt {
    font-size: 15px;
    font-weight: 500;
    color: #848484;
  }
  .wellness .info-wrap dd {
    font-size: 15px;
  }
  .wellness .info-wrap .info li {
    font-size: 15px;
  }
  .wellness .info-wrap .tit {
    font-size: 15px;
  }
  .wellness .info-wrap strong {
    font-size: 18px;
  }

  /* ============= 요금할인 모바일 페이지 ============= */
  .discount .content {
    padding: 74px 0 130px;
  }
  /* 텍스트 */
  .discount .top p {
    font-size: 15px;
    padding-bottom: 10px;
  }
  .discount .top p br {
    display: block;
  }
  /* 텍스트 */
  .discount .top h2 {
    font-size: 24px;
    margin-bottom: 16px;
  }
  /* 객실시설, 요금할인 선택 버튼 전체 상자 */
  .discount .filter-wrap {
    padding: 28px 29px;
  }
  .discount .filter-wrap .filter {
    max-width: 260px;
  }
  /* 버튼 상자 공통 리스트  */
  .discount .filter-wrap .filter li {
    display: flex;
    flex-direction: column;
    align-items: left;
  }
  .discount .filter-wrap li:nth-child(1) h3 {
    margin: 0 0 17px 0;
  }
  /* 리스트 버튼 */
  .discount .filter .filter-list {
    display: flex;
    gap: 7px 10px;
  }
  /* 객실시설 체크박스 */
  .discount .filter .filter-list .checkbox {
    padding: 0 29px;
  }
  /* 요금할인 전체 부모 */
  .discount .filter .txt-wrap {
    flex-direction: column;
    margin-top: 30px;
  }
  /* 텍스트 */
  .discount .filter .txt-wrap h3 {
    margin: 0 0 10px 0;
  }
  .discount .filter .price {
    width: 100%;
    margin-bottom: 13px;
  }
  .discount .radio2 {
    margin: 0 0 8px 0;
  }
  /* select 기준 */
  .discount .select-custom {
    width: 258px;
    height: 45px;
    margin-left: 0;
  }
  /* 제목+화살표 버튼*/
  .discount .select-btn {
    line-height: 45px;
    font-size: 15px;
    /* 화살표를 배경으로 넣어서 패딩으로 위치 조절 안됨 오른쪽에서 16px 밀어줌 */
    background: url(../images/discount/arrow-down.png) no-repeat right 16px
      center;
    padding: 0 16px;
    background-size: 24px 24px;
  }
  /* select 리스트 부모*/
  .discount .select-custom .select-list-wrap {
    top: 35px;
    left: 14px;
  }
  /* select 리스트 */
  .discount .select-custom .select-list {
    width: 230px;
  }
  /* select 텍스트  */
  .discount .select-custom .select-list a {
    font-size: 15px;
    margin-left: 7px;
  }
  /* 텍스트 */
  .discount .bottom .txt h4 {
    font-size: 35px;
    margin-bottom: 40px;
  }
  /* 스크롤텍스트 */
  .discount .bottom .txt p {
    font-size: 15px;
    gap: 0 5px;
    justify-content: left;
  }
  /* 스크롤 텍스트 왼쪽 아이콘 */
  .discount .bottom .txt p::before {
    width: 16px;
    height: 16px;
    /* 백그라운드로 넣은 이미지 사이즈보다 작아져서 이미지가 잘릴때 고정 */
    background-size: contain;
  }
  /* ============= 테이블표 */
  /* 가로 스크롤 */
  .discount .table-wrap {
    /* 잘리는 부분 가로 스크롤로 밀어서 보게 */
    overflow-x: auto;
    /* 표랑 가로스크롤 사이 간격 */
    padding-bottom: 10px;
  }
  .discount .table {
    /* 표가 이 크기 이하로는 절대 쪼그라들지 않도록*/
    min-width: 750px;
    /* 창이 줄어들 때 글자 길이에 맞춰 반응하게*/
    table-layout: auto;
  }
  .discount .table thead th {
    padding: 18px 5px;
    font-size: 16px;
  }
  .discount .table td {
    font-size: 16px;
  }
  .discount .table .col1 {
    padding: 51px 5px;
  }
  .discount .table .col3 {
    padding: 30px 5px;
  }
  .discount .table .col4 {
    padding: 18px 5px;
  }
  .discount .table .col4 br {
    display: block;
  }
  .discount .table .col5 {
    padding: 26px 16px;
  }
  .discount .bottom .tit p {
    font-size: 15px;
    padding-top: 14px;
  }
}