/*****************************************
*                  index                 *
*****************************************/

body {
  min-width: 1150px;
}

#main {
  overflow: hidden;
}

.area {
  position: relative;
}
.section {
  position: relative;
  background-repeat: no-repeat;
}

.banner img{
  width: 100%;
  min-height: 497px;
  object-fit: cover;
}
#custom {
}
#standard {
}

#custom .section {
  background-position: center top;
  background-repeat: no-repeat;
  overflow: hidden;
}

#cut-1 {
  height: 497px;
}

#cut-small-bar {
  height: 65px;
  background-image: url(../images/index/small_bar2023.png);
  background-size: auto 100%;
  background-color: #b19156;
}

.small-bar-social {
  width: 35px;
  height: 35px;
  /*	display: flex; 
	flex-direction: row; 
	justify-content: space-around; */
  position: absolute;
  right: 25px;
  top: 15px;
}

#cut-2 {
  height: 3941px;
  background-image: url(../images/index/gogotea_bg2024.png);
  background-size: auto 12%;
  background-repeat: repeat !important;
  position: relative;
}

.sec-sub-bg-head {
  background-image: url(../images/index/sec-sub-bg-head.png);
  background-size: contain;
  background-repeat: no-repeat;
  height: 84px;
  width: 1126px;
  position: absolute;
  left: 50%;
  margin-left: -570px;
  top: 195px;
}

.sec-sub-bg-body {
  background-image: url("../images/index/sec-sub-bg-body.png");
  background-size: contain;
  background-repeat: repeat;
  height: 3255px;
  width: 1126px;
  position: absolute;
  left: 50%;
  margin-left: -570px;
  top: 260px;
}

.sec-sub-bg-foot {
  background-image: url("../images/index/sec-sub-bg-foot.png");
  background-size: contain;
  background-repeat: no-repeat;
  height: 84px;
  width: 1126px;
  position: absolute;
  left: 50%;
  margin-left: -570px;
  bottom: 348px;
}

#cut-3 {
  height: 1283px;
  background-image: url(../images/index/cut-3-bg.jpg?v=180814);
}
#cut-4 {
  height: 1588px;
  background-image: url(../images/index/cut-4-bg.jpg?v=180814);
}

#cut-2 .title {
  position: relative;
  z-index: 2;
  top: 60px;
  left: 199px;
  width: 595px;
  height: 58px;
  background: url(../images/index/main-sec-title.png) 0 0 no-repeat;
  background-size: auto 100%;
}
#cut-2 .part {
  position: absolute;
}
.picture {
  positon: relative;
}
.picture .sec-btn-1 {
  position: absolute;
  bottom: 53px;
  left: 112px;
  background: url(../images/index/sec-1-btn.jpg) 0 0 no-repeat;
  background-size: contain;
}

.picture .photo {
  width: 100%;
}

#leaf1 {
  position: absolute;
  background: url(../images/index/leaf_1.png) 0 0 no-repeat;
  width: 222px;
  height: 263px;
  z-index: 5;
  top: 864px;
  left: 442px;
  pointer-events: none;
  background-size: contain;
}
#leaf2 {
  position: absolute;
  background: url(../images/index/leaf_2.png) 0 0 no-repeat;
  width: 151px;
  height: 139px;
  z-index: 5;
  top: 1187px;
  left: 168px;
  pointer-events: none;
  background-size: contain;
}
#leaf3 {
  position: absolute;
  background: url(../images/index/leaf_3.png) 0 0 no-repeat;
  width: 303px;
  height: 178px;
  z-index: 5;
  top: 1756px;
  left: 401px;
  pointer-events: none;
  background-size: contain;
}
#leaf4 {
  position: absolute;
  background: url(../images/index/leaf_4.png) 0 0 no-repeat;
  width: 267px;
  height: 248px;
  z-index: 5;
  top: 2215px;
  left: 254px;
  pointer-events: none;
  background-size: contain;
}
#leaf5 {
  position: absolute;
  background: url(../images/index/leaf_5.png?v=2505) 0 0 no-repeat;
  width: 100%;
  height: 231px;
  z-index: 5;
  top: 2692px;
  left: 567px;
  pointer-events: none;
  background-size: contain;
}
.picture .sec-btn-4 {
  position: absolute;
  bottom: 53px;
  left: 150px;
  background: url(../images/index/sec-4-btn.jpg) 0 0 no-repeat;
  background-size: contain;
}

