/* img */
.logo img,
.slogn img,
.tupbg img,
.ublbt img,
.ubcbox div img,
.hott img,
.sg2tx div img,
.htl img,
.s6tl div img,
.slognm img,
.boda img,
.bdbo div img,
.ubrbt img,
.slox img,
.sptx img,
.sptx2 img,
.sptx3 img {
  display: block;
  width: 100%;
}
/* head */
.webbox {
  width: 100%;
  position: relative;
  overflow: hidden;
}
.ublbt {
  position: absolute;
  left: 50%;
  width: 21%;
  margin-left: -41%;
  bottom: 33%;
}
.ubrbt {
  position: absolute;
  left: 50%;
  width: 21%;
  margin-left: 19%;
  bottom: 33%;
}
.ublbt2 {
  position: relative;

  width: 80%;
}
.ubldb {
  width: 45%;
  margin: 20px 0 0 10%;
}
.ubrdb {
  width: 45%;
  margin: 20px 0 0 30%;
}
.ubrbt2 {
  position: relative;
  width: 80%;
  margin-left: 10%;
}
.ubl {
  width: 100%;
}
.ubr {
  width: 100%;
}
.htl {
  width: 87%;
  margin: 0 auto;
  margin-top: -25%;
}
.jama::after {
  content: "";
  position: absolute;
  width: 3vw;
  height: 3vw;
  background-image: url("../images/jama.png");
  background-size: 100% 100%;
  top: -25%;
  right: -12%;
}
.jama2::after {
  content: "";
  position: absolute;
  width: 3vw;
  height: 3vw;
  background-image: url("../images/jama.png");
  background-size: 100% 100%;
  top: -3%;
  right: -12%;
}
.ubcbox {
  width: 30%;
  position: absolute;
  left: 50%;
  margin-left: -15%;
  bottom: 28%;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.head {
  width: 100%;
  position: relative;
  background: url("../images/bg1.jpg");
  background-size: 100% auto;
  padding-bottom: 61.9%;
  overflow: hidden;
}
.gfbox {
  position: absolute;
  width: 20vw;
  bottom: -3vw;
  left: 50%;
  margin-left: -10vw;
}
.bobo {
  position: absolute;
  width: 100%;
  height: 61.9vw;
  left: 50%;
  margin-left: -50%;
  overflow: hidden;
}
.boboa {
  position: absolute;
  top: -8%;
  width: 74vw;
  left: 50%;
  margin-left: -36vw;
}
.bobob {
  position: absolute;
  width: 64vw;
  left: 50%;
  margin-left: -27vw;
  bottom: -23%;
}
.botx {
  position: absolute;
  width: 44%;
  left: 50%;
  margin-left: -22%;
  top: 5vw;
}
.lefbta {
  position: absolute;
  width: 18vw;
  bottom: 17%;
  left: 50%;
  margin-left: 1vw;
  cursor: pointer;
}
.lefbtb {
  cursor: pointer;
  position: absolute;
  width: 18vw;
  bottom: 63%;
  left: 50%;
  margin-left: 23vw;
}
.rigbta {
  position: absolute;
  width: 18vw;
  bottom: 10%;
  left: 50%;
  margin-left: -23vw;
}
.rigbtb {
  position: absolute;
  width: 18vw;
  bottom: 15%;
  left: 50%;
  margin-left: -45vw;
}
.logo {
  width: 12vw;
  position: absolute;
  top: 5%;
  right: 3%;
}
.slogn {
  position: absolute;
  width: 58%;
  top: 2%;
  left: 50%;
  margin-left: -26%;
}
.slognm {
  position: relative;
  width: 90%;
  margin: 20% auto 0 auto;
}
.tupbg {
  position: absolute;
  width: 100%;
  bottom: 0;
}
.tupbg2 {
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.rigbtb {
  position: absolute;
  width: 18vw;
  /* bottom: 10%; */
  left: 50%;
  margin-left: -45vw;
}
.btui {
  position: absolute;
  width: 40%;
  right: -15%;
  margin-top: -4%;
}
.btba {
  position: absolute;
  overflow: hidden;
  border-radius: 10px;
}
.btba:before {
  content: "";
  position: absolute;

  width: 1000px;
  height: 100px; /**白光的宽度，可根据实际调整**/
  background-image: linear-gradient(
    to bottom,
    transparent,
    rgba(253, 255, 132, 0.6),
    transparent
  );
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: searchLights 3s ease-in 1s infinite;
  -o-animation: searchLights 3s ease-in 1s infinite;
  animation: searchLights 1.5s ease-in 1s infinite; /**第一个数字参数控制扫光速度，数字越大越慢**/
}

.adxb > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: all 1s ease;
  opacity: 0;
  transform: translateY(-30px); /* 從下方開始 */
}

.adxb > div.active {
  opacity: 1;
  transform: translateY(0);
  z-index: 2;
}
.adxa > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: all 1s ease;
  opacity: 0;
  transform: translateY(30px); /* 從下方開始 */
}

