/* ********** ********** ********** */
/*       o_style style sheet        */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* 공통 : start */
.o_section {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  position: relative;
}

body {
  background-color: #000;
}
/* 공통 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_main : start */
.o_section_main {
  overflow: hidden;
  height: 60rem;
}
.o_section_main::before {
  content: "";
  width: 75%;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 1),
    rgba(0, 0, 0, 0) 85%,
    rgba(0, 0, 0, 0)
  );
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
}

.o_section_main .video-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.o_section_main .video-wrapper .poster-image {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
  transition: opacity 1s ease;
  top: 0;
  left: 0;
}
.o_section_main .video-wrapper .poster-image.hidden {
  opacity: 0;
  pointer-events: none;
}
.o_section_main .video-wrapper iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 132rem;
  height: 200%;
  min-width: 100%; /* 좌우가 작으면 늘어나게 */
}

.o_section_main .o_wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  width: 100%;
  height: 100%;
  z-index: 10;
  display: flex;
  align-items: center;
}

.o_section_main .logoBox {
  display: block;
  width: 6.53rem;
  position: absolute;
  top: 6rem;
  right: 0;
}
.o_section_main .textBox {
  text-align: left;
}
.o_section_main .textBox .o_text_1 {
  max-width: 44.33rem;
  width: 80%;
}
.o_section_main .textBox h3 {
  color: var(--w-color);
  font-weight: 400;
}
.o_section_main .textBox .o_btnBox {
  text-align: left;
}

@media all and (max-width: 991px) {
  .o_section_main .o_wrapper {
    width: 90%;
  }
}

@media all and (max-width: 767px) {
  .o_section_main {
    height: 171.3vmin;
  }
  .o_section_main::before {
    content: "";
    width: 100%;
    height: 75%;
    background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 1),
      rgba(0, 0, 0, 0) 85%,
      rgba(0, 0, 0, 0)
    );
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
  }

  .o_section_main .video-wrapper iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    min-width: 100%; /* 좌우가 작으면 늘어나게 */
  }

  .o_section_main .o_wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: 90%;
    height: 100%;
    z-index: 10;
    display: block;
  }

  .o_section_main .logoBox {
    width: 10vmin;
    position: absolute;
    top: 5vmin;
    left: 0;
  }
  .o_section_main .textBox {
    text-align: left;
    margin-top: 28.5vmin;
  }
  .o_section_main .textBox .o_text_1 {
    max-width: 100%;
    width: 78.5vmin;
  }
  .o_section_main .textBox h3 {
    font-size: 4.1vmin;
    padding-top: 7.5vmin;
  }
  .o_section_main .textBox .o_btnBox {
    text-align: center;
    margin: 46.2vmin 0 15vmin;
  }
}
/* hero_section : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_video : start */
.o_section_video {
  background-image: url("../image/00.video/pc/img_bg.jpg");
  padding: 8rem 0 6rem;
}
.o_section_video .textBox {
  text-align: center;
}
.o_section_video .textBox p {
  font-weight: 400;
  color: var(--w-color);
}

.o_section_video .videoBox .o_inner {
  padding: 56.25% 0 0 0;
  position: relative;
}
.o_section_video .videoBox iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media all and (max-width: 767px) {
  .o_section_video {
    background-image: url("../image/00.video/mo/img_bg.png");
    padding: 15vmin 0 7.5vmin;
  }

  .o_section_video .textBox p {
    font-size: 3.3vmin;
  }
}
/* o_section_video : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_1 : start */
.o_section_1 {
  background-image: url("../image/01/pc/img_bg.jpg");
}

.o_section_1 .contentBox {
  height: 43rem;
}

/* .contentBox._1 */
.o_section_1 .contentBox._1 {
  padding-top: 8rem;
}
.o_section_1 .contentBox._1 .textBox img {
  max-width: 25rem;
  width: 80%;
}
.o_section_1 .contentBox._1 .textBox h4 {
  color: var(--w-color);
  font-weight: 400;
  z-index: 1;
  position: relative;
}
.o_section_1 .contentBox._1 .textBox h4 strong {
  color: var(--m-color);
  font-weight: 500;
}

