@charset "utf-8";
/* ===================================================	共用 =================================================== */
html,
body {
  background:
    url(../images/deco.png) top center repeat-y,
    #f9eed9;
  background-size:
    100% auto,
    auto;
}

@media screen and (max-width: 991px) {
  html,
  body {
    background-size: auto;
  }
}

@media screen and (max-width: 991px) {
  .blk_bas .blk_body > * {
    margin: 0vw auto 2vw;
  }
  .block_other {
    margin: 0 auto;
  }
}
@font-face {
  font-family: SweiHalfMoonCJKtc-Black;
  src: url("https://events.eslite.com/font/SweiHalfMoonCJKtc-Black.ttf");
}
big {
  color: #cb530b;
}
.block0 .blk_body {
  background: none;
}
.block0 {
  position: relative;
  background:
    url(../images/bg0_deco.png) top center repeat-y,
    url(../images/bg_1.jpg) center repeat;
}
.block0 .blk_body::before {
  display: none;
}
/* KV */
.title-item {
  position: absolute;
  z-index: 90;
}
.title01 {
  top: calc((230 / 1920) * 100%);
  left: calc((510 / 1920) * 100%);
  width: calc((220 / 1920) * 100%);
  animation: bounceInDown 1.5s;
  animation-iteration-count: 1;
}
.title02 {
  top: calc((336 / 1920) * 100%);
  left: calc((730 / 1920) * 100%);
  width: calc((353 / 1920) * 100%);
  animation: bounceInDown 1.8s;
  animation-iteration-count: 1;
}
.title03 {
  top: calc((500 / 1920) * 100%);
  left: calc((1095 / 1920) * 100%);
  width: calc((160 / 1920) * 100%);
  animation: bounceInDown 1.7s;
  animation-iteration-count: 1;
}
.title04 {
  top: calc((350 / 1920) * 100%);
  left: calc((1240 / 1920) * 100%);
  width: calc((150 / 1920) * 100%);
  animation: bounceInDown 1.9s;
  animation-iteration-count: 1;
}
.title05 {
  top: calc((1398 / 1920) * 100%);
  left: calc((692 / 1920) * 100%);
  width: calc((529 / 1920) * 100%);
  animation: flipInX 2s;
  animation-iteration-count: 1;
}
.title06 {
  top: calc((787 / 1920) * 100%);
  left: calc((1210 / 1920) * 100%);
  width: calc((709 / 1920) * 100%);
}

.bg_dis2_bottom {
  background: url(../images/bg_dis.png) top center no-repeat;
  height: 92px;
}
@media screen and (max-width: 991px) {
  .bg_dis2_bottom {
    background-size: 100%;
    height: 6vw;
  }
}
@media screen and (max-width: 991px) {
  .blk_pre .tips {
    margin: 1vw 1vw;
  }
  .blk_pre .tips a {
    padding: 1vw;
  }
}

/* 下拉式選單 */
.list {
  background: #fff;
}

.inquireBox {
  margin: 20px auto 10px;
}
.inquireBox .inquire,
.inquireBox .inquire_close {
  background: url(../images/bg_2.jpg) center repeat;
}

.inquireBox .list h4 {
  font-size: 24px;
  color: #c84f0b;
  padding: 30px 0px 10px;
  line-height: 1.2;
}
.inquireBox .list p {
  padding: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #393939;
  font-size: 20px;
  line-height: 1.4;
}

.inquireBox .banner {
  padding: 5px 0 30px;
  margin: 0;
}
@media screen and (max-width: 991px) {
  .inquireBox {
    margin: 1.3vw 2vw 0;
  }
  .inquireBox .inquire p,
  .inquireBox .inquire_close p {
    font-size: 3vw;
  }
  .inquireBox .list h4 {
    font-size: 3.4vw;
    padding: 4vw 1vw 1vw;
  }
  .inquireBox .list p {
    font-size: 3.2vw;
    padding: 2vw 0 1vw;
  }
  .inquireBox .banner {
    padding: 1vw 1vw 3vw;
  }
  .inquireBox .inquire,
  .inquireBox .inquire_close {
    padding: 0.2em 1em;
  }
}

