/* TODO PC 样式 */
.category-wrap .header {
  position: -webkit-sticky; position: sticky; z-index: 10; top: 0; width: 100%; height: 100%;
}

.category-wrap .header > .header-bg { display: block; width: 100%; }

.category-wrap .header > .header-menu {
  position: absolute; top: 0; left: 0; 
  width: 100%; height: 100%; padding: 2.5% 3% 0%;
}

.category-wrap .header .header-menu-item { position: relative; }

.category-wrap .header-menu-item > img { height: 2.604167vw; }

.category-wrap .header-menu-item--before {
  position: absolute; top: 0; left: 0; height: 50%; z-index: 1; opacity: 0;
  -webkit-transform: translate(-45%, -20%); transform: translate(-45%, -20%);
  -webkit-transition: left .4s ease-in-out, opacity .4s ease-in-out;
  transition: left .4s ease-in-out, opacity .4s ease-in-out;
}

.category-wrap .header-menu-item--before > img { width: auto; height: 100%; }

/* TODO 内容样式 */
.category-wrap .category, .category-mobile {
  position: relative; z-index: 1; padding: 2.34375vw 5% 4.166667vw;
  width: 100%; min-height: 100vh; min-height: 100dvh;
}

.category-wrap .category::before, .category-mobile::before {
  content: ""; position: absolute; z-index: -1; top: 0; left: 0;
  width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5);
}

.category-wrap .back-button { top: 10vw; top: 10vw; }

.category-wrap .type {
  border-radius: 15px;
  background-size: 100% auto;
  background-image: url("../images/common/10.png");
}

.category-wrap .type + .type { margin-top: 2.864583vw; }

.category-wrap .type .type-inner { position: relative; }

.category-wrap .type .type-inner img { display: block; }

.category-wrap .type .track { margin-left: auto; margin-right: auto; }

.category-wrap .type .type-inner > img:not(.track), .category-wrap .type .food-coupon {
  position: absolute;
}

.category-wrap .type .type-inner .title {
  width: 18.75vw; top: 5%; left: 4.5%;
}

/* TODO 种类一 */
.category-wrap .type-one { margin-top: -2.604167vw; }

.category-wrap .type-one .type-inner { padding-top: 7.8125vw; }

.category-wrap .type-one .type-inner .track { width: 59.21875vw; }

.category-wrap .type-one .type-inner .desc {
  width: 44.270833vw; top: 2%; right: 2.75%;
}

.category-wrap .type-one .food-coupon-one { top: 27%; left: 13%; }

.category-wrap .type-one .food-coupon-one > img:nth-child(1) { width: 27.8125vw; }

.category-wrap .type-one .food-coupon-one > img:nth-child(2) {
  width: 23.385417vw; margin: 1.041667vw 0px 0px 1.5625vw;
}

.category-wrap .type-one .food-coupon-two { bottom: 1.5%; left: 27.5%; }

.category-wrap .type-one .food-coupon-two > img:nth-child(1) { width: 21.666667vw; }

.category-wrap .type-one .food-coupon-two > img:nth-child(2) {
  width: 23.385417vw; margin: 0px 0px 0px 2.083333vw;
}

/* TODO 种类二 */
.category-wrap .type-two .type-inner .track { width: 48.90625vw; margin-left: 29.5vw; }

.category-wrap .type-two .type-inner .desc {
  width: 44.270833vw; top: 21%; left: 4%;
}

.category-wrap .type-two .food-coupon-one { top: 11.5%; right: 9.5%; }

.category-wrap .type-two .food-coupon-one > img:nth-child(1) { width: 24.53125vw; }

.category-wrap .type-two .food-coupon-one > img:nth-child(2) {
  width: 19.270833vw; margin: 0px 0px 0px 4.166667vw;
}

.category-wrap .type-two .food-coupon-two { bottom: 12%; left: 36%; }

.category-wrap .type-two .food-coupon-two > img:nth-child(1) { width: 28.645833vw; }

.category-wrap .type-two .food-coupon-two > img:nth-child(2) {
  width: 18.489583vw; margin: 1.5625vw 0px 0px 2.083333vw;
}

/* TODO 种类三 */
.category-wrap .type-three .type-inner .track { width: 55.885417vw; margin-left: 14.583333vw; }

