@charset "UTF-8";
#load {
  position: fixed;
  width: 600px;
  height: 36px;
  left: 50%;
  top: 50%;
  margin-top: -18px;
  margin-left: -300px;
  overflow: visible;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

#load div {
  position: absolute;
  width: 20px;
  height: 36px;
  font-size: 1.25rem;
  opacity: 0;
  animation: move 2s linear infinite;
  -o-animation: move 2s linear infinite;
  -moz-animation: move 2s linear infinite;
  -webkit-animation: move 2s linear infinite;
  transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  color: #c20909;
}

#load div:nth-child(2) {
  animation-delay: 0.2s;
  -o-animation-delay: 0.2s;
  -moz-animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
}

#load div:nth-child(3) {
  animation-delay: 0.4s;
  -o-animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
}

#load div:nth-child(4) {
  animation-delay: 0.6s;
  -o-animation-delay: 0.6s;
  -moz-animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
}

#load div:nth-child(5) {
  animation-delay: 0.8s;
  -o-animation-delay: 0.8s;
  -moz-animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
}

#load div:nth-child(6) {
  animation-delay: 1s;
  -o-animation-delay: 1s;
  -moz-animation-delay: 1s;
  -webkit-animation-delay: 1s;
}

#load div:nth-child(7) {
  animation-delay: 1.2s;
  -o-animation-delay: 1.2s;
  -moz-animation-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
}

@keyframes move {
  0% {
    left: 0;
    opacity: 0;
  }
  35% {
    left: 41%;
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  65% {
    left: 59%;
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  100% {
    left: 100%;
    -moz-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg);
    opacity: 0;
  }
}
@-moz-keyframes move {
  0% {
    left: 0;
    opacity: 0;
  }
  35% {
    left: 41%;
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  65% {
    left: 59%;
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  100% {
    left: 100%;
    -moz-transform: rotate(-180deg);
    transform: rotate(-180deg);
    opacity: 0;
  }
}
@-webkit-keyframes move {
  0% {
    left: 0;
    opacity: 0;
  }
  35% {
    left: 41%;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  65% {
    left: 59%;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  100% {
    left: 100%;
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    opacity: 0;
  }
}
@-o-keyframes move {
  0% {
    left: 0;
    opacity: 0;
  }
  35% {
    left: 41%;
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  65% {
    left: 59%;
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
  }
  100% {
    left: 100%;
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg);
    opacity: 0;
  }
}
#container {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s;
  overflow: hidden;
}
#container.load {
  opacity: 1;
  visibility: visible;
}
#container .pin-spacer {
  width: 100% !important;
  transition: all 0.3s;
}

.main_cont {
  width: 100% !important;
  max-width: 100% !important;
  font-size: 1.85vh;
  transition: height 0.5s;
}
@media all and (min-width: 1280px) and (max-height: 720px) {
  .main_cont {
    font-size: 1rem;
  }
}
@media all and (min-width: 1920px) and (min-height: 1080px) {
  .main_cont {
    font-size: 1.25rem;
  }
}
@media screen and (max-width: 1280px) {
  .main_cont {
    font-size: 1.125rem;
  }
}
@media screen and (max-width: 800px) {
  .main_cont {
    font-size: 0.9375rem;
  }
}

#mainCont3,
#mainCont4,
#mainCont5,
#mainCont6 {
  position: relative;
  background-color: #fff;
}

#mainCont1 {
  position: relative;
  min-height: calc(var(--vh, 1vh) * 100);
  max-height: none;
  z-index: 5;
  overflow: hidden;
}
#mainCont1 .bg {
  background: url("/resource/images/main/mCont1_bg.jpg") no-repeat center/cover;
  width: 100% !important;
  height: 100% !important;
  min-height: calc(var(--vh, 1vh) * 100) !important;
  max-height: none !important;
}
#mainCont1 .clone_cont1 {
  min-height: calc(var(--vh, 1vh) * 100) !important;
  height: calc(var(--vh, 1vh) * 100);
  max-height: none !important;
}
#mainCont1 .cont1_wrap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  min-height: calc(var(--vh, 1vh) * 100);
  max-height: none;
}
#mainCont1 .scene {
  flex-direction: column;
}
#mainCont1 .inner {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  padding-top: calc(var(--vh, 1vh) * 10.74);
  padding-bottom: 2em;
  height: 100%;
  min-height: calc(var(--vh, 1vh) * 100);
}
@media screen and (max-width: 1280px) {
  #mainCont1 .inner {
    flex-wrap: nowrap;
    flex-direction: column;
    justify-content: space-evenly;
  }
}
#mainCont1 .txt_box {
  width: 100%;
  font-size: 1.2em;
  line-height: 1.41;
  text-align: center;
  color: #5e4d3a;
  margin-bottom: 1.5833333333em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .txt_box {
    font-size: 1em;
    line-height: 1.3333333333;
  }
}
#mainCont1 .txt_box .scene {
  height: var(--min-hei);
}
#mainCont1 .m_tit {
  display: inline-block;
  overflow: hidden;
  font-size: 2.5em;
  color: var(--brand-color-sub3);
  font-family: "Noto Sans KR", sans-serif;
  font-weight: 300;
  line-height: 1.333;
  padding-bottom: 0.5em;
  letter-spacing: -1.5px;
}
#mainCont1 .m_tit .point {
  font-weight: bold;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .m_tit {
    font-size: 1.8666666667em;
    letter-spacing: -1.4px;
    line-height: 1.5357142857;
    padding-bottom: 0.5178571429em;
  }
}
#mainCont1 .m_sub_txt {
  display: inline-block;
  overflow: hidden;
  width: 100%;
}
#mainCont1 .m_sub_txt .txt {
  width: 100%;
}
#mainCont1 [class*=scean] {
  display: none;
}
#mainCont1 [class*=scean].on {
  display: flex;
}
#mainCont1 [class*=scean].on .m_tit, #mainCont1 [class*=scean].on .m_sub_txt {
  overflow: hidden;
}
#mainCont1 [class*=scean].on .m_tit .txt, #mainCont1 [class*=scean].on .m_sub_txt .txt {
  display: inline-block;
  opacity: 0;
  animation: var(--custom-wave-anim);
}
#mainCont1 [class*=scean].on .m_sub_txt .txt {
  animation-delay: 0.025s;
}
#mainCont1 .img_slide_wrap {
  position: relative;
  padding-left: 6.3em;
}
#mainCont1 .img_slide_wrap.act .scroll_lab {
  opacity: 0;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .img_slide_wrap {
    padding-left: 0;
  }
  #mainCont1 .img_slide_wrap .scroll_lab {
    display: none;
  }
}
#mainCont1 .img_slides {
  display: flex;
  position: relative;
}
#mainCont1 .scroll_lab {
  position: absolute;
  top: 10em;
  left: 0;
  display: flex;
  flex-direction: column;
  transform: translateY(-50%);
  font-size: 1em;
  line-height: 1.5;
  transition: opacity 0.35s;
  gap: 0.3em;
}
#mainCont1 .scroll_lab .txt {
  display: block;
  font-size: 1em;
  padding-right: 0.4em;
  font-weight: bold;
}
#mainCont1 .scroll_lab .arr {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  --longArr: longMove .85s 0s infinite alternate both running;
  animation: var(--longArr);
}
#mainCont1 .scroll_lab .arr::before, #mainCont1 .scroll_lab .arr::after {
  content: "";
  display: block;
}
#mainCont1 .scroll_lab .arr::after {
  position: absolute;
  top: 50%;
  right: 0;
  flex: 0 0 auto;
  width: 0.5em;
  height: 0.5em;
  border: 2px solid #222;
  border-left: 0;
  border-bottom: 0;
  transform: translateY(-50%) rotate(45deg);
  transform-origin: center;
}
#mainCont1 .scroll_lab .arr::before {
  width: 100%;
  border-bottom: 2px solid #222;
}
#mainCont1 .img_slide {
  display: flex;
  align-items: flex-start;
  flex: 0 0 auto;
  gap: 4.8em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .img_slide {
    gap: 1.0666666667em;
  }
}
#mainCont1 .img_slide.pin .slide_item {
  transform: none !important;
}
#mainCont1 .slide_item {
  flex: 0 0 auto;
}
#mainCont1 .slide_item img {
  box-shadow: 1.5em 1.5em 1.25em 0 rgba(0, 0, 0, 0.15);
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item img {
    box-shadow: 1em 1em 0.8333333333em 0 rgba(0, 0, 0, 0.15);
  }
}
#mainCont1 .slide_item:nth-child(1) {
  padding-top: 0;
}
#mainCont1 .slide_item:nth-child(1) img {
  height: 20.05em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(1) img {
    height: 16.9666666667em;
  }
}
#mainCont1 .slide_item:nth-child(2) {
  padding-top: 4.4em;
}
#mainCont1 .slide_item:nth-child(2) img {
  height: 20.5em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(2) img {
    height: 17.2666666667em;
  }
}
#mainCont1 .slide_item:nth-child(3) {
  padding-top: 0.75em;
}
#mainCont1 .slide_item:nth-child(3) img {
  height: 23.45em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(3) img {
    height: 19.2333333333em;
  }
}
#mainCont1 .slide_item:nth-child(4) {
  padding-top: 6.65em;
}
#mainCont1 .slide_item:nth-child(4) img {
  height: 19.3em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(4) img {
    height: 16.4666666667em;
  }
}
#mainCont1 .slide_item:nth-child(5) {
  padding-top: 4em;
}
#mainCont1 .slide_item:nth-child(5) img {
  height: 19.15em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(5) img {
    height: 12.6333333333em;
  }
}
#mainCont1 .slide_item:nth-child(6) {
  padding-top: 1.15em;
}
#mainCont1 .slide_item:nth-child(6) img {
  height: 27.65em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(6) img {
    height: 18.4333333333em;
  }
}
#mainCont1 .slide_item:nth-child(7) {
  padding-top: 9.6em;
}
#mainCont1 .slide_item:nth-child(7) img {
  height: 19.3em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(7) img {
    height: 16.4666666667em;
  }
}
#mainCont1 .slide_item:nth-child(8) {
  padding-top: 0.95em;
}
#mainCont1 .slide_item:nth-child(8) img {
  height: 19.8em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(8) img {
    height: 18.3333333333em;
  }
}
#mainCont1 .slide_item:nth-child(9) {
  padding-top: 2.75em;
}
#mainCont1 .slide_item:nth-child(9) img {
  height: 19.15em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(9) img {
    height: 13.1em;
  }
}
#mainCont1 .slide_item:nth-child(10) {
  padding-top: 1.7em;
}
#mainCont1 .slide_item:nth-child(10) img {
  height: 19.8em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(10) img {
    height: 16.0333333333em;
  }
}
#mainCont1 .slide_item:nth-child(11) {
  padding-top: 4.95em;
}
#mainCont1 .slide_item:nth-child(11) img {
  height: 19.15em;
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item:nth-child(11) img {
    height: 13.5333333333em;
  }
}
@media screen and (max-width: 1280px) {
  #mainCont1 .slide_item {
    padding-top: 0 !important;
  }
}