.adxa > div.active {
  opacity: 1;
  transform: translateY(0);
  z-index: 1;
}
.s2bu {
  position: absolute;
  width: 15%;
}
.s6bu {
  position: absolute;
  right: 0;
  width: 15%;
  top: 20%;
}
/* content */
.content {
  position: relative;
  width: 100%;
}
.stg1 {
  position: relative;
  width: 100%;
  /* background-color: #ffffff; */
  /* background: url("../images/bg2_02.jpg"); */
  background-size: 100% 100%;
}
.stg2,
.stg3,
.stg4,
.stg5 {
  position: relative;
  width: 100%;
  background-color: #ffefc8;
}
.stg6 {
  position: relative;
  width: 100%;
  background-color: #e8d6ce;
}
.stg7,
.stg77 {
  position: relative;
  width: 100%;
  background-color: #e8d6ce;
}
.stg8 {
  position: relative;
  width: 100%;
  background-color: #e8d6ce;
}
.stg9 {
  position: relative;
  width: 100%;
  background-color: #f7e29f;
}
.line {
  width: 80%;
  margin: 0 auto;
  height: 1px;
  background-color: #000;
}
.gnbx {
  position: relative;
  width: 100%;
  display: flex;
  /* align-items: center; */
  align-content: center;
  justify-content: center;
  color: #6d5b4f;
  font-size: 14px;
  font-weight: 600;
}
.gna {
  width: 15%;
}
.gnb {
  width: 15%;
}
.gnc {
  width: 38%;
}
.gnd {
  width: 37%;
}
.slox {
  width: 18%;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -26%;
}
.gn1 {
  text-align: center;
  padding: 15px;
  color: #fff;
  font-size: 1vw;
  font-weight: 600;
  background-color: #ff9733;
}
.gn2 {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 13vw;
  background-color: #fff;
  flex-wrap: wrap;
  padding-left: 10px;
  font-size: 18px;
}
.gn22 {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  /* justify-content: center; */
  height: 12vw;
  background-color: #fff;
  flex-wrap: wrap;
  padding-left: 10px;
}
.gn22::before {
  content: "";
  position: absolute;
  width: 95%;
  height: 1px;
  top: 0;
  left: 0;
  background-color: #ea711a;
}
.gn222 {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  font-size: 18px;
  height: 12vw;
  background-color: #fff;
  flex-wrap: wrap;
  padding-left: 10px;
}
.gn222::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  top: 0;
  left: 40px;
  background-color: #ea711a;
}
.bt:hover {
  transform: scale(0.98);
  transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
  filter: brightness(1.1);
  cursor: pointer;
}
.gn3 {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 25vw;
  background-color: #fbebd8;
  flex-wrap: wrap;
  padding-left: 10px;
}
.mtxt {
  /* position: absolute;
  top: 0.5vw; */
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  flex-wrap: wrap;
}
.mtxt2 {
  /* position: absolute;
  top: 1vw; */
  display: flex;
  align-items: center;
  align-content: center;
  /* justify-content: center; */
  flex-wrap: wrap;
  padding: 0 0 0 0vw;
}
.mtxt3 {
  /* position: absolute;
  top: 1vw; */
  display: flex;
  align-items: center;
  align-content: center;
  /* justify-content: center; */
  flex-wrap: wrap;
  padding: 0 1vw 0 1vw;
}
.gn33 {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 15vw;
  background-color: #fbebd8;
  flex-wrap: wrap;
  padding-left: 10px;
  font-size: 18px;
}
.gn333 {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 15vw;
  background-color: #fbebd8;
  flex-wrap: wrap;
  font-size: 18px;
}
.gn333::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  top: 0;
  left: 40px;
  background-color: #ea711a;
}
.gn3333 {
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  height: 15vw;
  background-color: #fbebd8;
  flex-wrap: wrap;
  padding-left: 10px;
}
.gn3333::before {
  content: "";
  position: absolute;
  width: 95%;
  height: 1px;
  top: 0;
  left: 0;
  background-color: #ea711a;
}
.gh20 {
  height: 20vw;
}
.gh15 {
  height: 15vw;
}
.ghs {
  height: 17vw;
}
.gh10 {
  height: 10vw;
}
.ult {
  font-size: 20px;
}
.fodbx {
  width: 80%;
  border-radius: 50%;
  overflow: hidden;
}
.tdtt {
  width: 100%;
  padding: 10px;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  color: #604c3f;
}
.tdtl {
  color: #e86000;
  font-size: 1.8vw;
  font-weight: 900;
  padding-top: 15px;
  align-items: flex-start;
  align-content: flex-start;
}
.fodz {
  width: 100%;
  transition: all 0.9s ease 0s;
  -moz-transition: all 0.9s ease 0s;
  -webkit-transition: all 0.9s ease 0s;
}
.sgtbg {
  position: relative;
  width: 84%;
  margin: 0 auto;
}
.stgt {
  position: absolute;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}
