@charset "utf-8";

/* =========================================================
   PKTRAVEL — JAPAN × KOREA
   Clean Editorial / Mist Blue + Ivory
   HTML structure unchanged
   ========================================================= */

.tour {


  width: 100%;
  max-width: 1250px;
  margin: auto;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
  display: table;
  
  
  
}

.tour .row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.tour img {
  max-width: 100%;
  margin: 0 auto;
  display: block;
  transition: filter .3s ease, transform .3s ease;
}

.tour p {
  color: #62696d !important;
  font-size: 15px !important;
  line-height: 1.95 !important;
  letter-spacing: .015em !important;
}

.tour b {
  font-weight: 700 !important;
  font-family: "Noto Serif TC", "Century Gothic", serif !important;
}

/* ---------- Intro ---------- */
.tour .hero-intro {
  position: relative;
  overflow: hidden;
  margin: 0 0 36px !important;
  padding: 76px 32px 62px !important;
  background: linear-gradient(135deg, #dfe8e9 0%, #eef2f1 52%, #f5f1e8 100%) !important;
  border: 0 !important;
}

.tour .hero-intro::before {
  content: "JAPAN  /  KOREA";
  position: absolute;
  top: 22px;
  left: 50%;
  transform: translateX(-50%);
  color: #75858a;
  font-size: 10px;
  letter-spacing: .46em;
  font-family: "Century Gothic", "Noto Sans TC", sans-serif;
}

.tour .hero-intro::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 20px;
  width: 34px;
  height: 1px;
  transform: translateX(-50%);
  background: #aa8e65;
}

.tour .hero-intro h5 {
  margin-bottom: 16px !important;
  color: #9c7d54 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: .24em !important;
}

.tour .notetitle {
  max-width: 820px;
  margin: 0 auto 18px !important;
  padding: 0 !important;
  color: #26363d !important;
  font-family: "Noto Serif TC", "Century Gothic", serif !important;
  font-size: 48px !important;
  font-weight: 500 !important;
  line-height: 1.22 !important;
  letter-spacing: .045em !important;
  text-align: center;
}

.tour .hero-intro p {
  max-width: 680px !important;
  margin: 0 auto !important;
  color: #647278 !important;
  font-size: 14px !important;
  line-height: 2 !important;
}

/* ---------- Region headers ---------- */
.tour .region-band {
  margin: 52px 0 34px !important;
  padding: 0 !important;
  background: #fff !important;
  border: 0 !important;
}

.tour .region-band .col-12 {
  padding: 0 !important;
  margin: 0 !important;
}

.tour .region-label {
  position: relative;
  padding: 18px 0 17px 66px !important;
  background: #fff !important;
  border-top: 1px solid #e4ded4 !important;
  border-bottom: 1px solid #e4ded4 !important;
  text-align: left !important;
}

.tour .region-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 42px;
  height: 100%;
}