.mainCont2_temp {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  min-height: calc(var(--vh, 1vh) * 100);
  height: 100%;
  background: url("/resource/images/main/mCont2_bg.jpg") no-repeat center/cover;
}
.mainCont2_temp::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 41.75em;
  max-width: 100%;
  height: calc(var(--vh, 1vh) * 100);
  background: url("/resource/images/main/emblem.png") no-repeat center/calc(100% - var(--spacing) * 2) auto;
}

#mainCont2 {
  z-index: 2;
  position: relative;
  pointer-events: none;
}

.mainCont2_wrap {
  color: var(--color-white);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: url("/resource/images/main/mCont2_bg.jpg") no-repeat center/cover;
  height: 100% !important;
  min-height: calc(var(--vh, 1vh) * 100);
  max-height: none !important;
}
.mainCont2_wrap::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(0.001deg);
  width: 41.75em;
  max-width: 100%;
  height: 100vh;
  background: url("/resource/images/main/emblem.png") no-repeat center/calc(100% - var(--spacing) * 2) auto;
  z-index: 2;
}
.mainCont2_wrap.on .txt_box {
  transform: none;
  opacity: 1;
}
.mainCont2_wrap .inner {
  position: relative;
  z-index: 3;
}
.mainCont2_wrap .txt_box {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  height: 100vh;
  transform: translateY(2em) rotate(0.001deg);
  opacity: 0;
  transition: transform 0.5s, opacity 0.5s;
}
.mainCont2_wrap .txt_box.on .txt {
  height: 0;
  opacity: 0;
}
.mainCont2_wrap .txt_box.on .scene_tit {
  height: 1em;
  opacity: 1;
}
.mainCont2_wrap .txt {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%) rotate(0.01deg);
  font-size: 1.8em;
  font-weight: 400;
  line-height: 1.5555555556;
  opacity: 0.9;
  transition: margin 1s, transform 0.5s, opacity 0.5s, height 0.5s;
  height: 6em;
}
@media screen and (max-width: 1280px) {
  .mainCont2_wrap .txt {
    font-size: 1em;
  }
}
.mainCont2_wrap .scene_tit {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%) rotate(0.01deg);
  text-align: center;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  font-size: 4.8em;
  gap: 0.15625em;
  font-weight: bold;
  line-height: 1;
  letter-spacing: -2.4px;
  height: 0;
  transition: height 1s, opacity 1s;
  overflow: hidden;
  opacity: 0;
}
.mainCont2_wrap .scene_tit::before, .mainCont2_wrap .scene_tit::after {
  content: "";
  display: block;
  width: 0.55em;
  height: 0.4625em;
  display: block;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center;
}
.mainCont2_wrap .scene_tit::before {
  background-image: url("/resource/images/common/dbqt_r.png");
}
.mainCont2_wrap .scene_tit::after {
  background-image: url("/resource/images/common/dbqt_l.png");
}
@media screen and (max-width: 1280px) {
  .mainCont2_wrap .scene_tit {
    font-size: 2.2em;
    gap: 0.3636363636em;
  }
  .mainCont2_wrap .scene_tit::before, .mainCont2_wrap .scene_tit::after {
    width: 0.6666666667em;
    height: 0.5606060606em;
  }
}

#mainCont3 .mainCont3_temp {
  min-height: calc(var(--vh, 1vh) * 100);
}
#mainCont3 .mainCont3_wrap {
  --top-gap: 6.3em;
  position: fixed;
  top: 0 !important;
  left: 0;
  transform: none !important;
  background: url("/resource/images/main/mCont3_bg.jpg") no-repeat center/cover;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100);
}
@media screen and (max-width: 1280px) {
  #mainCont3 .mainCont3_wrap {
    min-height: calc(var(--vh, 1vh) * 100);
    height: 100%;
  }
}
#mainCont3 .mainCont3_wrap.on .cloude_l {
  transform: translateX(-30%);
}
#mainCont3 .mainCont3_wrap.on .cloude_r {
  transform: translateX(30%);
}
#mainCont3 .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
}
#mainCont3 .mCont3_txt {
  position: absolute;
  left: 0;
  width: 100%;
  top: var(--top-gap);
  transform: translateY(0);
  text-align: center;
  font-weight: 400;
}
#mainCont3 .mCont3_txt .subs {
  display: block;
  font-size: 3.6em;
  color: #192b53;
  letter-spacing: -3.6px;
  line-height: 1;
  margin-top: 0.4444444444em;
}
#mainCont3 .mCont3_txt .img {
  height: 3.85em;
}
#mainCont3 .mCont3_txt .img img {
  height: 100%;
}
@media screen and (max-width: 1280px) {
  #mainCont3 .mCont3_txt {
    position: relative;
    margin-top: auto;
    top: auto;
  }
  #mainCont3 .mCont3_txt .subs {
    font-size: 1.8666666667em;
    letter-spacing: -2.8px;
    margin-top: 0.5357142857em;
  }
  #mainCont3 .mCont3_txt .img {
    height: 1.5333333333em;
  }
}
#mainCont3 .product_box {
  display: flex;
  align-items: stretch;
  justify-content: center;
  margin-top: auto;
}
#mainCont3 .product_box .megatrue {
  opacity: 1;
}
#mainCont3 .product_box.on .mega, #mainCont3 .product_box.on .true {
  opacity: 1;
}
@media screen and (max-width: 1280px) {
  #mainCont3 .product_box {
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 2.3333333333em;
  }
  #mainCont3 .product_box .mega {
    order: 0;
    margin-left: auto;
  }
  #mainCont3 .product_box .true {
    order: 1;
    margin-right: auto;
  }
  #mainCont3 .product_box .megatrue {
    width: 100%;
    order: 2;
    text-align: center;
  }
}
#mainCont3 .product_box, #mainCont3 .product_box .megatrue_img {
  height: 34.1em;
}
#mainCont3 .product_box {
  height: auto;
}
#mainCont3 .mega, #mainCont3 .true {
  margin-top: 6.25em;
  opacity: 0;
  transition: opacity 0.725s;
}
@media screen and (max-width: 1280px) {
  #mainCont3 .mega, #mainCont3 .true {
    margin-top: 0;
  }
}
#mainCont3 .mega {
  width: 22.75em;
  height: 10.9em;
  background: url("/resource/images/main/mega.png") no-repeat center/100% auto;
  transform: translateX(1.85em);
}
@media screen and (max-width: 1280px) {
  #mainCont3 .mega {
    width: 9.6666666667em;
    height: 4.6333333333em;
    transform: none;
  }
}
#mainCont3 .true {
  width: 22.15em;
  height: 10.85em;
  background: url("/resource/images/main/true.png") no-repeat center/100% auto;
  transform: translateX(-1.35em);
}
@media screen and (max-width: 1280px) {
  #mainCont3 .true {
    width: 9.4333333333em;
    height: 4.6333333333em;
    transform: none;
  }
}
#mainCont3 .product_box .megatrue {
  max-height: none;
}
@media screen and (max-width: 1280px) {
  #mainCont3 .product_box .megatrue_img {
    margin-top: 2.8333333333em;
    max-height: 23.0666666667em;
    height: calc(var(--vh, 1vh) * 50);
  }
}
#mainCont3 .obj {
  overflow: hidden;
  position: absolute;
  pointer-events: none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: -1;
}
#mainCont3 .obj .cloude {
  position: absolute;
  transition: transform 0.825s;
}
#mainCont3 .obj .cloude_l {
  top: 0;
  left: 0;
  transform: translateX(-100%);
  height: 44.2em;
}
#mainCont3 .obj .cloude_r {
  top: 0;
  right: 0;
  transform: translateX(100%);
  height: 32.8em;
}
#mainCont3 .obj .cloude img {
  max-width: auto;
  height: 100%;
}
@media screen and (max-width: 1280px) {
  #mainCont3 .obj .cloude_l {
    height: 26.6333333333em;
  }
  #mainCont3 .obj .cloude_r {
    top: 20.01vh;
    height: 16.7666666667em;
  }
}