/* .contentBox._2 */
.o_section_1 .contentBox._2 .imgBox {
  height: 100%;
}
.o_section_1 .contentBox._2 .imgBox figure {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.o_section_1 .contentBox._2 .imgBox img {
  padding-top: 2rem;
}
.o_section_1 .contentBox._2 .imgBox .img_1 {
  width: 16.2rem;
}
.o_section_1 .contentBox._2 .imgBox .img_2 {
  width: 17.7rem;
}

@media all and (max-width: 767px) {
  .o_section_1 {
    background-image: url("../image/01/mo/img_bg.png");
  }

  .o_section_1 .contentBox {
    height: 85.6vmin;
  }

  /* .contentBox._1 */
  .o_section_1 .contentBox._1 {
    padding-top: 12.5vmin;
  }
  .o_section_1 .contentBox._1 .textBox img {
    max-width: 100%;
    width: 66.7vmin;
  }
  .o_section_1 .contentBox._1 .textBox h4 {
    font-size: 3.8vmin;
    padding-top: 7.5vmin;
    font-weight: 400;
  }
  .o_section_1 .contentBox._1 .textBox h4.text_2 {
    padding-top: 5vmin;
  }
  .o_section_1 .contentBox._1 .textBox h4 strong {
    font-weight: 400;
  }

  /* .contentBox._2 */
  .o_section_1 .contentBox._2 .imgBox {
    text-align: center;
  }
  .o_section_1 .contentBox._2 .imgBox img {
    padding-top: 0;
  }
  .o_section_1 .contentBox._2 .imgBox .img_1 {
    width: 67vmin;
    margin-top: 15vmin;
  }
}
/* o_section_1 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_2 : start */
.o_section_2 {
  background-image: url("../image/02/pc/img_bg.jpg");
  height: 49.4rem;
}
.o_section_2 .o_wrapper {
  display: flex;
  align-items: center;
  height: 100%;
}

.o_section_2 .contentBox {
}
.o_section_2 .contentBox .img_1 {
  width: 30rem;
}
.o_section_2 .contentBox h4 {
  color: var(--w-color);
  font-weight: 400;
}
.o_section_2 .contentBox h4 strong {
  color: var(--m-color);
  font-weight: 400;
}

@media all and (max-width: 767px) {
  .o_section_2 {
    background-image: url("../image/02/mo/img_bg.png");
    height: 147vmin;
  }
  .o_section_2 .o_wrapper {
    display: block;
  }

  .o_section_2 .contentBox {
    padding-top: 70vmin;
  }
  .o_section_2 .contentBox .img_1 {
    width: 79.2vmin;
  }
  .o_section_2 .contentBox h4 {
    font-size: 3.8vmin;
    line-height: 1.6;
  }
  .o_section_2 .contentBox h4 strong {
    color: var(--m-color);
    font-weight: 400;
  }
}
/* o_section_2 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_3 : start */
.o_section_3 {
  background-image: url("../image/03/pc/img_bg.jpg");
  padding: 6rem 0 10rem;
}

.o_section_3 .contentBox {
  text-align: center;
}
.o_section_3 .contentBox .img_1 {
  width: 32.3rem;
  margin: 0 auto;
}
.o_section_3 .contentBox h4 {
  color: var(--w-color);
  font-weight: 400;
  z-index: 1;
  position: relative;
}
.o_section_3 .contentBox h4 span {
  color: var(--w-color);
  font-weight: 400;
  position: relative;
}

.o_section_3 .imgBox .img_1 {
  max-width: 20rem;
  width: 25%;
  position: absolute;
  top: 25%;
  left: 0;
}
.o_section_3 .imgBox .img_2 {
  max-width: 20.6rem;
  width: 25%;
  position: absolute;
  bottom: -10%;
  right: 0;
}

@media all and (max-width: 767px) {
  .o_section_3 {
    background-image: url("../image/03/mo/img_bg.png");
    padding: 12vmin 0;
  }

  .o_section_3 .contentBox .img_1 {
    width: 82.3vmin;
  }
  .o_section_3 .contentBox h4 {
    font-size: 3.8vmin;
  }

  .o_section_3 .imgBox .img_1 {
    max-width: 100%;
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    margin-top: 13.8vmin;
  }
}
/* o_section_3 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_4 : start */
.o_section_4 {
  background-image: url("../image/04/pc/img_bg.jpg");
  height: 29rem;
}
.o_section_4 .o_wrapper {
  height: 100%;
  display: flex;
  align-items: center;
}
.o_section_4 .contentBox img {
  width: 27rem;
}

@media all and (max-width: 767px) {
  .o_section_4 {
    background-image: url("../image/04/mo/img_bg.png");
    height: 47.2vmin;
  }
  .o_section_4 .o_wrapper {
    height: 100%;
    display: flex;
    align-items: center;
  }
  .o_section_4 .contentBox img {
    width: 32.1vmin;
  }
}
/* o_section_4 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_5 : start */
.o_section_5 {
  background-image: url("../image/05/pc/img_bg.jpg");
  height: 45.2rem;
}
.o_section_5 .o_wrapper {
  height: 100%;
  display: flex;
  align-items: center;
}

.o_section_5 .contentBox img {
  max-width: 38.27rem;
  width: 80%;
}
.o_section_5 .contentBox h4 {
  color: var(--w-color);
  font-weight: 400;
}
.o_section_5 .contentBox h4 strong {
  color: var(--w-color);
  font-weight: 400;
}

.o_section_5 .o_btnBox {
  text-align: left;
}

@media all and (max-width: 767px) {
  .o_section_5 {
    background-image: url("../image/05/mo/img_bg.png");
    height: auto;
    padding: 12.5vmin 0 15vmin;
  }
  .o_section_5 .o_wrapper {
    display: block;
  }

  .o_section_5 .contentBox img {
    max-width: 100%;
    width: 85.4vmin;
  }
  .o_section_5 .contentBox h4 {
    font-size: 3.8vmin;
    line-height: 1.6;
    z-index: 1;
    position: relative;
  }
  .o_section_5 .contentBox h4 strong {
    color: var(--w-color);
    font-weight: 400;
    position: relative;
  }

  .o_section_5 .o_btnBox {
    text-align: center;
    padding-top: 41vmin;
  }
}
/* o_section_5 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_6 : start */
.o_section_6 {
  background-color: #222435;
}
.o_section_6 .textBox {
  text-align: center;
}
.o_section_6 .textBox h4 {
  color: var(--w-color);
  font-weight: 400;
}
.o_section_6 .textBox h4 strong {
  color: var(--m-color);
}

.o_section_6 .subText {
  text-align: center;
  color: var(--w-color);
  font-weight: 400;
}

@media all and (max-width: 767px) {
  .o_section_6 {
    background-image: url("../image/06/mo/img_bg.png");
    padding: 10vmin 0;
  }
  .o_section_6 .textBox h4 {
    font-size: 3.8vmin;
  }
  .o_section_6 .textBox h4 strong {
    font-size: 5vmin;
  }
}
/* o_section_6 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_7 : start */
.o_section_7 {
  background-image: url("../image/07/pc/img_bg.jpg");
}
.o_section_7 .titleBox {
  text-align: center;
}
.o_section_7 .titleBox h3 {
  color: var(--t-color);
  font-weight: 700;
}
.o_section_7 .titleBox h2 {
  color: var(--t-color);
  font-weight: 700;
}
.o_section_7 .titleBox h2 strong {
  color: var(--m-color);
}

.o_section_7 .contentBox .o_inner {
  display: flex;
  align-items: flex-end;
}
.o_section_7 .imgBox {
  width: 50%;
}
.o_section_7 .imgBox img {
  transition-delay: 0.25s;
}
.o_section_7 .textBox {
  width: 50%;
  margin-left: auto;
  padding-left: 5%;
}
.o_section_7 .textBox h3 {
  color: var(--w-color);
  font-weight: 700;
}
.o_section_7 .textBox h3 span {
  background-color: var(--m-color);
  padding: 0.25em;
  display: inline-block;
}
.o_section_7 .textBox h5 {
  color: var(--t-color);
  font-weight: 400;
}
.o_section_7 .textBox h5 span {
  font-weight: 700;
}
.o_section_7 .textBox h4 {
  color: var(--m-color);
  font-weight: 700;
}
.o_section_7 .textBox p {
  color: var(--t-color);
  font-weight: 500;
}

@media all and (max-width: 767px) {
  .o_section_7 {
    background-image: url("../image/07/mo/img_bg.png");
    padding: 10vmin 0;
  }
  .o_section_7 .titleBox h3 {
    font-size: 3.8vmin;
  }
  .o_section_7 .titleBox h2 {
    font-size: 3.8vmin;
  }
  .o_section_7 .titleBox h2 strong {
    font-size: 5vmin;
  }

  .o_section_7 .textBox {
    width: 100%;
    margin-left: 0;
    padding-left: 0;
    text-align: center;
    margin-top: 5vmin;
  }
  .o_section_7 .textBox h3 span {
    padding: 0.1em;
  }
  .o_section_7 .textBox h5 {
    font-size: 3.8vmin;
    margin-top: 5vmin;
  }
  .o_section_7 .textBox img {
    display: block;
    margin-top: 5vmin;
  }
  .o_section_7 .textBox h4 {
    font-size: 4.6vmin;
    margin-top: 5vmin;
  }
  .o_section_7 .textBox p {
    font-size: 3.3vmin;
    margin-top: 1vmin;
  }
}
/* o_section_7 : end */
/* ********** ********** ********** */

/* ********** ********** ********** */
/* o_section_8 : start */
.o_section_8 {
  background-image: url("../image/08/pc/img_bg.jpg");
  padding: 6rem 0 8rem;
}
.o_section_8 .titleBox {
  text-align: center;
}
.o_section_8 .titleBox h4 {
  color: var(--w-color);
  font-weight: 400;
}
.o_section_8 .titleBox h2 {
  color: var(--w-color);
  font-weight: 700;
  padding-top: 1rem;
}

.o_section_8 .titleBox h2 span::after {
  background-color: var(--m-color);
  height: 1.2em;
}

.o_section_8 .o_btnBox {
  padding-top: 26%;
}
.o_section_8 .o_btnBox a {
  color: var(--w-color);
}

@media all and (max-width: 767px) {
  .o_section_8 {
    background-image: url("../image/08/mo/img_bg.png");
    padding: 6.5vmin 0 25vmin;
  }

  .o_section_8 .titleBox h4 {
    font-size: 3.8vmin;
  }
  .o_section_8 .titleBox h2 {
    font-size: 4.1vmin;
    padding-top: 2vmin;
    font-weight: 400;
  }

  .o_section_8 .o_btnBox {
    padding-top: 38.5vmin;
  }
  .o_section_8 .o_btnBox a {
    color: var(--w-color);
  }
}
/* o_section_8 : end */
/* ********** ********** ********** */