.picture .sec-btn-5 {
  position: absolute;
  bottom: 65px;
  right: 152px;
  background: url(../images/index/sec-5-btn.jpg) 0 0 no-repeat;
  background-size: contain;
}

#sec-1 {
  top: 304px;
  left: 0;
  z-index: 2;
}

#sec-2 {
  top: 1225px;
  left: 0;
  z-index: 2;
}

#sec-3 {
  top: 1822px;
  left: 0;
  z-index: 3;
}

#sec-4 {
  top: 2357px;
  left: 0;
  z-index: 3;
}

#sec-5 {
  top: 3010px;
  left: 0;
  z-index: 3;
}

#standard .title,
#standard .content {
  position: absolute;
}

#standard .content {
  width: 100%;
}

#campaign {
  height: 506px;
  background-image: url(../images/index/campaign-bg.jpg);
  background-color: #760805;
  background-position: center top;
}

#campaign .title {
  top: 49px;
  left: 403px;
  width: 195px;
  height: 76px;
  background: url(../images/index/campaign-title.png) 0 0 no-repeat;
}

#campaign .content {
  top: 174px;
}

#campaign ul {
  font-size: 0;
  text-align: center;
}

#campaign li {
  display: inline-block;
  width: 455px;
  height: 243px;
  margin: 0 13px;
  background: #dec73c;
}

#campaign li a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #feefc9;
  overflow: hidden;
}

#campaign li a img {
  display: block;
}

#campaign li a:hover img {
  opacity: 0.5;
}

#campaign li a:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/index/campaign-frame.png) 0 0 no-repeat;
  box-sizing: border-box;
}

#products {
  height: 484px;
  background-image: url(../images/index/products-bg.jpg);
  background-color: #760805;
  background-position: center top;
}

#products .title {
  top: 57px;
  left: 376px;
  width: 248px;
  height: 76px;
  background: url(../images/index/products-title.png) 0 0 no-repeat;
}

#products .content {
  top: 178px;
}

#products .related-content {
}
#products .related-content li {
  /*	border-color: #ffe55f;
	background: #ffe55f;*/
  background: #ffffff;
}

#products .related-content li a {
  border-color: transparent;
  background: #ffffff;
}

#products .related-content li a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

#products .related-content .order-0 {
  left: -185px;
}
#products .related-content .order-1 {
  left: 0;
}
#products .related-content .order-2 {
  left: 186px;
}
#products .related-content .order-3 {
  left: 372px;
}
#products .related-content .order-4 {
  left: 558px;
}
#products .related-content .order-5 {
  left: 744px;
}

#products .related-content li a {
  color: #961d0d;
}

#products .related-arrow {
}
#products .related-arrow li {
  height: auto;
}
#products .related-arrow li a {
  top: 79px;
  width: 57px;
  height: 60px;
  background-position: center top;
}
#products .related-arrow li a:hover {
  background-position: center bottom;
}
#products .related-arrow li.prev a {
  background-image: url(../images/index/arrow-prev.png);
  left: 13px;
}
#products .related-arrow li.next a {
  background-image: url(../images/index/arrow-next.png);
  right: 13px;
}

#mainbanner {
  position: relative;
  width: 1150px;
  margin: 0 auto;
}
.mainbanner_arrows {
  position: absolute;
  z-index: 10;
}

#bn_prev {
  background-image: url(../images/index/arrow_left.png);
  height: 67px;
  width: 16px;
  left: 0;
  top: -300px;
  cursor: pointer;
}
#bn_next {
  background-image: url(../images/index/arrow_right.png);
  height: 67px;
  width: 16px;
  right: 0;
  top: -300px;
  cursor: pointer;
}

#tvcm {
  height: 598px;
  background-image: url(../images/index/tvcm-bg.png);
  background-color: #760805;
  background-position: center top;
}