#mainCont4 .mainCont4_wrap {
  background-color: var(--color-white);
  width: 100%;
  min-height: calc(var(--vh, 1vh) * 100);
  height: auto;
  padding: 4em 0;
}
@media screen and (max-width: 1280px) {
  #mainCont4 .mainCont4_wrap {
    padding: 4em 0;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont4 .mainCont4_wrap {
    height: auto;
    min-height: auto;
  }
}
#mainCont4 .wrap {
  text-align: center;
}
#mainCont4 .spread_wrap {
  position: relative;
  z-index: 10;
}
#mainCont4 .spread_wrap .inner {
  display: flex;
  gap: 1.2em;
}
@media screen and (max-width: 1024px) {
  #mainCont4 .spread_wrap .inner {
    flex-wrap: wrap;
  }
}
#mainCont4 .spread_wrap .spread_tit {
  font-size: 1.5em;
  font-weight: bold;
  line-height: 1.4;
}
@media screen and (max-width: 1024px) {
  #mainCont4 .spread_wrap .spread_tit br {
    display: none;
  }
}
#mainCont4 .spread_wrap .spread_item {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  width: 22.5%;
  min-height: 35.25em;
  text-align: left;
  transition: width 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  overflow: hidden;
}
@media screen and (max-width: 1280px) {
  #mainCont4 .spread_wrap .spread_item {
    width: 20%;
    min-height: 28.5em;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont4 .spread_wrap .spread_item {
    width: 100%;
    flex-direction: column-reverse;
    justify-content: flex-start;
    min-height: auto;
  }
}
#mainCont4 .spread_wrap .spread_item .txt_box {
  display: none;
  flex-direction: column;
  max-width: 58%;
  flex: 1 1;
  white-space: nowrap;
  background-color: #f9f9f9;
  padding-top: 4.25em;
  padding-left: 3em;
  padding-right: 1em;
  padding-bottom: 4.25em;
}
#mainCont4 .spread_wrap .spread_item .txt_box .spread_tit {
  font-size: 1.8em;
  margin-bottom: 1.25em;
}
@media screen and (max-width: 1280px) {
  #mainCont4 .spread_wrap .spread_item .txt_box {
    padding: 2em 1.3333333333em;
    max-width: 62%;
  }
  #mainCont4 .spread_wrap .spread_item .txt_box .spread_tit {
    font-size: 1.5333333333em;
    margin-bottom: 1.1956521739em;
  }
  #mainCont4 .spread_wrap .spread_item .txt_box .circle_list {
    font-size: 0.9333333333em;
  }
  #mainCont4 .spread_wrap .spread_item .txt_box .circle_list > li::before {
    margin-top: 0.5714285714em;
    width: 0.2857142857em;
    height: 0.2857142857em;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont4 .spread_wrap .spread_item .txt_box {
    display: flex;
    padding: 2em 2em;
    max-width: 100%;
    white-space: normal;
  }
  #mainCont4 .spread_wrap .spread_item .txt_box br {
    display: none;
  }
}
#mainCont4 .spread_wrap .spread_item.on {
  width: 55%;
  max-width: 55%;
}
@media screen and (max-width: 1280px) {
  #mainCont4 .spread_wrap .spread_item.on {
    width: 64%;
    max-width: 64%;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont4 .spread_wrap .spread_item.on {
    width: 100%;
    max-width: 100%;
  }
}
#mainCont4 .spread_wrap .spread_item.on .txt_box {
  display: flex;
}
#mainCont4 .spread_wrap .spread_item.on .img_box {
  width: 42%;
  min-width: 16.5em;
}
#mainCont4 .spread_wrap .spread_item.on .img_box::after {
  transform: scaleY(0);
  opacity: 0;
}
#mainCont4 .spread_wrap .spread_item.on .img_box::before, #mainCont4 .spread_wrap .spread_item.on .img_box .spread_tit {
  opacity: 0;
}
@media screen and (max-width: 1280px) {
  #mainCont4 .spread_wrap .spread_item.on .img_box {
    width: 40%;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont4 .spread_wrap .spread_item.on .img_box {
    width: 100%;
    min-width: 100%;
  }
}
#mainCont4 .spread_wrap .spread_item .img_box {
  position: relative;
  width: 100%;
  padding: 4.25em 1em 4.25em 1.75em;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  color: var(--color-white);
  overflow: hidden;
  cursor: pointer;
}
@media screen and (max-width: 800px) {
  #mainCont4 .spread_wrap .spread_item .img_box {
    cursor: auto;
    height: 15em;
  }
}
#mainCont4 .spread_wrap .spread_item .img_box::before {
  content: "";
  display: block;
  position: relative;
  width: 3em;
  height: 3em;
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 1.5em;
  z-index: 2;
}
#mainCont4 .spread_wrap .spread_item .img_box::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom, #000 2%, rgba(255, 255, 255, 0));
  z-index: 1;
  transition: transform 0.35s, opacity 0.4s;
  transform-origin: top;
}
@media screen and (max-width: 1024px) {
  #mainCont4 .spread_wrap .spread_item .img_box::after {
    display: none;
  }
}
#mainCont4 .spread_wrap .spread_item .img_box .spread_tit {
  position: relative;
  display: block;
  z-index: 3;
}
#mainCont4 .spread_wrap .spread_item .img_box::before,
#mainCont4 .spread_wrap .spread_item .img_box .spread_tit {
  transition: opacity 0.35s;
}
@media screen and (max-width: 1280px) {
  #mainCont4 .spread_wrap .spread_item .img_box::before,
  #mainCont4 .spread_wrap .spread_item .img_box .spread_tit {
    display: none;
  }
}
#mainCont4 .spread_wrap .spread_item.poll .img_box {
  background-image: url("/resource/images/main/spread_img01.jpg");
}
#mainCont4 .spread_wrap .spread_item.poll .img_box::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg data-name='그룹 13220'%3E%3Cg data-name='그룹 13219' transform='translate(6 4)' style='clip-path:url(%23x1h54u7zla)'%3E%3Cpath data-name='선 138' transform='translate(23.988 1.08)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M0 0v7.414'/%3E%3Cpath data-name='선 139' transform='translate(23.988 46.652)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M0 0v4.3'/%3E%3Cpath data-name='패스 11074' d='M44.911 10.819A27.028 27.028 0 0 1 24.908 2a27.03 27.03 0 0 1-20 8.819A27.427 27.427 0 0 1 2 10.662V24.17a28.987 28.987 0 0 0 22.908 28.337A28.987 28.987 0 0 0 47.815 24.17V10.662a27.427 27.427 0 0 1-2.904.157z' transform='translate(-.92 -.92)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3C/g%3E%3C/g%3E%3Cg data-name='그룹 13218'%3E%3Cg data-name='그룹 13217' transform='translate(16.799 19.048)' style='clip-path:url(%23uxb46ysq4b)'%3E%3Cpath data-name='패스 11070' d='M46.505 6.522a8.827 8.827 0 0 1 4.766-1.208 13.947 13.947 0 0 1 1.9.133v2.077L60.335 3.4 53.17 0v2.151a17.309 17.309 0 0 0-1.9-.108 12.035 12.035 0 0 0-6.549 1.736 8.474 8.474 0 0 0-1.21.938 7.435 7.435 0 0 1 1.564 3.128 5.909 5.909 0 0 1 1.429-1.322' transform='translate(-30.417)' style='stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath data-name='패스 11071' d='M2.871 53.809a15.512 15.512 0 0 0 1.558.083h.019A9.917 9.917 0 0 0 9.7 52.539a8.2 8.2 0 0 0 1.781-1.476 6.307 6.307 0 0 1-1.564-3.453 5.822 5.822 0 0 1-.225.406A5.064 5.064 0 0 1 7.913 49.8a6.722 6.722 0 0 1-3.485.824 11.814 11.814 0 0 1-1.3-.074l-.085-.008h-2v3.271z' transform='translate(-.73 -33.281)' style='stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath data-name='패스 11072' d='M0 18.319z' transform='translate(0 -12.805)' style='fill:%23fff'/%3E%3Cpath data-name='패스 11073' d='M23.32 21.731H22l-.084.009a12.1 12.1 0 0 1-1.3.074 6.66 6.66 0 0 1-3.562-.872 5.5 5.5 0 0 1-2.254-2.911 7.4 7.4 0 0 1-.339-1.3 6.863 6.863 0 0 1-.05-.373c0-.04-.005-.069-.007-.084v-.054l-.005-.054c-.391-3.868-2.167-6.492-4.384-7.9a12.019 12.019 0 0 0-6.55-1.747 17.3 17.3 0 0 0-2.42.173v3.314a13.685 13.685 0 0 1 2.42-.216A8.822 8.822 0 0 1 8.23 11c1.391.932 2.552 2.4 2.914 5.509a10.277 10.277 0 0 0 1.3 4.2 8.4 8.4 0 0 0 2.91 3.029 9.919 9.919 0 0 0 5.25 1.352h.019q.748 0 1.557-.083h1.14v2.126l7.165-4.12L23.32 19.6z' transform='translate(-.73 -4.557)' style='stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3C/g%3E%3C/g%3E%3Cpath data-name='사각형 1395' style='fill:none' d='M0 0h60v60H0z'/%3E%3C/svg%3E%0A");
}
#mainCont4 .spread_wrap .spread_item.quality .img_box {
  background-image: url("/resource/images/main/spread_img02.jpg");
}
#mainCont4 .spread_wrap .spread_item.quality .img_box::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg transform='translate(-1197 -399)'%3E%3Cg data-name='그룹 13155' transform='translate(1199 402)'%3E%3Cpath data-name='패스 11061' d='M10.751 60.333 2.5 70.428l8.251 1.6 3.672 7.559 8.285-10.116' transform='translate(-1.157 -27.912)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath data-name='패스 11062' d='m76.978 59.333 7.49 10.632-8.251 1.6-3.673 7.559-8.105-10.477' transform='translate(-29.812 -27.45)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3C/g%3E%3Cpath data-name='패스 11063' d='m52.331 24.588 2.7-6.827-6.193-3.938L47 6.718l-7.323.446L34.016 2.5l-5.662 4.664-7.323-.446-1.831 7.105-6.2 3.938 2.7 6.827-2.7 6.827 6.2 3.938 1.835 7.1 7.323-.446 5.662 4.664 5.662-4.664 7.318.451 1.835-7.106 6.193-3.937z' transform='translate(1192.984 400.843)' style='fill:none'/%3E%3Cg data-name='그룹 13157' style='clip-path:url(%23m7jsxy3tub)' transform='translate(1199 402)'%3E%3Cpath data-name='패스 11064' d='m52.331 24.588 2.7-6.827-6.193-3.938L47 6.718l-7.323.446L34.016 2.5l-5.662 4.664-7.323-.446-1.831 7.105-6.2 3.938 2.7 6.827-2.7 6.827 6.2 3.938 1.835 7.1 7.323-.446 5.662 4.664 5.662-4.664 7.318.451 1.835-7.106 6.193-3.937z' transform='translate(-6.016 -1.156)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath data-name='패스 11065' d='M54.175 30.8A14.878 14.878 0 1 0 39.3 45.674 14.878 14.878 0 0 0 54.175 30.8' transform='translate(-11.298 -7.364)' style='fill:none'/%3E%3Cpath data-name='패스 11066' d='M54.175 30.8A14.878 14.878 0 1 0 39.3 45.674 14.878 14.878 0 0 0 54.175 30.8z' transform='translate(-11.298 -7.364)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath data-name='패스 11067' d='m45.028 26.175 1.662 5.114h5.376a1.4 1.4 0 0 1 .821 2.526l-4.349 3.16 1.662 5.113a1.4 1.4 0 0 1-2.149 1.561L43.7 40.49l-4.35 3.16a1.4 1.4 0 0 1-2.15-1.562l1.662-5.113-4.349-3.16a1.4 1.4 0 0 1 .821-2.526h5.376l1.662-5.114a1.4 1.4 0 0 1 2.656 0z' transform='translate(-15.699 -11.663)' style='stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
#mainCont4 .spread_wrap .spread_item.vitamin .img_box {
  background-image: url("/resource/images/main/spread_img03.jpg");
}
#mainCont4 .spread_wrap .spread_item.vitamin .img_box::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg transform='translate(-1402 -450)'%3E%3Cpath d='M54.151 88.711a5.924 5.924 0 0 1-5.924 5.924h-3.66a5.924 5.924 0 0 1-5.924-5.924' transform='translate(1385.174 409.274)' style='stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath d='M54.151 88.711a5.924 5.924 0 0 1-5.924 5.924h-3.66a5.924 5.924 0 0 1-5.924-5.924' transform='translate(1385.174 415.034)' style='fill:none'/%3E%3Cpath d='M56.571 19.428a16.928 16.928 0 1 0-28.293 12.538 6.856 6.856 0 0 1 2.2 5.092v2.4h18.335v-2.4a6.852 6.852 0 0 1 2.195-5.09 16.874 16.874 0 0 0 5.563-12.54' transform='translate(1391.927 451.59)' style='fill:none'/%3E%3Cpath d='M56.571 19.428a16.928 16.928 0 1 0-28.293 12.538 6.856 6.856 0 0 1 2.2 5.092v2.4h18.335v-2.4a6.852 6.852 0 0 1 2.195-5.09 16.874 16.874 0 0 0 5.563-12.54z' transform='translate(1391.927 451.59)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath d='M52.426 72.876H32.677a3.1 3.1 0 1 1 0-6.207h19.749a3.1 3.1 0 1 1 0 6.207z' transform='translate(1389.02 424.956)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath d='M37.765 28.951a4.31 4.31 0 0 0 0 8.62h4.31v-4.31a4.31 4.31 0 0 0-4.31-4.31z' transform='translate(1387.374 440.374)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath d='M64.41 33.262a4.31 4.31 0 0 0-8.62 0v4.31h4.31a4.31 4.31 0 0 0 4.31-4.31z' transform='translate(1377.903 440.374)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath d='M52.666 55.752V43.918h-4.244v11.834' transform='translate(1381.027 434.028)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none'/%3E%3Cpath transform='translate(1403 470.803)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M5.099 0H0'/%3E%3Cpath transform='translate(1455.044 470.803)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M5.099 0H0'/%3E%3Cpath transform='translate(1406.682 456.773)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M4.442 2.504 0 0'/%3E%3Cpath transform='translate(1452.02 482.328)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M4.442 2.504 0 0'/%3E%3Cpath transform='translate(1452.02 456.773)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M0 2.504 4.442 0'/%3E%3Cpath transform='translate(1406.682 482.328)' style='stroke-linecap:round;stroke-linejoin:round;stroke:%23fff;stroke-width:1.5px;fill:none' d='M0 2.504 4.442 0'/%3E%3C/g%3E%3C/svg%3E%0A");
}
#mainCont4 .info_box {
  border: 1px solid var(--brand-color-sub2);
  background-color: var(--color-white);
}
#mainCont4 .info_box .info_box_txt {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--brand-color-sub2);
  font-size: 1.4em;
  color: var(--color-white);
  font-weight: bold;
  min-height: 2.8571428571em;
}
@media screen and (max-width: 1280px) {
  #mainCont4 .info_box .info_box_txt {
    font-size: 0.9333333333em;
    min-height: 2.9642857143em;
  }
}

