@charset "UTF-8";
@import url("/static/fonts/nanum_myeongjo/NanumMyeongjo.css");
@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Belleza&display=swap");
html {
  font-size: 12px; }

@media screen and (min-width: 360px) {
  html {
    font-size: 14px; } }
@media screen and (min-width: 400px) {
  html {
    font-size: 16px; } }
@media screen and (min-width: 430px) {
  html {
    font-size: 16px; } }
@media screen and (min-width: 768px) {
  html {
    font-size: 16px; } }
@media screen and (min-width: 1200px) {
  html {
    font-size: 16px; } }
@media screen and (min-width: 1920px) {
  html {
    font-size: 16px; } }
/* 폰트 */
/* 컬러 */
/* 드롭다운,멀티포함 */
/* font */
/* text cutting */
/* flex */
::-webkit-scrollbar {
  width: rem(6px);
  height: rem(6px); }
  @media screen and (min-width: 1200px) {
    ::-webkit-scrollbar {
      width: 10px;
      height: 10px; } }

::-webkit-scrollbar-thumb {
  background: #CCCCCC;
  border-radius: 0; }

::-webkit-scrollbar-thumb:hover {
  background: #888888; }

::-webkit-scrollbar-track {
  background: #eeeeee;
  border-radius: 0; }

body.index header h1 a .hstone-logotxt svg .hstone-logotxt_path {
  fill: #000; }
body.index header .utile li.btn_vr360 .btn_vr360 i svg .vr360_path1, body.index header .utile li.btn_vr360 .btn_vr360 i svg .vr360_path2 {
  fill: #444; }
body.index header .utile li.btn-popup .btn .alarm svg .alarm_path {
  stroke: #444; }
body.index header .utile li.btn-popup .btn:hover .alarm svg .alarm_path {
  stroke: #A6866B; }
body.index header .utile li.btn-member .btn .user svg .user_path {
  stroke: #444; }
body.index header .utile li.btn-member .btn:hover .user svg .user_path {
  stroke: #A6866B; }
body.index header #toggle-menu div span {
  background-color: #000; }
body.index header.hover h1 a .hstone-logotxt svg .hstone-logotxt_path, body.index header.on h1 a .hstone-logotxt svg .hstone-logotxt_path {
  fill: #4C504F; }
body.index header.hover .utile li.btn_vr360 .btn_vr360 i svg .vr360_path1, body.index header.hover .utile li.btn_vr360 .btn_vr360 i svg .vr360_path2, body.index header.on .utile li.btn_vr360 .btn_vr360 i svg .vr360_path1, body.index header.on .utile li.btn_vr360 .btn_vr360 i svg .vr360_path2 {
  fill: #444; }
body.index header.hover .utile li.btn-popup .btn .alarm svg .alarm_path, body.index header.on .utile li.btn-popup .btn .alarm svg .alarm_path {
  stroke: #444; }
body.index header.hover .utile li.btn-member .btn .user svg .user_path, body.index header.on .utile li.btn-member .btn .user svg .user_path {
  stroke: #444; }
body.index header.hover #toggle-menu div span, body.index header.on #toggle-menu div span {
  background-color: #444; }
body.index header.mobile-menu-open #toggle-menu div span {
  background-color: #000; }
@media screen and (min-width: 1200px) {
  body.index header {
    background: rgba(255, 255, 255, 0.03); }
    body.index header h1 a .hstone-logotxt svg .hstone-logotxt_path {
      fill: #fff; }
    body.index header .utile li.btn_vr360 .btn_vr360 i svg .vr360_path1, body.index header .utile li.btn_vr360 .btn_vr360 i svg .vr360_path2 {
      fill: #444; }
    body.index header .utile li.btn-popup .btn .alarm svg .alarm_path {
      stroke: #444; }
    body.index header .utile li.btn-popup .btn:hover .alarm svg .alarm_path {
      stroke: #A6866B; }
    body.index header .utile li.btn-member .btn .user svg .user_path {
      stroke: #444; }
    body.index header .utile li.btn-member .btn:hover .user svg .user_path {
      stroke: #A6866B; }
    body.index header #toggle-menu div span {
      background-color: #444; }
    body.index header .gnb .inner .oneDepth > li > a {
      color: #fff; }
    body.index header.hover h1 a .hstone-logotxt svg .hstone-logotxt_path, body.index header.on h1 a .hstone-logotxt svg .hstone-logotxt_path {
      fill: #4C504F; }
    body.index header.hover .gnb .inner .oneDepth > li > a, body.index header.on .gnb .inner .oneDepth > li > a {
      color: #222; }
      body.index header.hover .gnb .inner .oneDepth > li > a:hover, body.index header.on .gnb .inner .oneDepth > li > a:hover {
        color: #A6866B; }
    body.index header.mobile-menu-open .gnb .inner .oneDepth > li > a {
      color: #222; }
      body.index header.mobile-menu-open .gnb .inner .oneDepth > li > a:hover {
        color: #A6866B; } }

.container {
  padding-top: 4.1666666667rem; }
  @media screen and (min-width: 1200px) {
    .container {
      padding-top: 0; } }

.radial-progress {
  background-color: transparent;
  border-radius: 9999px;
  box-sizing: content-box;
  display: inline-grid;
  height: var(--size);
  place-content: center;
  position: relative;
  vertical-align: middle;
  width: var(--size);
  --value: 0;
  --size: 5rem;
  --thickness: calc(var(--size) / 10); }
  .radial-progress::-moz-progress-bar {
    -moz-appearance: none;
    appearance: none;
    background-color: transparent; }
  .radial-progress::-webkit-progress-bar, .radial-progress::-webkit-progress-value {
    -webkit-appearance: none;
    appearance: none;
    background-color: transparent; }
  .radial-progress:after, .radial-progress:before {
    border-radius: 9999px;
    content: "";
    position: absolute; }
  .radial-progress:before {
    background: radial-gradient(farthest-side, currentColor 98%, #0000) top/var(--thickness) var(--thickness) no-repeat, conic-gradient(currentColor calc(var(--value) * 1%), #0000 0);
    inset: 0;
    -webkit-mask: radial-gradient(farthest-side, #0000 calc(99% - var(--thickness)), #000 calc(100% - var(--thickness)));
    mask: radial-gradient(farthest-side, #0000 calc(99% - var(--thickness)), #000 calc(100% - var(--thickness))); }
  .radial-progress:after {
    background-color: currentColor;
    inset: calc(50% - var(--thickness) / 2);
    transform: rotate(calc(var(--value) * 3.6deg - 90deg)) translate(calc(var(--size) / 2 - 50%)); }

body.on_banner {
  padding-top: 4.1666666667rem; }
  body.on_banner header {
    top: 4.1666666667rem; }
  @media screen and (min-width: 1200px) {
    body.on_banner {
      padding-top: 100px; }
      body.on_banner header {
        top: 100px; }
        body.on_banner header .utile .btn-member {
          margin-top: 200px; } }

#mo-bar-banner {
  position: fixed;
  top: -100%;
  opacity: 0;
  left: 0;
  width: 100%;
  height: 4.1666666667rem;
  z-index: 102;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 1s ease-in; }
  #mo-bar-banner img {
    width: 100%;
    height: auto; }
    @media screen and (min-width: 640px) {
      #mo-bar-banner img {
        width: auto;
        height: 4.1666666667rem; } }
  #mo-bar-banner .close-btn {
    position: absolute;
    width: 2.25rem;
    height: 2.25rem;
    right: 1rem;
    top: 1rem; }
    #mo-bar-banner .close-btn i svg .close_path {
      stroke: #fff; }
  #mo-bar-banner.on {
    transition: all 1s 1s ease-out;
    opacity: 1;
    top: 0; }
  @media screen and (min-width: 1200px) {
    #mo-bar-banner {
      display: none; } }

#pc-bar-banner {
  display: none; }
  @media screen and (min-width: 1200px) {
    #pc-bar-banner {
      position: fixed;
      top: -100%;
      opacity: 0;
      left: 0;
      width: 100%;
      height: 100px;
      z-index: 102;
      display: flex;
      justify-content: center;
      align-items: center;
      transition: all 1s ease-in; }
      #pc-bar-banner img {
        width: 100%;
        min-width: 1200px;
        max-width: 1400px; }
      #pc-bar-banner .close-btn {
        position: absolute;
        width: 36px;
        height: 36px;
        right: 32px;
        top: 50%;
        margin-top: -18px; }
        #pc-bar-banner .close-btn i svg .close_path {
          stroke: #fff; }
      #pc-bar-banner.on {
        transition: all 1s 1s ease-out;
        opacity: 1;
        top: 0; } }

.container {
  min-height: auto; }
  .container > section {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; }
    .container > section .inner {
      width: 87.5%;
      height: 100%;
      min-height: 50rem;
      margin: auto;
      padding: 9.1666666667rem 0 5rem 0; }
      .container > section .inner .inner-box {
        position: relative;
        width: 100%;
        height: 100%; }
        .container > section .inner .inner-box .txt-box h3 {
          word-break: keep-all;
          font-family: "Nanum Myeongjo", serif;
          font-style: normal;
          letter-spacing: -0.82px;
          color: #000;
          font-size: 1.7083333333rem;
          line-height: 2.0833333333rem;
          font-weight: 700; }
          @media screen and (min-width: 1200px) {
            .container > section .inner .inner-box .txt-box h3 {
              color: #000;
              font-size: 40px;
              line-height: 60px;
              font-weight: 700; } }
        .container > section .inner .inner-box .txt-box p {
          word-break: keep-all;
          margin-top: 1rem;
          color: #444;
          font-size: 1rem;
          line-height: 1.4583333333rem;
          font-weight: 500; }
          @media screen and (min-width: 1200px) {
            .container > section .inner .inner-box .txt-box p {
              color: #444;
              font-size: 18px;
              line-height: 28px;
              font-weight: 500;
              margin-top: 24px; } }
        .container > section .inner .inner-box .txt-box .btn-row {
          margin-top: 2.5rem; }
          @media screen and (min-width: 1200px) {
            .container > section .inner .inner-box .txt-box .btn-row {
              margin-top: 64px; } }
        .container > section .inner .inner-box .vdo-box {
          position: relative;
          width: 100%; }
        .container > section .inner .inner-box .img-box picture {
          display: inline-block; }
      .container > section .inner.full {
        width: 100%;
        height: 100%; }
        .container > section .inner.full .full-inner {
          width: 87.5%;
          height: 100%;
          margin: auto; }
          .container > section .inner.full .full-inner .inner-box {
            position: relative;
            width: 100%;
            height: 100%; }
    @media screen and (min-width: 1200px) {
      .container > section .inner {
        max-width: 1440px;
        min-width: 1100px;
        padding: 0;
        height: 100%;
        min-height: 1080px; }
        .container > section .inner.full {
          width: 100%;
          max-width: 100%; }
          .container > section .inner.full .full-inner {
            width: 87.5%;
            max-width: 1440px;
            min-width: 1100px; } }
    @media screen and (min-width: 1440px) {
      .container > section .inner {
        width: 100%; } }
  .container .slide1 {
    overflow: hidden;
    position: relative;
    height: 100%;
    width: 100%;
    z-index: 2;
    background: #fff; }
    .container .slide1 .bg-video {
      position: relative;
      z-index: 1;
      width: 100%;
      height: 100%; }
      @media screen and (min-width: 1200px) {
        .container .slide1 .bg-video {
          padding-top: 0;
          height: 100vh; } }
    .container .slide1 .main_movie_slide {
      width: 100%;
      height: 100%; }
      .container .slide1 .main_movie_slide .swiper-slide {
        opacity: 1; }
        .container .slide1 .main_movie_slide .swiper-slide .vbg_common {
          position: absolute;
          width: 100%;
          height: 100%;
          top: 0;
          left: 0; }
        .container .slide1 .main_movie_slide .swiper-slide .vbg_img {
          width: 100%; }
          @media screen and (min-width: 1200px) {
            .container .slide1 .main_movie_slide .swiper-slide .vbg_img {
              display: none; } }
      .container .slide1 .main_movie_slide .seek-bars {
        opacity: 0; }
    .container .slide1 #top_counsel {
      display: none; }
    .container .slide1 .top-counsel-row {
      position: relative;
      width: 100%;
      height: 35rem;
      background: #fff;
      -webkit-border-top-left-radius: 1rem;
      -webkit-border-top-right-radius: 1rem;
      -moz-border-radius-topleft: 1rem;
      -moz-border-radius-topright: 1rem;
      border-top-left-radius: 1rem;
      border-top-right-radius: 1rem;
      transition: all .15s ease-in;
      z-index: 1; }
      .container .slide1 .top-counsel-row.exp {
        height: 41.25rem; }
      .container .slide1 .top-counsel-row.on {
        bottom: 0; }
      .container .slide1 .top-counsel-row > h3 {
        text-align: center;
        padding: 2.5rem 0 2.0833333333rem 0;
        color: #65B3B1;
        font-size: 1.4583333333rem;
        line-height: 1.4583333333rem;
        font-weight: 700; }
      .container .slide1 .top-counsel-row .close-popup {
        display: none;
        position: absolute;
        right: 1.3333333333rem;
        top: 1.3333333333rem; }
      .container .slide1 .top-counsel-row .form-row {
        padding: 0 1.6666666667rem; }
        .container .slide1 .top-counsel-row .form-row #top_counsel_form {
          display: flex;
          justify-content: space-between;
          align-items: center;
          flex-flow: wrap; }
          .container .slide1 .top-counsel-row .form-row #top_counsel_form .member_type {
            width: 100%;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            height: 3rem;
            margin-bottom: 0.875rem; }
          .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row {
            width: 48%;
            margin-bottom: 3.2083333333rem; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row input {
              color: #444; }
          .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row {
            width: 100%; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list {
              margin-top: 1rem;
              background: #f9f9f9;
              padding: 1.6666666667rem; }
              .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row {
                display: flex;
                justify-content: flex-start;
                align-items: center;
                flex-flow: wrap;
                margin-bottom: 1.1666666667rem; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row > .btn {
                  width: auto;
                  height: auto;
                  margin-left: 0.6666666667rem;
                  color: #888; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row label {
                  color: #888; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row:last-child {
                  margin-bottom: 0; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row button + .error {
                  width: 100%;
                  margin-left: 1.6666666667rem;
                  padding-top: 0.625rem;
                  color: #F82417;
                  font-size: 0.9583333333rem;
                  line-height: 1.2;
                  font-weight: 500; }
        .container .slide1 .top-counsel-row .form-row .btn-row {
          margin-top: 1.7916666667rem;
          text-align: center;
          display: flex;
          justify-content: center;
          align-items: center;
          flex-flow: nowrap; }
          .container .slide1 .top-counsel-row .form-row .btn-row a {
            margin: 0 0.4166666667rem; }
      @media screen and (min-width: 1200px) {
        .container .slide1 .top-counsel-row {
          position: absolute;
          bottom: 80px;
          left: 50%;
          max-width: 1200px;
          height: 244px;
          padding: 64px 0 0 50px;
          background: rgba(255, 255, 255, 0.2);
          border-radius: 8px;
          display: flex;
          justify-content: flex-start;
          align-items: flex-start;
          overflow: hidden;
          -moz-transform: translateX(-50%);
          -ms-transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
          backdrop-filter: blur(10px);
          /* 블러 효과 */
          -webkit-backdrop-filter: blur(10px);
          /* Safari용 */ }
          .container .slide1 .top-counsel-row:before {
            content: "";
            position: absolute;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 68px;
            background: rgba(255, 255, 255, 0.3); }
          .container .slide1 .top-counsel-row > h3 {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            width: 145px;
            height: 56px;
            text-align: left;
            padding: 0;
            color: #fff;
            font-size: 24px;
            line-height: 24px;
            font-weight: 700; }
          .container .slide1 .top-counsel-row .close-popup {
            display: none; }
          .container .slide1 .top-counsel-row .form-row {
            width: calc(100% - 195px);
            padding: 0; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form {
              display: flex;
              justify-content: flex-start;
              align-items: center;
              flex-flow: wrap; }
              .container .slide1 .top-counsel-row .form-row #top_counsel_form .member_type {
                width: 305px;
                height: 56px;
                margin-bottom: 0; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form .member_type .radio-box-group {
                  width: 100%; }
                  .container .slide1 .top-counsel-row .form-row #top_counsel_form .member_type .radio-box-group label span {
                    color: #fff; }
              .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row {
                width: 200px;
                height: 56px;
                margin-bottom: 0; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row:nth-child(2) {
                  margin-right: 20px; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row input {
                  background: transparent;
                  border-bottom: 1px solid #fff;
                  color: #444; }
                  .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row input::placeholder {
                    color: #888;
                    opacity: .6; }
              .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row {
                margin-top: 80px;
                display: flex;
                justify-content: flex-start;
                align-items: flex-start; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row > .check-box {
                  position: absolute;
                  left: -145px; }
                  .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row > .check-box label {
                    color: #fff; }
                .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list {
                  margin-top: 0;
                  background: none;
                  padding: 0;
                  display: flex;
                  justify-content: flex-start;
                  align-items: flex-start; }
                  .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row {
                    margin-bottom: 0; }
                    .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row > .btn {
                      margin-left: 8px;
                      color: #fff; }
                    .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row label {
                      color: #fff; }
                    .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row:nth-child(1) {
                      width: 350px; }
                    .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row:nth-child(2) {
                      width: 315px; }
                    .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row:nth-child(3) {
                      width: 315px; }
                    .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row button + .error {
                      width: 315px;
                      margin-left: 1.6666666667rem;
                      padding-top: 0.625rem;
                      color: #F82417;
                      font-size: 0.9583333333rem;
                      line-height: 1.2;
                      font-weight: 500; }
            .container .slide1 .top-counsel-row .form-row .btn-row {
              position: absolute;
              right: 0;
              top: 0;
              margin-top: 0;
              text-align: center;
              display: flex;
              justify-content: center;
              align-items: center;
              flex-flow: nowrap; }
              .container .slide1 .top-counsel-row .form-row .btn-row a {
                margin: 0; }
                .container .slide1 .top-counsel-row .form-row .btn-row a:nth-child(1) {
                  display: none; }
          .container .slide1 .top-counsel-row.exp {
            height: 274px; }
            .container .slide1 .top-counsel-row.exp:before {
              height: 98px; }
          .container .slide1 .top-counsel-row:hover {
            background: white; }
            .container .slide1 .top-counsel-row:hover:before {
              background: #eee; }
            .container .slide1 .top-counsel-row:hover > h3 {
              color: #65B3B1;
              font-size: 24px;
              line-height: 24px;
              font-weight: 700; }
            .container .slide1 .top-counsel-row:hover .form-row #top_counsel_form .member_type .radio-box-group label span {
              color: #444; }
            .container .slide1 .top-counsel-row:hover .form-row #top_counsel_form > .input-row input {
              border-bottom: 1px solid #aaa; }
              .container .slide1 .top-counsel-row:hover .form-row #top_counsel_form > .input-row input::placeholder {
                color: #aaa;
                opacity: 1; }
            .container .slide1 .top-counsel-row:hover .form-row #top_counsel_form .agree-row > .check-box label {
              color: #ccc; }
            .container .slide1 .top-counsel-row:hover .form-row #top_counsel_form .agree-row .agree_list .check-box-row > .btn {
              color: #aaa; }
            .container .slide1 .top-counsel-row:hover .form-row #top_counsel_form .agree-row .agree_list .check-box-row label {
              color: #aaa; } }
      @media screen and (min-width: 1440px) {
        .container .slide1 .top-counsel-row {
          max-width: 1400px;
          padding: 64px 0 0 100px; }
          .container .slide1 .top-counsel-row > h3 {
            width: 195px; }
          .container .slide1 .top-counsel-row .form-row {
            width: calc(100% - 295px); }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form .member_type {
              width: 305px; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row {
              width: 229px; }
              .container .slide1 .top-counsel-row .form-row #top_counsel_form > .input-row:nth-child(2) {
                margin-right: 20px; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row > .check-box {
              left: -195px; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row:nth-child(1) {
              width: 380px; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row:nth-child(2) {
              width: 345px; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row:nth-child(3) {
              width: 345px; }
            .container .slide1 .top-counsel-row .form-row #top_counsel_form .agree-row .agree_list .check-box-row button + .error {
              width: 345px;
              margin-left: 1.6666666667rem;
              padding-top: 0.625rem;
              color: #F82417;
              font-size: 0.9583333333rem;
              line-height: 1.2;
              font-weight: 500; } }
  .container .scroll_animate {
    pointer-events: none; }
    .container .scroll_animate .scene_common .inner-mo .inner {
      width: 100%;
      height: 50rem;
      padding: 0; }
    .container .scroll_animate .scene_common .inner-pc {
      display: none; }
    .container .scroll_animate .scene_common .txt-row h3 {
      font-family: "Belleza";
      color: #222;
      font-size: 2.6666666667rem;
      line-height: 2.6666666667rem;
      font-weight: 400; }
    .container .scroll_animate .scene_common .txt-row p {
      font-family: "Nanum Myeongjo";
      color: #555;
      font-size: 1.25rem;
      line-height: 1.6;
      font-weight: 700; }
    @media screen and (min-width: 1200px) {
      .container .scroll_animate .scene_common .inner-mo {
        display: none; }
      .container .scroll_animate .scene_common .inner-pc {
        display: block; }
        .container .scroll_animate .scene_common .inner-pc .inner {
          width: 100%;
          min-height: 1080px;
          padding: 0; }
      .container .scroll_animate .scene_common .txt-row h3 {
        font-family: "Belleza";
        color: #222;
        font-size: 64px;
        line-height: 64px;
        font-weight: 400; }
      .container .scroll_animate .scene_common .txt-row p {
        font-family: "Nanum Myeongjo";
        color: #555;
        font-size: 24px;
        line-height: 1.6;
        font-weight: 700; } }
    .container .scroll_animate #scene1 .inner-mo {
      width: 100%;
      height: 100%; }
      .container .scroll_animate #scene1 .inner-mo .inner {
        position: relative; }
        .container .scroll_animate #scene1 .inner-mo .inner:after {
          content: "";
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          opacity: 0;
          top: 0;
          transition: all 1s ease-in;
          background: url("/static/images/main/scene1_img@m.jpg") 50% 50% no-repeat;
          background-size: cover;
          z-index: 1; }
        .container .scroll_animate #scene1 .inner-mo .inner:before {
          content: "";
          position: absolute;
          width: 100%;
          height: 100%;
          left: 0;
          top: 0;
          z-index: 2;
          background: transparent;
          transition: all 1s 4s ease-out; }
        .container .scroll_animate #scene1 .inner-mo .inner .logo-row {
          position: absolute;
          width: 100%;
          top: 50%;
          left: 50%;
          z-index: 3;
          -moz-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          display: flex;
          justify-content: center;
          align-items: center;
          flex-flow: wrap;
          width: 100%; }
          .container .scroll_animate #scene1 .inner-mo .inner .logo-row .logo {
            width: 11.25rem;
            height: 5rem;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-flow: wrap;
            transform: translateY(70px);
            opacity: 0;
            transition: .5s 1.4s ease-out; }
            .container .scroll_animate #scene1 .inner-mo .inner .logo-row .logo .hstone-symbol {
              width: 6.6666666667rem;
              height: 3rem;
              margin: 0 10rem; }
              .container .scroll_animate #scene1 .inner-mo .inner .logo-row .logo .hstone-symbol svg {
                width: 100%; }
                .container .scroll_animate #scene1 .inner-mo .inner .logo-row .logo .hstone-symbol svg .hstone-symbol_path {
                  fill: #fff; }
            .container .scroll_animate #scene1 .inner-mo .inner .logo-row .logo .honorstone-logotxt {
              width: 100%; }
          .container .scroll_animate #scene1 .inner-mo .inner .logo-row .txt-row {
            text-align: center;
            font-family: "Nanum Myeongjo";
            margin-top: 4.1666666667rem;
            color: #fff;
            font-size: 1.25rem;
            line-height: 1.5;
            font-weight: 700;
            width: 100%;
            transform: translateY(70px);
            opacity: 0;
            transition: .5s 1.8s ease-out; }
    .container .scroll_animate #scene1.aniActive .inner-mo .inner:after {
      opacity: 1; }
    .container .scroll_animate #scene1.aniActive .inner-mo .inner:before {
      background: #65B3B1; }
    .container .scroll_animate #scene1.aniActive .inner-mo .inner .logo-row .logo, .container .scroll_animate #scene1.aniActive .inner-mo .inner .logo-row .txt-row {
      opacity: 1;
      transform: translateY(0); }
    @media screen and (min-width: 1200px) {
      .container .scroll_animate #scene1 {
        position: relative;
        height: 2000px;
        z-index: 1; }
        .container .scroll_animate #scene1 .inner-mo {
          display: none; }
        .container .scroll_animate #scene1 .inner-pc {
          height: 100%; }
          .container .scroll_animate #scene1 .inner-pc .obj_common {
            position: fixed;
            width: 100%;
            top: 0;
            left: 0; }
            .container .scroll_animate #scene1 .inner-pc .obj_common.obj_1 .item {
              position: absolute;
              width: 100%;
              height: 1px;
              left: 0;
              top: 50%;
              z-index: 2;
              background: #A6866B; }
            .container .scroll_animate #scene1 .inner-pc .obj_common.obj_1:before {
              content: "";
              position: absolute;
              z-index: -1;
              width: 100%;
              height: 100%;
              top: 0;
              left: 0;
              background: url(/static/images/main/main_section1_bg.jpg) 50% 50% no-repeat;
              background-size: cover; }
            .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item {
              position: absolute;
              width: 100%;
              height: 1px;
              top: 50%;
              -moz-transform: translateY(-50%);
              -ms-transform: translateY(-50%);
              -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
              left: 0;
              z-index: 1;
              display: flex;
              justify-content: flex-start;
              align-items: center;
              overflow: hidden;
              flex-flow: wrap; }
              .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_1, .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_2 {
                position: fixed;
                width: 100%;
                height: 50%; }
              .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 {
                position: fixed;
                width: 100%;
                height: 100%;
                opacity: 1;
                z-index: 3;
                transition: all .5s ease-in; }
                .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row {
                  position: fixed;
                  top: 50%;
                  left: 0;
                  width: 100%;
                  height: 120px;
                  text-align: center;
                  transition: all .5s ease-out;
                  -moz-transform: translateY(-50%);
                  -ms-transform: translateY(-50%);
                  -webkit-transform: translateY(-50%);
                  transform: translateY(-50%);
                  opacity: 0;
                  display: flex;
                  justify-content: flex-start;
                  align-items: center;
                  flex-flow: wrap;
                  align-content: space-between; }
                  .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row .logo {
                    width: 270px;
                    height: 120px;
                    margin: auto;
                    display: flex;
                    justify-content: flex-start;
                    align-items: center;
                    flex-flow: wrap;
                    align-content: space-between; }
                    .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row .logo .logo_symbol {
                      position: relative;
                      width: 160px;
                      height: 72px;
                      margin: auto; }
                      .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row .logo .logo_symbol img {
                        width: 100%; }
                    .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row .logo .logo_txt {
                      width: 100%; }
                  .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row .copy {
                    opacity: 0;
                    width: 100%;
                    transition: all .5s ease-out;
                    font-family: "Nanum Myeongjo";
                    color: #fff;
                    font-size: 36px;
                    line-height: 36px;
                    font-weight: 800; }
                  .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row.show {
                    opacity: 1; }
                    .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row.show.move {
                      height: 224px; }
                      .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row.show.move .logo_symbol {
                        width: 160px;
                        height: 72px; }
                      .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row.show.move .logo_txt {
                        display: block;
                        width: 270px;
                        height: 22px;
                        margin: 26px auto 80px auto; }
                      .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_3 .logo-row.show.move .copy {
                        opacity: 1; }
              .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_1 {
                height: 100vh;
                top: 50%;
                transform: translateY(-50%);
                background: url("/static/images/main/obj_2_2.jpg") 50% 50% no-repeat;
                background-size: cover;
                background-attachment: fixed;
                z-index: 2;
                transition: all 1s ease-in; }
              .container .scroll_animate #scene1 .inner-pc .obj_common.obj_2 .item .obj_2_2 {
                z-index: 1;
                top: 50%; } }
    .container .scroll_animate #scene2 .inner-mo .inner {
      background: url("/static/images/main/bg_premium.jpg") 50% 60% no-repeat;
      background-size: cover;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-flow: wrap;
      align-content: space-between;
      opacity: 0;
      transition: 1s .1s ease-out;
      height: auto; }
      .container .scroll_animate #scene2 .inner-mo .inner .top-row {
        width: 84.375%;
        margin: auto; }
        .container .scroll_animate #scene2 .inner-mo .inner .top-row .txt-row h3 {
          line-height: 1.15;
          margin: 5rem 0 2.9583333333rem 0;
          transform: translateX(70px);
          opacity: 0;
          transition: .5s .3s ease-out; }
        .container .scroll_animate #scene2 .inner-mo .inner .top-row .txt-row p {
          margin-bottom: 2.5rem;
          transform: translateX(70px);
          opacity: 0;
          transition: .5s .7s ease-out; }
        .container .scroll_animate #scene2 .inner-mo .inner .top-row .img-row {
          background: url("/static/images/main/premium_img.jpg") 50% 60% no-repeat;
          background-size: cover;
          opacity: 0;
          transition: 1s .9s ease-out; }
          .container .scroll_animate #scene2 .inner-mo .inner .top-row .img-row img {
            opacity: 0;
            width: 100%;
            max-width: 31.25rem; }
      .container .scroll_animate #scene2 .inner-mo .inner .bottom-row {
        width: 84.375%;
        margin: auto; }
        .container .scroll_animate #scene2 .inner-mo .inner .bottom-row .img-row {
          margin: 5.1041666667rem 0 1.5416666667rem 0;
          text-align: right; }
          .container .scroll_animate #scene2 .inner-mo .inner .bottom-row .img-row img {
            width: 11.9583333333rem; }
        .container .scroll_animate #scene2 .inner-mo .inner .bottom-row .txt-row {
          display: flex;
          justify-content: flex-end;
          align-items: center; }
          .container .scroll_animate #scene2 .inner-mo .inner .bottom-row .txt-row p {
            word-break: keep-all;
            width: 80%;
            text-align: right;
            font-family: inherit;
            color: #555;
            font-size: 1rem;
            line-height: 1.6;
            font-weight: 700;
            margin-bottom: 5rem;
            transform: translateX(70px);
            opacity: 0;
            transition: .5s 1.3s ease-out; }
    .container .scroll_animate #scene2.aniActive .inner {
      opacity: 1; }
      .container .scroll_animate #scene2.aniActive .inner .top-row .txt-row h3 {
        opacity: 1;
        transform: translateX(0); }
      .container .scroll_animate #scene2.aniActive .inner .top-row .txt-row p {
        opacity: 1;
        transform: translateX(0); }
      .container .scroll_animate #scene2.aniActive .inner .top-row .img-row {
        opacity: 1; }
      .container .scroll_animate #scene2.aniActive .inner .bottom-row .txt-row h4, .container .scroll_animate #scene2.aniActive .inner .bottom-row .txt-row p {
        opacity: 1;
        transform: translateX(0); }
    @media screen and (min-width: 1200px) {
      .container .scroll_animate #scene2 {
        position: relative;
        height: 5600px;
        z-index: 1; }
        .container .scroll_animate #scene2 .inner-mo {
          display: none; }
        .container .scroll_animate #scene2 .inner-pc {
          width: 100%;
          height: 100%; }
          .container .scroll_animate #scene2 .inner-pc .obj_common {
            position: fixed;
            width: 100%;
            top: 0;
            left: 0; }
            .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 {
              position: fixed;
              z-index: 3;
              overflow: hidden;
              width: 100%; }
              .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .txt-row {
                width: auto;
                position: absolute;
                left: 6.5%;
                bottom: 50%;
                opacity: 0;
                transition: all .15s ease-in;
                z-index: 2; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .txt-row h3 {
                  font-family: "Belleza";
                  margin-bottom: 150px;
                  transition: all 1s ease-in;
                  color: #fff;
                  font-size: 64px;
                  line-height: 64px;
                  font-weight: 400; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .txt-row p {
                  color: #fff;
                  font-size: 18px;
                  line-height: 1.5;
                  font-weight: 700; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .txt-row.show {
                  opacity: 1; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .txt-row.change h3 {
                  color: #222; }
              .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .img-row {
                position: fixed;
                width: 100vw;
                height: 100%;
                left: 0%;
                top: 0%;
                overflow: hidden; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .img-row .img {
                  position: absolute;
                  width: 100%;
                  height: 100%;
                  top: 0;
                  left: 0;
                  z-index: 1;
                  background: url("/static/images/main/scene2_img_bg.jpg") 50% 50% no-repeat;
                  background-size: cover; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .img-row img {
                  display: block;
                  width: 100%;
                  height: 100%;
                  opacity: 0; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .img-row.reset .img {
                  width: 100%;
                  height: 100%; }
                  .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .img-row.reset .img img {
                    display: block;
                    width: 100%;
                    height: 100%; }
              .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1.on .txt-row {
                opacity: 1; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1.on .txt-row.hide {
                  opacity: 0; }
            .container .scroll_animate #scene2 .inner-pc .obj_common.obj_2 {
              z-index: 2; }
              .container .scroll_animate #scene2 .inner-pc .obj_common.obj_2 .txt-row {
                width: auto;
                position: absolute;
                left: 50%;
                margin-left: -700px;
                top: 28%;
                opacity: 0;
                transition: all .5s ease-in; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_2 .txt-row h3 {
                  font-family: "Belleza";
                  margin-bottom: 40px;
                  color: #222;
                  font-size: 64px;
                  line-height: 64px;
                  font-weight: 400; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_2 .txt-row p {
                  color: #555;
                  font-size: 18px;
                  line-height: 1.5;
                  font-weight: 700; }
              .container .scroll_animate #scene2 .inner-pc .obj_common.obj_2.show .txt-row {
                top: 25%;
                opacity: 1; }
            .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 {
              z-index: 1; }
              .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row {
                position: absolute;
                width: 486px;
                left: 50%;
                top: 55%;
                opacity: 0;
                transition: all .3s ease-out;
                margin-left: 40px; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row .img-row {
                  width: 280px;
                  transition: all .3s ease-out; }
                  .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row .img-row img {
                    max-width: 100%; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row h4 {
                  color: #555;
                  font-size: 21px;
                  line-height: 1.5;
                  font-weight: 700;
                  margin-bottom: 10px; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row p {
                  font-family: initial;
                  color: #555;
                  font-size: 21px;
                  line-height: 1.5;
                  font-weight: 500; }
                .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row.show {
                  opacity: 1; } }
    @media screen and (min-width: 1920px) {
      .container .scroll_animate #scene2 .inner-pc .obj_common.obj_1 .txt-row {
        left: calc( 50% - 840px); }
      .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row {
        top: 50%;
        margin-left: 60px; }
        .container .scroll_animate #scene2 .inner-pc .obj_common.obj_3 .txt-row .img-row {
          width: 400px; } }
  .container section .inner {
    padding: 0; }
    .container section .inner.full .full-inner {
      width: 100%; }
  .container section#scene3 {
    z-index: 2; }
    .container section#scene3 .inner.full .full-inner .fl_view {
      opacity: 0;
      transition: 1s .1s ease-out; }
      .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide img {
        max-width: 100%; }
      .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over {
        position: absolute;
        bottom: -100%;
        left: 0;
        width: 100%;
        height: 16.9583333333rem;
        background: rgba(101, 179, 177, 0.7);
        transition: all .35s .17s ease-out;
        opacity: 0; }
        .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .txt-row h3 {
          text-align: center;
          font-family: "Outfit";
          margin: 2.9166666667rem auto 0.8333333333rem auto;
          color: #fff;
          font-size: 1.4583333333rem;
          line-height: 1.4583333333rem;
          font-weight: 600; }
        .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .txt-row p {
          text-align: center;
          margin-bottom: 2.2916666667rem;
          color: #fff;
          font-size: 1rem;
          line-height: 1.6;
          font-weight: 700; }
        .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .btn-row {
          text-align: center; }
          .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .btn-row .btn {
            background: #fff;
            color: #65B3B1; }
            .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .btn-row .btn i {
              margin-left: 0.4166666667rem; }
              .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .btn-row .btn i svg .pencil_path, .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .btn-row .btn i svg .search_path2 {
                stroke: #65B3B1; }
              .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide .over .btn-row .btn i svg .search_path1 {
                fill: #65B3B1; }
      .container section#scene3 .inner.full .full-inner .fl_view .swiper-slide-active .over {
        bottom: 0;
        opacity: 1; }
    .container section#scene3 .inner.full .full-inner.pc {
      display: none; }
    .container section#scene3.aniActive .inner.full .full-inner .fl_view {
      opacity: 1; }
    @media screen and (min-width: 1200px) {
      .container section#scene3 .inner.full .full-inner.mo {
        display: none; }
      .container section#scene3 .inner.full .full-inner.pc {
        display: block;
        max-width: 100%;
        height: 1080px; }
        .container section#scene3 .inner.full .full-inner.pc .fl-wrapper {
          position: relative;
          width: 100%;
          height: 100%; }
          .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view {
            position: relative;
            width: 100%;
            height: 100%;
            overflow: hidden; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view .blur {
              position: absolute;
              width: 100%;
              height: 100%;
              top: 50%;
              left: 50%;
              z-index: 2;
              opacity: 0;
              transition: all .25s ease-in;
              transform: translate(-50%, -50%);
              display: none; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view .def {
              position: absolute;
              width: 100%;
              height: 100%;
              top: 50%;
              left: 50%;
              z-index: 1;
              opacity: 0;
              transition: all .25s ease-in;
              transform: translate(-50%, -50%); }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on1 .blur {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper1_blur.png") 50% 100% no-repeat;
              background-size: cover; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on1 .def {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper1.jpg") 50% 100% no-repeat;
              background-size: cover; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on2 .blur {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper2_blur.png") 50% 100% no-repeat;
              background-size: cover; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on2 .def {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper2.jpg") 50% 100% no-repeat;
              background-size: cover; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on3 .blur {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper3_blur.png") 50% 100% no-repeat;
              background-size: cover; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on3 .def {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper3.jpg") 50% 100% no-repeat;
              background-size: cover; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on4 .blur {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper4_blur.png") 50% 100% no-repeat;
              background-size: cover; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .img_view.on4 .def {
              opacity: 1;
              background: url("/static/images/main/bg_fl-wrapper4.jpg") 50% 100% no-repeat;
              background-size: cover; }
          .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 366px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            z-index: 3;
            overflow: hidden;
            backdrop-filter: blur(10px);
            /* 블러 효과 */
            -webkit-backdrop-filter: blur(10px);
            /* Safari용 */ }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item {
              position: relative;
              bottom: -104px;
              width: 25%;
              height: 366px;
              transition: all .35s ease-Out; }
              .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over {
                width: 100%;
                height: 100%; }
                .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .txt-row h3 {
                  text-align: center;
                  font-family: "Outfit";
                  margin-top: 80px;
                  color: #fff;
                  font-size: 32px;
                  line-height: 32px;
                  font-weight: 600; }
                .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .txt-row p {
                  word-break: keep-all;
                  margin-top: 24px;
                  text-align: center;
                  color: #fff;
                  font-size: 18px;
                  line-height: 1.5;
                  font-weight: 400; }
                .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row {
                  width: 128px;
                  height: 56px;
                  margin: 48px auto 0 auto;
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  opacity: 0;
                  transition: none;
                  transform: translateY(100%); }
                  .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn {
                    width: 56px;
                    height: 56px;
                    border: 1px solid #fff;
                    background: transparent; }
                    .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn span {
                      display: none; }
                    .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn i svg .pencil_path, .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn i svg .search_path2 {
                      stroke: #fff; }
                    .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn i svg .search_path1 {
                      fill: #fff;
                      stroke: #fff; }
              .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item.active {
                bottom: 0;
                background: #65B3B1; }
                .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item.active .over .btn-row {
                  opacity: 1;
                  transform: translateY(0); } }
    @media screen and (min-width: 1600px) {
      .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row {
        width: 100%; }
        .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn {
          width: 56px;
          height: 56px;
          border: 1px solid #fff;
          background: transparent;
          position: absolute; }
          .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn span {
            display: block;
            white-space: nowrap;
            transition: all .25s .15s ease-out;
            opacity: 0;
            color: #65B3B1;
            font-size: 18px;
            line-height: 18px;
            font-weight: 600; }
          .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(1) {
            right: 50%;
            margin-right: 8px;
            justify-content: flex-end;
            padding-right: 17px; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(1) span {
              margin-right: 16px; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(1):hover {
              background: #fff;
              width: 180px; }
              .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(1):hover span {
                opacity: 1; }
              .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(1):hover i svg .pencil_path {
                stroke: #65B3B1; }
          .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(2) {
            left: 50%;
            margin-left: 8px;
            justify-content: flex-start;
            padding-left: 17px; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(2) span {
              margin-left: 16px; }
            .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(2):hover {
              background: #fff;
              width: 180px; }
              .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(2):hover span {
                opacity: 1; }
              .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item .over .btn-row .btn:nth-child(2):hover i svg .search_path2 {
                stroke: #65B3B1; }
      .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item.active {
        bottom: 0;
        background: #65B3B1; }
        .container section#scene3 .inner.full .full-inner.pc .fl-wrapper .box-menu .menu-item.active .over .btn-row {
          opacity: 1;
          transform: translateY(0); } }
  .container section#scene4 {
    z-index: 2;
    background: url("/static/images/main/bg_facility@m.jpg") 50% 50% no-repeat;
    background-size: cover; }
    .container section#scene4 .inner.full .full-inner {
      padding-bottom: 5rem; }
      .container section#scene4 .inner.full .full-inner h3 {
        text-align: left;
        font-family: "Belleza";
        margin: 5rem auto 1.6666666667rem 1.6666666667rem;
        color: #222;
        font-size: 2.6666666667rem;
        line-height: 2.6666666667rem;
        font-weight: 400;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .1s ease-out; }
      .container section#scene4 .inner.full .full-inner img {
        max-width: 100%; }
      .container section#scene4 .inner.full .full-inner .honorstable_special_txt {
        position: absolute;
        right: 0;
        bottom: 9.7083333333rem;
        width: 18.9166666667rem;
        height: 11rem;
        z-index: 2;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s 1s ease-out; }
        .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide {
          display: flex;
          justify-content: flex-start;
          align-items: flex-end;
          padding: 0 0 1.6666666667rem 1.6666666667rem; }
          .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide:nth-child(odd) {
            background: #A6866B; }
          .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide:nth-child(even) {
            background: #65B3B1; }
          .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide .txt-row h4 {
            font-family: "Outfit";
            margin-bottom: 1.3333333333rem;
            color: #fff;
            font-size: 1.3333333333rem;
            line-height: 1.3333333333rem;
            font-weight: 600; }
          .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide .txt-row p {
            padding-right: 2.0833333333rem;
            word-break: keep-all;
            color: #fff;
            font-size: 1rem;
            line-height: 1.4;
            font-weight: 500; }
      .container section#scene4 .inner.full .full-inner .honorstable_special {
        opacity: 0;
        transition: .5s .5s ease-out; }
      .container section#scene4 .inner.full .full-inner .controller {
        margin: 9.2916666667rem 0 0 1.6666666667rem;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s 1.3s ease-out; }
        .container section#scene4 .inner.full .full-inner .controller .swiper-pagination {
          position: relative;
          width: 5.0833333333rem;
          top: 0;
          text-align: center;
          bottom: auto;
          height: 3.0416666667rem;
          display: flex;
          justify-content: center;
          align-items: center;
          color: #aaa;
          font-size: 0.9583333333rem;
          line-height: 0.9583333333rem;
          font-weight: 600; }
          .container section#scene4 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-current {
            margin-right: 0.25rem;
            color: #A6866B;
            font-size: 0.9583333333rem;
            line-height: 0.9583333333rem;
            font-weight: 600; }
          .container section#scene4 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-total {
            margin-left: 0.25rem;
            color: #aaa;
            font-size: 0.9583333333rem;
            line-height: 0.9583333333rem;
            font-weight: 600; }
    .container section#scene4.aniActive .inner.full .full-inner h3 {
      transform: translateX(0);
      opacity: 1; }
    .container section#scene4.aniActive .inner.full .full-inner .honorstable_special_txt {
      transform: translateX(0);
      opacity: 1; }
    .container section#scene4.aniActive .inner.full .full-inner .honorstable_special {
      opacity: 1; }
    .container section#scene4.aniActive .inner.full .full-inner .controller {
      transform: translateX(0);
      opacity: 1; }
    @media screen and (min-width: 1200px) {
      .container section#scene4 {
        background: url("/static/images/main/bg_facility.jpg") 50% 50% no-repeat;
        background-size: cover;
        height: 1080px; }
        .container section#scene4 .inner.full .full-inner {
          padding-bottom: 0;
          max-width: 1280px; }
          .container section#scene4 .inner.full .full-inner h3 {
            margin: 0;
            padding: 160px 0 24px 0;
            color: #222;
            font-size: 64px;
            line-height: 64px;
            font-weight: 400; }
          .container section#scene4 .inner.full .full-inner img {
            max-width: 100%; }
          .container section#scene4 .inner.full .full-inner .honorstable_special_txt {
            bottom: 120px;
            width: 440px;
            height: 264px; }
            .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide {
              padding: 0 0 48px 48px; }
              .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide .txt-row h4 {
                margin-bottom: 24px;
                color: #fff;
                font-size: 28px;
                line-height: 28px;
                font-weight: 600; }
              .container section#scene4 .inner.full .full-inner .honorstable_special_txt .swiper-slide .txt-row p {
                padding-right: 50px;
                color: #fff;
                font-size: 18px;
                line-height: 1.4;
                font-weight: 500; }
          .container section#scene4 .inner.full .full-inner .honorstable_special {
            max-width: 1120px; }
          .container section#scene4 .inner.full .full-inner .controller {
            margin: 40px 0 0 104px; }
            .container section#scene4 .inner.full .full-inner .controller .swiper-pagination {
              width: 92px;
              height: 64px;
              color: #aaa;
              font-size: 16px;
              line-height: 16px;
              font-weight: 600; }
              .container section#scene4 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-current {
                margin-right: 6px;
                color: #A6866B;
                font-size: 16px;
                line-height: 16px;
                font-weight: 600; }
              .container section#scene4 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-total {
                margin-left: 6px;
                color: #aaa;
                font-size: 16px;
                line-height: 16px;
                font-weight: 600; } }
  .container section#scene5 {
    z-index: 2; }
    .container section#scene5 .inner.full {
      background: url("/static/images/main/bg_service@m.jpg") 50% 50% no-repeat;
      background-size: cover;
      padding-bottom: 5.4166666667rem;
      opacity: 0;
      transition: 1s .1s ease-out; }
      .container section#scene5 .inner.full .full-inner .txt-row h3 {
        text-align: left;
        font-family: "Belleza";
        padding: 5.4166666667rem 0 1.6666666667rem 1.6666666667rem;
        color: #222;
        font-size: 2.6666666667rem;
        line-height: 2.6666666667rem;
        font-weight: 400;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .3s ease-out; }
      .container section#scene5 .inner.full .full-inner .txt-row p {
        text-align: left;
        font-family: "Nanum Myeongjo";
        padding: 0 0 3.3333333333rem 1.6666666667rem;
        color: #222;
        font-size: 1.25rem;
        line-height: 1.4;
        font-weight: 700;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .6s ease-out; }
      .container section#scene5 .inner.full .full-inner .service_slide {
        width: 87.5%;
        margin: auto;
        opacity: 0;
        transition: 1s .9s ease-out; }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide img {
          max-width: 100%; }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 {
          overflow: hidden; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 img, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 img, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 img {
            display: block;
            opacity: 0; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 > h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 > h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 > h3 {
            position: absolute;
            bottom: 1rem;
            left: 1rem;
            width: 100%;
            z-index: 2;
            opacity: 0;
            font-family: "Outfit";
            color: #fff;
            font-size: 1.0833333333rem;
            line-height: 1.0833333333rem;
            font-weight: 600; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 .over, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 .over, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 .over {
            display: none; }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img1 {
          position: absolute;
          top: 0;
          right: 0;
          width: 75%; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img1 h3 {
            transition: all 1s .3s ease-out; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img1 img {
            transition: all .5s .17s ease-out;
            transform: translateX(-101%); }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img2 {
          position: absolute;
          top: 49.91087344029%;
          left: 0;
          width: 53.57142857143%; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img2 h3 {
            transition: all 1s .5s ease-out; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img2 img {
            transition: all .5s .25s ease-out;
            transform: translateX(101%); }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img3 {
          position: absolute;
          top: 49.91087344029%;
          right: 0;
          width: 42.85714285714%; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img3 h3 {
            transition: all 1s .75s ease-out; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img3 img {
            transition: all .5s .35s ease-out;
            transform: translateY(-101%); }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img1 {
          position: absolute;
          top: 0;
          left: 5.71428571429%;
          width: 47.85714285714%; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img1 h3 {
            transition: all 1s .3s ease-out; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img1 img {
            transition: all .5s .17s ease-out;
            transform: translateX(-101%); }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img2 {
          position: absolute;
          top: 49.91087344029%;
          left: 0;
          width: 53.57142857143%; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img2 h3 {
            transition: all 1s .5s ease-out; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img2 img {
            transition: all .5s .25s ease-out;
            transform: translateX(101%); }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img3 {
          position: absolute;
          top: 25.13368983957%;
          right: 0;
          width: 42.85714285714%; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img3 h3 {
            transition: all 1s .75s ease-out; }
          .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img3 img {
            transition: all .5s .35s ease-out;
            transform: translateY(-101%); }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img1 h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img2 h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img3 h3 {
          opacity: 1; }
        .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img1 img, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img2 img, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img3 img {
          opacity: 1;
          transform: translate(0, 0); }
      .container section#scene5 .inner.full .full-inner .controller {
        margin: 1.6666666667rem 0 0 1.6666666667rem;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s 1.3s ease-out; }
        .container section#scene5 .inner.full .full-inner .controller .swiper-pagination {
          position: relative;
          width: 5.0833333333rem;
          top: 0;
          text-align: center;
          bottom: auto;
          height: 3.0416666667rem;
          display: flex;
          justify-content: center;
          align-items: center;
          color: #aaa;
          font-size: 0.9583333333rem;
          line-height: 0.9583333333rem;
          font-weight: 600; }
          .container section#scene5 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-current {
            margin-right: 0.25rem;
            color: #A6866B;
            font-size: 0.9583333333rem;
            line-height: 0.9583333333rem;
            font-weight: 600; }
          .container section#scene5 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-total {
            margin-left: 0.25rem;
            color: #aaa;
            font-size: 0.9583333333rem;
            line-height: 0.9583333333rem;
            font-weight: 600; }
    .container section#scene5.aniActive .inner.full {
      opacity: 1; }
      .container section#scene5.aniActive .inner.full .full-inner h3 {
        transform: translateX(0);
        opacity: 1; }
      .container section#scene5.aniActive .inner.full .full-inner p {
        transform: translateX(0);
        opacity: 1; }
      .container section#scene5.aniActive .inner.full .full-inner .service_slide {
        opacity: 1; }
      .container section#scene5.aniActive .inner.full .full-inner .controller {
        transform: translateX(0);
        opacity: 1; }
    @media screen and (min-width: 1200px) {
      .container section#scene5 {
        height: 1080px; }
        .container section#scene5 .inner.full {
          background: url("/static/images/main/bg_service.jpg") 50% 50% no-repeat;
          background-size: cover;
          padding-bottom: 180px;
          opacity: 1;
          transition: none; }
          .container section#scene5 .inner.full .full-inner {
            width: 100%;
            max-width: 1440px;
            margin: auto;
            padding-top: 180px;
            display: flex;
            justify-content: flex-end;
            align-items: flex-start;
            flex-flow: wrap; }
            .container section#scene5 .inner.full .full-inner .txt-row {
              position: absolute;
              top: 258px;
              left: 80px; }
              .container section#scene5 .inner.full .full-inner .txt-row h3 {
                padding: 0;
                margin-bottom: 40px;
                color: #222;
                font-size: 64px;
                line-height: 64px;
                font-weight: 400; }
              .container section#scene5 .inner.full .full-inner .txt-row p {
                padding: 0;
                color: #222;
                font-size: 24px;
                line-height: 1.4;
                font-weight: 700; }
            .container section#scene5 .inner.full .full-inner .service_slide {
              width: 1000px;
              height: 720px;
              margin: 0; }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 > h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 > h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 > h3 {
                bottom: 48px;
                left: 48px;
                color: #fff;
                font-size: 24px;
                line-height: 24px;
                font-weight: 600; }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 .over, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 .over, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 .over {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                z-index: 2;
                opacity: 0;
                transition: all .3s ease-in;
                background: #65B3B1;
                display: flex;
                justify-content: center;
                align-items: center;
                align-content: center;
                flex-flow: wrap; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 .over h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 .over h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 .over h3 {
                  font-family: "Outfit";
                  text-align: center;
                  width: 100%;
                  color: #fff;
                  font-size: 24px;
                  line-height: 24px;
                  font-weight: 600; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 .over p, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 .over p, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 .over p {
                  width: 100%;
                  text-align: center;
                  margin: 20px auto 32px auto;
                  color: #fff;
                  font-size: 18px;
                  line-height: 1.5;
                  font-weight: 500; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1 .over .btn-row, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2 .over .btn-row, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3 .over .btn-row {
                  text-align: center; }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img1:hover .over, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img2:hover .over, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide .img3:hover .over {
                opacity: 1; }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img1 {
                position: absolute;
                top: 0;
                right: 0;
                width: 64%; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img1 h3 {
                  transition: all 1s .3s ease-out; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img1 img {
                  transition: all .5s .17s ease-out;
                  transform: translateX(-101%); }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img2 {
                position: absolute;
                top: 50%;
                left: 0;
                width: 64%; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img2 h3 {
                  transition: all 1s .5s ease-out; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img2 img {
                  transition: all .5s .25s ease-out;
                  transform: translateX(101%); }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img3 {
                position: absolute;
                top: 50%;
                right: 0;
                width: 32%; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img3 h3 {
                  transition: all 1s .75s ease-out; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(1) .img3 img {
                  transition: all .5s .35s ease-out;
                  transform: translateY(-101%); }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img1 {
                position: absolute;
                top: 0;
                left: unset;
                right: 36%;
                width: 36.8%; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img1 h3 {
                  transition: all 1s .3s ease-out; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img1 img {
                  transition: all .5s .17s ease-out;
                  transform: translateX(-101%); }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img2 {
                position: absolute;
                top: 50%;
                left: unset;
                right: 36%;
                width: 56%; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img2 h3 {
                  transition: all 1s .5s ease-out; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img2 img {
                  transition: all .5s .25s ease-out;
                  transform: translateX(101%); }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img3 {
                position: absolute;
                top: 25%;
                right: 0;
                width: 32%; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img3 h3 {
                  transition: all 1s .75s ease-out; }
                .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide:nth-child(2) .img3 img {
                  transition: all .5s .35s ease-out;
                  transform: translateY(-101%); }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img1 h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img2 h3, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img3 h3 {
                opacity: 1; }
              .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img1 img, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img2 img, .container section#scene5 .inner.full .full-inner .service_slide .swiper-slide.swiper-slide-active .img3 img {
                opacity: 1;
                transform: translate(0, 0); }
            .container section#scene5 .inner.full .full-inner .controller {
              width: 100%;
              margin: -92px 0 0 80px; }
              .container section#scene5 .inner.full .full-inner .controller .swiper-pagination {
                width: 117px;
                height: 64px;
                color: #aaa;
                font-size: 16px;
                line-height: 16px;
                font-weight: 600; }
                .container section#scene5 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-current {
                  margin-right: 6px;
                  color: #A6866B;
                  font-size: 16px;
                  line-height: 16px;
                  font-weight: 600; }
                .container section#scene5 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-total {
                  margin-left: 6px;
                  color: #aaa;
                  font-size: 16px;
                  line-height: 16px;
                  font-weight: 600; } }
  .container section#scene6 {
    z-index: 2; }
    .container section#scene6 .inner.full {
      background: url("/static/images/main/bg_membership@m.jpg") 50% 50% no-repeat;
      background-size: cover;
      opacity: 0;
      transition: 1s .1s ease-out; }
      .container section#scene6 .inner.full .full-inner .txt-row h3 {
        text-align: center;
        font-family: "Belleza";
        padding: 5.4166666667rem 0 1.6666666667rem 0;
        color: #222;
        font-size: 2.6666666667rem;
        line-height: 2.6666666667rem;
        font-weight: 400;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .3s ease-out; }
      .container section#scene6 .inner.full .full-inner .txt-row p {
        text-align: center;
        font-family: "Nanum Myeongjo";
        padding: 0 0 2.5rem 0;
        color: #222;
        font-size: 1.25rem;
        line-height: 1.4;
        font-weight: 700;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .6s ease-out; }
      .container section#scene6 .inner.full .full-inner .txt-row .btn-row {
        text-align: center;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .8s ease-out; }
      .container section#scene6 .inner.full .full-inner .icon-menu {
        width: 87.5%;
        margin: 3.3333333333rem auto 0 auto;
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-flow: wrap;
        opacity: 0;
        transition: 1s .9s ease-out; }
        .container section#scene6 .inner.full .full-inner .icon-menu li {
          position: relative;
          width: 50%;
          height: 11.6666666667rem;
          text-align: center;
          display: flex;
          justify-content: center;
          align-items: center;
          align-content: center;
          flex-flow: wrap; }
          .container section#scene6 .inner.full .full-inner .icon-menu li .icon {
            text-align: center;
            width: 4.1666666667rem;
            height: 4.1666666667rem;
            border-radius: 4.1666666667rem;
            background: #eee;
            margin: auto; }
            .container section#scene6 .inner.full .full-inner .icon-menu li .icon i {
              width: 4.1666666667rem;
              height: 4.1666666667rem; }
          .container section#scene6 .inner.full .full-inner .icon-menu li p {
            width: 100%;
            margin-top: 1.3333333333rem;
            color: #222;
            font-size: 1.0833333333rem;
            line-height: 1.0833333333rem;
            font-weight: 600; }
          .container section#scene6 .inner.full .full-inner .icon-menu li:before, .container section#scene6 .inner.full .full-inner .icon-menu li:after {
            content: "";
            position: absolute;
            background: #ddd;
            opacity: 0;
            top: 50%; }
          .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(2) i svg {
            width: 42.5%;
            height: 30.5%; }
            .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(2) i svg .coupon_path1, .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(2) i svg .coupon_path2 {
              stroke: #65B3B1; }
          .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(1):before, .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(3):before {
            right: 0;
            width: 1px;
            height: 70%;
            opacity: 1;
            -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%); }
          .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(1):after, .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(2):after {
            right: 0;
            width: 70%;
            height: 1px;
            top: auto;
            right: auto;
            left: 50%;
            bottom: 0;
            opacity: 1;
            -moz-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%); }
    .container section#scene6.aniActive .inner.full {
      opacity: 1; }
      .container section#scene6.aniActive .inner.full .full-inner h3 {
        transform: translateX(0);
        opacity: 1; }
      .container section#scene6.aniActive .inner.full .full-inner p {
        transform: translateX(0);
        opacity: 1; }
      .container section#scene6.aniActive .inner.full .full-inner .btn-row {
        opacity: 1;
        transform: translateX(0); }
      .container section#scene6.aniActive .inner.full .full-inner .icon-menu {
        opacity: 1; }
    @media screen and (min-width: 1200px) {
      .container section#scene6 .inner.full {
        background: url("/static/images/main/bg_membership.jpg") 50% 50% no-repeat;
        background-size: cover;
        opacity: 1;
        transition: none; }
        .container section#scene6 .inner.full .full-inner .txt-row h3 {
          padding: 167px 0 40px 0;
          color: #222;
          font-size: 64px;
          line-height: 64px;
          font-weight: 400; }
        .container section#scene6 .inner.full .full-inner .txt-row p {
          padding: 0 0 64px 0;
          color: #222;
          font-size: 24px;
          line-height: 1.4;
          font-weight: 700; }
        .container section#scene6 .inner.full .full-inner .icon-menu {
          width: 100%;
          max-width: 1440px;
          margin: 120px auto 0 auto; }
          .container section#scene6 .inner.full .full-inner .icon-menu li {
            width: 25%;
            height: 342px; }
            .container section#scene6 .inner.full .full-inner .icon-menu li .icon {
              width: 100px;
              height: 100px;
              border-radius: 100px; }
              .container section#scene6 .inner.full .full-inner .icon-menu li .icon i {
                width: 100px;
                height: 100px; }
            .container section#scene6 .inner.full .full-inner .icon-menu li p {
              margin-top: 32px;
              color: #222;
              font-size: 20px;
              line-height: 20px;
              font-weight: 600; }
            .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(1):before, .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(2):before, .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(3):before {
              right: 0;
              width: 1px;
              height: 70%;
              opacity: 1;
              -moz-transform: translateY(-50%);
              -ms-transform: translateY(-50%);
              -webkit-transform: translateY(-50%);
              transform: translateY(-50%); }
            .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(1):after, .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(2):after {
              display: none; }
            .container section#scene6 .inner.full .full-inner .icon-menu li:nth-child(2) i svg {
              width: 43%;
              height: 31%; } }
  .container section#scene7 {
    z-index: 2; }
    .container section#scene7 .inner.full {
      background: url("/static/images/main/bg_notice@m.jpg") 50% 50% no-repeat;
      background-size: cover;
      padding-bottom: 5rem;
      opacity: 0;
      transition: 1s .1s ease-out; }
      .container section#scene7 .inner.full .full-inner .txt-row h3 {
        text-align: center;
        font-family: "Belleza";
        padding: 5.4166666667rem 0 1.6666666667rem 0;
        color: #222;
        font-size: 2.6666666667rem;
        line-height: 2.6666666667rem;
        font-weight: 400;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .3s ease-out; }
      .container section#scene7 .inner.full .full-inner .txt-row p {
        text-align: center;
        font-family: "Nanum Myeongjo";
        padding: 0 0 2.5rem 0;
        color: #222;
        font-size: 1.25rem;
        line-height: 1.4;
        font-weight: 700;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .6s ease-out; }
      .container section#scene7 .inner.full .full-inner .txt-row .img-row {
        display: none; }
      .container section#scene7 .inner.full .full-inner .list-row {
        width: 87.5%;
        margin: auto;
        border-top: 1px solid #ccc; }
        .container section#scene7 .inner.full .full-inner .list-row ul {
          position: relative;
          display: flex;
          justify-content: flex-start;
          align-items: center;
          border-bottom: 1px solid #ccc;
          padding: 2rem 0.0833333333rem;
          transition: all .2s ease-in; }
          .container section#scene7 .inner.full .full-inner .list-row ul:before {
            content: "";
            position: absolute;
            bottom: -1px;
            left: 50%;
            width: 0%;
            height: 2px;
            opacity: 0;
            background: #fff;
            transition: all .2s ease-in;
            -moz-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%); }
          .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(1) {
            display: flex;
            justify-content: center;
            align-items: center;
            flex-flow: wrap;
            width: 18.92857142857%; }
            .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(1) strong {
              display: block;
              width: 100%;
              font-family: "Outfit";
              text-align: center;
              color: #aaa;
              font-size: 1.4583333333rem;
              line-height: 1.4583333333rem;
              font-weight: 500; }
            .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(1) span {
              width: 100%;
              font-family: "Outfit";
              text-align: center;
              color: #aaa;
              font-size: 1.0833333333rem;
              line-height: 1.0833333333rem;
              font-weight: 400; }
          .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(2) {
            width: 65.71428571429%;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            flex-flow: wrap; }
            .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(2) strong {
              display: block;
              width: 100%;
              font-family: "Outfit";
              text-align: left;
              margin: 0.4166666667rem 0;
              color: #A6866B;
              font-size: 1rem;
              line-height: 1rem;
              font-weight: 600; }
            .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(2) a {
              width: 100%;
              margin: 0.4166666667rem 0;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              color: #222;
              font-size: 1rem;
              line-height: 1.4;
              font-weight: 600; }
          .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(3) {
            width: 15.35714285714%;
            display: flex;
            justify-content: center;
            align-items: center; }
            .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(3) i {
              transform: rotate(90deg); }
              .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(3) i svg .arrow5_path {
                stroke: #aaa; }
          .container section#scene7 .inner.full .full-inner .list-row ul.news li:nth-child(2) strong {
            color: #A6866B; }
          .container section#scene7 .inner.full .full-inner .list-row ul.media li:nth-child(2) strong {
            color: #65B3B1; }
          .container section#scene7 .inner.full .full-inner .list-row ul.pr li:nth-child(2) strong {
            color: #008C9E; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.news:before {
            width: 100%;
            opacity: 1;
            background: #A6866B; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.news li:nth-child(1) strong {
            color: #A6866B; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.news li:nth-child(1) span {
            color: #A6866B; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.news li:nth-child(3) i svg .arrow5_path {
            stroke: #A6866B; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.media:before {
            width: 100%;
            opacity: 1;
            background: #65B3B1; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.media li:nth-child(1) strong {
            color: #65B3B1; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.media li:nth-child(1) span {
            color: #65B3B1; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.media li:nth-child(3) i svg .arrow5_path {
            stroke: #65B3B1; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.pr:before {
            width: 100%;
            opacity: 1;
            background: #008C9E; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.pr li:nth-child(1) strong {
            color: #008C9E; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.pr li:nth-child(1) span {
            color: #008C9E; }
          .container section#scene7 .inner.full .full-inner .list-row ul:hover.pr li:nth-child(3) i svg .arrow5_path {
            stroke: #008C9E; }
          .container section#scene7 .inner.full .full-inner .list-row ul:nth-child(1) {
            transform: translateY(70px);
            opacity: 0;
            transition: .5s .8s ease-out; }
          .container section#scene7 .inner.full .full-inner .list-row ul:nth-child(2) {
            transform: translateY(70px);
            opacity: 0;
            transition: .5s 1s ease-out; }
          .container section#scene7 .inner.full .full-inner .list-row ul:nth-child(3) {
            transform: translateY(70px);
            opacity: 0;
            transition: .5s 1.2s ease-out; }
          .container section#scene7 .inner.full .full-inner .list-row ul:nth-child(4) {
            transform: translateY(70px);
            opacity: 0;
            transition: .5s 1.4s ease-out; }
          .container section#scene7 .inner.full .full-inner .list-row ul:nth-child(5) {
            transform: translateY(70px);
            opacity: 0;
            transition: .5s 1.6s ease-out; }
    @media screen and (min-width: 1200px) {
      .container section#scene7 .inner.full {
        background: url("/static/images/main/bg_notice.jpg") 50% 50% no-repeat;
        background-size: cover;
        padding: 225px 0;
        opacity: 1;
        transition: none; }
        .container section#scene7 .inner.full .full-inner {
          width: 100%;
          max-width: 1440px;
          display: flex;
          justify-content: space-between;
          align-items: flex-start; }
          .container section#scene7 .inner.full .full-inner .txt-row {
            display: flex;
            justify-content: flex-start;
            align-items: flex-start;
            flex-flow: wrap;
            align-content: space-between;
            height: 706px; }
            .container section#scene7 .inner.full .full-inner .txt-row .txt h3 {
              text-align: left;
              padding: 64px 0 40px 20px;
              color: #222;
              font-size: 64px;
              line-height: 64px;
              font-weight: 400; }
            .container section#scene7 .inner.full .full-inner .txt-row .txt p {
              text-align: left;
              padding: 0 0 0 20px;
              color: #222;
              font-size: 24px;
              line-height: 1.4;
              font-weight: 700; }
            .container section#scene7 .inner.full .full-inner .txt-row .img-row {
              width: 560px;
              display: block;
              opacity: 0;
              transition: 1s .8s ease-out; }
              .container section#scene7 .inner.full .full-inner .txt-row .img-row img {
                max-width: 100%; }
          .container section#scene7 .inner.full .full-inner .list-row {
            width: calc( 100% - 720px);
            margin: 0 0 auto auto; }
            .container section#scene7 .inner.full .full-inner .list-row ul {
              padding: 50px 0; }
              .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(1) {
                width: 120px; }
                .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(1) strong {
                  margin-bottom: 6px;
                  color: #aaa;
                  font-size: 32px;
                  line-height: 32px;
                  font-weight: 500; }
                .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(1) span {
                  color: #aaa;
                  font-size: 20px;
                  line-height: 20px;
                  font-weight: 400; }
              .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(2) {
                width: calc(100% - 224px); }
                .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(2) strong {
                  margin: 8px 0;
                  color: #A6866B;
                  font-size: 18px;
                  line-height: 18px;
                  font-weight: 600; }
                .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(2) a {
                  margin: 8px 0;
                  color: #222;
                  font-size: 18px;
                  line-height: 1.4;
                  font-weight: 600; }
              .container section#scene7 .inner.full .full-inner .list-row ul li:nth-child(3) {
                width: 104px; } }
    .container section#scene7.aniActive .inner.full {
      opacity: 1; }
      .container section#scene7.aniActive .inner.full .full-inner h3 {
        transform: translateX(0);
        opacity: 1; }
      .container section#scene7.aniActive .inner.full .full-inner p {
        transform: translateX(0);
        opacity: 1; }
      .container section#scene7.aniActive .inner.full .full-inner .img-row {
        opacity: 1; }
      .container section#scene7.aniActive .inner.full .full-inner .list-row ul {
        transform: translateY(0);
        opacity: 1; }
  .container section#scene8 {
    z-index: 2; }
    .container section#scene8 .inner.full {
      background: url("/static/images/main/bg_youtube@m.jpg") 50% 50% no-repeat;
      background-size: cover;
      padding-bottom: 5rem;
      opacity: 0;
      transition: 1s .1s ease-out; }
      .container section#scene8 .inner.full .full-inner .txt-row h3 {
        text-align: center;
        font-family: "Belleza";
        padding: 5.4166666667rem 0 1.6666666667rem 0;
        color: #222;
        font-size: 2.6666666667rem;
        line-height: 2.6666666667rem;
        font-weight: 400;
        transform: translateY(70px);
        opacity: 0;
        transition: .5s .3s ease-out; }
      .container section#scene8 .inner.full .full-inner .txt-row p {
        text-align: center;
        font-family: "Nanum Myeongjo";
        padding: 0 0 2.5rem 0;
        color: #222;
        font-size: 1.25rem;
        line-height: 1.4;
        font-weight: 700;
        transform: translateY(70px);
        opacity: 0;
        transition: .5s .6s ease-out; }
      .container section#scene8 .inner.full .full-inner .txt-row .btn-row {
        text-align: center;
        margin-bottom: 4.1666666667rem;
        transform: translateY(70px);
        opacity: 0;
        transition: .5s .9s ease-out; }
      .container section#scene8 .inner.full .full-inner .gallery_view {
        width: 87.5%;
        height: auto;
        margin-bottom: 0.8333333333rem;
        opacity: 0;
        transition: .5s .9s ease-out; }
        .container section#scene8 .inner.full .full-inner .gallery_view h4 {
          color: #222;
          font-size: 1.25rem;
          line-height: 1.25rem;
          font-weight: 600;
          margin-bottom: 0.8333333333rem; }
        .container section#scene8 .inner.full .full-inner .gallery_view img {
          max-width: 100%;
          width: 100%; }
        .container section#scene8 .inner.full .full-inner .gallery_view iframe {
          position: absolute;
          width: 100%;
          height: 100%;
          top: 0;
          left: 0;
          z-index: 1; }
        @media screen and (min-width: 1200px) {
          .container section#scene8 .inner.full .full-inner .gallery_view {
            height: auto;
            margin-bottom: 28px; }
            .container section#scene8 .inner.full .full-inner .gallery_view h4 {
              color: #222;
              font-size: 32px;
              line-height: 32px;
              font-weight: 600;
              margin-bottom: 28px; } }
      .container section#scene8 .inner.full .full-inner .gallery_thum {
        width: 87.5%;
        height: auto;
        height: auto;
        padding-bottom: 0.9583333333rem;
        opacity: 0;
        transition: .5s 1.1s ease-out; }
        .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide {
          width: 7.4583333333rem;
          height: auto;
          display: flex; }
          .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide img {
            max-width: 100%; }
          .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide:before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: #fff;
            opacity: .5; }
          .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide:after {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: calc( 100% - 6px );
            height: calc( 100% - 6px );
            border: 3px solid #65B3B1;
            opacity: 0;
            transition: all .15s ease-in; }
          .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide:hover:after {
            opacity: 1; }
          .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide.swiper-slide-thumb-active:before {
            opacity: 0; }
        .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-pagination {
          top: auto;
          bottom: 0; }
          .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-pagination.swiper-pagination-progressbar {
            background: #eee; }
            .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-pagination.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
              background: #ccc; }
        @media screen and (min-width: 1200px) {
          .container section#scene8 .inner.full .full-inner .gallery_thum {
            height: 215px;
            padding-bottom: 20px; }
            .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide {
              width: 342px;
              height: 192px; } }
      .container section#scene8 .inner.full .full-inner .controller {
        margin: 1.6666666667rem 0 0 1.6666666667rem;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        transform: translateX(70px);
        opacity: 0;
        transition: .5s .9s ease-out; }
        .container section#scene8 .inner.full .full-inner .controller .swiper-pagination {
          position: relative;
          width: 5.0833333333rem;
          top: 0;
          text-align: center;
          bottom: auto;
          height: 3.0416666667rem;
          display: flex;
          justify-content: center;
          align-items: center;
          color: #aaa;
          font-size: 0.9583333333rem;
          line-height: 0.9583333333rem;
          font-weight: 600; }
          .container section#scene8 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-current {
            margin-right: 0.25rem;
            color: #A6866B;
            font-size: 0.9583333333rem;
            line-height: 0.9583333333rem;
            font-weight: 600; }
          .container section#scene8 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-total {
            margin-left: 0.25rem;
            color: #aaa;
            font-size: 0.9583333333rem;
            line-height: 0.9583333333rem;
            font-weight: 600; }
    .container section#scene8.aniActive .inner.full {
      opacity: 1; }
      .container section#scene8.aniActive .inner.full .full-inner h3 {
        transform: translateY(0);
        opacity: 1; }
      .container section#scene8.aniActive .inner.full .full-inner p {
        transform: translateY(0);
        opacity: 1; }
      .container section#scene8.aniActive .inner.full .full-inner .btn-row {
        transform: translateY(0);
        opacity: 1; }
      .container section#scene8.aniActive .inner.full .full-inner .gallery_view {
        opacity: 1; }
      .container section#scene8.aniActive .inner.full .full-inner .gallery_thum {
        opacity: 1; }
      .container section#scene8.aniActive .inner.full .full-inner .controller {
        transform: translateX(0);
        opacity: 1; }
    @media screen and (min-width: 1200px) {
      .container section#scene8 .inner.full {
        background: url("/static/images/main/bg_youtube.jpg") 50% 50% no-repeat;
        background-size: cover;
        padding: 200px 0;
        height: 1080px;
        opacity: 1;
        transition: none; }
        .container section#scene8 .inner.full .full-inner {
          width: 100%;
          max-width: 1440px;
          margin: auto;
          height: 673px;
          display: flex;
          justify-content: flex-start;
          align-items: flex-start;
          flex-flow: wrap; }
          .container section#scene8 .inner.full .full-inner .txt-row {
            width: calc( 100% - 880px); }
            .container section#scene8 .inner.full .full-inner .txt-row h3 {
              text-align: left;
              padding: 64px 0 40px 0;
              color: #222;
              font-size: 64px;
              line-height: 64px;
              font-weight: 400; }
            .container section#scene8 .inner.full .full-inner .txt-row p {
              text-align: left;
              padding: 0 0 64px 0;
              color: #222;
              font-size: 24px;
              line-height: 1.4;
              font-weight: 700; }
            .container section#scene8 .inner.full .full-inner .txt-row .btn-row {
              text-align: left;
              margin-bottom: 0; }
          .container section#scene8 .inner.full .full-inner .gallery-group {
            width: 880px; }
            .container section#scene8 .inner.full .full-inner .gallery-group .gallery_view {
              width: 100%;
              height: auto;
              margin-bottom: 20px; }
              .container section#scene8 .inner.full .full-inner .gallery-group .gallery_view img {
                max-width: 100%;
                width: 100%; }
              .container section#scene8 .inner.full .full-inner .gallery-group .gallery_view iframe {
                position: absolute;
                width: 100%;
                height: 100%;
                top: 0;
                left: 0;
                z-index: 1; }
          .container section#scene8 .inner.full .full-inner .gallery_thum {
            width: 100%;
            height: auto;
            height: auto;
            padding-bottom: 0; }
            .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide {
              width: 280px;
              height: 158px; }
              .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide:before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 158px;
                background: #000;
                opacity: .3; }
              .container section#scene8 .inner.full .full-inner .gallery_thum .swiper-slide.swiper-slide-thumb-active:before {
                opacity: 0; }
          .container section#scene8 .inner.full .full-inner .controller {
            margin: -111px 0 0 0; }
            .container section#scene8 .inner.full .full-inner .controller .swiper-pagination {
              width: 117px;
              height: 64px;
              color: #aaa;
              font-size: 16px;
              line-height: 16px;
              font-weight: 600; }
              .container section#scene8 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-current {
                margin-right: 6px;
                color: #A6866B;
                font-size: 16px;
                line-height: 16px;
                font-weight: 600; }
              .container section#scene8 .inner.full .full-inner .controller .swiper-pagination .swiper-pagination-total {
                margin-left: 6px;
                color: #aaa;
                font-size: 16px;
                line-height: 16px;
                font-weight: 600; } }
  .container section#scene9 {
    z-index: 2; }
    .container section#scene9 .inner.full {
      background: url("/static/images/main/bg_facility@m.jpg") 50% 50% no-repeat;
      background-size: cover;
      padding-bottom: 5rem;
      opacity: 0;
      transition: 1s .1s ease-out; }
      .container section#scene9 .inner.full .full-inner .txt-row h3 {
        text-align: center;
        font-family: "Belleza";
        padding: 5.4166666667rem 0 1.6666666667rem 0;
        color: #222;
        font-size: 2.6666666667rem;
        line-height: 2.6666666667rem;
        font-weight: 400;
        transform: translateY(70px);
        opacity: 0;
        transition: .5s .3s ease-out; }
      .container section#scene9 .inner.full .full-inner .txt-row p {
        text-align: center;
        font-family: "Nanum Myeongjo";
        padding: 0 0 2.5rem 0;
        color: #222;
        font-size: 1.25rem;
        line-height: 1.4;
        font-weight: 700;
        transform: translateY(70px);
        opacity: 0;
        transition: .5s .6s ease-out; }
      .container section#scene9 .inner.full .full-inner .follow_slide {
        width: 87.5%;
        margin: auto;
        padding-bottom: 0.8333333333rem;
        opacity: 0;
        transition: 1s .9s ease-out; }
        .container section#scene9 .inner.full .full-inner .follow_slide .swiper-slide {
          text-align: center;
          display: flex;
          justify-content: center;
          align-items: center;
          flex-flow: wrap;
          width: 50%; }
          .container section#scene9 .inner.full .full-inner .follow_slide .swiper-slide a {
            position: relative;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: flex-start;
            align-items: center; }
            .container section#scene9 .inner.full .full-inner .follow_slide .swiper-slide a img {
              max-width: 100%; }
            .container section#scene9 .inner.full .full-inner .follow_slide .swiper-slide a .over {
              position: absolute;
              width: 100%;
              height: 100%;
              top: 0;
              left: 0;
              opacity: 0;
              background: rgba(0, 0, 0, 0.5);
              transition: all .25s ease-in;
              display: flex;
              justify-content: center;
              align-items: center; }
              .container section#scene9 .inner.full .full-inner .follow_slide .swiper-slide a .over i {
                width: 48px;
                height: 48px; }
                .container section#scene9 .inner.full .full-inner .follow_slide .swiper-slide a .over i svg .insta_path {
                  fill: #fff; }
            .container section#scene9 .inner.full .full-inner .follow_slide .swiper-slide a:hover .over {
              opacity: 1; }
        .container section#scene9 .inner.full .full-inner .follow_slide .swiper-pagination {
          top: auto;
          bottom: 0; }
          .container section#scene9 .inner.full .full-inner .follow_slide .swiper-pagination.swiper-pagination-progressbar {
            background: #eee; }
            .container section#scene9 .inner.full .full-inner .follow_slide .swiper-pagination.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
              background: #ccc; }
    .container section#scene9.aniActive .inner.full {
      opacity: 1; }
      .container section#scene9.aniActive .inner.full .full-inner h3 {
        transform: translateY(0);
        opacity: 1; }
      .container section#scene9.aniActive .inner.full .full-inner p {
        transform: translateY(0);
        opacity: 1; }
      .container section#scene9.aniActive .inner.full .full-inner .follow_slide {
        opacity: 1; }
    @media screen and (min-width: 1200px) {
      .container section#scene9 .inner.full {
        background: url("/static/images/main/bg_facility.jpg") 50% 50% no-repeat;
        background-size: cover;
        padding: 216px 0;
        opacity: 1;
        transition: none; }
        .container section#scene9 .inner.full .full-inner .txt-row h3 {
          padding: 0 0 40px 0;
          color: #222;
          font-size: 64px;
          line-height: 64px;
          font-weight: 400; }
        .container section#scene9 .inner.full .full-inner .txt-row p {
          padding: 0 0 100px 0;
          color: #222;
          font-size: 24px;
          line-height: 1.4;
          font-weight: 700; }
        .container section#scene9 .inner.full .full-inner .follow_slide {
          width: 100%;
          max-width: 1440px;
          padding-bottom: 40px; } }
  .container section.bottom_counsel {
    z-index: 2;
    background: url("/static/images/main/bg_contact@m.jpg") 50% 0 no-repeat;
    background-size: cover;
    padding: 4.1666666667rem 0 0 0; }
    .container section.bottom_counsel .bg-form .full-inner {
      width: 87.5%;
      margin: auto; }
      .container section.bottom_counsel .bg-form .full-inner > h3 {
        display: none; }
      .container section.bottom_counsel .bg-form .full-inner .login-box {
        display: none; }
      .container section.bottom_counsel .bg-form .full-inner .form-row .txt-row h3 {
        text-align: left;
        font-family: "Belleza";
        padding: 0 0 2.5rem 0;
        color: #222;
        font-size: 2.6666666667rem;
        line-height: 2.6666666667rem;
        font-weight: 400; }
      .container section.bottom_counsel .bg-form .full-inner .form-row .input-row label {
        padding-left: 0;
        color: #555;
        font-size: 1.0833333333rem;
        line-height: 1.0833333333rem;
        font-weight: 600; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .input-row label:after {
          color: #A6866B; }
      .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=tel],
      .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=text],
      .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=number] {
        background: transparent !important;
        border-bottom: 0.0625rem solid #aaa;
        color: #555;
        font-size: 1rem;
        line-height: 1rem;
        font-weight: 500; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=tel]::placeholder,
        .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=text]::placeholder,
        .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=number]::placeholder {
          color: #ccc;
          font-size: 1rem;
          line-height: 1rem;
          font-weight: 500; }
      .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row h4 {
        display: none; }
      .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box {
        margin-bottom: 1rem; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box label {
          color: #555;
          font-size: 1rem;
          line-height: 1rem;
          font-weight: 600; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box > input + label {
          background: none; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box > input + label:before {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            width: 1.0416666667rem;
            height: 1.0416666667rem;
            background: #fff;
            border: 0.125rem solid #ccc; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box > input:checked + label {
          background: url(/static/images/components/icon_checkbox_on.svg) no-repeat center left;
          background-size: contain; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box > input:checked + label:before {
            display: none; }
      .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list {
        background: #f9f9f9;
        padding: 1.6666666667rem; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row {
          display: flex;
          justify-content: flex-start;
          align-items: center;
          flex-flow: wrap;
          margin-bottom: 1.1666666667rem; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row > .check-box label {
            color: #555;
            font-size: 1rem;
            line-height: 1rem;
            font-weight: 600;
            color: #555; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row > .check-box > input + label {
            background: none; }
            .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row > .check-box > input + label:before {
              content: "";
              position: absolute;
              left: 0;
              top: 0;
              width: 1.0416666667rem;
              height: 1.0416666667rem;
              background: #fff;
              border: 0.125rem solid #ccc; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row > .check-box > input:checked + label {
            background: url(/static/images/components/icon_checkbox_on.svg) no-repeat center left;
            background-size: contain; }
            .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row > .check-box > input:checked + label:before {
              display: none; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row button {
            width: auto;
            height: auto;
            text-decoration: underline;
            margin: 0 0 0 1.6666666667rem;
            color: #555; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row button + .error {
            margin-left: 1.6666666667rem;
            padding-top: 0.625rem;
            color: #F82417;
            font-size: 0.9583333333rem;
            line-height: 1.2;
            font-weight: 500; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row:last-child {
            margin-bottom: 0; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row .error {
            width: 100%; }
      .container section.bottom_counsel .bg-form .full-inner .form-row > .btn-row {
        text-align: center;
        padding: 2.5rem 0 0 0; }
      .container section.bottom_counsel .bg-form .full-inner .form-row .member_type {
        display: flex;
        justify-content: flex-start;
        align-items: center; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .member_type strong {
          color: #555;
          padding-left: 0;
          margin-bottom: 0;
          width: 5.4166666667rem; }
          .container section.bottom_counsel .bg-form .full-inner .form-row .member_type strong:after {
            color: #A6866B; }
        .container section.bottom_counsel .bg-form .full-inner .form-row .member_type .radio-box-group .radio-box label span {
          color: #444;
          word-break: keep-all;
          line-height: 1.3; }
      .container section.bottom_counsel .bg-form .full-inner .map_row {
        display: none; }
    @media screen and (min-width: 1200px) {
      .container section.bottom_counsel {
        background: url("/static/images/sales/bg_counsel.jpg") 50% 0 no-repeat;
        background-size: cover;
        padding: 200px 0 0 0;
        height: 1080px; }
        .container section.bottom_counsel .bg-form .full-inner {
          width: 100%;
          max-width: 1440px;
          display: flex;
          justify-content: center;
          align-items: flex-start;
          flex-flow: wrap; }
          .container section.bottom_counsel .bg-form .full-inner .form-row {
            width: 534px;
            margin-right: 666px; }
            .container section.bottom_counsel .bg-form .full-inner .form-row .txt-row h3 {
              padding: 0 0 48px 0;
              color: #222;
              font-size: 64px;
              line-height: 64px;
              font-weight: 400; }
            .container section.bottom_counsel .bg-form .full-inner .form-row .input-row {
              display: flex;
              justify-content: flex-start;
              align-items: center;
              flex-flow: wrap; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .input-row label {
                width: 114px;
                margin-bottom: 0;
                color: #555;
                font-size: 20px;
                line-height: 20px;
                font-weight: 600; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=tel],
              .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=text],
              .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=number] {
                width: calc( 100% - 114px);
                border-bottom: 2px solid #aaa;
                background: transparent;
                color: #555;
                font-size: 18px;
                line-height: 18px;
                font-weight: 500; }
                .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=tel]::placeholder,
                .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=text]::placeholder,
                .container section.bottom_counsel .bg-form .full-inner .form-row .input-row input[type=number]::placeholder {
                  color: #ccc;
                  font-size: 18px;
                  line-height: 18px;
                  font-weight: 500; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .input-row .error {
                padding-left: 115px; }
            .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row {
              display: flex;
              justify-content: flex-start;
              align-items: center;
              flex-flow: wrap; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row h4 {
                display: block;
                width: 428px;
                margin-bottom: 24px;
                color: #444;
                font-size: 20px;
                line-height: 20px;
                font-weight: 600; }
                .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row h4 strong {
                  color: #A6866B;
                  font-size: 20px;
                  line-height: 20px;
                  font-weight: 600; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box {
                margin-bottom: 24px; }
                .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box label {
                  color: #555;
                  font-size: 18px;
                  line-height: 18px;
                  font-weight: 600; }
                .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row > .check-box > input + label:before {
                  width: 16px;
                  height: 16px;
                  border: 2px solid #ccc; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list {
                width: 100%;
                background: rgba(166, 134, 107, 0.08);
                padding: 24px; }
                .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row {
                  margin-bottom: 24px;
                  flex-flow: wrap; }
                  .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row > .check-box label {
                    color: #555;
                    font-size: 18px;
                    line-height: 18px;
                    font-weight: 600; }
                  .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row > .check-box > input + label:before {
                    width: 16px;
                    height: 16px;
                    border: 2px solid #ccc; }
                  .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row button {
                    margin: 0 0 0 10px; }
                  .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row button + .error {
                    width: 100%;
                    margin-left: 28px;
                    padding-top: 15px;
                    color: #F82417;
                    font-size: 16px;
                    line-height: 1.2;
                    font-weight: 500; }
                  .container section.bottom_counsel .bg-form .full-inner .form-row .agree-row .agree_list .check-box-row .error {
                    width: auto; }
            .container section.bottom_counsel .bg-form .full-inner .form-row > .btn-row {
              padding: 64px 0 0 0;
              text-align: left; }
            .container section.bottom_counsel .bg-form .full-inner .form-row .member_type {
              display: flex;
              justify-content: flex-start;
              align-items: center; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .member_type strong {
                width: 114px;
                color: #555;
                margin-bottom: 0; }
                .container section.bottom_counsel .bg-form .full-inner .form-row .member_type strong:after {
                  color: #A6866B; }
              .container section.bottom_counsel .bg-form .full-inner .form-row .member_type .radio-box-group {
                padding-left: 0;
                width: calc(100% - 114px); }
                .container section.bottom_counsel .bg-form .full-inner .form-row .member_type .radio-box-group .radio-box label span {
                  color: #444; }
          .container section.bottom_counsel .bg-form .full-inner .map_row {
            display: block;
            position: absolute;
            width: 50%;
            height: 653px;
            top: 128px;
            right: 0; }
            .container section.bottom_counsel .bg-form .full-inner .map_row img {
              width: 100%; }
            .container section.bottom_counsel .bg-form .full-inner .map_row .wrap_map {
              height: calc( 100% - 32px ); } }
    @media screen and (min-width: 1440px) {
      .container section.bottom_counsel .bg-form .full-inner .form-row {
        width: 534px;
        margin-right: 915px; }
      .container section.bottom_counsel .bg-form .full-inner .map_row {
        width: 720px;
        height: 680px;
        top: 128px; } }

/*.scroll {
    z-index: 9;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 50px;
    color: rgba(255, 255, 255, 0.7);
    font-weight: 700;
    font-size: 14px;
    animation: scroll infinite 0.8s linear;
    bottom: 50px;

    &::before {
        content: "";
        position: absolute;
        top: -15px;
        left: 50%;
        transform: translateX(-50%);
        background-image: url("../../images/main/icon_scroll.png");
        width: 14px;
        height: 8px;
    }
}  */
.progress_box {
  left: 50%;
  bottom: 5rem;
  width: 87.5%;
  height: 3.3333333333rem;
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 2;
  /*.autoplay-progress {
      position: relative;
      z-index: 10;
      width: 102px;
      height: 102px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: var(--swiper-theme-color);
      &:before{
          content:"";
          position: absolute;
          width: 84px;
          height: 84px;
          left: 7px;
          top: 7px;
          border: 2px solid #fff;
          border-radius: 51px;
          opacity: .3;
      }
  }*/
  /*.autoplay-progress {
      svg {
          --progress: 0;
          position: absolute;
          left: 0;
          top: 0px;
          z-index: 10;
          width: 100%;
          height: 100%;
          stroke-width: 1px;
          stroke: $PointColor;
          fill: none;
          stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
          stroke-dasharray: 125.6;
          transform: rotate(-90deg);
      } 
      svg + span{
          opacity: 0;
      }
  }*/ }
  .progress_box .group-unmute, .progress_box .group-mute {
    position: absolute;
    top: 1.0416666667rem;
    right: 7.9166666667rem;
    width: 1.25rem;
    height: 1.25rem;
    z-index: 2; }
    .progress_box .group-unmute i, .progress_box .group-mute i {
      width: 1.25rem;
      height: 1.25rem; }
  .progress_box .swiper-button-prev, .progress_box .swiper-button-next {
    position: absolute;
    top: 0.2083333333rem;
    right: 0;
    background: #fff;
    border: none; }
    .progress_box .swiper-button-prev i svg .arrow3_path, .progress_box .swiper-button-next i svg .arrow3_path {
      stroke: #65B3B1; }
    .progress_box .swiper-button-prev:hover, .progress_box .swiper-button-next:hover {
      background: #65B3B1; }
      .progress_box .swiper-button-prev:hover i svg .arrow3_path, .progress_box .swiper-button-next:hover i svg .arrow3_path {
        stroke: #fff; }
  .progress_box .swiper-button-prev {
    right: 3.75rem; }
  .progress_box .swiper-pagination2 {
    position: absolute;
    left: auto;
    right: 12.0833333333rem;
    width: auto;
    /*left: rem(300px);*/
    top: 1.25rem;
    height: 0.75rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #fff;
    font-size: 1rem;
    line-height: 1rem;
    font-weight: 600; }
    .progress_box .swiper-pagination2 span {
      display: block;
      height: 0.75rem;
      color: #fff;
      font-size: 1rem;
      line-height: 1rem;
      font-weight: 600;
      opacity: 1;
      margin: 0 0.25rem !important;
      background: none !important; }
      .progress_box .swiper-pagination2 span.swiper-pagination-bullet-active {
        opacity: 1; }
  .progress_box .btn-control {
    position: absolute;
    z-index: 30;
    width: 3.3333333333rem;
    height: 3.3333333333rem;
    right: 9.1666666667rem;
    top: 0.0416666667rem;
    display: flex;
    justify-content: center;
    align-items: center; }
    .progress_box .btn-control .group-play, .progress_box .btn-control .group-pause {
      position: relative;
      width: 100%;
      height: 100%;
      overflow: hidden;
      text-indent: -999px;
      font-size: 0;
      z-index: 1; }
    .progress_box .btn-control .group-play {
      display: none;
      background: url("/static/images/components/icon_play_gray.svg") 50% 50% no-repeat;
      background-size: 0.8333333333rem 0.7291666667rem; }
    .progress_box .btn-control .group-pause {
      background: url("/static/images/components/icon_pause_gray.svg") 50% 50% no-repeat;
      background-size: 0.6875rem 0.7291666667rem; }
  .progress_box .progress-circle {
    position: relative;
    width: 3.4166666667rem;
    height: 3.4166666667rem;
    z-index: 1;
    opacity: 0; }
    .progress_box .progress-circle svg {
      transform: rotate(-90deg);
      width: 100%;
      height: 100%; }
    .progress_box .progress-circle circle {
      fill: none;
      stroke-width: 4px; }
    .progress_box .progress-circle .background {
      stroke: rgba(255, 255, 255, 0.5); }
    .progress_box .progress-circle .progress {
      stroke: #A6866B;
      stroke-dasharray: 282.74;
      stroke-dashoffset: calc(282.74 * (1 - var(--progress) / 100));
      transition: stroke-dashoffset 0.35s; }
    .progress_box .progress-circle text {
      font-size: 18px;
      text-anchor: middle;
      dominant-baseline: middle; }
  .progress_box.arrow_hide .swiper-button-prev, .progress_box.arrow_hide .swiper-button-next {
    display: none; }
  .progress_box.arrow_hide .group-unmute, .progress_box.arrow_hide .group-mute {
    right: 0; }
  .progress_box.arrow_hide .btn-control {
    right: 1rem; }
  .progress_box.arrow_hide .swiper-pagination2 {
    right: 3.75rem; }
  @media screen and (min-width: 1200px) {
    .progress_box {
      width: 100%;
      max-width: 1200px;
      bottom: 430px;
      height: 80px;
      /*>span{
          width: 35px;
          height: 39px;
          top: 44px;
          left: 50px;
          background: url("../../images/play.png") 50% 50% no-repeat;
      }
      .autoplay-progress {
          position: relative;
          z-index: 10;
          width: 102px;
          height: 102px;
          display: flex;
          align-items: center;
          justify-content: center;
          font-weight: bold;
          color: var(--swiper-theme-color);
          &:before{
              content:"";
              position: absolute;
              width: 84px;
              height: 84px;
              left: 7px;
              top: 7px;
              border: 2px solid #fff;
              border-radius: 51px;
              opacity: .3;
          }
      }*/
      /*.autoplay-progress {
          svg {
              --progress: 0;
              position: absolute;
              left: 0;
              top: 0px;
              z-index: 10;
              width: 100%;
              height: 100%;
              stroke-width: 1px;
              stroke: $PointColor;
              fill: none;
              stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
              stroke-dasharray: 125.6;
              transform: rotate(-90deg);
          } 
          svg + span{
              opacity: 0;
          }
      }*/ }
      .progress_box .swiper-button-prev, .progress_box .swiper-button-next {
        top: 5px;
        right: 0; }
      .progress_box .swiper-button-prev {
        right: 80px; }
      .progress_box .group-unmute, .progress_box .group-mute {
        top: 27px;
        right: 168px;
        width: 24px;
        height: 24px; }
        .progress_box .group-unmute i, .progress_box .group-mute i {
          width: 24px;
          height: 24px; }
      .progress_box .swiper-pagination2 {
        right: 250px;
        top: 32px;
        height: 18px; }
        .progress_box .swiper-pagination2 span {
          height: 19px;
          color: #fff;
          font-size: 18px;
          line-height: 18px;
          font-weight: 600;
          margin: 0 12px !important; }
      .progress_box .btn-control {
        width: 80px;
        height: 80px;
        right: 190px; }
        .progress_box .btn-control .group-play {
          display: none;
          background: url("/static/images/components/icon_play_gray.svg") 50% 50% no-repeat;
          background-size: 16px 14px; }
        .progress_box .btn-control .group-pause {
          background: url("/static/images/components/icon_pause_gray.svg") 50% 50% no-repeat;
          background-size: 13px 14px; }
      .progress_box .progress-circle {
        width: 80px;
        height: 80px; }
        .progress_box .progress-circle circle {
          stroke-width: 2px; }
      .progress_box.arrow_hide .group-unmute, .progress_box.arrow_hide .group-mute {
        right: 0; }
      .progress_box.arrow_hide .btn-control {
        right: 24px; }
      .progress_box.arrow_hide .swiper-pagination2 {
        right: 90px; } }
  @media screen and (min-width: 1440px) {
    .progress_box {
      max-width: 1400px; } }

.main_slide .swiper-slide-active .txt-box > h3,
.main_slide .swiper-slide-active .txt-box > h4,
.main_slide .swiper-slide-active .txt-box > a,
.main_slide .swiper-slide-active .txt-box > p {
  transform: translateY(0);
  opacity: 1; }
.main_slide .btn_sound {
  width: 105px;
  height: 100%; }
  .main_slide .btn_sound button {
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    transform: translateY(-50%); }
    .main_slide .btn_sound button img {
      display: block;
      width: 100%; }

.main_slide .arrow-box {
  position: relative;
  width: 80px;
  height: 50px; }

@keyframes opacity_ani {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
@keyframes s6_img2 {
  0% {
    transform: translateX(101%); }
  20% {
    transform: translateX(101%); }
  40% {
    transform: translateX(101%); }
  60% {
    transform: translateX(0); }
  70% {
    transform: translateX(0); }
  100% {
    transform: translateX(0); } }
@keyframes s6_img3 {
  0% {
    transform: translateX(-101%); }
  20% {
    transform: translateX(-101%); }
  45% {
    transform: translateX(-101%); }
  65% {
    transform: translateX(0); }
  70% {
    transform: translateX(0); }
  100% {
    transform: translateX(0); } }
@keyframes s6_img6 {
  0% {
    transform: translateY(-101%); }
  20% {
    transform: translateY(-101%); }
  48% {
    transform: translateY(-101%); }
  68% {
    transform: translateY(0); }
  70% {
    transform: translateY(0); }
  100% {
    transform: translateY(0); } }