#paddingWrap {
  padding: 0 4vw;
}
/* SECTION */
section {
  background-color: coral;
  overflow: hidden;
  position: relative;
  height: 150vw;
  margin-top: 3.5vw;
}
@media screen and (max-width:1440px) {
  section {
    margin-top: 5vw;
  }
}
@media screen and (max-width:1000px) {
  section {
    margin-top: 15vw;
  }
}

section #sectionWrap {
  height: 100% !important;
  width: 300%;
}

section ul {
  height: 100% !important;
}
section ul li {
  height: 100% !important;
  position: relative;
  width: 100vw;
  float: left;
}

.container {
  background: var(--primary-color);
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.container .blobs {
  width: 36vh;
  height: 36vh;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.container .redblobs .redblob {
  width: 50vw;
  height: 50vw;
  border-radius: 100%;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.3);
  mix-blend-mode: multiply;
  filter: blur(60px);
}

.container .redblobs .reda {
  background-color: rgba(0, 0, 0, .5);
  bottom: 30%;
  right: 30%;
  animation: circular2 30s linear infinite;
}

.container .redblobs .redb {
  bottom: 20%;
  left: 10%;
  animation: circular 10s linear infinite;
}

.container .redblobs .redc {
  top: 50%;
  left: 50%;
  animation: circular 20s linear infinite;
}

@keyframes circular {
  0% {
    transform: translate(0, -20%);
  }

  25% {
    transform: translate(20%, 0);
  }

  50% {
    transform: translate(0, 20%);
  }

  75% {
    transform: translate(-20%, 0);
  }

  100% {
    transform: translate(0, -20%);
  }
}

@keyframes circular2 {
  0% {
    transform: translate(0, 20%);
  }

  25% {
    transform: translate(-20%, 0);
  }

  50% {
    transform: translate(0, -20%);
  }

  75% {
    transform: translate(20%, 0);
  }

  100% {
    transform: translate(0, 20%);
  }

}

.container .blueblobs .blueblob {
  width: 50vw;
  height: 50vw;
  border-radius: 100%;
  position: absolute;
  background-color: #EB0045;
  mix-blend-mode: multiply;
  filter: blur(60px);
}

.container .blueblobs .bluea {
  background-color: #EB0045;
  bottom: 30%;
  right: 30%;
  animation: circular 30s linear infinite;
}

.container .blueblobs .blueb {
  background-color: #D0D9E8;
  bottom: 20%;
  left: 10%;
  animation: circular 10s linear infinite;
}

.container .blueblobs .bluec {
  top: 50%;
  left: 50%;
  animation: circular 20s linear infinite;
}

section .sectimgs {
  position: absolute;
  top: 0vw;
  width: 100%;
  height: 150vw;
}

section .sectimgs #sect3d {
  transform: translate(-50%, -50%);
  width: 70%;
  position: absolute;
  top: 50%;
  left: 50%;
}

section .sectimgs #sect3d img {
  width: 100%;
  height: 100%;
  padding: 6vw 0;
  object-fit: cover;
}

section .sectimgs span {
  position: absolute;
  bottom: 2vw;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  display: block;
  font-size: 5vw;
  font-family: 'Pretendard-Medium';
}

section #slidearrow {
  position: absolute;
  width: 100vw;
  top: 65vw;
  left: 0;
}

section #slidearrow span {
  position: absolute;
  font-size: 14vw;
  margin: 0 5vw;
}

section #slidearrow span+span {
  right: 0;
  margin-right: 2vw;
}


/* video */
#video {
  max-width: 1300px;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #999999;
  margin: 0 auto;
  padding: 10vw 0;
}
#video .subTitle {}
#video .subTitle span {
  font-weight: 500;
  font-family: 'Paperlogy';
  font-size: 5vw;
}
#video .subInfo {
  max-width: 850px;
  font-size: 1rem;
  line-height: 1.5;
  text-align: center;
  margin: 2vw;
}
#video .viewWrap {
  width: 100%;
  border: 1.2rem solid #EB0045;
  border-radius: 2.5rem;
  overflow: hidden;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
#video .viewWrap video {
  width: 101%;
  display: block;
}