.point_tit {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 2.8em;
  font-weight: bold;
  gap: 0.3571428571em;
  margin-bottom: 0.7142857143em;
  color: var(--brand-color-sub2);
  letter-spacing: -1.4px;
  line-height: 1.35;
}
.point_tit .point {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.4285714286em;
  height: 2.3333333333em;
  border-radius: 2.3333333333em;
  overflow: hidden;
  color: var(--brand-color-sub2);
  box-shadow: inset 0 0 0 0.25rem var(--brand-color-sub2);
  background-color: var(--color-white);
}
.point_tit .point::before {
  content: "POINT";
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--brand-color-sub2);
  color: var(--color-white);
  font-size: 0.75em;
  letter-spacing: 0;
  height: 100%;
  padding-left: 0.8888888889em;
  padding-right: 0.4444444444em;
}
.point_tit .point .numb {
  display: block;
  font-weight: 900;
  padding-left: 0.4583333333em;
  padding-right: 0.625em;
}
@media screen and (max-width: 1280px) {
  .point_tit {
    font-size: 2em;
    gap: 0.5em;
    margin-bottom: 0.7291666667em;
  }
  .point_tit .point {
    font-size: 0.5em;
    height: 2.3333333333em;
    border-radius: 2.3333333333em;
    box-shadow: inset 0 0 0 0.125rem var(--brand-color-sub2);
  }
  .point_tit .point::before {
    font-size: 0.8em;
    padding-left: 0.6666666667em;
    padding-right: 0.3333333333em;
  }
}

.point_txt {
  font-size: 2em;
  color: #444;
  letter-spacing: -1.2px;
  line-height: 1.25;
  margin-bottom: 0.75em;
}
.point_txt .point {
  display: block;
  font-weight: bold;
  font-size: 1em;
  letter-spacing: -1.4px;
  margin-bottom: 0.125em;
}
.point_txt .point.semi {
  font-weight: 500;
}
.point_txt .txt {
  font-size: 0.55em;
  margin-top: 1.0909090909em;
  line-height: 1.4545454545;
  font-weight: 400;
  color: #222;
  letter-spacing: 0;
}
@media screen and (max-width: 1280px) {
  .point_txt {
    font-size: 1.2em;
    line-height: 1.2777777778;
    margin-bottom: 1.6666666667em;
  }
  .point_txt .point {
    font-size: 1.3888888889em;
    letter-spacing: -1.25px;
    margin-bottom: 0.3em;
  }
  .point_txt .txt {
    font-size: 0.9411764706em;
    margin-top: 0.78125em;
  }
}

.info_icon_lists {
  display: flex;
  flex-wrap: wrap;
  padding-top: 3em;
  padding-bottom: 3em;
  overflow: hidden;
}
@media screen and (max-width: 1280px) {
  .info_icon_lists {
    padding-top: 0.6666666667em;
    padding-bottom: 1.1666666667em;
  }
}
@media screen and (max-width: 1024px) {
  .info_icon_lists {
    padding-left: 1.3333333333em;
    padding-right: 1.3333333333em;
  }
}
.info_icon_lists .inn {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  width: 33.3333%;
  padding-left: 3em;
  padding-right: 3em;
  overflow: hidden;
}
.info_icon_lists .inn::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: calc(100% - 0.9em);
  margin-top: 0.6em;
  background: url("/resource/images/common/line_bar.svg") repeat-y center top/100% auto;
}
.info_icon_lists .inn:last-child::after {
  display: none;
}
@media screen and (max-width: 1280px) {
  .info_icon_lists .inn {
    padding-left: 0.6666666667em;
    padding-right: 0.6666666667em;
  }
}
@media screen and (max-width: 1024px) {
  .info_icon_lists .inn {
    width: 100%;
    flex-direction: row;
    align-items: center;
    gap: 0.6666666667em;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0.6666666667em;
    margin-bottom: 0.6333333333em;
  }
  .info_icon_lists .inn::after {
    width: 100%;
    height: 1px;
    margin-top: 0;
    top: auto;
    bottom: 0;
    background-image: url("/resource/images/common/line_var_m.svg");
    background-repeat: repeat-x;
  }
  .info_icon_lists .inn:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
  }
  .info_icon_lists .inn .tit_box {
    min-width: 8em;
    width: 8em;
  }
}
.info_icon_lists .tit_box {
  margin-bottom: 1.5em;
}
@media screen and (max-width: 1024px) {
  .info_icon_lists .tit_box {
    margin-bottom: 0;
  }
}
.info_icon_lists .icon_box {
  display: block;
  width: 6em;
  height: 6em;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.15em;
}
.info_icon_lists .icon_box img {
  width: 100%;
}
@media screen and (max-width: 1280px) {
  .info_icon_lists .icon_box {
    width: 4em;
    height: 4em;
    margin-bottom: 0.6666666667em;
  }
}
.info_icon_lists .info_icon_tit {
  font-size: 1.45em;
  font-weight: bold;
  color: #222;
  line-height: 1.3448275862;
}
@media screen and (max-width: 1280px) {
  .info_icon_lists .info_icon_tit {
    font-size: 1em;
  }
}
@media screen and (max-width: 1024px) {
  .info_icon_lists .info_icon_tit {
    margin-bottom: 0;
  }
}