.contmx {
  width: 84%;
  margin: 0 auto;
  position: relative;
  background-color: #fff;
}
.mtlimg {
  width: 33%;
  margin: 0 auto;
}
.szon {
  padding-top: 5vw;
  width: 100%;
  height: 18vw;
  overflow: hidden;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.szimg {
  width: 100%;
  transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.szimg:hover,
.fodz:hover {
  transform: scale(1.1);
  transition: all 0.9s ease 0s;
  -moz-transition: all 0.9s ease 0s;
  -webkit-transition: all 0.9s ease 0s;
}
.hover {
  transform: scale(1.2);
  transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -webkit-transition: all 0.3s ease 0s;
}
.sg2tx {
  width: 52%;
  padding-top: 5vw;
  margin: 0 auto 5vw auto;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.sg2t1 {
  width: 30%;
}
.sg2t2 {
  width: 70%;
  margin-left: 10%;
}
.wbgx {
  width: 70%;
  margin: 0 40% 0 17%;
  padding: 3.2vw 3.2vw 3.2vw 0;
  background: url("../images/wbg.png") no-repeat;
  background-size: 100% 100%;
  display: flex;
  /* align-items: center; */
  align-content: center;
  justify-content: center;
}
.wbgxx {
  width: 70%;
  margin: 0 40% 0 17%;
  padding: 2vw 3.2vw 2vw 0;
  background: url("../images/wbg.png") no-repeat;
  background-size: 100% 100%;
  display: flex;
  /* align-items: center; */
  align-content: center;
  justify-content: center;
}
.wlbx {
  width: 20%;
  text-align: center;
  line-height: 5vw;
  font-weight: 900;
  font-size: 3vw;
  padding: 2vw 2vw 2vw 2vw;
  letter-spacing: 10px;
  color: #604c3f;
}
.wlbx2 {
  width: 20%;
  text-align: center;
  line-height: 5vw;
  font-weight: 900;
  font-size: 3vw;
  padding: 0 2vw 0vw 2vw;
  letter-spacing: 10px;
}
.wrbx {
  width: 80%;
  border-left: 2px solid #bf3b56;
  padding: 0 0vw 0 2vw;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.wrbx2 {
  width: 80%;
  border-left: 1px solid #306a00;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.pttt {
  padding-top: 4vw;
}
.pt,
.pf {
  padding-top: 2vw;
}
.ptt {
  padding-top: 5vw;
}
.ptff {
  padding-bottom: 10vw;
}
.ptf {
  padding-bottom: 4vw;
}
.stg1cont {
  width: 90%;
  margin: 0 auto;
}
.stg1min {
  width: 100%;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  margin-top: -2%;
}
.stg1min > div {
  margin: 0 0%;
}
.stgtl {
  position: absolute;
  width: 17%;
  top: 25%;
  left: 50%;
  margin-left: -8.25%;
}
.imtl {
  width: 19vw;
  padding: 5vw 0 3vw 0;
  margin: 0 auto;
}
.hotl {
  cursor: pointer;
  width: 16.6667%;
}
.hott {
  width: 50.5%;
  margin: 0 auto;
}
.hot {
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.hta {
  width: 100%;
  background: url("../images/hot1.png") no-repeat;
  background-size: 100% auto;
}
.hotl:hover .hta {
  width: 100%; /* 將元素的寬度設置為100% */
  background: url("../images/hot1a.png") no-repeat; /* 設置背景圖像，並且不重複顯示 */
  background-size: 100% auto; /* 將背景圖像的寬度設置為100%，高度自適應 */
}
.hotl:hover .htb {
  width: 100%; /* 將元素的寬度設置為100% */
  background: url("../images/hot2a.png") no-repeat; /* 設置背景圖像，並且不重複顯示 */
  background-size: 100% auto; /* 將背景圖像的寬度設置為100%，高度自適應 */
}
.hotl:hover .htc {
  width: 100%; /* 將元素的寬度設置為100% */
  background: url("../images/hot3a.png") no-repeat; /* 設置背景圖像，並且不重複顯示 */
  background-size: 100% auto; /* 將背景圖像的寬度設置為100%，高度自適應 */
}
.hotl:hover .htd {
  width: 100%; /* 將元素的寬度設置為100% */
  background: url("../images/hot4a.png") no-repeat; /* 設置背景圖像，並且不重複顯示 */
  background-size: 100% auto; /* 將背景圖像的寬度設置為100%，高度自適應 */
}
.hotl:hover .hte {
  width: 100%; /* 將元素的寬度設置為100% */
  background: url("../images/hot5a.png") no-repeat; /* 設置背景圖像，並且不重複顯示 */
  background-size: 100% auto; /* 將背景圖像的寬度設置為100%，高度自適應 */
}
.hotl:hover .htf {
  width: 100%; /* 將元素的寬度設置為100% */
  background: url("../images/hot6a.png") no-repeat; /* 設置背景圖像，並且不重複顯示 */
  background-size: 100% auto; /* 將背景圖像的寬度設置為100%，高度自適應 */
}
.hotl:hover .htg {
  width: 100%; /* 將元素的寬度設置為100% */
  background: url("../images/hot33a.png") no-repeat; /* 設置背景圖像，並且不重複顯示 */
  background-size: 100% auto; /* 將背景圖像的寬度設置為100%，高度自適應 */
}
.hfa {
  width: 73.5%;
  background: url("../images/hotn1.png") no-repeat;
  background-size: 100% auto;
  margin: -10px auto 0 auto;
}
.htb {
  width: 100%;
  background: url("../images/hot2.png") no-repeat;
  background-size: 100% auto;
}
.hfb {
  width: 73.5%;
  background: url("../images/hotn2.png") no-repeat;
  background-size: 100% auto;
  margin: -10px auto 0 auto;
}
.htc {
  width: 100%;
  background: url("../images/hot3.png") no-repeat;
  background-size: 100% auto;
}
.hfc {
  width: 73.5%;
  background: url("../images/hotn3.png") no-repeat;
  background-size: 100% auto;
  margin: -10px auto 0 auto;
}
.htd {
  width: 100%;
  background: url("../images/hot4.png") no-repeat;
  background-size: 100% auto;
}
.hfd {
  width: 73.5%;
  background: url("../images/hotn4.png") no-repeat;
  background-size: 100% auto;
  margin: -10px auto 0 auto;
}
.hte {
  width: 100%;
  background: url("../images/hot5.png") no-repeat;
  background-size: 100% auto;
}
.hfe {
  width: 73.5%;
  background: url("../images/hotn5.png") no-repeat;
  background-size: 100% auto;
  margin: -10px auto 0 auto;
}
.htf {
  width: 100%;
  background: url("../images/hot6.png") no-repeat;
  background-size: 100% auto;
}
.htg {
  width: 100%;
  background: url("../images/hot33.png") no-repeat;
  background-size: 100% auto;
}
.hff {
  width: 73.5%;
  background: url("../images/hotn6.png") no-repeat;
  background-size: 100% auto;
  margin: -10px auto 0 auto;
}
.hfg {
  width: 73.5%;
  background: url("../images/hotn7.png") no-repeat;
  background-size: 100% auto;
  margin: -10px auto 0 auto;
}
.alivebt {
  background-position: 0 bottom;
}
.alivebt2 {
  background-position: 0 bottom;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  transform: scale(1.4);
  filter: brightness(1.1) drop-shadow(0 0 10px rgba(0, 0, 0, 0.5));
}
.rigbox {
  position: fixed;
  bottom: 25%;
  right: -20%;
  z-index: 3;
}
.rigtbx,
.rigfbx {
  width: 100px;
  margin: 1vw auto;
}
.umk {
  margin-top: 8vw;
}
.pcimg {
  display: block;
}
.mbimg {
  display: none;
}
.contal {
  position: relative;
  padding: 3vw 0 1vw 0;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.conimg {
  width: 95%;
  margin: 0 auto;
}
.rtnbx {
  width: 80%;
  margin: 0 auto;
  display: flex;
  /* align-items: center; */
  align-content: center;
  justify-content: center;
}
.rtnl {
  width: 40%;
  margin: 0 5%;
}
.rtnr {
  width: 40%;
  margin: 0 5%;
}
.rtntl {
  font-size: 2.5rem;
  letter-spacing: 3px;
  font-weight: 900;
  color: #bc3b33;
}
.rtnmtx {
  font-size: 20px;
  font-weight: 600;
  margin-top: 1vw;
}
.bbu {
  position: absolute;
  left: 2%;
  top: 10%;
  width: 10%;
}
.bbu2 {
  width: 10%;
  position: absolute;
  right: 5%;
  bottom: 0;
}
/* topbt */
.dtt {
  position: fixed;
  width: 100%;
  max-width: 2000px;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 11;
}
.topbt {
  position: absolute;
  width: 70px;
  padding-bottom: 69px;
  display: none;
  cursor: pointer;
  background-attachment: scroll;
  background-image: url(../images/top.png);
  background-repeat: no-repeat, no-repeat;
  background-position: 50% 50%, 50% 50%;
  background-size: 100% auto, 100% auto;
  bottom: 10px;
  right: 28px;
  z-index: 11;
  transition: all 0.3s;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
}
.stg,
.stga {
  display: none;
}
.fdline {
  position: relative;
  border-bottom: 2px solid #ea5514;
  display: inline-block;
}
/* mbcont */
#hotl {
  padding: 20px 0;
}
.hotlx {
  width: 80%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  flex-wrap: wrap;
}
.hotlx2 {
  width: 90%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.hotlc {
  width: 80%;
  margin: 0 auto;
  display: flex;
  /* align-items: center; */
  align-content: center;
  justify-content: center;
}
.mtc1 {
  color: #d5a592;
}
.mtc2 {
  color: #d67d64;
}
.mtc3 {
  color: #bc3b33;
}
.hottl {
  width: 20%;
  text-align: center;
}
.hotlname {
  width: 90%;
  margin: 0 auto;
  color: #d5a592;
  font-size: 20px;
  font-weight: 900;
}
.hotlname2 {
  width: 90%;
  margin: 0 auto;
  color: #bf3a29;
  font-size: 20px;
  font-weight: 900;
}
.hotlname3 {
  width: 90%;
  margin: 0 auto;
  color: #942c2a;
  font-size: 20px;
  font-weight: 900;
}
.hotlmtx {
  position: relative;
  width: 90%;
  font-size: 32px;
  letter-spacing: 3px;
  font-weight: 900;
  margin: 0 auto;
}
.hotlmtx2 {
  width: 90%;
  font-size: 21px;
  letter-spacing: 5px;
  font-weight: 900;
  margin: 20px auto 0 auto;
}
.fodxx {
  width: 100%;
  text-align: center;
  color: #604c3f;
  font-size: 16px;
  font-weight: 600;
  padding: 5px;
}
.fodxxl {
  width: 100%;
  text-align: left;
  color: #604c3f;
  font-size: 16px;
  font-weight: 600;
  padding: 5px;
}
.hottx {
  color: #7c330f;
  width: 75%;
  font-size: 20px;
  letter-spacing: 3px;
  font-weight: 550;
  margin: 0 auto;
  text-align: center;
}
.hotrl {
  text-align: center;
  width: 78%;
  margin-left: 2%;
}
.hotll {
  text-align: center;
  width: 100%;
  margin-left: 2%;
}
.acctl {
  cursor: pointer;
  display: block;
  padding: 15px 15px 15px 15px;
  text-align: center;
  background-color: #ff9733;
  color: #ffffff;
  font-size: 21px;
  letter-spacing: 3px;
  font-weight: 700;
  border-bottom: 1px solid #ccc;
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.acctl2 {
  cursor: pointer;
  display: block;
  padding: 15px 15px 15px 15px;
  text-align: center;
  background-color: #ffb26a;
  color: #ffffff;
  font-size: 21px;
  letter-spacing: 3px;
  font-weight: 700;
  border-bottom: 1px solid #ccc;
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.fodtl {
  width: 100%;
}
.rigbox {
  opacity: 0;
}
.showw {
  opacity: 1;
  right: 1%;
  transition: all 0.8s;
}
/* stg1 */
.orgbx {
  position: relative;
  width: 100%;
  padding: 20px;
  color: #604c3f;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.orga {
  width: 6%;
}
.orgb {
  width: 20%;
}
.orgc {
  width: 18%;
}
.orgd {
  width: 18%;
}
.orge {
  width: 19%;
}
.orgf {
  width: 19%;
}
.orgtl {
  position: relative;
  width: 50px;
  margin: 0 auto;
  font-size: 17px;
  color: #ea5514;
  font-weight: 700;
  text-align: center;
  /* padding: 10px 0; */
}
.orgtla {
  position: relative;
  width: 50px;
  margin: 0 auto;
  font-size: 17px;
  color: #d5a592;
  font-weight: 700;
  text-align: center;
  /* padding: 10px 0; */
}
.orgtlb {
  position: relative;
  width: 50px;
  margin: 0 auto;
  font-size: 17px;
  color: #d67d64;
  font-weight: 700;
  text-align: center;
  /* padding: 10px 0; */
}

.orgimg {
  width: 65%;
}
.orgha {
  height: 4vw;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.orghb {
  height: 3vw;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}

.orghd {
  position: relative;
  height: 12vw;
  display: flex;
  /* align-items: center; */
  padding-top: 20px;
  /* align-content: center; */
  justify-content: center;
}
.orghe {
  position: relative;
  height: 4vw;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.sptxs {
  width: 70%;
  padding: 10px;
  position: absolute;
  color: #c10d23;
  font-size: 16px;
  text-align: center;
  bottom: 0px;
  left: 50%;
  margin-left: -35%;
}
.sptx {
  width: 73%;
  padding: 10px;
  position: absolute;
  color: #c10d23;
  font-size: 16px;
  text-align: center;
  bottom: 0px;
  left: 50%;
  margin-left: -36.5%;
}
.sptx2 {
  width: 81%;
  padding: 10px;
  position: absolute;
  color: #c10d23;
  font-size: 16px;
  text-align: center;
  bottom: 5px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  left: 50%;
  margin-left: -40.5%;
}
.sptx3 {
  width: 91.5%;
  padding: 10px;
  position: absolute;
  color: #c10d23;
  font-size: 16px;
  text-align: center;
  bottom: 5px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  left: 50%;
  margin-left: -45.75%;
}
.sptxm {
  width: 100%;
  position: absolute;
  color: #c10d23;
  font-size: 17px;
  text-align: center;
}

.orgmtl {
  position: relative;
  width: 80%;
  margin: 0 auto;
  text-align: center;
  color: #000;
  font-size: 35px;
  font-weight: 900;
}
.orgmtla {
  position: relative;
  width: 80%;
  margin: 0 auto;
  text-align: center;
  color: #d5a592;
  font-size: 35px;
  font-weight: 900;
}
.orgmtlb {
  position: relative;
  width: 80%;
  margin: 0 auto;
  text-align: center;
  color: #d67d64;
  font-size: 35px;
  font-weight: 900;
}
.orgma {
  position: relative;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}
.orgmb {
  position: relative;
  font-size: 20px;
  font-weight: 600;
}
.orgmc {
  text-align: center;
  font-size: 15px;
  font-weight: 900;
}
.orghc {
  height: 3vw;
  font-size: 17px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.linet::before {
  content: "";
  position: absolute;
  width: 180%;
  height: 1px;
  top: 0px;
  left: 7px;
  background-color: #ea5514;
}
.linett::before {
  content: "";
  position: absolute;
  width: 86%;
  height: 1px;
  top: 0px;
  left: 0px;
  background-color: #ea5514;
  left: 50%;
  margin-left: -43%;
}
.lineta::before {
  content: "";
  position: absolute;
  width: 180%;
  height: 1px;
  top: 0px;
  left: 7px;
  background-color: #d5a592;
}
.linetta::before {
  content: "";
  position: absolute;
  width: 90%;
  height: 1px;
  top: 0px;
  left: 0px;
  background-color: #d5a592;
  left: 50%;
  margin-left: -43%;
}
.linetb::before {
  content: "";
  position: absolute;
  width: 185%;
  height: 1px;
  top: 0px;
  left: 7px;
  background-color: #d67d64;
}
.linettb::before {
  content: "";
  position: absolute;
  width: 90%;
  height: 1px;
  top: 0px;
  left: 0px;
  background-color: #d67d64;
  left: 50%;
  margin-left: -43%;
}
.linetts::before {
  content: "";
  position: absolute;
  width: 86%;
  height: 1px;
  top: 0px;
  left: 0px;
  background-color: #619bae;
  left: 50%;
  margin-left: -43%;
}
.mmcc {
  padding: 20px 20px 0 20px;
  flex-wrap: wrap;
}
.gima::after {
  content: "";
  position: absolute;
  width: 50px;
  height: 50px;
  background: url("../images/gmm.png");
  right: -25px;
  top: -20px;
}
.gcbx {
  position: relative;
  width: 100%;
  padding: 20px 40px;
  color: #604c3f;
  display: flex;
  /* align-items: center; */
  align-content: center;
  justify-content: center;
}
.gctl {
  text-align: center;
  font-size: 18px;
  font-weight: 900;
  color: #bc3b33;
  padding-bottom: 15px;
  border-bottom: 1px solid #bc3b33;
}
.gcttll {
  padding-top: 25px;
  text-align: center;
  font-size: 35px;
  font-weight: 900;
  color: #bc3b33;
}
.gcmcx {
  text-align: center;
  padding-top: 35px;
  font-size: 1.1vw;
  font-weight: 600;
}
.gcmcxx {
  text-align: center;
  padding-top: 35px;
  font-size: 1vw;
  font-weight: 600;
}
.gcmcxxx {
  padding-top: 35px;

  font-size: 15px;
  font-weight: 900;
}

.gca {
  width: 20%;
}
.gcb {
  width: 20%;
}
.gcc {
  width: 20%;
}
.gcd {
  width: 20%;
}
.gce {
  width: 20%;
}
.s6tl {
  width: 60%;
  margin: 0 auto;
  position: relative;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
}
.s6t1 {
}
.s6t2 {
  margin-left: 10%;
}
/*  */
.nop::after {
  position: absolute;
  content: "";
  left: 0;
  display: block;
  top: -10px;
  z-index: 100;
  width: 150px;
  height: 60px;
  background: url("../images/newn.png");
  background-size: cover;
}
@media only screen and (max-width: 1750px) {
  .orghd {
    height: 14vw;
  }
}
@media only screen and (max-width: 1600px) {
  .orgmtl,
  .orgmtla,
  .orgmtlb,
  .gcttll {
    font-size: 2vw;
  }
  .orghd {
    height: 12vw;
  }
}
@media only screen and (max-width: 1600px) {
  .orghd {
    height: 15vw;
  }
}
@media only screen and (max-width: 1550px) {
}
@media only screen and (max-width: 1440px) {
  /* .gn3 {
    height: 21vw;
  } */
}

@media only screen and (max-width: 1300px) {
  .orgma {
    font-size: 17px;
  }
  .orghd {
    height: 17vw;
  }
}
@media only screen and (max-width: 1100px) {
  .orghd {
    height: 22vw;
  }
}
@media only screen and (max-width: 1200px) {
  .gn33,
  .gn333,
  .gn3333 {
    height: 23vw;
  }
  .gn3 {
    height: 36rem;
  }
  .gn2,
  .gn222,
  .gn22 {
    height: 27rem;
  }
  .gnbx {
    font-size: 13px;
    font-weight: 600;
  }
  .ult {
    font-size: 12px;
  }

  .szon {
    padding-top: 5vw;
    width: 100%;
    height: 20vw;
    overflow: hidden;
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
  }
  .sgtbg {
    width: 95%;
  }
  .contmx {
    width: 95%;
    margin: 0 auto;
    position: relative;
    background-color: #fff;
  }
}
@media only screen and (max-width: 800px) {
  .slox {
    width: 21%;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -29%;
  }
  .jama::after {
    content: "";
    position: absolute;
    width: 10vw;
    height: 10vw;
    background-image: url("../images/jama.png");
    background-size: 100% 100%;
    top: -25%;
    right: 5%;
  }
  .sptxm {
    width: 100%;
    position: relative;
    color: #c10d23;
    font-size: 3.5vw;
    text-align: left;
    bottom: 0;
    margin-left: 25px;
  }
  .bodb {
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
  }
  .tbb {
    margin: 3%;
  }
  .boda {
    width: 60%;
    margin: 5% auto;
  }
  .bdbo {
    position: relative;
  }
  .slogn {
    position: relative;
    top: 0;
    left: 0;
    width: 90%;
    margin: 15% auto 0 auto;
    padding-bottom: 2%;
  }
  .sg2t2,
  .s6t2 {
    width: 90%;
    margin: 5% auto;
  }
  .sg2t1,
  .s6t1 {
    width: 50%;
    margin: 0 auto;
  }
  .sg2tx,
  .s6tl {
    width: 90%;
    padding-top: 10%;
    margin: 0 auto 10% auto;
    display: block;
  }
  .line {
    display: none;
  }
  .rtnmtx {
    margin-bottom: 15px;
    font-size: 14px;
    font-weight: 600;
  }
  .rtntl {
    font-size: 1.7rem;
    letter-spacing: 3px;
    font-weight: 900;
    color: #2d6300;
    margin-bottom: 15px;
  }
  .rtnl,
  .rtnr {
    width: 100%;
    margin: 0;
  }
  .rtnbx {
    width: 90%;
    display: block;
  }
  .wrbx2 {
    width: 100%;
    border-left: 0px solid #306a00;
  }
  .imtl {
    width: 50vw;
    padding: 5vw 0 3vw 0;
    margin: 0 auto;
  }
  .rigtbx,
  .rigfbx {
    width: 80px;
    margin: 1vw auto;
  }
  .mtlimg {
    width: 90%;
    margin: 0 auto;
  }
  .mmb {
    width: 95%;
    margin: 0 auto;
    padding: 20px;
    background-color: #fff;
  }
  .mncont {
    width: 95%;
    margin: 10px auto 0 auto;
  }
  .pcimg {
    display: none;
  }
  .mbimg {
    display: block;
  }
  .mbtlmg {
    width: 94.5%;
    margin: 0 auto;
  }
  .szimg {
    margin-top: 18px;
    width: 100%;
    transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
  }
  .szon {
    padding-top: 5vw;
    width: 100%;
    height: 23vw;
    overflow: hidden;
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
  }

  .wrbx {
    width: 100%;
    border-left: 0 solid #ea5514;
    padding: 0;
  }
  .wlbx {
    width: 100%;
    text-align: center;
    font-weight: 900;
    font-size: 7vw;
    padding: 2vw 2vw 4vw 2vw;
    letter-spacing: 10px;
  }
  .wlbx2 {
    width: 100%;
    text-align: center;
    font-weight: 900;
    font-size: 7vw;
    padding: 2vw 2vw 4vw 2vw;
    letter-spacing: 10px;
  }
  .wbgx {
    width: 95%;
    margin: 8vw auto 0 auto;
    padding: 20px 10px;
    background: none;
    background-size: 100% auto;
    background-color: #fff;
    display: block;
    border-radius: 2em;
  }
  .wbgxx {
    width: 95%;
    margin: 8vw auto 0 auto;
    padding: 20px 10px;
    background: none;
    background-size: 100% auto;
    background-color: #fff;
    display: block;
    border-radius: 2em;
  }

  .stga {
    width: 100%;
    display: block;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    background-color: #f2ebdb;
  }

  .sgabt {
    width: 48%;
    margin: 3% 1%;
  }
  .stg {
    width: 100%;
    display: block;
    background: url("../images/stgbg.jpg");
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
  }
  .stgbt {
    width: 40%;
    margin: 3% 5%;
  }
  .stg1 {
    display: none;
  }
  .botx {
    position: absolute;
    width: 74%;
    left: 50%;
    margin-left: -37%;
    top: 25vw;
  }
  .rigbta,
  .rigbtb,
  .lefbta,
  .lefbtb {
    display: none;
  }
  .logo {
    width: 30vw;
    position: absolute;
    top: 5%;
    right: 7%;
  }
  .boboa {
    position: absolute;
    top: 7%;
    width: 150vw;
    left: 50%;
    margin-left: -73vw;
  }
  .bobob {
    position: absolute;
    width: 142vw;
    left: 50%;
    margin-left: -60vw;
    bottom: -22%;
  }
  .bobo {
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden;
    background-color: #d97d64;
  }
  .gfbox {
    position: absolute;
    width: 41vw;
    bottom: -8vw;
    left: 50%;
    margin-left: -20vw;
  }
  .head {
    width: 100%;
    position: relative;
    background: url("../images/mbbg.jpg");
    background-size: 100% auto;
    padding-bottom: 0%;
    overflow: hidden;
  }
}
@media only screen and (max-width: 560px) {
  .hotlname {
    width: 80%;
  }
  .hotlname2 {
    width: 80%;
  }
  .hottx {
    width: 80%;
  }
  .hottx {
    letter-spacing: 0px;
  }
  .hottl {
    width: 20%;
    text-align: center;
  }
  .hotlc {
    width: 86%;
  }
  .hotlx {
    width: 86%;
  }
  .topbt {
    position: absolute;
    opacity: 0.5;
    width: 45px;
    padding-bottom: 69px;
    display: none;
    cursor: pointer;
    background-attachment: scroll;
    background-image: url(../images/top.png);
    background-repeat: no-repeat, no-repeat;
    background-position: 50% 50%, 50% 50%;
    background-size: 100% auto, 100% auto;
    bottom: 10px;
    right: 20px;
    z-index: 11;
    transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
  }
  .pcimg {
    display: none;
  }
  .mbimg {
    display: block;
  }
}

/* anima */
.anima2 {
  animation: shake-vertical 3s ease;

  animation-iteration-count: infinite;
}
.anima1 {
  animation: pulsate-bck 1s ease;

  animation-iteration-count: infinite;
}
@-webkit-keyframes pulsate-bck {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes pulsate-bck {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes shake-vertical {
  0%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
  }
  80% {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
  }
  90% {
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }
}