.tour .region-label-gyeongju::before { background: #b1843f; }
.tour .region-label-busan::before { background: #3f8792; }
.tour .region-label-kyushu::before { background: #9b615a; }

.tour .region-label-eyebrow {
  display: block;
  margin-bottom: 5px !important;
  color: #9ca0a3 !important;
  font-family: "Century Gothic", "Noto Sans TC", sans-serif;
  font-size: 9px !important;
  font-weight: 600 !important;
  line-height: 1.3;
  letter-spacing: .34em !important;
  text-transform: uppercase;
}

.tour .region-label-title {
  display: block;
  color: #26343a !important;
  font-family: "Noto Serif TC", "Century Gothic", serif !important;
  font-size: 31px !important;
  font-weight: 500 !important;
  line-height: 1.3;
  letter-spacing: .07em !important;
}

/* ---------- Typography ---------- */
.tour .big-title {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 9px !important;
  padding: 0 !important;
  border: 0 !important;
  color: #9d9d99 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
}

.tour .big-title::before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 1px;
  margin: 0;
  background: #8c8f91;
  vertical-align: middle;
}

.tour h1 {
  margin: 0 0 15px !important;
  color: #a5a8aa !important;
  font-family: "Century Gothic", "Noto Sans TC", sans-serif !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  letter-spacing: .14em !important;
}

.tour h2 {
  margin: 0 0 10px !important;
  color: #26343a !important;
  font-family: "Noto Serif TC", "Century Gothic", serif !important;
  font-size: 26px !important;
  font-weight: 600 !important;
  line-height: 1.38 !important;
  letter-spacing: .015em !important;
}

.tour h3 {
  margin: 0 auto 16px;
  color: #383838;
  font-family: "Noto Serif TC", "Microsoft JhengHei", serif;
  font-size: 32px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 2px;
}

.tour h3 span {
  position: relative;
  display: inline-block;
  margin-right: 8px;
  color: #518AC3 !important;
}

.tour h3 span::after {
  content: "";
  position: absolute;
  left: 3%;
  bottom: 2px;
  width: 94%;
  height: 7px;
  background: rgba(81, 138, 195, 0.12);
  z-index: -1;
}

.tour h5 { color: #26343a !important; }

/* ---------- Article spacing ---------- */
.tour .row[class*="pt-5"],
.tour .row[class*="py-3"] {
  position: relative;
  scroll-margin-top: 20px;
}

.tour .row[class*="pt-5"] > [class*="col-"],
.tour .row[class*="py-3"] > [class*="col-"] {
  padding-top: 8px !important;
  padding-bottom: 20px !important;
}

.tour .row[class*="pt-5"]:not(.hero-intro):not(.region-band)::after,
.tour .row[class*="py-3"]:not(.hero-intro):not(.region-band)::after {
  content: "";
  position: absolute;
  left: 4%;
  right: 4%;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #e8e5df, transparent) !important;
}

/* ---------- Images ---------- */
.tour .pic01 {
  display: block;
  float: left;
}

.tour .picmark {
  float: right;
  padding: 5px;
}

.tour .pic-full img {
  width: 100% !important;
  height: 100% !important;
  min-height: 300px !important;
  object-fit: cover !important;
}

.tour .row img:not([src*="gift"]) {
  border-radius: 0 !important;
}

@media (hover: hover) {
  .tour .row img:not([src*="gift"]):hover {
    filter: saturate(.94) contrast(1.025);
  }
}

/* ---------- Video hero ---------- */
.tour .hero-video-box {
  position: relative;
  width: 100%;
  height: 440px !important;
  min-height: 0 !important;
  overflow: hidden;
  background: #d5dedf !important;
}

.tour .hero-video-box video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  filter: saturate(.82) contrast(1.02) brightness(.96) !important;
}

.tour .hero-video-box::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(38,54,61,.04), rgba(38,54,61,.28));
}

.tour .hero-text {
  position: absolute;
  left: 50%;
  top: 50%;
  width: auto;
  z-index: 10;
  transform: translate(-50%, -50%);
  text-align: center;
  pointer-events: none;
}

.tour .hero-text::before {
  content: "BUSAN · COASTAL JOURNEY";
  display: block;
  margin-bottom: 10px;
  color: rgba(255,255,255,.58);
  font-size: 9px;
  letter-spacing: .34em;
}

.tour .hero-text h1 {
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-family: "Arial Black", sans-serif !important;
  font-size: 38px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: .12em !important;
  text-shadow: none !important;
  text-transform: uppercase;
}

/* ---------- Soft panels ---------- */
.tour .BGblue,
.tour .BGgray,
.tour .BGyellow {
  position: relative;
}