.category-wrap .type-three .type-inner .title { top: 3.5%; }

.category-wrap .type-three .type-inner .desc {
  width: 44.270833vw; top: 2.25%; right: 5%;
}

.category-wrap .type-three .food-coupon-one { top: 22.5%; right: 36.5%; }

.category-wrap .type-three .food-coupon-one > img:nth-child(2) { width: 22.552083vw; }

.category-wrap .type-three .food-coupon-one > img:nth-child(1) {
  width: 20.208333vw; margin: 1.5625vw 3.125vw 0px 0px;
}

.category-wrap .type-three .food-coupon-two { top: 45%; left: 9%; }

.category-wrap .type-three .food-coupon-two > img:nth-child(1) { width: 29.010417vw; }

.category-wrap .type-three .food-coupon-two > img:nth-child(2) {
  width: 18.489583vw; margin: 2.864583vw 0px 0px 2.083333vw;
}

.category-wrap .type-three .food-coupon-three { bottom: 15%; right: 8.5%; }

.category-wrap .type-three .food-coupon-three > img:nth-child(1) { width: 28.072917vw; }

.category-wrap .type-three .food-coupon-three > img:nth-child(2) {
  width: 15.416667vw; margin: 1.041667vw 0px 0px 4.166667vw;
}

.category-wrap .type-three .food-coupon-four { bottom: 5%; left: 17%; }

.category-wrap .type-three .food-coupon-four > img:nth-child(1) { width: 28.229167vw; }

.category-wrap .type-three .food-coupon-four > img:nth-child(2) {
  width: 23.072917vw; margin: 1.041667vw 0px 0px 6.25vw;
}

/* TODO 种类四 */
.category-wrap .type-four .type-inner .track { width: 73.854166vw; margin-left: 8.333333vw; }

.category-wrap .type-four .type-inner .title { top: 2%; }

.category-wrap .type-four .desc-one { 
  width: 37.708333vw; top: 3.5%; right: 9%;
}

.category-wrap .type-four .desc-two { 
  width: 40.989583vw; top: 14.35%; left: 9%;
}

.category-wrap .type-four .desc-three { 
  width: 41.041667vw; top: 28.65%; right: 8%;
}

.category-wrap .type-four .desc-four { 
  width: 40.572917vw; top: 40%; left: 10%;
}

.category-wrap .type-four .desc-five {
  width: 41.354167vw; bottom: 3%; right: 7%;
}

.category-wrap .type-four .desc-six {
  width: 38.75vw; bottom: 7.25%; left: 8.2%;
}

.category-mobile-wrap .header {
  position: -webkit-sticky; position: sticky; z-index: 10; top: 0; width: 100%; height: 100%;
}

.category-mobile-wrap .header > .header-bg { display: block; width: 100%; }

#carousel {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%; padding: 7.5% 7.448494% 0px;
}

#carousel .header-menu-item { position: relative; height: 100%; }

#carousel .header-menu-item + .header-menu-item { margin-left: 10vw; }

#carousel .header-menu-item > img { height: 30.434782%; }

#carousel .header-menu-item--before {
  position: absolute; top: 0; left: 0; height: 60%;
  -webkit-transform: translate(-45%, 30%); 
  transform: translate(-45%, 30%);
  opacity: 0; visibility: hidden; 
  -webkit-transition: opacity 0.15s, visibility 0.15s;
  transition: opacity 0.15s, visibility 0.15s;
}

#carousel .header-menu-item.active .header-menu-item--before {
  opacity: 1; visibility: visible;
}

#carousel .header-menu-item--before > img { width: auto; height: 100%; }

.category-mobile { padding: 6.510417vw 3.255208vw; }

.category-mobile .type {
  position: relative;
  border-radius: 15px;
  background-size: 100% auto;
  background-image: url("../images/common/10.png");
}

.category-mobile .type + .type { margin-top: 3.90625vw; }

.category-mobile .type-inner { padding-top: 5.859375vw; }

.category-mobile .type-inner img { display: block; }

.category-mobile .type .title {
  width: 30.360531%; margin: 0px 0px 0px 5.859375vw;
}

/* TODO 种类一 */
.category-mobile .type-one { padding-bottom: 13.020833vw; }

.category-mobile .type-one .desc-one {
  width: 94.876660%; margin: -9% auto 0px;
}

