@charset "utf-8";

html { height: 100%; overflow-y: auto; }
body { margin-top: 0 !important; height: 100%; font: 12px/14px 'Nanum Gothic', 'Dotum', 'applegothic','ＭＳ Ｐゴシック', 'SimHei', sans-serif !important; word-break: break-all; word-wrap: break-word; word-break: keep-all;  }
h1, h2, h3, h4, h5, h6 { font: bold 12px/14px 'Nanum Gothic', 'Dotum', 'applegothic', sans-serif; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p, button { margin: 0; padding: 0; -webkit-text-size-adjust: none; }
fieldset, img, abbr, acronym { border: 0 none; }
img { vertical-align: top; }
legend { position: absolute; height: 0; line-height: 0; font-size: 0; overflow: hidden; }
legend.showlegend { position: static; line-height: 14px; font-size: 12px; overflow: visible; }
address, caption, cite, code, dfn, em, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; }
q:before, q:after { content:''; }
table { width: 100%; border-collapse: collapse; border-spacing: 0; }
caption { height: 0; line-height: 0; font-size: 0; overflow: hidden; text-indent: -10000px; }
hr { display: none; }
a { text-decoration: none; cursor: pointer; }
a:focus,
a:hover { transition: color 0.3s; -webkit-transition: color 0.3s; }