#tvcm .title {
  top: 66px;
  left: 392px;
  width: 214px;
  height: 83px;
  background: url(../images/index/tvcm-title.png) 0 0 no-repeat;
  background-size: auto 100%;
}

#tvcm .content {
  top: 177px;
}

#tvcm .videos-content li {
}
#tvcm .videos-content li a {
}
#tvcm .videos-content li a:after {
  top: 103px;
  left: 155px;
  background: url(../images/index/tvcm-play.png) 0 0 no-repeat;
}
#tvcm .videos-content li a:before {
  content: "";
  display: block;
  position: absolute;
  top: 103px;
  left: 155px;
  width: 54px;
  height: 54px;
  background: url(../images/index/tvcm-play.png) 0 bottom no-repeat;
  z-index: 1;
  opacity: 0;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -ms-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -o-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
#tvcm .videos-content li a:hover:before {
  opacity: 1;
}
#tvcm .pic {
  background: rgba(68, 16, 0, 0.5);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -ms-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -o-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
/*#tvcm .videos-content li a:hover .pic {background: rgba(68, 16, 0, 1);}*/
/*#tvcm .videos-content li a .pic img {opacity: 0.5; filter: alpha(opacity=50);}*/
#tvcm .videos-content li a:hover .pic img {
  opacity: 1;
  filter: alpha(opacity=1);
}
#tvcm .pic:after {
  border-color: #e9bd7d;
  border-width: 2px;
}

#tvcm .videos-content {
  height: 307px;
}

#tvcm .videos-content .name {
  color: #ffd485;
}

#tvcm .videos-arrow {
}
#tvcm .videos-arrow li {
  height: auto;
}
#tvcm .videos-arrow li.prev {
  left: 13px;
}
#tvcm .videos-arrow li.next {
  right: 13px;
}
#tvcm .videos-arrow li a {
  top: 92px;
  width: 57px;
  height: 60px;
  background-position: center top;
}
#tvcm .videos-arrow li a:hover {
  background-position: center bottom;
}
#tvcm .videos-arrow li.prev a {
  background-image: url(../images/index/arrow-prev.png);
  left: 13px;
}
#tvcm .videos-arrow li.next a {
  background-image: url(../images/index/arrow-next.png);
  right: 13px;
}

#knowledge {
  height: 289px;
  margin-top: -289px;
}

#knowledge .inner {
  width: 1125px;
  margin: 0 auto;
}

#knowledge .content {
}
#knowledge ul {
  font-size: 0;
  text-align: left;
}
#knowledge li {
  display: inline-block;
  margin-right: 9px;
  background-color: #ffd985;
}
#knowledge li a {
  display: block;
  width: 366px;
  height: 196px;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: auto 100%;
}
#knowledge li a:hover {
  opacity: 0.7;
}
#knowledge li a.item-1 {
  background-image: url(../images/index/knowledge-1-2024.png);
}
#knowledge li a.item-2 {
  background-image: url(../images/index/knowledge-2-2023.png);
}
#knowledge li a.item-3 {
  background-image: url(../images/index/knowledge-3-2023.png);
}

#shop {
  height: 368px;
  background-image: url(../images/index/shop-bg.jpg);
  background-color: #760805;
  background-position: center top;
}

#shop .title {
  top: 48px;
  left: 414px;
  width: 158px;
  height: 77px;
  background: url(../images/index/shop-title.png) 0 0 no-repeat;
}

#shop .content {
  top: 178px;
}

#shop ul {
  font-size: 0;
  text-align: center;
}
#shop li {
  display: inline-block;
  width: 230px;
  height: 100px;
  margin: 0 3px;
  vertical-align: top;
  background: #f9e9c0;
}

#shop li a {
  display: table-cell;
  width: 230px;
  height: 100px;
  vertical-align: middle;
  background: url(../images/index/shop-arrow.png) left center no-repeat;
}

#shop li a:hover {
  opacity: 0.5;
}

#shop li a img {
  margin: 0 0 0 0;
}