/* 版身 */
.blk_bas {
  margin-top: 30px;
}
.blk_body {
  background: url("../images/bg_3.jpg") center repeat;
  position: relative;
  padding: 40px 0 10px;
}
.blk_body::before {
  content: "";
  position: absolute;
  top: -55px;
  width: 1200px;
  height: 55px;
  background: url(../images/bg_before.png) top center no-repeat;
  box-sizing: border-box;
}
.blk_head {
  background: url(../images/btt.png) center no-repeat;
  height: 320px;
  z-index: 1;
  position: relative;
  margin: 6px auto -30px;
}
@media screen and (max-width: 991px) {
  .blk_bas {
    margin-top: 5vw;
  }
  .block0 .blk_body {
    padding: 0.1vw 0 2vw;
  }
  .blk_body {
    padding: 3vw 0 1vw;
  }
  .blk_head {
    background: url(../images/btt_m.png) center no-repeat;
    background-size: 100%;
    height: auto;
    margin: 1vw auto -1vw;
  }
  .blk_body::before {
    top: -29px;
    width: 100%;
    height: 30px;
    background-size: 100% 100%;
  }
}
.btt {
  font-family: SweiHalfMoonCJKtc-Black;
  font-size: 75px;
  height: 200px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
  color: #cb530b;
  letter-spacing: 2px;
}
.btt small {
  font-family: "Noto Sans TC";
  display: block;
  margin-top: 18px;
  font-size: 35px;
  color: #864c26;
  letter-spacing: 2px;
}
.blk_head .more {
  font-family: SweiHalfMoonCJKtc-Black;
  color: #ffffff;
  background: url(../images/bg_2.jpg) center repeat;
  position: absolute;
  left: 75%;
  transform: translateX(-50%);
  font-size: 1.3rem;
  font-weight: 700;
  padding: 7px 14px;
  border-radius: 99em;
  transition: 0.5s;
  top: 190px;
}
.blk_head .more.active,
.blk_head .more:hover {
  background: url(../images/bg_4.jpg) center repeat;
  color: #ffe3af;
}
@media screen and (max-width: 991px) {
  .btt {
    font-size: 11vw;
    height: 34vw;
    padding-top: 4.4vw;
    letter-spacing: 0.4vw;
  }
  .btt small {
    font-size: 5vw;
    margin-top: 2vw;
  }
  .blk_head .more {
    left: 78%;
    top: 26vw;
    font-size: 4vw;
    padding: 1vw 3vw;
  }
}
.quotes li:nth-child(odd) {
  background: #88502ad6;
  border-radius: 15px 0 0 15px;
}

.quotes li:nth-child(even) {
  background: #cb550db8;
  border-radius: 0 15px 15px 0;
}
@media screen and (max-width: 991px) {
  .quotes li:nth-child(odd) {
    background: #88502ad6;
    border-radius: 2vw 0 0 2vw;
  }

  .quotes li:nth-child(even) {
    background: #cb550db8;
    border-radius: 0 2vw 2vw 0;
  }
}
.hightlight .font h4,
.toptitle .font h4 {
  background: url(../images/bg_2.jpg) center repeat;
}
.rectangle_3p .font h4 {
  color: #c84f0b;
}
.quotes .font:after {
  height: 0px;
}
.quotes .font h4:after {
  height: 8px;
}
.hightlight .font p {
  padding: 5px 3.3px 7px;
  font-size: 16.5px;
}
.toptitle li {
  padding: 35px 0 8px;
}
@media screen and (max-width: 991px) {
  .toptitle li {
    padding: 9vw 0 1vw;
  }
  .hightlight .font {
    margin: 0 0 1vw 0;
  }
  .hightlight .font p {
    padding: 1vw;
    font-size: 3.5vw;
  }
}

/* 圓角 */
.hightlight li,
.toptitle li,
.banner img,
.rectangle_3p li {
  border-radius: 15px;
}
.hightlight img {
  border-radius: 15px 15px 0 0;
}
@media screen and (max-width: 991px) {
  .hightlight li,
  .hightlight img,
  .toptitle li,
  .banner img,
  .rectangle_3p li {
    border-radius: 2vw;
  }
  .hightlight img {
    border-radius: 2vw 2vw 0 0;
  }
}
/* 側邊欄 */
.menustyle2 {
  background: url(../images/bg_2.jpg) center repeat;
  border: none;
}
.menustyle2 .nav-link.active,
.menustyle2 .nav-link:hover {
  background: url(../images/bg_4.jpg) center repeat;
  color: #ffe3af;
}
@media screen and (max-width: 991px) {
  .menustyle2 a {
    padding: 1vw 3vw;
  }
}