.subTitle {
  color: #EB0045;
  font-weight: 700;
  font-size: 5vw;
  text-align: center;
  font-family: 'Paperlogy';
}
/* info */
#info {
  max-width: 1300px;
  margin: 0 auto;
  padding: 10vw 0;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #999999;
}
#info .subTitle {}
#info .contentWrap {
  flex-flow: column nowrap;  
  margin-top: 5rem;
  display: flex;
  justify-content: space-between;
}
#info .contentWrap .viewWrap {
  width: 100%;
  margin-bottom: 5vw;
}
#info .contentWrap .viewWrap img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
#info .contentWrap .infoWrap {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 5vh;
  width: 100%;
  line-height: 2;
}
#info .contentWrap .infoWrap .infoTxt {
}
#info .contentWrap .infoWrap .infoTxt p {
  font-family: 'Paperlogy';
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.3;
}
#info .contentWrap .infoWrap .infoTxt .title {
  font-size: 1.8rem;
  margin-bottom: .5rem;
  font-weight: 500;
  text-decoration: underline;
}



/* ingredient */
#ingredient {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  width: 100%;
  margin-top: 10vw;
}
#ingredient .left * {
  color: #FFF;
}
#ingredient .left {
  position: relative;
  background-color: #C61549;
  border-top-right-radius: 300px;
  width: 100%;
  padding: 5vw;
}
#ingredient .left p {
  font-family: 'paperlogy';
  font-size: 2rem;
  font-weight: 700;
}
#ingredient .left p.bold {
  font-family: "Rubik Mono One", monospace !important;
  font-size: 3rem;
  line-height: 1;
  font-weight: 500;
}
#ingredient .left p.imgBox {
  width: 12vw;
  height: 15vw;
  position: absolute;
  right: 5%;
  bottom: 5%;
  background-color: #850D30;
  border-radius: 120px;
}
#ingredient .left p img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}
#ingredient .right {
  width: 100%;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  gap: 8vw;
  align-items: flex-start;
  padding: 4vw 0;
}
#ingredient .right li:nth-child(1) {
  background-color: #666666;
}
#ingredient .right li:nth-child(2) {
  background-color: #C61549;
}
#ingredient .right li:nth-child(3) {
  background-color: #aaa;
}
#ingredient .right li:nth-child(4) {
  background-color: #e598af;
}
#ingredient .right li {
  width: 30vw;
  height: 30vw;
  border-radius: 100%;
}
#ingredient .right li * {
  font-family: 'paperlogy';
  text-align: center;
}
#ingredient .right li p {
  height: 100%;
  color: #fff;
  font-size: 3.5vw;
  font-weight: 700;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
}
#ingredient .right li p span {
  font-size: 5vw;
  font-weight: 700;
}



/* ROUND */
div#round {
  position: relative;
}

div#round #roundimg div {
  position: relative;
  overflow: hidden;
  height: 52vw;
}

div#round #roundimg div::after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  background-color: #22222273;
  z-index: 4;
}

div#round #roundbg01 {
  background-image: url(../img/cicleImg1.png);
  background-size: cover;
  background-position: center;
}

div#round #roundbg02 {
  background-image: url(../img/cicleImg2.png);
  background-size: cover;
  background-position: center;
}

div#round #circle ul {
  display:flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  height:inherit;
  border-radius: 100%;
  gap: 40%;
}

div#round #circle ul li {
  position: absolute;
  left: 0;
  z-index: 5;
  text-align: center;
  width: 100%;
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
}

div#round #circle .circle01 {
  top: 10vw;
}

div#round #circle .circle02 {
  top: 60vw;
}

div#round #circle ul li h2 * {
  font-family: 'paperlogy';
  font-weight: 700;
  color: #FFF;
  margin-bottom: 2vw;
  font-size: 4vw;
}
div#round #circle ul li h2 .size *,
div#round #circle ul li h2 .size {
  font-size: 2vw;
}
div#round #circle ul li h2 .color {
  color: #EB0045;
}
div#round #circle ul li h2 {
  font-size: 4vw;
  font-weight: 700;
  font-family: 'paperlogy';
  margin-bottom: 2vw;
  color: var(--primary-color);
}

div#round #circle ul li p {
  padding: 0 3vw;
  font-size: 3vw;
  line-height: 1.3;
  font-weight: 200;
  color: #fff;
}