@charset "utf-8";
/* CSS Document */
#incon2 {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
  padding: 5px 10px 10px 5px;
  animation: st 0.9s;
}
.img {
  width: 60%;
  margin: 2em auto;
  border: 4px double #b99e65;
  padding: 5px;
  background-color: #302820;
  text-align: center;
}
#incon2 .con2 {
  position: relative;
  width: 96%;
  margin: 0 auto;
  /**/
  font-size: 1rem;
  line-height: 2rem;
  font-weight: 400;
  color: #c8c4bb;
}
.con2 .tbx {
  position: relative;
  padding: 0.3rem 0 0.8rem;
}
.con2 .rtbx {
  position: relative;
  padding: 0.3rem 0 0.8rem;
  color: #f8916b;
}
.con2 .tbxa {
  position: relative;
  padding: 0 0 0.8rem;
}
.con2 .tbx span {
  display: inline-block;
}
.play2 {
  position: absolute;
  width: 4vw; /*80*/
  padding-bottom: 4vw;
  display: block;
  cursor: pointer;
  background-attachment: scroll;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-image: url(../images/play2.png);
  background-size: 100% auto;
  top: 23vw;
  right: 17vw;
  z-index: 1;
}
/**/
.gic {
  padding-left: 3.05rem;
}
.gic img {
  position: absolute;
  width: auto;
  height: 110%;
  display: inline-block;
  margin-right: 1.5%;
  overflow: hidden;
  left: -0.2rem;
  top: 41.5%;
  transform: translateY(-50%);
}
.ytbox {
  width: 60%;
  padding: 5px;
  border: 4px double #4b5f8b;
  margin: 1% auto;
}
.msbox {
  width: 100%;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  overflow: hidden;
}
.poshowx {
  width: 100%;
  position: relative;
  overflow: hidden;
}
.poshow {
  width: 70%;
  margin: 0 auto;
  background: url("../img/pobg.png");
  background-size: 100% 100%;
}
.posbtx {
  position: absolute;
}
.posp {
  width: 100%;
  margin: 0 auto;
}
.posbtx {
  position: absolute;
  right: 13%;
  top: 14%;
  width: 11%;
}
/* 預設全部隱藏 popup 區塊 */
.posp > div {
  display: none;
}

/* 顯示用 */
/* .posp .show {
  display: block;
} */
.posbt1,
.posbt2,
.posbt3,
.posbt4 {
  position: relative;
  display: inline-block;
  cursor: pointer;
  width: 100px;
  height: 100px;
  margin-right: 10px;
}
/* 按鈕替圖效果 */
.posbt1.on::before,
.posbt2.on::before,
.posbt3.on::before,
.posbt4.on::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 2;
}

.posbt1.on::before {
  background-image: url("../img/pos1a.png");
}
.posbt2.on::before {
  background-image: url("../img/pos2a.png");
}
.posbt3.on::before {
  background-image: url("../img/pos3a.png");
}
.posbt4.on::before {
  background-image: url("../img/pos4a.png");
}