.circle_list {
  font-size: 1.125rem;
  color: var(--color-grey2);
  font-weight: 400;
  text-align: left;
}
.circle_list > li {
  display: flex;
  align-items: flex-start;
  gap: 0.4444444444em;
  line-height: 1.5;
}
.circle_list > li::before {
  content: "";
  display: block;
  width: 0.4444444444em;
  height: 0.4444444444em;
  flex: 0 0 auto;
  background-color: var(--brand-color-sub2);
  border-radius: 50%;
  margin-top: 0.5em;
}
.circle_list > li + li {
  margin-top: 1.3333333333em;
}
@media screen and (max-width: 1280px) {
  .circle_list {
    font-size: 0.7333333333em;
  }
  .circle_list > li {
    gap: 0.3636363636em;
  }
  .circle_list > li::before {
    width: 0.3636363636em;
    height: 0.3636363636em;
    margin-top: 0.3636363636em;
  }
  .circle_list > li + li {
    margin-top: 0.6818181818em;
  }
}

.mega_tit {
  width: 100%;
  text-align: center;
  font-size: 3.5em;
  font-weight: 400;
  font-family: "GmarketSans", sans-serif;
  color: #ff7700;
  letter-spacing: -1.75px;
}
.mega_tit .point {
  display: block;
  font-size: 1.7142857143em;
  font-weight: 900;
  color: var(--color-black);
  letter-spacing: -3px;
  line-height: 1.35;
}
@media screen and (max-width: 1280px) {
  .mega_tit {
    font-size: 2.1333333333em;
  }
  .mega_tit .point {
    font-size: 1.875em;
    margin-top: 0.2083333333em;
    line-height: 1.15;
  }
}

#mainCont5 {
  background-color: #feefe4;
}
#mainCont5 .mainCont5_wrap {
  display: flex;
  align-items: center;
  height: calc(var(--vh, 1vh) * 100);
  padding-top: 3em;
  padding-bottom: 3em;
}
@media screen and (max-width: 1280px) {
  #mainCont5 .mainCont5_wrap {
    padding-top: 4em;
    padding-bottom: 4em;
    height: auto;
  }
}
@media screen and (max-width: 800px) {
  #mainCont5 .mainCont5_wrap {
    min-height: 100vh;
  }
}
#mainCont5 .split_box {
  display: flex;
  align-items: stretch;
  gap: 1.6em;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  #mainCont5 .split_box {
    gap: 1.3333333333em;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont5 .split_box {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
#mainCont5 .left {
  text-align: left;
  width: calc(100% - 43.85em);
}
#mainCont5 .left .point_tit {
  justify-content: flex-start;
}
@media screen and (max-width: 1280px) {
  #mainCont5 .left {
    width: calc(100% - 33.45em);
  }
}
@media screen and (max-width: 1024px) {
  #mainCont5 .left {
    width: 100%;
    text-align: center;
  }
  #mainCont5 .left .point_tit {
    justify-content: center;
  }
}
#mainCont5 .right {
  width: 43.85em;
  text-align: center;
}
@media screen and (max-width: 1280px) {
  #mainCont5 .right {
    width: 33.45em;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont5 .right {
    width: 100%;
    margin-top: 2.3333333333em;
  }
}
#mainCont5 .txt {
  max-width: 23.6363636364em;
}
@media screen and (max-width: 1280px) {
  #mainCont5 .txt {
    max-width: 100%;
  }
}

#mainCont6 {
  background-color: #fee9e4;
}
#mainCont6 .mainCont6_wrap {
  display: flex;
  align-items: center;
  min-height: calc(var(--vh, 1vh) * 100);
  padding-top: 4em;
  padding-bottom: 4em;
}
#mainCont6 .graph_box .wid_33p {
  width: calc(33.3333333333% - 0.6666666667 * 0.7em);
}
#mainCont6 .graph_box .wid_50p {
  width: 50%;
}
#mainCont6 .graph_box .ps {
  font-size: 0.7em;
  margin-top: 1.0714285714em;
  border-top: 1px solid #ccc;
  padding-top: 1.1428571429em;
  line-height: 1.4285714286;
  color: #111;
}
#mainCont6 .graph_box .ps.nth_2 {
  margin-left: calc(-100% + (0.7em * -1));
}
@media screen and (max-width: 1280px) {
  #mainCont6 .graph_box .ps {
    font-size: 0.6666666667em;
    margin-top: 1.75em;
    padding-top: 0.8em;
  }
}
@media screen and (max-width: 800px) {
  #mainCont6 .graph_box .ps.nth_2 {
    margin-left: 0;
  }
}
@media screen and (max-width: 1024px) {
  #mainCont6 .graph_box .wid_33p {
    width: calc(50% - 0.5 * 2em);
  }
  #mainCont6 .graph_box .wid_33p:first-child {
    width: 100%;
  }
  #mainCont6 .graph_box .graph {
    background-color: var(--color-white);
  }
  #mainCont6 .graph_box .wid_50p {
    width: 100%;
  }
}
@media screen and (max-width: 800px) {
  #mainCont6 .graph_box .wid_33p, #mainCont6 .graph_box .wid_50p {
    width: 100%;
  }
}
#mainCont6 .graph_list {
  display: flex;
  gap: 0.7em;
}
#mainCont6 .graph_list .graph {
  text-align: center;
}
@media screen and (max-width: 1280px) {
  #mainCont6 .graph_list {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 800px) {
  #mainCont6 .graph_list {
    gap: 2em;
  }
}
#mainCont6 .graph_list .graph_list {
  gap: 0.4em;
}
@media screen and (max-width: 800px) {
  #mainCont6 .graph_list .graph_list {
    gap: 1.3333333333em;
  }
}

.click_btn {
  display: inline-flex;
  position: relative;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  z-index: 10;
}
@media screen and (max-width: 1280px) {
  .click_btn {
    max-width: calc(100% - 6em);
    text-align: center;
  }
}
@media screen and (max-width: 601px) {
  .click_btn {
    max-width: calc(100% - 6.6666666667em);
  }
}
.click_btn .btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #a21313;
  font-size: 1.8em;
  height: 3.8333333333em;
  border-radius: 3.8333333333em;
  margin-top: 1.6944444444em;
  width: 13.9375em;
  padding-top: 0.2222222222em;
  padding-bottom: 0.2222222222em;
  padding-left: 1.3888888889em;
  padding-right: 1.3888888889em;
  font-weight: 400;
  text-align: center;
  overflow: hidden;
  color: #fff;
  border: 0;
}
.click_btn .btn::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  background-color: var(--brand-color-sub2);
  z-index: 1;
  transition: width 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.click_btn .btn .txt {
  display: inline-block;
  position: relative;
  z-index: 5;
}
@media screen and (min-width: 1025px), print {
  .click_btn .btn:hover::before {
    width: 100%;
  }
}
@media screen and (max-width: 1280px) {
  .click_btn .btn {
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    padding-left: 1.25em;
    padding-right: 1.25em;
    font-size: 1.3333333333em;
    height: 3.625em;
    border-radius: 3.625em;
    margin-top: 1.6em;
    min-width: 200px;
    max-width: 100%;
  }
}
@media screen and (max-width: 800px) {
  .click_btn .btn {
    animation: scaleAnimBtn 1.4s both infinite;
  }
}
.click_btn .click_anim {
  font-size: 1.2em;
  position: absolute;
  left: 100%;
  bottom: 50%;
  transform: translateY(50%);
  transform-origin: left;
  margin-left: 0.8333333333em;
  font-weight: bold;
  font-family: "GmarketSans", sans-serif;
  animation: scaleAnim 1.4s both infinite;
}
.click_btn .click_anim::after {
  content: "";
  display: block;
  width: 2.7916666667em;
  height: 2.3333333333em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='67' height='56' viewBox='0 0 67.5 56.4'%3E%3Cg%3E%3Cpath fill='%23CC0D0D' d='M30.8,14.9C30.7,14.8,30.7,14.7,30.8,14.9L30.8,14.9z'/%3E%3Cpath fill='%23CC0D0D' d='M20.1,23.5c0,0.1,0.1,0.2,0.1,0.3C20.2,23.8,20.2,23.8,20.1,23.5z'/%3E%3Cpath fill='%23CC0D0D' d='M66.2,0.6c-0.6-0.5-1.9-0.9-2.1,0.2c-0.9,4.6-2.8,9-5.5,12.8c-4.5,6.5-10.7,11.5-18,14.5 c-2.2,0.9-4.6,1.6-7,1.9c2-5.1,2.3-10.7-0.2-15.7c-2.4-4.9-10-9.9-14.5-4.6c-1.6,2.1-2.5,4.5-2.6,7.1c-0.3,2.8,0.1,5.7,1.2,8.3 c1.4,3.5,4,6.4,7.3,8.1c0.7,0.3,1.3,0.5,2,0.7c-0.4,0.5-0.8,1-1.2,1.4c-2.7,3-6,5.3-9.7,6.8c-2.9,1.2-6.1,2.3-9.3,2.1 c0.3-0.4,0.7-0.8,1-1.2c2.7-3.6,4.5-7.7,5.5-12.1c0.1-1.1-0.3-2.3-1.2-3c-0.6-0.5-1.9-0.9-2.1,0.2c-0.9,4.2-2.7,8.2-5.3,11.6 c-1.2,1.8-2.6,3.5-4.1,5c-0.7,0.7,0.1,2.4,0.6,3c4.1,4.1,9.4,6.8,15.1,7.8c2.8,0.6,5.6,0.8,8.4,0.7c2.1-0.1,0.3-4.4-1.6-4.3 c-0.8,0-1.5,0-2.3,0c-0.4-0.1-0.8-0.1-1.2-0.1c-0.1,0-0.3,0-0.4,0c-1.2-0.1-2.4-0.3-3.6-0.5c-2.2-0.4-4.5-1.1-6.6-2 c-0.6-0.2-1.1-0.5-1.6-0.8c4.1,0.2,8.2-1.3,11.8-2.9c4.4-2.1,8.2-5.2,11-9.1c0.4-0.6,0.9-1.2,1.3-1.9c1.4,0,2.7-0.1,4.1-0.3 c7.8-1.4,15-5.2,20.6-10.7c5.6-5.3,10-12.3,11.4-20C67.5,2.5,67.1,1.3,66.2,0.6z M22.4,27.5C22.3,27.4,22.3,27.4,22.4,27.5 L22.4,27.5z M25.4,29.6C25.3,29.6,25.3,29.6,25.4,29.6L25.4,29.6z M27.4,30.1c-0.6-0.1-1.2-0.2-1.7-0.4c0,0-0.2-0.1-0.3-0.1 c-0.4-0.2-0.8-0.4-1.2-0.6c-0.2-0.1-0.3-0.2-0.5-0.3c-0.5-0.4,0.3,0.2-0.2-0.2c-0.3-0.3-0.6-0.5-0.9-0.8c0,0-0.1-0.1-0.2-0.2 c-0.4-0.4-0.7-0.8-1-1.2c0-0.1-0.1-0.1-0.1-0.1c0,0-0.1-0.1-0.1-0.2c-0.2-0.3-0.4-0.7-0.6-1.1c-0.2-0.3-0.3-0.7-0.4-1.1 c0-0.1-0.1-0.2-0.1-0.3c-0.1-0.6-0.2-1.2-0.3-1.8c0,0,0-0.1,0-0.1c0-0.1,0-0.1,0-0.2c0-0.1,0-0.2,0-0.3c-0.1-0.7,0-1.3,0-2 c0-0.3,0.1-0.6,0.1-0.9c-0.1,0.5,0,0,0-0.1s0.1-0.3,0.1-0.4c0.1-0.6,0.3-1.2,0.5-1.8c0.1-0.3,0.2-0.5,0.3-0.8 c-0.1,0.4,0.1-0.1,0.1-0.1c0.1-0.2,0.1-0.3,0.2-0.4c1-1.8,2.4-3,4.5-2.8c-0.3-0.1,0.2,0,0.3,0s0.3,0.1,0.4,0.1 c0.3,0.1,0.6,0.2,0.9,0.3c-0.3-0.1,0.2,0.1,0.2,0.1c0.2,0,0.3,0.1,0.5,0.2c0.4,0.2,0.7,0.4,1,0.6c0.6,0.4,1.1,0.8,1.5,1.3 c0.2,0.2,0.3,0.3,0.4,0.5c0,0,0,0,0,0c0.1,0.1,0.1,0.2,0.1,0.2c0.1,0.1,0.2,0.3,0.3,0.5c-0.2-0.5,0.1,0.1,0.1,0.2 c0.1,0.3,0.2,0.5,0.3,0.8c0,0,0.2,0.6,0.1,0.2c0.1,0.4,0.2,0.8,0.3,1.2c0.2,0.7,0.2,1.4,0.2,2.2c0,1.7-0.2,3.3-0.7,4.9 c-0.6,1.8-1.3,3.5-2.2,5.2C28.7,30.3,28,30.2,27.4,30.1z'/%3E%3Cpath fill='%23CC0D0D' d='M20.6,24.9C20.9,25.5,20.7,25,20.6,24.9L20.6,24.9z'/%3E%3C/g%3E%3C/svg%3E%0A") no-repeat center/100% auto;
}
.click_btn .click_anim::before {
  content: "Click!";
  display: block;
  position: absolute;
  bottom: 100%;
  right: 0;
  transform: translateX(50%);
  color: var(--color-red);
  font-weight: 900;
}
@media screen and (max-width: 1280px) {
  .click_btn .click_anim {
    font-size: 0.8666666667em;
    margin-left: 0.3846153846em;
  }
}
@media screen and (max-width: 800px) {
  .click_btn .click_anim {
    left: auto;
    right: 100%;
    margin-left: 0;
    margin-right: 0.3846153846em;
    animation: none;
  }
  .click_btn .click_anim::after {
    transform: scaleX(-1);
    transform-origin: center;
  }
  .click_btn .click_anim::before {
    transform: translateX(-50%);
  }
}