.category-mobile .type-one .desc-two {
  width: 88.235294%; margin: -52% auto 0px;
}

.category-mobile .type-one .food-coupon-one { margin-top: -47.75%; }

.category-mobile .type-one .food-coupon-one > img:nth-child(1) {
  width: 50.474383%; margin-left: 25.616698%;
}

.category-mobile .type-one .food-coupon-one > img:nth-child(2) {
  width: 49.335863%; margin-left: 27.514231%;
}

.category-mobile .type-one .food-coupon-two { margin-top: 3.90625vw; }

.category-mobile .type-one .food-coupon-two > img:nth-child(1) {
  width: 41.560284%; margin-left: 5.341246%;
}

.category-mobile .type-one .food-coupon-two > img:nth-child(2) {
  width: 49.787234%; margin: -16% 0px 0px 35%;
}

/* TODO 种类二 */
.category-mobile .type-two { padding-bottom: 13.020833vw; }

.category-mobile .type-two .desc-one {
  width: 95.697329%; margin: -7.5% auto 0px;
}

.category-mobile .type-two .food-coupon-one { margin-top: -64%; }

.category-mobile .type-two .food-coupon-one > img:nth-child(1) {
  width: 46.099291%; margin-left: 30.496454%;
}

.category-mobile .type-two .food-coupon-one > img:nth-child(2) {
  width: 41.097923%; margin: -1.302083vw 0px 0px 35.460993%;
}

.category-mobile .type-two .food-coupon-two > img:nth-child(1) {
  width: 51.186944%; margin-left: 9.643917%;
}

.category-mobile .type-two .food-coupon-two > img:nth-child(2) {
  width: 41.097923%; margin: -13% 0px 0px 54.154302%;
}

/* TODO 种类三 */
.category-mobile .type-three { padding-bottom: 9.114583vw; }

.category-mobile .type-three .desc-one {
  width: 95.697329%; margin: -8% auto 0px;
}

.category-mobile .type-three .food-coupon-one { margin-top: -83.75%; }

.category-mobile .type-three .food-coupon-one > img:nth-child(1) {
  width: 40.567375%; margin-left: 31.773050%;
}

.category-mobile .type-three .food-coupon-one > img:nth-child(2) {
  width: 41.843972%; margin: 0px 0px 0px 35%;
}

.category-mobile .type-three .food-coupon-two { margin-top: 10.416667vw; }

.category-mobile .type-three .food-coupon-two > img:nth-child(1) {
  width: 51.489362%; margin-left: 7.801418%;
}

.category-mobile .type-three .food-coupon-two > img:nth-child(2) {
  width: 29.787234%; margin: -13% 0px 0px 52.482270%;
}

.category-mobile .type-three .food-coupon-three { margin-top: 3.90625vw; }

.category-mobile .type-three .food-coupon-three > img:nth-child(1) {
  width: 29.929078%; margin-left: 10.212765%;
}

.category-mobile .type-three .food-coupon-three > img:nth-child(2) {
  width: 51.914894%; margin-left: 1.953125vw;
}

.category-mobile .type-three .food-coupon-four { margin-top: 6.510417vw; }

.category-mobile .type-three .food-coupon-four > img:nth-child(1) {
  width: 50.070921%; margin-left: 16.312057%;
}

.category-mobile .type-three .food-coupon-four > img:nth-child(2) {
  width: 50.496454%; margin: -5.5% 0px 0px 30.070922%;
}

/* TODO 种类四 */
.category-mobile .type-four { padding-bottom: 10.416667vw; }

.category-mobile .type-four .desc-one {
  width: 86.254980%; margin: 0px auto 0px;
}

.category-mobile .type-four .desc-two {
  width: 94.621514%; margin: -10% auto 0px;
}

.category-mobile .type-four .desc-three {
  width: 96.215139%; margin: -15% auto 0px;
}

.category-mobile .type-four .desc-four {
  width: 93.625498%; margin: -2% auto 0px;
}

.category-mobile .type-four .desc-five {
  width: 87.450199%; margin: -6% auto 0px;
}

.category-mobile .type-four .desc-six {
  width: 93%; margin: -6% auto 0px;
}

@media screen and (max-width: 576px) {
  .category-mobile { padding: 9.114583vw 15px; }

  .category-mobile .type .title { width: 35%; }
}