#social {
  padding: 89px 0;
  background: url(../images/index/social-bg.jpg) #814e19 center top no-repeat;
}

#social .content {
  position: relative;
}

#social ul {
  font-size: 0;
  text-align: center;
}

#social li {
  position: relative;
  display: inline-block;
  margin: 0 13px;
  background: #a81600;
}

#social li a {
  position: relative;
  display: block;
  width: 455px;
  height: 100px;
  /*background-image: url(./images/index/social-items.jpg);*/
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
}

#social li a:hover {
  opacity: 0.45;
}

#social li:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: #f1d9a6 0px solid; /* #f1d9a6 */
  box-sizing: border-box;
  z-index: 2;
  pointer-events: none;
  -webkit-transition: border-width 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -moz-transition: border-width 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -ms-transition: border-width 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  -o-transition: border-width 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: border-width 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

#social li:hover:after {
  border-width: 3px;
}

#social li a.facebook {
  background-position: center center;
}
#social li a.instagram {
  background-position: center center;
}

.small-bar-social div {
  width: 35px;
  height: 35px;
}

#pop {
}

.pop-container {
  background: rgba(70, 1, 1, 0.8);
}

.pop-main {
  margin-top: 80px;
  margin-bottom: 80px;
}
.pop-main .btn-close {
  top: -67px;
  right: -6px;
  width: 124px;
  height: 56px;
  background-image: url(../images/index/pop-btn-close.png);
}
.pop-main .btn-close:hover {
  background-position: center bottom;
}

#video {
  width: 1000px;
}
#video .embed {
  width: 1000px;
  height: 560px;
  background: #000000;
  overflow: hidden;
}
#video .btn-close {
}

.button {
  border: none;
  color: #ffffff;
  text-align: center;
  padding: 20px;
  width: 347px;
  height: 48px;
  cursor: pointer;
  position: relative;
}

.button span {
  cursor: pointer;
  display: inline-block;
  transition: 0.5s;
  position: absolute;
  top: 9px;
}

.type1 {
  left: 274px;
}
.type2 {
  left: 288px;
}

.button span:after {
  content: url("../images/index/arrow.png");
}

.button:hover span {
  /*padding-left: 10px;*/
}

.button:hover span:after {
  right: 0;
  animation: fade 1s linear;
}

@keyframes fade {
  5% {
    opacity: 1;
  }
  60% {
    opacity: 0;
    padding-left: 15px;
  }
  61%,
  80% {
    opacity: 0;
    padding-left: 0px;
  }
  100% {
    opacity: 1;
  }
}




@media screen and (max-width: 1000px) {
  img{width: 100%;}
  .sec-sub-bg-head,.sec-sub-bg-body,.sec-sub-bg-foot{display: none;}
  .banner img{
   min-height: 124.8vw; 
}
div#custom {
  top: -1.60vw;
}

#custom .section .inner {
  height: 100%;
}

#custom #cut-1 {
  height: 158.93vw;
  background-image: url(../m/images/index/cut-1-bg.jpeg);
  overflow: visible;
  z-index: 1;
  background-size: 100% auto;
}

#cut-2 {
  height: 960.00vw;
  background-image: url(../m/images/index/cut-2-bg-25.png);
  background-size: 100% auto;
}
#cut-small-bar {
  height: 14.40vw;
  background-image: url(../m/images/index/small_bar2023.png);
  background-size: 100% auto;
}
.small-bar-social {
  width: 9.33vw;
  height: 9.33vw;
  position: absolute;
  right: 4.00vw;
  top: 3.20vw;
}

.small-bar-social div {
  width: 9.33vw;
  height: 9.33vw;
}
#sec-1,#sec-2,#sec-3,#sec-4,#sec-5{
  position: relative !important;
  top: initial !important;
}
#sec-1 { height: 192.00vw; }
#sec-2 { height: 149.33vw; }
#sec-3 { height: 154.67vw; }
#sec-4 { height: 170.67vw; }
#sec-5 { height: 185.33vw; }