.tour .BGblue { background: #f2f6f6 !important; }
.tour .BGgray { background: #f5f4f1 !important; }
.tour .BGyellow { background: #f8f4ec !important; }

.tour .BGblue::before,
.tour .BGgray::before,
.tour .BGyellow::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18px;
  bottom: 18px;
  width: 2px;
}

.tour .BGblue::before { background: #3f8792; }
.tour .BGgray::before { background: #999; }
.tour .BGyellow::before { background: #ae8d5c; }

/* ---------- Food / Sauna ---------- */
.tour .food-title {
  display: inline-block;
  color: #2f3d42 !important;
  font-family: "Noto Sans TC", "Century Gothic", sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.5;
  letter-spacing: .015em !important;
}

.tour .folio {
  margin-bottom: 10px !important;
  color: #9b9ea0 !important;
  font-size: 10px !important;
  letter-spacing: .16em !important;
  text-transform: uppercase;
}

.tour .kr-tag {
  display: inline-block;
  margin-bottom: 14px;
  padding: 4px 9px !important;
  border: 1px solid #e0ddd7 !important;
  border-radius: 20px !important;
  background: #faf9f7 !important;
  color: #74787a !important;
  font-family: "Noto Serif TC", serif;
  font-size: 10px !important;
}

.tour .note-box {
  padding: 20px 22px !important;
  background: #eee9df !important;
  color: #5b6061 !important;
  border: 0 !important;
  border-left: 3px solid #aa8e65 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: .85rem;
  line-height: 1.9;
}

.tour .note-box b { color: #334248 !important; }

.tour .foodbox {
    width: 20%;
    padding: 0 4px 12px;
    box-sizing: border-box;
    float: left;
}

.tour .foodbox img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
}
.tour .viewbox {
    width: 20%;
    padding: 0 4px 12px;
    box-sizing: border-box;
    float: left;
}

.tour .viewbox img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
}
/* ---------- Section headings ---------- */
.tour h6 {
  margin: 0 0 14px;
  color: #9c8872;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 5px;
}

.tour h6 span {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

.tour h6 span::before,
.tour h6 span::after {
  content: "";
  width: 35px;
  height: 1px;
  background: #c8b8a8;
}

.tour h7 {
  display: block;
  max-width: 760px;
  margin: 0 auto;
  color: #777;
  font-size: 15px;
  font-weight: 400;
  line-height: 2;
  letter-spacing: 1px;
}

.tour h6 + br,
.tour h3 + br {
  display: none;
}

/* ---------- Hotels ---------- */
.tour .row > .col-md-7 {
  padding-top: 22px;
  padding-bottom: 22px;
}

/* ---------- Gifts ---------- */
.tour .gift-title {
  position: relative;
  display: inline-block;
  margin: 13px auto 9px !important;
  padding: 0 !important;
  background: transparent !important;
  color: #292b2d !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-sizing: border-box;
  font-size: 14px !important;
  font-weight: 600 !important;
}

.tour .gift-title::before,
.tour .gift-title::after {
  display: none !important;
}

.tour .gift-title p {
  margin: 4px 0 0 !important;
  padding: 0;
  color: #999c9e !important;
  font-size: 10px !important;
}

/* ---------- Footer ---------- */
.tour > .row:last-of-type > div {
  background: #dbe4e4 !important;
}

.tour > .row:last-of-type p {
  margin: 0 !important;
  color: #6f7b7f !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 990px) {
  .tour .picmark {
    width: 50%;
    padding: 2%;
  }

  .tour p {
    font-size: 14px !important;
    line-height: 1.8 !important;
  }

  .tour .hero-intro {
    padding: 56px 22px 46px !important;
  }

  .tour .notetitle {
    font-size: 33px !important;
  }

  .tour .region-band {
    margin: 34px 0 24px !important;
    padding: 0 16px !important;
  }

  .tour .region-label {
    padding: 13px 0 12px 50px !important;
  }

  .tour .region-label::before {
    width: 34px !important;
  }

  .tour .region-label-title {
    font-size: 24px !important;
  }

  .tour h2 {
    font-size: 23px !important;
  }

  .tour .hero-video-box {
    height: 285px !important;
  }

  .tour .hero-text h1 {
    font-size: 28px !important;
  }

  .tour .pic-full img {
    min-height: 230px !important;
  }

   .tour .foodbox {
        width: 33.333%;
    }
    .tour .viewbox {
        width: 33.333%;
    }
}

@media (max-width: 640px) {
  .tour .hero-intro {
    margin-bottom: 20px !important;
    padding: 46px 18px 38px !important;
  }

  .tour .hero-intro::before {
    top: 14px !important;
    letter-spacing: .28em !important;
  }

  .tour .notetitle {
    font-size: 29px !important;
    letter-spacing: .015em !important;
  }

  .tour .hero-intro p {
    padding: 0 !important;
    font-size: 13px !important;
    line-height: 1.85 !important;
  }

  .tour .region-band {
    margin: 28px 0 20px !important;
    padding: 0 12px !important;
  }

  .tour .region-label {
    padding-left: 44px !important;
  }

  .tour .region-label::before {
    width: 30px !important;
  }

  .tour .region-label-title {
    font-size: 21px !important;
  }

  .tour .big-title {
    font-size: 9px !important;
  }

  .tour h1 {
    font-size: 9px !important;
  }

  .tour h2 {
    font-size: 21px !important;
  }

  .tour .hero-video-box {
    height: 215px !important;
  }

  .tour .hero-text::before {
    font-size: 7px !important;
  }

  .tour .hero-text h1 {
    font-size: 22px !important;
  }

}


/* ---------- Section headings mobile ---------- */
@media (max-width: 767px) {
  .tour h6 {
    margin-bottom: 12px;
    font-size: 10px;
    letter-spacing: 4px;
  }

  .tour h6 span::before,
  .tour h6 span::after {
    width: 22px;
  }

  .tour h3 {
    margin-bottom: 12px;
    font-size: 23px;
    line-height: 1.6;
    letter-spacing: 1px;
  }

  .tour h3 span {
    display: block;
    width: fit-content;
    margin: 0 auto 2px;
  }

  .tour h7 {
    max-width: 92%;
    font-size: 14px;
    line-height: 1.8;
    letter-spacing: .5px;
  }
     .tour .foodbox {
        width: 50%;
        padding: 0 3px 6px;
    }

    .tour .foodbox img {
        aspect-ratio: 1 / 1;
    }
     .tour .viewbox {
        width: 50%;
        padding: 0 3px 6px;
    }

    .tour .viewbox img {
        aspect-ratio: 1 / 1;
    }
}