@keyframes scaleAnim {
  0% {
    transform: translateY(50%);
  }
  50% {
    transform: translateY(50%) scale(1.05);
  }
  100% {
    transform: translateY(50%);
  }
}
@keyframes scaleAnimBtn {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}
#mainCont7 {
  position: relative;
  z-index: 5;
  min-height: calc(var(--vh, 1vh) * 100);
  background: #fff url("/resource/images/main/mCont_bg7.png") repeat-y center 70%/cover;
}
@media screen and (max-width: 800px) {
  #mainCont7 {
    background-image: url("/resource/images/main/mCont_bg7_m.png");
    min-height: auto;
  }
}
#mainCont7 .inner {
  display: flex;
  align-items: center;
  justify-content: center;
  align-content: center;
  flex-wrap: wrap;
  width: 100%;
  min-height: calc(var(--vh, 1vh) * 100);
}
#mainCont7 .inner .inn {
  display: flex;
  flex-wrap: wrap;
}
@media all and (min-width: 1920px) {
  #mainCont7 .inner .inn {
    margin-top: 4.1em;
  }
}
@media all and (min-width: 1280px) and (max-height: 720px) {
  #mainCont7 .inner .inn {
    margin-top: calc(var(--vh, 1vh) * 7.5925);
  }
}
@media screen and (max-width: 1280px) {
  #mainCont7 .inner {
    margin-top: 0;
    height: auto;
    min-height: auto;
  }
}
#mainCont7 .objs {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: hidden;
}
#mainCont7 .objs .obj {
  position: absolute;
  background: no-repeat center/100% auto;
  transition: transform 1.25s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 1.25s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
}
#mainCont7 .objs.product {
  width: 100%;
  height: 50%;
  top: 50%;
  left: 0;
  padding-top: 5em;
}
#mainCont7 .objs.product .bottle {
  animation: 0.725s ease infinite alternate stepUp;
}
@media screen and (max-width: 800px) {
  #mainCont7 .objs.product .bottle {
    animation: none;
  }
}
#mainCont7 .objs.product .gold {
  animation-delay: 0.125s;
}
#mainCont7 .objs.product .focus {
  animation-delay: 0.25s;
}
#mainCont7 .objs.product .max {
  animation-delay: 0.3725s;
}
#mainCont7 .objs .power {
  width: 9.55em;
  background-image: url("/resource/images/main/mega_power.png");
  left: 6.25%;
}
#mainCont7 .objs .power::before {
  content: "";
  display: block;
  padding-top: 165.44%;
}
#mainCont7 .objs .gold {
  width: 12.05em;
  background-image: url("/resource/images/main/mega_gold.png");
  left: 21.875%;
}
#mainCont7 .objs .gold::before {
  content: "";
  display: block;
  padding-top: 138.589%;
}
#mainCont7 .objs .focus {
  width: 13.75em;
  background-image: url("/resource/images/main/mega_focus.png");
  left: auto;
  right: 23.63%;
}
#mainCont7 .objs .focus::before {
  content: "";
  display: block;
  padding-top: 123.6363%;
}
#mainCont7 .objs .max {
  top: 1.875em;
  width: 11.65em;
  background-image: url("/resource/images/main/mega_max.png");
  left: auto;
  right: 14.5104%;
}
#mainCont7 .objs .max::before {
  content: "";
  display: block;
  padding-top: 139.914%;
}
#mainCont7 .objs ._633 {
	width: 14.25em;
	background-image: url("/resource/images/main/mega__633.png");
	left: auto;
	right: 6.5104%;
  }
  #mainCont7 .objs ._633::before {
	content: "";
	display: block;
	padding-top: 137.623%;
  }
#mainCont7 .objs .bubble1 {
  width: 27.25em;
  top: 10.925vh;
  left: 24.73%;
  background-image: url("/resource/images/main/bubble1.png");
}
#mainCont7 .objs .bubble1::before {
  content: "";
  display: block;
  padding-top: 31.61634%;
}
#mainCont7 .objs .bubble2 {
  width: 18.05em;
  top: 27.777%;
  left: 5.78%;
  background-image: url("/resource/images/main/bubble2.png");
}
#mainCont7 .objs .bubble2::before {
  content: "";
  display: block;
  padding-top: 30.4245%;
}
#mainCont7 .objs .bubble3 {
  width: 22.7em;
  top: 7.4074vh;
  left: 56.71%;
  background-image: url("/resource/images/main/bubble3.png");
}
#mainCont7 .objs .bubble3::before {
  content: "";
  display: block;
  padding-top: 35.169%;
}
#mainCont7 .objs .bubble4 {
  width: 16.65em;
  top: 25.16vh;
  right: 5%;
  background-image: url("/resource/images/main/bubble4.png");
}
#mainCont7 .objs .bubble4::before {
  content: "";
  display: block;
  padding-top: 39.93%;
}

#mainCont7 .objs .bubble5 {
	width: 20.375em;
	top: 25.16vh;
	right: 2%;
	background-image: url("/resource/images/main/bubble4_1.png");
  }
  #mainCont7 .objs .bubble5::before {
	content: "";
	display: block;
	padding-top: 39.93%;
  }
