@charset "UTF-8";
:root {
  --color1: #2e509c;
  --font-size-L: 60px;
  --font-size-M: 40px;
  --font-size-S: 28px;
  --font-size-XS: 26px;
}
@media screen and (max-width: 450px) {
  :root {
    --font-size-L: 30px;
    --font-size-M: 24px;
    --font-size-S: 20px;
    --font-size-XS: 16px;
  }
}

/**--  tabs  --**/
.tabs .tabs-head li {
  background-image: url(../images/bg1.jpg);
}
.tabs .tabs-head li.active {
  background-image: url(../images/bg3.jpg);
}
.tabs .tabs-head li:hover {
  background-image: url(../images/bg3.jpg);
}
/**--  kv  --**/
.kv_pc {
  position: relative;
  width: 100%;
}

.kv_pc img {
  width: 100%;
}

.topbox {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.kv_item {
  position: absolute;
}

.kv_item-title {
  width: 55%;
  top: 8.5%;
  left: 22%;
}

.kv_item-sale {
  width: 19%;
  top: 77%;
  left: 57%;
}

.kv_m img {
  width: 100%;
}

.showByDate {
  /*display: block !important;*/
}

/**--  menu --**/
.menustyle2 {
  border: unset;
  background: url(../images/bg2.jpg);
  border-radius: 20px;
}
@media screen and (max-width: 991px) {
  .menustyle2 {
    border-radius: unset;
  }
}
.menustyle2 .nav-link:focus,
.menustyle2 .nav-link:hover {
  background: url(../images/bg1.jpg);
  color: #fff;
}
.menustyle2 .active {
  background: url(../images/bg1.jpg) !important;
  color: #fff !important;
}
.menustyle2 li {
  border-bottom: 0.5px solid var(--color1);
}
.menustyle2 a {
  color: var(--color1);
  font-family: "Noto Serif TC", serif;
  font-weight: 600;
}
.menustyle2 .menutitle a,
.menustyle2 .menutitle a:hover {
  color: #fff;
  background: url(../images/bg1.jpg);
}
/**--  共用  --**/
html,
body {
  background-image: url(../images/bg.jpg);
}

.container {
  background-image: url(../images/bg.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% auto;
  background-attachment: fixed;
  overflow: unset;
  max-width: unset;
  padding: 0;
}
@media screen and (max-width: 991px) {
  .container {
    background-image: unset;
  }
}

.btt {
  font-family: "Noto Serif TC", serif;
  font-size: var(--font-size-L);
}
.btt b {
  background-image: url(../images/bttDeco1.png), url(../images/bttDeco2.png), url(../images/bg1.jpg);
  background-repeat: no-repeat, no-repeat, repeat;
  background-position: left 0.1em bottom, right 0.1em bottom -0.1em, left;
  background-size: 0.6em auto, 0.5em auto, auto;
  border-radius: 0 1em 0 0;
  padding: 0.3em 1.4em;
  color: #fff;
}
.btt small {
  background-image: url(../images/bg3.jpg);
  padding: 0.3em 1em;
  color: #fff;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0.4em auto 0;
  position: relative;
  z-index: 1;
  -webkit-transform: skewY(-2deg);
          transform: skewY(-2deg);
}

.stt {
  font-family: "Noto Serif TC", serif;
  font-size: var(--font-size-M);
  background-image: url(../images/bg1.jpg);
  padding: 0.3em 1em;
  color: #fff;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 1em auto 0;
  position: relative;
  border-radius: 999em;
}
.stt:before, .stt:after {
  content: "";
  display: block;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 100% auto;
  position: absolute;
  bottom: 0;
}
.stt:before {
  background-image: url(../images/sttDeco.png);
  width: 2em;
  padding-bottom: 2em;
  left: 0;
  -webkit-transform: translate(-50%, 4%);
          transform: translate(-50%, 4%);
}
.stt:after {
  background-image: url(../images/sttDeco2.png);
  width: 1em;
  padding-bottom: 1em;
  right: 0;
  -webkit-transform: translate(50%, 4%);
          transform: translate(50%, 4%);
}

.blk_pre {
  background-image: url(../images/bg.jpg);
  padding: 20px;
}
@media screen and (max-width: 991px) {
  .blk_pre {
    padding: 4vw;
  }
}

.blk_bas {
  margin-top: 80px;
}
@media screen and (max-width: 450px) {
  .blk_bas {
    margin-top: 40px;
  }
}

.blk_head {
  background: unset;
}
.blk_body:nth-of-type(1) {
  margin-top: 0;
}
.blk_pre .blk_body {
  background: unset;
}
.blk_bas .blk_body {
  background-image: url(../images/bg2.jpg);
  padding-top: 6em;
  margin-top: -6em;
  border-radius: 0 40px 0 40px;
}
.blk_bas .blk_body > *:nth-child(1) {
  margin-top: 30px;
}
@media screen and (max-width: 991px) {
  .blk_bas .blk_body > *:nth-child(1) {
    margin-top: 10px;
  }
}
.blk_bas .blk_body > *:nth-last-child(1) {
  margin-bottom: 30px;
}
@media screen and (max-width: 991px) {
  .blk_bas .blk_body > *:nth-last-child(1) {
    margin-bottom: 10px;
  }
}

.alternate ul:nth-child(even) li:last-child,
.alternate ul:nth-child(odd) li:first-child,
.collect_5x6 .s-row h4,
.collect_5x6 .special,
.hightlight .font h4,
.hightlight_5p .font h4 {
  background-image: url(../images/bg4.jpg);
}

.half ul {
  background-image: url(../images/bg5.jpg);
}

.alternate .font h4,
.rectangle_3p .font h4 {
  color: var(--color1);
}

@media screen and (max-width: 991px) {
  .hightlight_5p ul li:first-child .font h4 {
    color: var(--color1);
  }
}

.banner {
  padding: 0;
  margin-bottom: 0;
}
.banner + .banner {
  margin-top: 0px;
}
@media screen and (max-width: 991px) {
  .banner + .banner {
    margin-top: 0;
  }
}