iframe {
  width: 100%;
  display: block;
}
.f1 {
  position: relative;

  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  color: #ffffff;
  padding: 0.4rem 0 0.25rem;
  background: url("../img/tlbg.png");
  background-size: 100% 100%;
  margin: 1rem 1rem 1rem 0;
  width: 295px;
  height: 48px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.f1 span {
  margin-top: 10px;
}
.f1 span.kr {
  margin: 0 -0.5rem;
}
.f1a {
  position: relative;
  display: block;
  font-size: 1.8rem;
  line-height: 2.2rem;
  font-weight: 700;
  color: #e5c6a2;
  padding: 1rem 0 0.5rem;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.f1a img {
  position: relative;
  width: 2.5rem;
  top: 0.35rem;
}
.f1a > span {
  position: relative;
  font-size: 1.5rem;
  height: 2.2rem;
  font-weight: bold;
  color: #f31a1a;
  display: inline-block;
  /*font-style: oblique;
	text-decoration: underline;*/
}
.f1b {
  position: relative;
  display: block;
  font-size: 2rem;
  line-height: 2.5rem;
  font-weight: 500;
  color: #123c4d;
  margin: 0.3rem 0 1rem;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.f2 {
  position: relative;
  width: 300px;
  height: 45px;
  display: block;
  font-size: 1.3rem;
  font-weight: 500;
  color: #ffffff;
  padding: 0.35rem 0 0;
  margin-bottom: 0.5rem;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  background: url("../img/stl.png") no-repeat;
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  align-content: center;
  padding-top: 12px;
  padding-left: 20px;
}
.f2.ht {
  padding: 1rem 0 0.6rem;
}
.f2 span {
  position: relative;
  left: -0.6rem;
}
.f3 {
  position: relative;
  display: block;
  font-size: 1.2rem;
  line-height: 2rem;
  font-weight: 500;
  color: #ebb983;
  padding: 1rem 0 0;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.f3a {
  position: relative;
  display: block;
  font-size: 1.4rem;
  line-height: 2rem;
  font-weight: 500;
  color: #302820;
  padding: 0.2rem 0 0;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.f3 span {
  display: inline-block;
}
.f4 {
  position: relative;
  font-size: 1.1rem;
  line-height: 2.5rem;
  font-weight: 400;
  color: #ffa315;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.f5 {
  position: relative;
  font-size: 1.6rem;
  font-weight: 400;
  display: inline-block;
  color: #123c4d; /*ffce52*/
  padding: 0.4rem 1.25rem 0.3rem;
  border: 1px solid #123c4d;
  margin: 0.8rem 0.5rem 0.8rem 0;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.f5 span {
}

.fh {
  position: relative;
  display: inline-block;
  padding: 0.35rem 0;
}

.con2 ul.ft1,
.con2 ul.ft2 {
  position: relative;
  padding: 0.3rem 0 1rem 22px;
}
.con2 ul.ft1 li {
  position: relative;
  list-style-type: decimal;
}
.con2 ul.ft2 li {
  position: relative;
  list-style-type: disc;
}

.tdn {
  position: relative;
  color: #f63f06;
  line-height: 1.6rem;
  text-align: center;
  padding: 0.8rem 0;
}
.dyibk {
  display: inline-block;
}
.dyibk2 {
  display: inline-block;
}
.blue {
  color: #09f;
  font-weight: 400;
}
.blue2 {
  color: #29a5b3;
  font-weight: 400;
}
.og {
  color: #ffd200;
  font-weight: 400;
}
.og2 {
  color: #ff4200;
  font-weight: 400;
}
.green {
  color: #59840c;
  font-weight: 400;
}
.red {
  color: #c30;
  font-weight: 400;
}
.red2 {
  color: #ff4366;
  font-weight: 400;
}
.tc {
  text-align: center;
}
.tc2 {
  text-align: center;
}
.tpw0 {
  width: 99%;
}
.tpw1 {
  width: 70%;
  margin-left: 0;
}
.tpw2 {
  width: 75%;
}
.tw {
  position: relative;
  width: calc(100% + 22px);
  margin: 0.8rem 0 0.8rem -22px;
}
.ph,
.ph3,
.ph5 {
  position: relative;
  display: inline-block;
  /*border: 1px solid #ceb884;
  	border-radius:5px;*/
  padding: 6px 6px; /* 6px*/
  margin: 0.5rem auto;
}
.ph5 {
  border: 1px solid #ceb884;
}

.ph > p,
.ph3 > p {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
  top: 0;
  left: 0;
}
.ph > p::before,
.ph > p::after,
.ph3 > p::before,
.ph3 > p::after {
  position: absolute;
  display: block;
  content: "";
}
.ple {
  margin-left: 100px;
}
.ph > p::before,
.ph3 > p::before {
  width: calc(100% - 2.6vw);
  height: calc(100% - 1px);
  border-top: 1px solid #b99e65;
  border-bottom: 1px solid #b99e65;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.ph > p::after,
.ph3 > p::after {
  width: calc(100% - 1px);
  height: calc(100% - 2.65vw);
  border-left: 1px solid #b99e65;
  border-right: 1px solid #b99e65;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.ph img,
.ph3 img,
.ph5 img {
  position: relative;
  max-width: 100%;
  display: block;
  /*border-radius:5px;*/
  border: 2px solid #b99e65;
  overflow: hidden;
}
.ph2 {
  position: relative;
  display: inline-block;
  margin: 0.5rem auto;
}
.ph2 img {
  position: relative;
  max-width: 100%;
  display: block;
}
.vd {
  position: relative;
  display: inline-block;
  width: 700px;
  border: 1px solid #ceb884;
  padding: 3px;
  margin: 0.5rem auto 1.2rem;
}
.vd > div {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  border: 2px solid #ceb884;
  overflow: hidden;
}
.vd > div video,
.vd > div iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0%;
  left: 0%;
}
.vd2 {
  position: relative;
  display: block;
  width: 100%;
  border: 1px solid #ceb884;
  padding: 3px;
  margin: 0.5rem auto 1rem;
}
.vd2 > div {
  position: relative;
  width: 100%;
  padding-bottom: 28%;
  border: 2px solid #ceb884;
  overflow: hidden;
}
.vd2 > div video,
.vd2 > div iframe {
  position: absolute;
  width: 100%;
  top: -2%;
  left: 50%;
  transform: translateX(-50%);
}

/**/
.tbx1,
.tbx2 {
  position: relative;
}
.tbx1 table,
.tbx2 table {
  position: relative;
  width: 100%;
  border-spacing: 1px;
  margin: 1rem auto 1.5rem;
}
.tbx1 table td,
.tbx2 table td {
  word-break: break-all;
  padding: 0.5rem 0.5rem;
  text-align: center;
}
.tbx1 table tr:nth-child(odd) td,
.tbx2 table tr:nth-child(odd) td {
  background-color: rgba(38, 67, 88, 0.35);
}
.tbx1 table tr:nth-child(even) td,
.tbx2 table tr:nth-child(even) td {
  background-color: rgba(68, 100, 126, 0.25);
}
.tbx1 table tr:first-child td {
  padding: 0.8rem 0.5rem;
  background-color: rgb(32 105 132 / 80%);
  text-align: center;
  font-weight: 400;
  color: #fbf7e8;
}
.tbx1 table tr:first-child td span {
  display: inline-block;
}

.tbx1 .ftd1 {
  font-weight: 400;
  color: #fbf7e8;
}
.tbx1 .td1 span {
  line-height: 1.6rem;
  display: inline-block;
  border-bottom: 1px dotted #aca89f; /*solid*/
  padding: 0 0.3rem 0.3rem;
  margin-bottom: 0.5rem;
}
.tbx1 .td2 span {
  display: inline-block;
}
.tbx1 table tr td.td3 {
  padding: 0.8rem 0.5rem;
  background-color: rgba(39, 37, 49, 0.8);
  text-align: center;
  color: #fbf7e8;
}
.tbx1.jk table tr td:nth-child(1) {
  width: 16%;
}
.tbx1.jk table tr td:nth-child(2),
.tbx1.jk table tr td:nth-child(3) {
  width: 10%;
}
.tbx1.jk table tr td:nth-child(4),
.tbx1.jk table tr td:nth-child(5) {
  width: 32%;
  text-align: left;
}
.tbx1.jk table tr:first-child td {
  text-align: center;
}

.pp1 img,
.pp2 img {
  position: relative;
  width: 20px;
  display: inline-block;
  margin: 0 5px;
  overflow: hidden;
  top: 4px;
}
.pe0 {
  position: absolute;
  width: 32.9%; /*658*/
  padding-bottom: 50%; /*859*/
  display: block;
  pointer-events: none;
  background-attachment: scroll;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  background-size: 100% auto;
  background-image: url(../images/pe0.png);
  right: -35%;
  bottom: 0;
  z-index: 1;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.pea {
  position: absolute;
  width: 37.45%; /*749*/
  padding-bottom: 50%; /*1000*/
  display: block;
  pointer-events: none;
  background-attachment: scroll;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  background-size: 100% auto;
  bottom: 0;
  z-index: 1;
  /**/
  transition: all 0.5s;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
}
.s1 {
  position: relative;
  width: 100%;
  height: 15px;
  display: block;
  background-attachment: scroll;
  background-repeat: repeat-x;
  background-position: 50% 50%;
  background-image: url(../images/dodo.png);
  margin: 0 auto;
}
.swboxa {
  width: 70%;
  margin: 0 auto;
}
.swboxb {
  width: 70%;
  margin: 0 auto;
}
.adimg2 {
  width: 80%;
  margin: 0 auto;
}
.swiper-slide {
  transition: transform 0.3s ease;
  transform: scale(0.8);
  opacity: 0.8;
}

.swiper-slide-active {
  transition: transform 0.3s ease;
  transform: scale(1); /* 中間那張放大 */
  opacity: 1;
}

.poxbox {
  position: relative;
  width: 100%;
}
.whp,
.bkp {
  display: none;
  width: 70%;
  margin: 0 auto;
}

.poxbtx {
  position: absolute;
  top: 20%;
  left: 50%;
  margin-left: -32%;
}
.poxbt1 {
  width: 140px;
  position: relative;
}
.poxbt1.on::before {
  position: absolute;
  content: "";
  background: url("../img/sz_nav1_on.png");
  background-size: 100% 100%;
  width: 100%;
  padding-bottom: 90%;
}
.poxbt2.on::before {
  position: absolute;
  content: "";
  background: url("../img/sz_nav2_on.png");
  background-size: 100% 100%;
  width: 100%;
  padding-bottom: 90%;
}
.poxbt2 {
  position: relative;
  width: 120px;
}
.whp,
.bkp,
.whpmb,
.bkpmb {
  display: none;
}
.whp.on,
.bkp.on,
.whpmb.on,
.bkpmb.on {
  display: block;
}
.e4img {
  width: 80%;
  margin: 0 auto;
}
.e4img2 {
  width: 60%;
  margin: 0 auto;
}
.ub7 {
  width: 35%;
}
@media only screen and (max-width: 1600px) {
  /**/
  /*.uph1{height:78%;}*/

  .ph2bx .b3x div img {
    width: 95%;
  }
}
@media only screen and (max-width: 1400px) {
  /**/
  /*.uph1{height:76%;}*/
  .livebx {
    width: 36px; /**/
    padding-bottom: 20px;
    top: 3px;
  }
  .gic {
    padding-left: 2.45rem;
  }
  .f1 {
    font-size: 1.6rem;
    line-height: 2.2rem;
    padding: 0.35rem 0 0.15rem;
    margin: 1rem 0 0.4rem;
  }
  .f1a {
    font-size: 1.6rem;
    line-height: 2.2rem;
  }
  .f1a > span {
    font-size: 1.4rem;
  }
  .f2 {
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
  .f3,
  .f3a {
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
  .f4 {
    font-size: 1.2rem;
    line-height: 2.2rem;
  }
  .f5 {
    font-size: 1.5rem;
  }

  .btmk.kt2 a {
    width: 170px;
  }
  .btmk a {
    font-size: 1.55rem;
  }
  .btmk a > div span {
    font-size: 1.4rem;
  }

  /**/
  .ph2a div {
    font-size: 2rem;
    font-weight: 700;
  }
  .ph2bx .spt > div {
    font-size: 1.35rem;
    line-height: 1.6rem;
  }
  .ph2bx ul li div img {
    width: 80%; /*96*/
  }
  /**/
  .acbtbx > a {
    width: 300px;
  }

  .acbtk_1 {
    width: 300px;
  }
  .acbtk_2 a {
    width: 300px;
    margin: 5px 10px;
  }
  .acbtk_3 a {
    width: 200px;
    margin: 5px 40px;
  }
}

@media only screen and (max-width: 1250px) {
  /**/
  #incon2 .con2 {
    font-size: 1rem;
    line-height: 1.8rem;
  }
  .ph {
    max-width: 90%;
  }
  .ttkbx img {
    max-height: 45px;
  }
  /**/
  .wtc {
    width: 100%;
  }
}
@media only screen and (max-width: 1000px) {
  /**/
  /*.uph1{height:73%;}*/
  .livebx {
    /*width:32px;
	padding-bottom:18px;*/
    top: 3px;
    left: 2px;
  }
  #incon2 .con2 {
    font-size: 1rem;
    line-height: 1.6rem;
  }
  .gic {
    padding-left: 2.38rem;
  }
  .f1 {
    font-size: 1.5rem;
    line-height: 2rem;
    padding: 0.3rem 0 0.1rem;
    margin: 1rem 0 0.4rem;
  }
  .f1a {
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .f1a > span {
    font-size: 1.2rem;
  }
  .f2 {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .f3,
  .f3a {
    font-size: 1.25rem;
    line-height: 1.8rem;
  }
  .f4 {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .f5 {
    font-size: 1.35rem;
    padding: 0.3rem 1.25rem 0.2rem;
    margin: 0.5rem 0.3rem 0.5rem 0;
  }
  /**/
  .btm {
    width: 55%; /*600 1320*/
    padding-bottom: 5.5%; /*60*/
  }
  .btm1 {
    width: 36.66%; /*400 1320*/
    padding-bottom: 5.5%; /*60*/
  }
  .btmk a {
    font-size: 1.45rem;
  }
  .btmk a > div span {
    font-size: 1.3rem;
  }
  .bti a {
    width: 30%; /*230*/
    padding-bottom: 7.826%; /*60*/
    margin: 0 3.5%;
  }
  .bti1 a {
    width: 45.65%; /*350 17.1428*/
    padding-bottom: 7.826%; /*60*/
  }
  .bti1 span {
    overflow: hidden;
    margin-bottom: 2.1%;
  }
  .ttkbx {
    padding: 1rem 0 0.3rem;
  }
  .ttkbx img {
    max-height: 35px;
  }

  /**/
  .shp {
    width: 100%;
  }
  .ph2a div {
    font-size: 1.8rem;
  }
  /**/
  .acbtbx {
    padding: 1rem 0;
  }
  .acbtbx > a {
    width: 250px;
  }
  /**/
  .acbtk_1 {
    width: 200px;
  }
  .acbtk_2 a {
    width: 200px;
    margin: 5px 10px;
  }
  .acbtk_3 {
    padding: 0 0;
  }
  .acbtk_3 a {
    width: 133px;
    margin: 5px 30px;
  }
  .kc::before,
  .kc::after {
    width: calc(50% - 124px);
  }
  .listen {
    width: 250px;
  }
}
@media only screen and (max-width: 800px) {
  /**/
  #incon2 .con2 {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .f1 {
    font-size: 1.4rem;
    line-height: 2rem;
  }
  .f1a {
    font-size: 1.4rem;
    line-height: 2rem;
  }
  .f1a > span {
    font-size: 1.2rem;
  }
  .f2 {
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
  .f3,
  .f3a {
    font-size: 1.15rem;
    line-height: 1.6rem;
  }
  .f4 {
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
  .f5 {
    font-size: 1.2rem;
  }

  .vd {
    width: 90%;
  }
}
/**/
@media only screen and (max-width: 780px) {
  .swboxb {
    width: 100%;
    margin: 0 auto;
  }
  .posbt1,
  .posbt2,
  .posbt3,
  .posbt4 {
    width: 90px;
    height: 90px;
  }

  .img {
    width: 95%;
    margin: 2em auto;
    border: 4px double #b99e65;
    padding: 5px;
    background-color: #302820;
    text-align: center;
  }
  .posbtx {
    right: 15%;
  }
  .tbx1 table,
  .tbx2 table {
    margin: 0 auto;
  }
  .ub7 {
    width: 100%;
  }
  .e4img,
  .e4img {
    width: 100%;
    margin: 0 auto;
  }
  .poxbt2 {
    position: relative;
    width: 90px;
  }
  .poxbt1 {
    width: 100px;
    position: relative;
  }
  .poxbtx {
    position: absolute;
    top: 20%;
    left: 50%;
    margin-left: -52%;
  }
  .poshow {
    width: 150%;
    margin-left: -25%;
    background: url("../img/pobg.png");
    background-size: 100% 100%;
  }
  /**/
  .livebx {
    width: 34px;
    padding-bottom: 19px;
    top: 3px;
    left: 2px;
  }
  #incon2 {
    position: relative;
    height: auto;
    padding: 5px 2px 10px;
  }
  #incon2 .con2 {
    font-size: 1rem;
    line-height: 2rem;
  }
  .play2 {
    width: 13.25vw; /*80*/
    padding-bottom: 13.25vw;
    top: 24.65vw;
    right: 67vw;
  }

  .f1 {
    font-size: 1.6rem;
    line-height: 2.2rem;
    font-weight: 400;
    padding: 0.35rem 0 0.15rem;
    margin: 1rem 0 0.4rem;
  }
  .f1a {
    font-size: 1.6rem;
    line-height: 2.2rem;
    font-weight: 500;
  }
  .f1a img {
    width: 2.2rem;
  }

  .f1 span {
    font-weight: 500;
  }
  .f2 {
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
  .f3,
  .f3a {
    font-size: 1.3rem;
    line-height: 1.8rem;
  }
  .f4 {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .f5 {
    font-size: 1.6rem;
  }
  .tc2 {
    text-align: left;
  }
  .tpw0 {
    width: 100%;
  }
  .tpw1 {
    width: 100%;
  }
  .tpw2 {
    width: 100%;
  }
  .ph {
    padding: 4px;
  }
  .ph::before {
    background-size: 3.46vw auto; /*27*/
  }
  .ph > p::before {
    width: calc(100% - 6.86vw);
  }
  .ph > p::after {
    height: calc(100% - 6.86vw);
  }
  .ph img {
    border: 2px solid #b99e65;
  }

  .ph3 {
    padding: 4px;
  }
  .ph3::before {
    background-size: 3.46vw auto; /*27*/
  }
  .ph3 > p::before {
    width: calc(100% - 6.86vw);
  }
  .ph3 > p::after {
    height: calc(100% - 6.86vw);
  }
  .ph3 img {
    border: 2px solid #b99e65;
  }

  .vd {
    padding: 2px;
  }
  .vd2 > div {
    padding-bottom: 43%;
  }
  .vd2 > div video,
  .vd2 > div iframe {
    width: 145%;
    top: 0%;
  }
  .pe0 {
    display: none;
  }
  .pea {
    display: none;
  }
  /**/
  .btm {
    width: 85%; /*600 1320*/
    padding-bottom: 8.5%; /*60*/
  }
  .btm1 {
    width: 56.66%; /*400 1320*/
    padding-bottom: 8.5%; /*60*/
  }
  .bossbx > div:nth-child(1) {
    float: none;
    width: 100%;
  }
  .bossbx > div:nth-child(2) {
    float: none;
    width: 100%;
    text-align: left;
  }
  /**/
  .adj > div:nth-child(1) {
    float: none;
    width: 100%;
  }
  .adj > div:nth-child(2) {
    float: none;
    width: 100%;
  }
  .pem {
    display: block;
  }

  /**/
  .ph2a div {
    font-size: 2.2rem;
  }
  /**/
  .up4 img.up4_a {
    display: none;
  }
  .up4 .up4_b {
    display: block;
  }
  .up4 .u4_tbx {
    position: relative;
    width: 80%; /*620*/
    padding-bottom: 23.225%; /*180*/
    margin: 0 auto;
  }
  .u4_t1 {
    left: 0;
    top: 0;
  }
  .u4_t2 {
    left: 0;
    top: 0;
  }
  .u4_t3 {
    left: 0;
    top: 0;
  }
  .u4_t4 {
    left: 0;
    top: 0;
  }
  .u4_t5 {
    left: 0;
    top: 0;
  }
  .u4_t6 {
    left: 0;
    top: 0;
  }
  .up4 .u4ph {
    position: relative;
    padding: 2px;
  }
  .u4ph2 {
    padding: 2px;
  }
  .ph16 {
    position: relative;
    width: 78%; /*610*/
    padding-bottom: 29.4%; /*230*/
    right: 0;
    top: 0;
    margin: 0 auto;
  }
  .u4_1 {
    top: 0;
    left: 0;
  }
  .u4_1 img {
    width: auto; /*650*/
  }
  .u4_2 {
    top: 0;
    left: 0;
  }
  .u4_2 img {
    width: auto; /*650*/
  }
  .u4_3 {
    top: 0;
    left: 0;
  }
  .u4_3 img {
    width: auto; /*650*/
  }
  .u4_4 {
    top: 0;
    left: 0;
  }
  .u4_4 img {
    width: auto; /*600*/
  }
  .u4_5 {
    top: 0;
    right: 0;
  }
  .u4_5 img {
    width: auto; /*600*/
  }
  /**/
  .ph_a_1_1 {
    position: absolute;
    width: 75%; /*330 36.2*/
    display: block;
    top: 5px;
    right: 5px;
    z-index: 1;
  }

  /**/
  .acbtbx > a {
    width: 46%;
  }

  /**/
  .tbx1.jk table tr td:nth-child(1) {
    width: 22%;
  }
  .tbx1.jk table tr td:nth-child(2),
  .tbx1.jk table tr td:nth-child(3) {
    width: 10%;
  }
  .tbx1.jk table tr td:nth-child(4),
  .tbx1.jk table tr td:nth-child(5) {
    width: 29%;
  }
  /**/
  .acbtk_1 {
    width: 250px;
  }
  .acbtk_2 a {
    width: 250px;
    margin: 5px 10px;
  }
  .acbtk_3 {
    padding: 10px 0 15px;
  }
  .acbtk_3 a {
    width: 167px; /*167px*/
    margin: 5px 10px; /*2*/
  }

  .kc::before,
  .kc::after {
    width: calc(50% - 179px);
  }
  .listen {
    width: 360px;
  }
}
@media only screen and (max-width: 650px) {
  /**/
  .btm {
    width: 90%; /*600 1320*/
    padding-bottom: 9%; /*60*/
  }
  .btm1 {
    width: 60%; /*400 1320*/
    padding-bottom: 9%; /*60*/
  }
  .btmk.kt1 a {
    width: calc(97% / 2);
  }
  .btmk.kt2 a {
    width: calc(97% / 3);
  }
  .btmk a {
    font-size: 1.35rem;
    height: 45px;
  }
  .btmk a.on,
  .btmk a:hover {
    top: 0;
  }
  .btmk a > div {
    width: calc(100% - 8px);
    top: 49%;
  }
  .btmk a > div span {
    font-size: 1.2rem;
    margin: 0 0 0 0;
  }
  .bti1 span {
    overflow: hidden;
    margin-bottom: 1.5%;
  }
  /**/
  .shp {
    width: 100%;
  }
  .ph2bx ul li {
    display: block;
  }
  .ph2bx ul li div {
    float: none;
    width: 95%;
    margin: 0.5rem auto;
    padding: 0.15rem 0;
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
  .ph2bx ul li div img {
    width: auto;
  }
}
@media only screen and (max-width: 606px) {
  /**/
  .acbtbx {
    padding: 1rem 0;
  }
  .acbtbx > a {
    width: 70%;
    max-width: 310px;
    margin: 1% 0;
  }
}
@media only screen and (max-width: 560px) {
  /**/
  .dyibk2 {
    display: block;
  }
  .ph {
    max-width: 98%;
  }
  .vd {
    width: 98%;
  }
  .ttkbx {
    text-align: left;
  }
  .ttkbx img {
    max-height: 57px;
  }
  .ttkbx img:nth-child(1) {
    width: 74.948%;
  }
  .ttkbx img:nth-child(2) {
    width: 100%;
  }
  .ttkbx img:nth-child(3) {
    width: 81.93%;
  }
  /**/
  .ph16 {
    position: relative;
    width: 95%; /*610*/
    padding-bottom: 35.819%; /*230*/
  }
  .listen {
    margin: 10px auto;
  }
}
@media only screen and (max-width: 470px) {
  /**/
  .con2 .tbx {
    padding: 0.2rem 0 0.6rem;
  }
  .con2 .tbxa {
    padding: 0 0 0.6rem;
  }
  .f1 {
    font-size: 1.6rem; /*1.5*/
    line-height: 2rem;
    padding: 0.3rem 0 0.1rem;
    margin: 1rem 0 0.4rem;
  }
  .f2 {
    font-size: 1.3rem;
    line-height: 2rem;
  }
  .f3,
  .f3a {
    font-size: 1.2rem;
    line-height: 1.6rem;
  }
  .f4 {
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
  .f5 {
    font-size: 1.4rem;
  }
  /**/
  .btm {
    width: 96%; /*600 1320*/
    padding-bottom: 9.6%; /*60*/
  }
  .btmk.kt2 a {
    width: calc(97% / 2);
  }
  .bti a {
    width: 45%; /*230*/
    padding-bottom: 11.7391%; /*60*/
    margin: 0 1%;
  }
  .bti1 a {
    width: 68.47%; /*350 17.1428*/
    padding-bottom: 11.7391%; /*60*/
  }
  .bti1 span {
    margin-bottom: 2.1%;
  }
  /**/
  .ph2a div {
    font-size: 1.6rem;
  }

  /**/
  .w_m_1 {
    min-width: 40px;
  }
  .tbx1 table,
  .tbx2 table {
    width: 102%;
    left: -1%;
  }
  .tbx1 table tr:first-child td {
    padding: 0.8rem 0.3rem;
  }
  .tbx1 table td,
  .tbx2 table td {
    padding: 0.5rem 0.3rem;
  }
  /**/
  .acbtbx > a {
    width: 85%;
  }

  .acbtk_3 a {
    width: 45%; /*167px*/
    margin: 5px 2%; /*2*/
  }

  .kc::before,
  .kc::after {
    width: 6%;
  }
  .listen {
    width: 88%;
    margin: 10px auto;
  }
}

@media only screen and (max-width: 380px) {
  /**/
  .bti1 span {
    margin-bottom: 0%;
  }
  .acbtk_1 {
    width: 250px;
  }
}
@media only screen and (max-width: 360px) {
  /**/
}
@media only screen and (max-width: 340px) {
  /**/
  #incon2 .con2 {
    font-size: 1.2rem;
    line-height: 1.8rem;
  }
  .f5 {
    font-size: 1.3rem;
  }
  /**/
  .btmk a {
    font-size: 1.25rem;
    margin: 0 -1px;
  }
  .btmk a > div span {
    font-size: 1.2rem;
  }
}
/* 手機時只顯示 .whpmb, .bkpmb */
@media (max-width: 780px) {
  .whp,
  .bkp {
    display: none !important;
  }
}

/* PC 時只顯示 .whp, .bkp */
@media (min-width: 780px) {
  .whpmb,
  .bkpmb {
    display: none !important;
  }
}