#mainCont7 .objs .medicine1 {
  width: 6.5em;
  left: 15.88%;
  bottom: 10.4629vh;
  background-image: url("/resource/images/main/medicine1.png");
}
#mainCont7 .objs .medicine1::before {
  content: "";
  display: block;
  padding-top: 92.95%;
}
#mainCont7 .objs .medicine2 {
  width: 7.15em;
  left: 20.5729%;
  bottom: 4.7222vh;
  background-image: url("/resource/images/main/medicine2.png");
}
#mainCont7 .objs .medicine2::before {
  content: "";
  display: block;
  padding-top: 95.104%;
}
#mainCont7 .objs .medicine3 {
  width: 6.05em;
  right: 16.45%;
  bottom: 5.3703vh;
  background-image: url("/resource/images/main/medicine3.png");
}
#mainCont7 .objs .medicine3::before {
  content: "";
  display: block;
  padding-top: 80.33%;
}
#mainCont7 .objs [class*=bubble],
#mainCont7 .objs [class*=medicine],
#mainCont7 .objs [class*=bottle] {
  opacity: 0;
  transition: opacity 1.25s cubic-bezier(0.165, 0.84, 0.44, 1);
}
#mainCont7 .objs [class*=bottle] {
  transition-delay: 0.3125s;
}
#mainCont7 .objs [class*=medicine] {
  transition-delay: 0.525s;
}
@media screen and (max-width: 1280px) {
  #mainCont7 .objs {
    position: relative;
    height: auto;
  }
  #mainCont7 .objs.bubble {
    padding-top: 5em;
    display: flex;
    flex-direction: column;
  }
  #mainCont7 .objs.bubble [class*=bubble] {
    position: static;
    display: block;
  }
  #mainCont7 .objs.bubble .bubble1 {
    order: 1;
  }
  #mainCont7 .objs.bubble .bubble2 {
    order: 3;
  }
  #mainCont7 .objs.bubble .bubble3 {
    order: 2;
    margin-left: auto;
    margin-top: -4em;
  }
  #mainCont7 .objs.bubble .bubble4 {
    order: 4;
    margin-left: auto;
    margin-top: -4em;
  }
  #mainCont7 .objs.bubble .bubble5 {
    order: 4;
    margin-left: auto;
    margin-top: 0;
  }
  #mainCont7 .objs.product {
    position: relative;
    top: auto;
    left: auto;
    height: auto;
    padding-bottom: 1.7333333333em;
    padding-top: 1.6666666667em;
    text-align: center;
  }
  #mainCont7 .objs.product .product_inner {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  #mainCont7 .objs.product [class*=bottle] {
    position: static;
    display: block;
  }
  #mainCont7 .objs.product .power {
    margin-right: 1.1666666667em;
    width: 6.0666666667em;
  }
  #mainCont7 .objs.product .gold {
    margin-right: 0.6666666667em;
    width: 7.7583333333em;
  }
  #mainCont7 .objs.product .focus {
    margin-right: 0.6333333333em;
    width: 9.6833333333em;
  }
  #mainCont7 .objs.product .max {
    width: 7.5833333333em;
  }
  #mainCont7 .objs.product ._633 {
    width: 9.1833333333em;
  }
  #mainCont7 .objs .obj1 {
    left: 0;
    bottom: 0;
    width: 9.5em;
  }
  #mainCont7 .objs .obj2 {
    width: 8.4333333333em;
    left: 8em;
  }
  #mainCont7 .objs .obj3 {
    width: 11.6666666667em;
    top: 0;
    left: 19.33%;
    z-index: 4;
  }
  #mainCont7 .objs .obj4 {
    width: 7.7333333333em;
    top: 0;
    right: 0;
  }
  #mainCont7 .objs .bubble1 {
    width: 17.3333333333em;
    z-index: 2;
  }
  #mainCont7 .objs .bubble2 {
    width: 13.5333333333em;
    margin-left: 0.5em;
  }
  #mainCont7 .objs .bubble3 {
    width: 16.1666666667em;
  }
  #mainCont7 .objs .bubble4 {
    width: 12.7666666667em;
  }
  #mainCont7 .objs .bubble5 {
    width: 15.3666666667em;
  }

  #mainCont7 .objs .medicine1 {
    width: 3em;
    left: 14.33%;
    bottom: -0.4333333333em;
  }
  #mainCont7 .objs .medicine2 {
    width: 3em;
    left: 21.17%;
    bottom: -1.1666666667em;
  }
  #mainCont7 .objs .medicine3 {
    width: 4.05em;
    right: 17.91%;
    bottom: -1.3em;
  }
}
@media screen and (max-width: 800px) {
  #mainCont7 .objs.bubble .bubble1 {
    transition-delay: 0;
  }
  #mainCont7 .objs.bubble .bubble2 {
    transition-delay: 0.35s;
  }
  #mainCont7 .objs.bubble .bubble3 {
    transition-delay: 0.1725s;
    margin-top: -0.3333333333em;
  }
  #mainCont7 .objs.bubble .bubble4 {
    transition-delay: 0.525s;
    margin-top: -1.3333333333em;
  }
  #mainCont7 .objs.product .power {
    width: 3.4666666667em;
  }
  #mainCont7 .objs.product .gold {
    width: 4.4333333333em;
  }
  #mainCont7 .objs.product .focus {
    width: 5.5333333333em;
  }
  #mainCont7 .objs.product .max {
    width: 4.3333333333em;
  }
  #mainCont7 .objs.product ._633 {
    width: 5.183333em;
  }
  #mainCont7 .objs .medicine1 {
    width: 2em;
  }
  #mainCont7 .objs .medicine2 {
    width: 2em;
  }
  #mainCont7 .objs .medicine3 {
    width: 2.7em;
  }
}
@media screen and (max-width: 601px) {
  #mainCont7 .objs.bubble .bubble1 {
    transform: translateX(-6%);
  }
  #mainCont7 .objs.bubble .bubble3 {
    transform: translateX(7.5%);
  }
  #mainCont7 .objs.bubble .bubble4 {
    transform: translateX(10%);
  }
}
#mainCont7.on .obj {
  transform: translate(0);
  opacity: 1;
}

#mainCont8 {
  position: relative;
  z-index: 10;
  background-color: #fff;
}
#mainCont8::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  border-bottom: 1px solid #e2e2e2;
}
#mainCont8 .pdt_wrap {
  display: flex;
  gap: 1.6em;
}
#mainCont8 .pdt_wrap .txt_wrap, #mainCont8 .pdt_wrap .img_wrap {
  width: 50%;
}
#mainCont8 .pdt_wrap.st_0 .bg_item:nth-child(1) {
  transition: opacity 0.75s;
  opacity: 1;
}
#mainCont8 .pdt_wrap.st_0 .paging_btn {
  background-color: #6776a5;
}
#mainCont8 .pdt_wrap.st_0 .txt_item:nth-child(1) {
  display: flex;
  visibility: visible;
}
#mainCont8 .pdt_wrap.st_0 .txt_item:nth-child(1) .tit, #mainCont8 .pdt_wrap.st_0 .txt_item:nth-child(1) .desc, #mainCont8 .pdt_wrap.st_0 .txt_item:nth-child(1) .check_lists li, #mainCont8 .pdt_wrap.st_0 .txt_item:nth-child(1) .btn_box {
  animation: var(--moveUpAnim);
}
#mainCont8 .pdt_wrap.st_1 .bg_item:nth-child(2) {
  transition: opacity 0.75s;
  opacity: 1;
}
#mainCont8 .pdt_wrap.st_1 .paging_btn {
  background-color: #b91a1a;
}
#mainCont8 .pdt_wrap.st_1 .txt_item:nth-child(2) {
  display: flex;
  visibility: visible;
}
#mainCont8 .pdt_wrap.st_1 .txt_item:nth-child(2) .tit, #mainCont8 .pdt_wrap.st_1 .txt_item:nth-child(2) .desc, #mainCont8 .pdt_wrap.st_1 .txt_item:nth-child(2) .check_lists li, #mainCont8 .pdt_wrap.st_1 .txt_item:nth-child(2) .btn_box {
  animation: var(--moveUpAnim);
}
#mainCont8 .pdt_wrap.st_2 .bg_item:nth-child(3) {
  transition: opacity 0.75s;
  opacity: 1;
}
#mainCont8 .pdt_wrap.st_2 .paging_btn {
  background-color: #d97b30;
}
#mainCont8 .pdt_wrap.st_2 .txt_item:nth-child(3) {
  display: flex;
  visibility: visible;
}
#mainCont8 .pdt_wrap.st_2 .txt_item:nth-child(3) .tit, #mainCont8 .pdt_wrap.st_2 .txt_item:nth-child(3) .desc, #mainCont8 .pdt_wrap.st_2 .txt_item:nth-child(3) .check_lists li, #mainCont8 .pdt_wrap.st_2 .txt_item:nth-child(3) .btn_box {
  animation: var(--moveUpAnim);
}
#mainCont8 .pdt_wrap.st_3 .bg_item:nth-child(4) {
  transition: opacity 0.75s;
  opacity: 1;
}
#mainCont8 .pdt_wrap.st_3 .paging_btn {
  background-color: #dc5100;
}
#mainCont8 .pdt_wrap.st_3 .txt_item:nth-child(4) {
  display: flex;
  visibility: visible;
}
#mainCont8 .pdt_wrap.st_3 .txt_item:nth-child(4) .tit, #mainCont8 .pdt_wrap.st_3 .txt_item:nth-child(4) .desc, #mainCont8 .pdt_wrap.st_3 .txt_item:nth-child(4) .check_lists li, #mainCont8 .pdt_wrap.st_3 .txt_item:nth-child(4) .btn_box {
  animation: var(--moveUpAnim);
}
#mainCont8 .pdt_wrap.st_4 .bg_item:nth-child(5) {
	transition: opacity 0.75s;
	opacity: 1;
  }
  #mainCont8 .pdt_wrap.st_4 .paging_btn {
	background-color: #6776a5;
  }
  #mainCont8 .pdt_wrap.st_4 .txt_item:nth-child(5) {
	display: flex;
	visibility: visible;
  }
  #mainCont8 .pdt_wrap.st_4 .txt_item:nth-child(5) .tit, #mainCont8 .pdt_wrap.st_4 .txt_item:nth-child(5) .desc, #mainCont8 .pdt_wrap.st_4 .txt_item:nth-child(5) .check_lists li, #mainCont8 .pdt_wrap.st_4 .txt_item:nth-child(5) .btn_box {
	animation: var(--moveUpAnim);
  }
@media screen and (max-width: 1280px) {
  #mainCont8 .pdt_wrap {
    flex-wrap: wrap;
    gap: 0;
  }
  #mainCont8 .pdt_wrap .txt_wrap, #mainCont8 .pdt_wrap .img_wrap {
    width: 100%;
  }
  #mainCont8 .pdt_wrap .txt_wrap {
    order: 2;
  }
  #mainCont8 .pdt_wrap .img_wrap {
    order: 1;
  }
}
#mainCont8 .txt_wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  max-width: calc(45rem - var(--spacing));
  width: 100%;
  padding-left: var(--spacing);
  margin-left: auto;
  background-color: var(--color-white);
  word-break: keep-all;
}
@media screen and (max-width: 1280px) {
  #mainCont8 .txt_wrap {
    max-width: 100%;
    padding-top: 4em;
    padding-bottom: 4em;
    padding-left: var(--spacing);
    padding-right: var(--spacing);
  }
}
#mainCont8 .txt_item {
  display: none;
  width: 100%;
  visibility: hidden;
  --point1: #122250;
  --point2: #9f0707;
  --point3: #f5cd00;
  --point4: #ff7104;
  flex-direction: column;
  --moveUpAnim: moveUp 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