button { border: 0 none; background: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
button, input, select, textarea { font: 12px/14px 'Nanum Gothic', 'Dotum', 'applegothic', sans-serif; vertical-align: middle; }
button,
input[type="button"],
input[type="reset"],
input[type="submit"] { cursor: pointer; overflow: visible; -webkit-appearance: button; }
select { min-width: 100px; -webkit-border-radius: 0; }
textarea { overflow: auto; resize: none; }

input[type="checkbox"],
input[type="radio"] { width: 14px; height: 14px; line-height: 14px; box-sizing: border-box; -webkit-border-radius: 0; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/* html5 태그*/
header, footer, article, section, aside, details, figure, figcaption, nav, hgroup { display: block; margin: 0; padding: 0; }
audio[controls], canvas, video { display: inline-block; *display: inline; *zoom: 1; }

#_wrap { width: 100%; }
#_wrap .header { width: 100%; height: 345px; }	
#_wrap .bg_hanok { height: 345px; background: url(/img/bg_subhead_han.png) no-repeat center; }
#_wrap .bg_kyo { height: 345px; background: url(/img/bg_subhead_kyo.png) no-repeat  center; }
#_wrap .header ._gnb {  text-align: center  }

._header ._gnb ul { overflow: hidden; position: relative; top: 120px; margin: 0 auto; width: 995px; margin: 0 auto }
._header ._gnb ul li { list-style: none; float: left; text-align: center; width: 200px; letter-spacing: -1px; background: #ffb513; padding: 15px; margin-right: 25px; border-radius: 3px  }
._header ._gnb ul li:last-child { margin-right: 0 }

._header ._gnb ul li a { font-size: 18px;  color: #333; font-weight: bold }
._header ._gnb ul li a:hover { text-decoration: underline }
._header ._gnb ul li a span {  border-bottom: 3px solid none; padding-bottom: 42px;  }
._header ._gnb ul li a span.select { border-bottom: 3px solid #fff;  }


.index_box { max-width: 500px; min-width: 500px; border: 3px solid #d3d5d8; padding: 35px 18px; margin: 50px auto; background: #fff }
.index_box h2 { font-size: 16px; font-weight: bold; color: #2768c8  }

.login_notice { padding: 30px 0 20px; font-size: 14px; color: #ac0069; line-height: 1.3 }

.login .login_tbl { width: 96%; border: 1px solid #a0a0a0; background: #fafbfc; padding: 15px 2% }
.login .login_tbl table th, .login table td { text-align: left; padding: 5px 0 3px 10px; font-weight: normal; color: #000; font-size: 14px; }
.login .login_tbl table td input.ipt { border: 1px solid #000; padding: 8px 0 6px 10px; font-size: 14px; background: white; width: 80% }
.login .login_tbl table td label { margin-left: 10px;  }
.iptz { border: 1px solid #000; padding: 8px 0 6px 10px; font-size: 16px; background: white; width: 80%;  }
.btn_w { border: 1px solid #000; display: block; width: 100%; text-align: center; margin: 0 auto; padding: 12px 0; color: white; border-radius: 3px; font-size: 14px; background: #333  }


ul.tab_menu{ clear:both; margin: 0 0 0 0; background:url(http://owol.oneroomtalk.net/test/img/bg_tab.gif) repeat-x bottom; *zoom:1; height: 54px; padding: 0; list-style: none }
ul.tab_menu:after {content:''; display:block; clear:both; }
ul.tab_menu li{ float: left; }
ul.tab_menu li a{ background:none; display:block; height:49px; padding:0 15px; border-top:1px solid #686970; border-right: 1px solid #686970;border-bottom:4px solid #686970;text-align:center;color:#000;line-height:49px;text-decoration:none;letter-spacing:-1.1px; font-size: 15px;  }
ul.tab_menu li.on a{border-top-color:#4b4c52; border-bottom:4px solid #ac0069;background:#4b4c52;color:#fff; height:auto;}
ul.tab_menu li.off{height:49px;padding:0 20px;/* border-top:1px solid #b4b4b8 */border-top:1px solid #686970; border-right:1px solid #686970;text-align:center;color:#b4b4b8;line-height:49px;   }
ul.tab_menu li:first-child{border-left:1px solid #686970}

.cal_navi {text-align:center;}
.cal_navi .title_red, .cal_navi .btn_reserve_prev, 
.cal_navi .btn_reserve_next {font-size:14px; display:inline-block; margin:15px 0 10px;}
.cal_navi .title_red {font-weight:bold;}
.cal_navi .btn_reserve_prev, 
.cal_navi .btn_reserve_next {display:inline-block; width:30px; height:30px; border:2px solid #e5e5e5; background:#f7f7f7; color:gray; text-align:center; line-height:30px;}
.cal_navi .btn_reserve_prev {margin:0 20px 0 0; position:relative; top:-1px;}
.cal_navi .btn_reserve_next {margin:0 0 0 20px; position:relative; top:-1px;}

.caltable {position:relative;width:90%;border-collapse:collapse; margin: 0 auto;}
.caltable th {border:1px solid #7f7f7f;}
.caltable .date td {border:1px solid #ccc; padding: 15px 0}
.caltable th.sunday {background:red; color:white;}
.caltable th.saturday {background:skyblue; border-right:1px solid #7f7f7f; color:white;}
.caltable .date .titday {padding:5px 0 0 5px;font-size:11px;font-family: Verdana,applegothic;letter-spacing:-1px;}
.caltable .date .titday .hlday {font-family:'돋움',Dotum,Verdana,applegothic;color:red;}
.caltable .date .rmlist {margin:0;padding:5px 0 5px 5px;list-style:none;}
.caltable .date .rmlist li {padding:1px 0 2px;}
.caltable .date .rmlist li a:hover {color:#000}
.caltable .date .rmlist li .tit {color:#000}
.caltable .date .dday .rmlist li .tit {color:#fff}
.caltable .prev, .caltable .next {background:#f7f7f7;}
.caltable .dday {background:#6358a6;color:#fff}
.caltable .dday_hu {background:#ffcfcf;color:#fff}


.caltable .dday a {color:#fff}
.caltable .dday_hu a {color:#fff}
.caltable .sun, .caltable .sun a {color:#000;}
.caltable .sat, .caltable .sat a {color:#000;}
.caltable td {height:50px;vertical-align:top;width:14.285714%}

.caltable td.mini {height:30px;vertical-align:middle;text-align:center;}
.caltable .date .mini a.titday {padding:0;cursor:pointer;display:block;height:30px;line-height:30px;overflow:hidden;}
.caltable .date .mini a.titday:hover {background-color:#cfcfcf}
.caltable .date .closeday {color:#dfdfdf}
.caltable th:first-child, .caltable td:first-child { border-left: 0 !important }
.caltable th:last-child, .caltable td:last-child { border-right: 0 !important }


.tbl_type,.tbl_type th,.tbl_type td{border:0;text-align:center;}
.tbl_type,.tbl_type th:first-child,.tbl_type td:first-child { border-left: 0 !important }
.tbl_type,.tbl_type th:last-child,.tbl_type td:last-child { border-right: 0 !important }
.tbl_type{width:100%;border-top:2px solid #151515;border-bottom:1px solid #9C9C9C;border-collapse:collapse}
.tbl_type caption{display:none}
.tbl_type tfoot{background-color:#f5f7f9;font-weight:bold}
.tbl_type th{padding:7px 0 4px;border:1px solid #9C9C9C;background-color:#f5f7f9;color:#000;font-weight:bold}
.tbl_type td{padding:6px 4px 4px;border:1px solid #9C9C9C;color:#4c4c4c}
.tbl_type.frm td {text-align:left;}

.box_type {width:100%;border:1px solid #9C9C9C;}
.box_type .noti {text-align:left;padding:10px 5px;}
.box_type .privacy {line-height:1.6em}
.box_type .privacy .purpose {margin:4px 0;padding:0 0 0 15px;list-style:none;}
.box_type .privacy .purpose li {margin:0;padding:0}
.tit:hover { color: blue }
h3 { margin: 30px auto 10px; font-size: 24px; border: 2px solid #ff9800; width: 300px; padding: 15px 0; border-radius: 3px;  }


.sub_tbl { width: 90%; border: 1px solid #a0a0a0; background: #fafbfc; padding: 15px 2%; margin: 0 auto; font-size: 14px; }
.sub_tbl th {  font-weight: normal; color: #333; font-size: 16px; background: #f5f5f5; border: 1px solid #ccc; height: 40px}
.sub_tbl td { padding: 5px 0 3px 10px; font-weight: bold; color: #333; font-size: 16px; border: 1px solid #ccc }
.sub_tbl td input.ipt { border: 1px solid #000; padding: 8px 0 6px 10px; font-size: 16px; background: white; width: 300px }
.sub_tbl td input.ipt:focus { border: 1px solid #1d4e9d; background: #f5f5f5 }
.sub_tbl td label { margin-left: 10px;  }
.sub_tbl  td span { margin-left: 5px; }
.sub_tbl  td div { color: #ad2100; margin: 10px 0;  }

.btn_z { border: 1px solid #000; display: inline-block; text-align: center; padding: 12px; color: white; border-radius: 3px; font-size: 14px; height: 50px; width: 150px;  }
.btn_q { border: 1px solid #000; display: block; width: 80%; text-align: center; margin: 0 auto; padding: 7px 0; color: white; border-radius: 3px;   }
.btn_a { border: 1px solid #000; display: block; width: 80%; text-align: center; margin: 0 auto; padding: 4px 0; color: white; border-radius: 3px;   }
.btn_w { border: 1px solid #000; display: block; width: 90%; text-align: center; margin: 0 auto; padding: 12px 0; color: white; border-radius: 3px; font-size: 14px;  }
.btn_f { border: 1px solid #000; display: block; width: 100%; text-align: center; margin: 0 auto; padding: 12px 0; color: white; border-radius: 3px; font-size: 14px;  }
.btn_n { border: 1px solid #000; display: inline-block; text-align: center; margin: 0 auto; padding: 12px; color: white; border-radius: 3px; font-size: 14px;  }
.modi { background: #ac0069 }
.open { background: #555 }
.b_org { background: #FF5E00 }
.b_blue { background: #2768c8 }
.w_blue { color: #2768c8   }
.b_ma { background: #FF007F  }
.w_red {color: #FF0000  }

.t_title { font-size: 16px;   }
.a_txt {  font-size: 14px; line-height: 1.5 }
.a_tbl { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px;; text-align: center; margin: 10px 0}
.a_tbl th, .a_tbl td { padding: 15px 0; border: 1px solid #ccc; line-height: 1.2 }

.calendar-table {
  border-collapse: collapse;
  width: 100%;
}

.calendar-table td,
.calendar-table th {
  border: 1px solid #ccc;     /* 실선 경계선 */
  padding: 6px;
  text-align: left;
  vertical-align: top;
}


.s-title01.mmy {
  font-size: 28px;
  font-weight: bold;
  line-height: 1.4;
}

ul.main-img {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px;
  padding: 0;
}

ul.main-img li {
  width: 360px;
  height: 270px;
  list-style: none;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 5px rgba(0,0,0,0.2);
}

ul.main-img li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

ul.main-img li dl {
  position: absolute;
  bottom: 0;
  width: 100%;
  margin: 0;
  padding: 12px;
  background: rgba(0,0,0,0.5);
  color: #fff;
  box-sizing: border-box;
}

ul.main-img li dl dt,
ul.main-img li dl dd {
  margin: 0;
  font-size: 16px;
}

.room-card {
  position: relative;
  width: 350px;
  height: 230px;
  overflow: hidden;
  display: inline-block;
  margin: 10px; /* 이 부분 추가 */
}

.room-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.room-overlay {
  position: absolute;
  bottom: 0;
  width: 100%;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  padding: 10px;
  box-sizing: border-box;
}

.room-overlay .name {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
}

.room-overlay .price {
  color: #f1c40f;
  font-size: 14px;
}

/* 가격표 테이블 공통 스타일 */
.price-table {
  width: 100%;
  margin: 0 auto;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 15px;
}

.price-table th,
.price-table td {
  padding: 16px;
  text-align: center;
  border-bottom: 1px solid #ccc;
  vertical-align: middle;
  word-break: keep-all;
}

/* ✅ 제목(첫 행) 배경색 */
.price-table thead th {
  background-color: #f6f4ef; /* 밝은 베이지 */
  border-top: 2px solid #9c7e58; /* 상단 굵은 선 */
  color: #333;
}

/* ✅ '구분' 및 '요금' 첫 번째 열 배경 강조 */
.price-table td:first-child,
.price-table th:first-child {
  background-color: #fdfaf5;
  font-weight: bold;
  color: #333;
}

/* ✅ 강조 색상 (요금) */
.price-table .price {
  color: #c37a00;
  font-weight: bold;
}

  table.order-price {
    width: 100%;
    max-width: 1000px;
    table-layout: fixed; /* 셀 너비 고정 */
    border-collapse: collapse;
    margin: 30px auto;
    font-family: '맑은 고딕', sans-serif;
    font-size: 15px;
  }

  table.order-price th, table.order-price td {
    border: 1px solid #ccc;
    padding: 10px;
    text-align: center;
  }

  table.order-price th {
    background-color: #f1f1f1;
    font-weight: bold;
  }

  .order-room-group {
    background-color: #e6f7ff;
    font-weight: bold;
  }

  .order-room-name {
    font-weight: 500;
    color: #333;
  }

  .rate-table {
  width: 100%;
  max-width: 600px;
  border-collapse: collapse;
  font-size: 14px;
  margin: 0 auto;
  border: 1px solid #ddd;
}
.rate-table th, .rate-table td {
  border: 1px solid #ddd;
  text-align: center;
  padding: 6px 8px;
}
.rate-guide .rate {
  padding: 2px 6px;
  border-radius: 4px;
  font-weight: bold;
  display: inline-block;
}
.rate-W {
  background: #ffffff !important;  /* 흰색 (평일) */
  color: #000 !important;
}

.rate-H {
  background: #ffe4e1 !important;  /* 연분홍 - 휴일 */
  color: #900000 !important;
}


.rate-F {
  background: #fff0cc !important;  /* 연노랑 (금요일) */
  color: #000 !important;
}

.rate-B {
  background: #dceeff !important;  /* 연하늘 (토요일 또는 공휴일 전일) */
  color: #000 !important;
}

/* 날짜 셀만 진하게 강조 (공통: .date-cell + 요일 등급 조합) */
.rate-W.date-cell {
  background-color: #f4f4f4 !important;  /* 흰색보다 연회색 */
}

.rate-H.date-cell {
  background-color: #ffdad7 !important;  /* 연분홍보다 조금 진하게 */
}

.rate-F.date-cell {
  background-color: #ffe9aa !important;  /* 연노랑보다 살짝 진하게 */
}

.rate-B.date-cell {
  background-color: #cce6ff !important;  /* 연하늘보다 더 진하게 */
}

.date-number {
    display: inline-block;
    padding: 2px 6px;
    background-color: #f0f0f0;
    border: 2px solid #999; /* 진한 회색 테두리 */
    border-radius: 5px;
    font-weight: bold;
    font-size: 13px;
    margin-bottom: 3px;
}

.calendar-table {
  border-collapse: collapse;
  width: 100%;
}

.calendar-table td {
  border: 1px solid #ccc;  /* 실선 */
  padding: 5px;
  vertical-align: top;
}

.caltable td,
.caltable th {
  border: 1px solid #ccc !important;  /* 실선 강제 적용 */
  box-sizing: border-box;
}

.caltable .date td {
  border: 1px solid #ccc;
  padding: 10px 6px;
  box-sizing: border-box;
}

.yo-text {
  font-size: 12px;
  margin-top: 2px;
  color: #444;
}

.reg-c-info {
  font-size: 12px;
  margin-top: 4px;
  padding: 2px 4px;
  border-radius: 4px;
  display: inline-block;
}

.reg-comp { background-color: #ccc; color: #333; } /* 완료 */
.reg-wat { background-color: #ffeeba; color: #856404; } /* 대기 */
.reg-cap { background-color: #d4edda; color: #155724; } /* 가능 */
.reg-cap_1 { 
  background-color: #e0e0e0;
  color: #000;
  border-radius: 3px;
  font-weight: 700;
  padding: 2px 6px;       /* 🔹 세로 높이를 확보 */
  line-height: 1.4;       /* 🔹 글씨가 가운데 정렬되도록 */
  display: inline-block;  /* 🔹 배지 형태 유지 */
} /* 공실 */


.reg-cap2 {
    background-color: #4CAF50;
    color: #fff;
    padding: 2px 4px;
    font-size: 0.85em;
    border-radius: 3px;
}
.reg-c-info {
    padding: 4px;
    font-size: 0.85em;
    margin-bottom: 2px;
}

td.sun { background-color: #ffecec; }  /* 일요일 */
td.sat { background-color: #e6f3ff; }  /* 토요일 */

td.past {
    background-color: inherit ; /* 또는 삭제 */
}

.td-msg.gray-center {
    color: #999;
    text-align: center;
    font-size: 13px;
    margin-top: 8px;
}

.rate-text {
    font-size: 12px;
    color: #666;
    margin-left: 2px;
}

.date-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 4px;
}
.date-text {
  font-size: 15px;
  font-weight: bold;
}
.rate-label {
  font-size: 12px;
  color: #555;
}

.date-td {
  background-color: #fceeee;
  border-bottom: 1px solid #ddd;
}

.main-pic {
  max-width: 1080px;   /* .container와 동일하게 */
  margin: 0 auto;      /* 가운데 정렬 */
  padding: 0px;       /* 필요 시 여백 */
  box-sizing: border-box;
}

.container {
  max-width: 1080px !important;
  margin: 0 auto !important;   /* 가운데 정렬 */
  padding: 0 15px !important;  /* 좌우만 여백 주고, 위아래는 0 */
  box-sizing: border-box;
  background-color: #fff;
}

.room-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr) !important; /* 항상 3열 */
  gap: 10px; /* 칸 사이 여백 */
  justify-items: center;   /* 각 칸 안 내용 가운데 정렬 */
  justify-content: center; /* 전체 그리드 가운데 정렬 */
}

/* 태블릿 화면 (가로폭 768px 이하) */
@media (max-width: 768px) {
  .room-grid {
    grid-template-columns: repeat(2, 1fr) !important; /* 2열 */
  }
}

/* 모바일 화면 (가로폭 480px 이하) */
@media (max-width: 480px) {
  .room-grid {
    grid-template-columns: repeat(2, 1fr) !important; /* 2열 */
  }
}

.room-card {
  display: block;
  text-align: center;
  text-decoration: none;
  width: auto !important;    /* 폭 강제 풀기 */
  max-width: 100%;           /* grid 셀 안에서만 꽉 차게 */
  color: inherit;
}

.room-card img {
  width: 100%;      /* 칸 크기에 맞게 */
  height: auto;     /* 원본 비율 유지 */
  border-radius: 8px; /* 모서리 둥글게 (선택사항) */
}

.room-overlay {
  margin-top: 8px;
}

.room-name {
  font-size: 16px;          /* 글씨 크기 */
  font-weight: bold;        /* 두껍게 */
  color: #f8f407;              /* 기본 진한 회색 */
  text-align: center;       /* 가운데 정렬 */
  margin-top: 10px;         /* 위쪽 여백 */
  margin-bottom: 5px;       /* 아래쪽 여백 */
  letter-spacing: -0.5px;   /* 자간 약간 줄임 */
}