.picture .photo{
  position: relative;
  width: 96%;
  left: 2%;
}
#sec-1 .photo{ top: 19.4667vw; }
#sec-2 .photo{ top: 8.8vw; }
#sec-3 .photo{ top: 8.8vw; }
#sec-4 .photo{ top: 1.333vw; }
#sec-5 .photo{ top: 8.8vw; }

#cut-1 .caption {
  top: 16.80vw;
  left: 17.07vw;
  width: 17.33vw;
  height: 100.27vw;
  background: url(../m/images/index/caption.png) 0 0 no-repeat;
  background-size: contain;
}

#cut-1 .new {
  top: 4.00vw;
  left: 6.13vw;
  width: 25.07vw;
  height: 15.47vw;
  transform: rotate(-7.2deg);
  z-index: 1;
}

#cut-2 .title {
  position: relative;
  z-index: 2;
  top: 5.60vw;
  left: 22.67vw;
  height: 12.80vw;
  background: url(../m/images/index/main-sec-title.png) 0 0 no-repeat;
  background-size: contain;
}

.button {
  padding: 5.33vw;
  width: 69.33vw;
  height: 5.33vw;
}

.picture .sec-btn-1 {
  bottom: -10.67vw;
  left: 10.13vw;
  background: url(../m/images/index/sec-1-btn.jpg) 0 0 no-repeat;
  background-size: contain;
}

.picture .sec-btn-4 {
  bottom: 7.47vw;
  left: 10.13vw;
  background: url(../m/images/index/sec-4-btn.jpg) 0 0 no-repeat;
  background-size: contain;
}

.picture .sec-btn-5 {
  bottom: -1.33vw;
  left: 10.13vw;
  background: url(../m/images/index/sec-5-btn.jpg) 0 0 no-repeat;
  background-size: contain;
}
.button span{
  display: none;
}

.sec-1-teapot {
  position: absolute;
  z-index: 4;
  bottom: -2.67vw;
  left: 32.00vw;
  width: 26.13vw;
  pointer-events: none;
}

.sec-3-milk {
  position: absolute;
  bottom: -14.40vw;
  right: 6.67vw;
  width: 11.20vw;
}

.sec-4-bt {
  position: absolute;
  bottom: 14.67vw;
  right: 7.47vw;
  width: 11.20vw;
  z-index: 2;
}

#custom .section .picture {
  position: relative;
  width: 89.33vw;
  margin: 0 auto 5.87vw;
}

#custom .section .picture .photo2 {
  top: 19.47vw;
  left: 2.13vw;
}

#cut-2 h2 {
  width: 69.07vw;
  height: 34.40vw;
  margin: 11.20vw 0 2.67vw 16.53vw;
}

#cut-3 h2 {
  width: 146.67vw;
  height: 29.07vw;
  margin: 6.93vw 0 3.73vw 14.93vw;
}

#cut-4 h2 {
  width: 116.80vw;
  height: 29.60vw;
  margin: 5.60vw 0 3.20vw 29.87vw;
}

#cut-5 h2 {
  width: 51.47vw;
  height: 18.40vw;
  margin: 4.27vw 0 5.60vw 24.00vw;
}

/* leaf */
#leaf1 { width: 22.67vw; height: 70.13vw; top: 212.00vw; right: 1.33vw; left: initial;}
#leaf2 { width: 44.00vw; height: 70.13vw; top: 295.47vw; right: 1.33vw; left: initial;}
#leaf3 { width: 24.00vw; height: 29.33vw; top: 361.33vw; }
#leaf4 { width: 10.67vw; height: 8.00vw; top: 380.00vw; right: 10.67vw; left: initial;}
#leaf5 { width: 45.33vw; height: 47.47vw; top: 492.80vw; right: 1.33vw; left: initial;}
#leaf6 { width: 32.00vw; height: 21.33vw; top: 678.67vw; }
#leaf7 { width: 10.67vw; height: 66.13vw; top: 706.13vw; right: 6.67vw; left: initial;}