@media screen and (max-width: 1280px) {
  #mainCont8 .txt_item {
    align-items: center;
  }
}
#mainCont8 .txt_item .tit {
  display: block;
  height: 4.95em;
}
#mainCont8 .txt_item .tit svg {
  width: auto;
  height: 100%;
}
@media screen and (max-width: 1440px) {
  #mainCont8 .txt_item .tit {
    height: 4.5em;
  }
}
@media screen and (max-width: 1280px) {
  #mainCont8 .txt_item .tit {
    height: 2.2333333333em;
    text-align: center;
  }
}
#mainCont8 .txt_item:nth-child(1) .desc {
  color: var(--point1);
}
#mainCont8 .txt_item:nth-child(1) .check_lists li::before {
  background-image: url("/resource/images/common/ico_check1.png");
}
#mainCont8 .txt_item:nth-child(2) .desc {
  color: var(--point2);
}
#mainCont8 .txt_item:nth-child(2) .check_lists li::before {
  background-image: url("/resource/images/common/ico_check2.png");
}
#mainCont8 .txt_item:nth-child(3) .desc {
  color: var(--point3);
}
#mainCont8 .txt_item:nth-child(3) .check_lists li::before {
  background-image: url("/resource/images/common/ico_check3.png");
}
#mainCont8 .txt_item:nth-child(4) .desc {
  color: var(--point4);
}
#mainCont8 .txt_item:nth-child(4) .check_lists li::before {
  background-image: url("/resource/images/common/ico_check4.png");
}
#mainCont8 .txt_item:nth-child(5) .desc {
	color: var(--point1);
  }
#mainCont8 .txt_item:nth-child(5) .check_lists li::before {
	background-image: url("/resource/images/common/ico_check5.png");
  }
#mainCont8 .txt_item .desc {
  display: block;
  font-size: 1.8em;
  font-weight: 600;
  line-height: 1.3333;
  margin-top: 0.9722222222em;
  animation-delay: 0.125s !important;
}
@media screen and (max-width: 1280px) {
  #mainCont8 .txt_item .desc {
    font-size: 1.3333333333em;
    margin-top: 1.1333333333em;
    text-align: center;
  }
}
#mainCont8 .txt_item .check_lists {
  font-size: 1.5em;
  margin-top: 1.2em;
  line-height: 1.3333333333;
  font-weight: 400;
  color: var(--color-black);
}
#mainCont8 .txt_item .check_lists li {
  display: flex;
  align-items: baseline;
  gap: 0.5333333333em;
  animation-delay: 0.25s !important;
}
#mainCont8 .txt_item .check_lists li::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  width: 0.8em;
  height: 0.8em;
  background: no-repeat center/100% auto;
  margin-bottom: 0.2333333333em;
}
#mainCont8 .txt_item .check_lists li + li {
  margin-top: 0.5em;
}
@media screen and (max-width: 1280px) {
  #mainCont8 .txt_item .check_lists {
    font-size: 1.0666666667em;
    margin-top: 0.9375em;
  }
  #mainCont8 .txt_item .check_lists li {
    gap: 0.5em;
  }
  #mainCont8 .txt_item .check_lists li::before {
    width: 0.75em;
    height: 0.75em;
    margin-bottom: 0.25em;
  }
  #mainCont8 .txt_item .check_lists + li {
    margin-top: 0.59375em;
  }
}
#mainCont8 .txt_item .btn_box {
  gap: 0.8em;
  margin-top: 3em;
  justify-content: flex-start;
  animation-delay: 0.3725s !important;
}
#mainCont8 .txt_item .btn_box .arr_btn {
  font-size: 1em;
  display: flex;
  justify-content: space-between;
  gap: 0.8em;
  padding-left: 2.9em;
  padding-right: 2.5em;
  font-weight: bold;
}
#mainCont8 .txt_item .btn_box .arr_btn.btn_lg {
  max-width: 57%;
}
#mainCont8 .txt_item .btn_box .arr_btn.btn_md {
  max-width: 41%;
}
@media screen and (max-width: 1280px) {
  #mainCont8 .txt_item .btn_box {
    gap: 0.3333333333em;
    margin-top: 2em;
  }
  #mainCont8 .txt_item .btn_box .arr_btn {
    font-size: 0.8em;
    padding-left: 2em;
    padding-right: 2em;
  }
  #mainCont8 .txt_item .btn_box .arr_btn.btn_lg {
    max-width: 350px;
  }
  #mainCont8 .txt_item .btn_box .arr_btn.btn_md {
    max-width: 240px;
  }
}
#mainCont8 .txt_item .arr_btn .arr {
  position: relative;
  display: block;
  width: 0.65em;
  height: 0.65em;
  overflow: hidden;
}
#mainCont8 .txt_item .arr_btn .arr::before, #mainCont8 .txt_item .arr_btn .arr::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 12.8 13'%3E%3Cpath fill='%23111111' d='M0.4,11l8.6-8.6l-7.9,0l0-2h11.3v11.3h-2l0-7.9l-8.6,8.6L0.4,11z'/%3E%3C/svg%3E%0A") no-repeat center/100% auto;
  transition: transform 0.35s;
}
#mainCont8 .txt_item .arr_btn .arr::before {
  transform: translate(-200%, 200%);
}
@media screen and (min-width: 1025px), print {
  #mainCont8 .txt_item .arr_btn:hover .arr::before {
    transform: translate(0, 0);
  }
  #mainCont8 .txt_item .arr_btn:hover .arr::after {
    transform: translate(200%, -200%);
  }
}
#mainCont8 .bg_items {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}
#mainCont8 .bg_item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: radial-gradient(circle at 50% 50%, #314a94, #1d2245 66%);
  opacity: 0;
  transition: opacity 1s;
}
#mainCont8 .bg_item:nth-child(1) {
  background-image: radial-gradient(circle at 50% 50%, #314a94, #1d2245 66%);
}
#mainCont8 .bg_item:nth-child(2) {
  background-image: radial-gradient(circle at 50% 50%, #942212, #530f0f 66%);
}
#mainCont8 .bg_item:nth-child(3) {
  background-image: radial-gradient(circle at 50% 50%, #ffe667, #e49f38 66%);
}
#mainCont8 .bg_item:nth-child(4) {
  background-image: radial-gradient(circle at 50% 50%, #febb56, #e96430 66%);
}
#mainCont8 .bg_item:nth-child(5) {
	background-image: radial-gradient(circle at 50% 50%, #0789a1, #0c2666 66%);
  }
#mainCont8 .img_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  min-height: calc(var(--vh, 1vh) * 100);
  margin-left: 0;
  margin-right: 0;
  overflow: hidden;
  transition: background 1s;
}
#mainCont8 .img_wrap .swiper-container {
  --justify-space: 3em;
  overflow: visible;
  max-width: calc(29em + (var(--justify-space) * 2));
  padding-left: var(--justify-space);
  padding-right: var(--justify-space);
  position: relative;
  z-index: 2;
}
#mainCont8 .img_wrap .swiper-slide::before {
  content: "";
  display: block;
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#mainCont8 .img_wrap .swiper-slide .img_box {
  transition: opacity 0.5s, transform 1s;
}
#mainCont8 .img_wrap .swiper-slide:not(.swiper-slide-active) .img_box {
  opacity: 0.35;
  transform: scale(0.51);
}
@media screen and (max-width: 1280px) {
  #mainCont8 .img_wrap {
    min-height: auto;
    padding-top: 6.4666666667em;
    padding-bottom: 6em;
  }
  #mainCont8 .img_wrap .swiper-container {
    --justify-space: 2.4166666667em;
    max-width: calc(21.6666666667em + (var(--justify-space) * 2));
  }
}
@media screen and (max-width: 800px) {
  #mainCont8 .img_wrap .swiper-container {
    max-width: calc(15.2em + (var(--justify-space) * 2));
  }
}
#mainCont8 .swiper-contr {
  display: flex;
  justify-content: space-between;
  width: 100%;
  z-index: 10;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
#mainCont8 .swiper_btn {
  display: block;
  width: 1em;
  height: 2.15em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='44' viewBox='0 0 22.6 42.4'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' d='M0.7,0.7l20.5,20.5L0.7,41.7'/%3E%3C/svg%3E%0A") no-repeat center/100% auto;
  transition: opacity 0.35s;
}
#mainCont8 .swiper_btn.prev_btn {
  transform: scaleX(-1);
}
@media screen and (max-width: 1280px) {
  #mainCont8 .swiper_btn {
    width: 0.5333333333em;
    height: 1.0666666667em;
  }
}
#mainCont8 .swiper_btn.swiper-button-disabled {
  opacity: 0.5;
}
#mainCont8 .paging {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 4.5em;
  gap: 1.8em;
}
@media screen and (max-width: 1280px) {
  #mainCont8 .paging {
    margin-top: 2.4666666667em;
    gap: 1em;
  }
}
#mainCont8 .paging_btn {
  display: block;
  flex: 0 0 auto;
  width: 0.7em;
  height: 0.7em;
  border-radius: 50%;
  transition: background 0.65s;
  cursor: pointer;
}
#mainCont8 .paging_btn.swiper-pagination-bullet-active {
  background-color: #fff !important;
}
@media screen and (max-width: 1280px) {
  #mainCont8 .paging_btn {
    width: 0.4em;
    height: 0.4em;
  }
}

@keyframes stepUp {
  100% {
    transform: translateY(-20px) rotate(0.001deg);
  }
}
@keyframes moveUp {
  0% {
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    transform: 0;
    opacity: 1;
  }
}
@keyframes longMove {
  0% {
    width: 100%;
  }
  95% {
    width: 170%;
  }
  100% {
    width: 170%;
  }
}

/*# sourceMappingURL=main.css.map */