#leaf1 {

  background: url(../m/images/index/leaf_1.png) 0 0 no-repeat;
  background-size: contain;
}
#leaf2 {
  background: url(../m/images/index/leaf_2.png) 0 0 no-repeat;
  background-size: contain;
}
#leaf3 {
  background: url(../m/images/index/leaf_3.png) 0 0 no-repeat;
  background-size: contain;
}
#leaf4 {
  background: url(../m/images/index/leaf_4.png) 0 0 no-repeat;
  background-size: contain;
}
#leaf5 {
  background: url(../m/images/index/leaf_5.png) 0 0 no-repeat;
  background-size: contain;
}
#leaf6 {
  background: url(../m/images/index/leaf_6.png) 0 0 no-repeat;
  background-size: contain;
}
#leaf7 {
  background: url(../m/images/index/leaf_7.png) 0 0 no-repeat;
  background-size: contain;
}
#campaign {
  padding-bottom: 1.60vw;
  background-size: 100vw 81.07vw;
}

#campaign .title {
  top: 6.13vw;
  left: 32.53vw;
  width: 35.73vw;
  height: 13.33vw;
}

#campaign .content {
  padding-top: 26.40vw;
}

#campaign li {
  width: 90.13vw;
  height: 48.00vw;
  margin: 0 auto 4.80vw;
}

#campaign li a img {
  width: 90.13vw;
}

#products {
  height: auto;
  padding-bottom: 6.67vw;
  background-size: 100vw 156.27vw;
}
#products .content{
  position: relative;
}
#products .title {
  top: 5.07vw;
  left: 29.33vw;
  width: 42.40vw;
  height: 13.60vw;
  background: url(../m/images/index/products-title.png) 0 0 no-repeat;
  background-size: contain;
}

#products .content {
  top: 0;
  padding-top: 24.53vw;
}

#products #related .related-content .btn-more {
  height: 13.33vw;
  line-height: 13.33vw;
}

#mainbanner {
  width: 93.33vw;
}

#bn_prev,
#bn_next {
  height: 9.33vw;
  width: 5.33vw;
  top: -64.00vw;
}

#tvcm { 
/*   height: 77.33vw; */
  height: 87.33vw;
  background-image: url(../m/images/index/tvcm-bg.png);
  background-color: #731008;
  background-position: center top;
  background-size: 100vw 101.60vw;
}

#tvcm .title {
  top: 5.60vw;
  left: 30.93vw;
  width: 40.00vw;
  height: 18.67vw;
  background: url(../m/images/index/tvcm-title.png) 0 0 no-repeat;
  background-size: contain;
}

#tvcm .content {
  top: 25.87vw;
}

#tvcm .slide-content a,
#tvcm .slide-content .pic,
#tvcm .slide-content .vid {
  width: 72.00vw;
  height: 38.40vw;
}

#knowledge {
  height: 80.80vw;
  margin-top: -82.93vw;
}
#knowledge .inner{
  width: 100%;
}
#knowledge ul {
    text-align: center;
}
#knowledge li {
  margin: 0 0 1.6vw;
}
#knowledge li a {
  width: 89.60vw;
  height: 23.47vw;
}
#knowledge li a.item-1 {
  background-image: url(../m/images/index/knowledge-1-2024.png);
}
#knowledge li a.item-2 {
  background-image: url(../m/images/index/knowledge-2-2023.png);
}
#knowledge li a.item-3 {
  background-image: url(../m/images/index/knowledge-3-2023.png);
}

#knowledge li a:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border: #cc935b 1px solid;
  box-sizing: border-box;
}

#shop {
  padding-bottom: 6.93vw;
  background-size: 100vw 86.40vw;
}

#shop .title {
  margin-top: 7.73vw;
  left: 34.67vw;
  width: 29.07vw;
  height: 14.40vw;
}

#shop .content {
  margin-top: 4.80vw;
}

#shop li {
  width: 44.00vw;
  height: 23.47vw;
  margin: 0 0.80vw 1.60vw;
}

#shop li a {
  width: 44.00vw;
  height: 23.47vw;
  background-size: 44.00vw 23.47vw;
}

#standard #social {
  padding: 8.80vw 0;
  background-size: 100vw 41.07vw;
}

#social li {
  margin: 0 0.67vw;
}

#social li a {
  width: 43.73vw;
  height: 22.67vw;
}
  
}