html,
body {
 height: 100%;
 padding: 0;
 margin: 0;
}
.js-transitions-disabled * {
 transition: none !important;
}
.carousel {
 background: rgba(0,0,0,0.3);
 position: relative;
 overflow: hidden;
 perspective: 50vw;
 perspective-origin: 50% 50%;
}
.carousel__control {
 position: absolute;
 height: 160px;
 width: 40px;
 background: #fff;
 right: 0;
 top: 0;
 bottom: 0;
 margin: auto;
 z-index: 1;
}
.carousel__control a {
 position: relative;
 display: block;
 width: 100%;
 padding-top: 75%;
 box-sizing: border-box;
}
.carousel__control a:hover:before {
 background-color: rgba(0,0,0,0.4);
}
.carousel__control a.active:before,
.carousel__control a.active:hover:before {
 background-color: rgba(0,0,0,0.6);
}
.carousel__control a:first-child {
 margin-top: 15px;
}
.carousel__control a:before {
 position: absolute;
 top: 50%;
 left: 0;
 right: 0;
 margin: auto;
 border-radius: 50%;
 padding-top: 25%;
 width: 25%;
 background: rgba(0,0,0,0.2);
 content: '';
 display: block;
 margin-top: -12.5%;
}
.carousel__stage {
 position: absolute;
 top: 20px;
 bottom: 20px;
 left: 20px;
 right: 20px;
 margin: auto;
 transform-style: preserve-3d;
 transform: translateZ(calc(-50vh + 20px));
}
.spinner {
  position: absolute;
  width: calc(50vw - (20px));
  height: calc(100vh - 40px);
  top: 0;
  left: 0;
  right: auto;
  bottom: 0;
  margin: auto;
  transform-style: preserve-3d;
  transition: transform 1s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform-origin: 50% 50%;
  transform: rotateX(0);
}
.js-spin-fwd .spinner {
 transform: rotateX(-90deg);
}
.js-spin-bwd .spinner {
 transform: rotateX(90deg);
}
.js-spin-fwd .spinner--right {
 transform: rotateX(90deg);
}
.js-spin-bwd .spinner--right {
 transform: rotateX(-90deg);
}
.spinner--right {
 right: 0;
 left: auto;
}
.spinner__face {
 display: none;
 position: absolute;
 width: 100%;
 height: 100%;
 overflow: hidden;
}
.spinner__face.js-next {
 display: block;
 transform: rotateX(90deg) translateZ(calc(50vh - 20px));
}
.spinner--right .spinner__face.js-next {
 transform: rotateX(270deg) translateZ(calc(50vh - 20px));
}
.js-spin-bwd .spinner__face.js-next {
 transform: rotateX(-90deg) translateZ(calc(50vh - 20px));
}
.js-spin-bwd .spinner--right .spinner__face.js-next {
 transform: rotateX(-270deg) translateZ(calc(50vh - 20px));
}
.js-active {
 display: block;
 transform: translateZ(calc(50vh - 20px));
}
.content {
 position: absolute;
 width: 200%;
 height: 100%;
 left: 0;
 border-radius:10px;
 overflow:hidden;
}
.spinner--right .content {
 left: -100%;
}
.content__left,
.content__right {
 position: absolute;
 left: 0;
 top: 0;
 width: 50%;
 height: 100%;
}
.content__right {
 right: 0;
 left: auto;
 background:rgba(42,65,95,0.95);
}
.content__left {
 background-repeat: no-repeat;
 background-size: cover;
}
.content__left:after {
 position: absolute;
 display: block;
 content: "";
 width: 100%;
 height: 100%;
 background-color: rgba(0,0,0,0.1);
}
.content__left h1 {
 position: absolute;
 top: 50%;
 margin-top: -3vw;
 text-align: center;
 font-family: "Oswald", sans-serif;
 font-size: 5vw;
 height: 10vw;
 opacity: 1;
 color: #fff;
 width: 100%;
 letter-spacing: 0.15em;
 line-height: 0.6;
}
.content__left span {
 font-size: 1vw;
 font-weight: 300;
 letter-spacing: 0.2em;
 opacity: 0.9;
 font-family:'NEXON Lv1 Gothic OTF','Malgun Gothic', dotum, sans-serif;
}
.content__right {
 display: flex;
 align-items: center;
 justify-content: center;
}
.content__right .content__main {
 position: absolute;
 font-family:'NEXON Lv1 Gothic OTF','Malgun Gothic', dotum, sans-serif;
 text-align: left;
 color: #fff;
 font-size: 1.3vw;
 padding: 0 4vw;
 line-height: 1.65;
 font-weight: 300;
 letter-spacing: 0rem;
 margin: 0;
 opacity: 0.9;
}
.content__right .content__main p:last-child {
 text-transform: uppercase;
 letter-spacing: 0.15em;
 font-size: 0.85em;
}
.content__right .content__index {
 font-size: 30vh;
 position: absolute;
 right: -1vh;
 top: 35vh;
 opacity: 0.04;
 font-family: "Oswald", sans-serif;
 color: #fff;
}
[data-type="iceland"] .content__left {
 background-image: url("/home/image/room-8054834_1280.jpg");
}
.spinner--right [data-type="iceland"] .content__left {
 background-image: none;
}
[data-type="china"] .content__left {
 background-image: url("/home/image/restaurant-18311_1280.jpg");
}
.spinner--right [data-type="china"] .content__left {
 background-image: none;
}
[data-type="usa"] .content__left {
 background-image: url("/home/image/flooring-8276447_1280.jpg");
}
.spinner--right [data-type="usa"] .content__left {
 background-image: none;
}
[data-type="peru"] .content__left {
 background-image: url("/home/image/architecture-2592975_1280.jpg");
}
.spinner--right [data-type="peru"] .content__left {
 background-image: none;
}
@media screen and (max-width: 1199px) {
.content__left span {
 font-size: 0.95rem;
}
.content__main p{
font-size: 0.95rem;
}
}
@media screen and (max-width: 991px) {
.content__left span {
 font-size: 0.85rem;
}
.content__main p{
font-size: 0.85rem;
}
}
@media (max-width: 768px) {
.carousel {
 height: 60%;
}
.content__left span {
 font-size: 0.75rem;
 position:relative;
 top:5px;
}
.content__main p{
font-size: 0.75rem;
}
}
/******************height: calc(100vh - 100px);*****************************/
.sbcontainer {
height: 100vh;
 overflow: auto;
 overflow-x: hidden;
 -ms-scroll-snap-type: y mandatory;
 scroll-snap-type: y mandatory;
}
.sbcontainer{
 -ms-overflow-style: none;
}
.sbcontainer::-webkit-scrollbar{
 display:none;
}
.sbpage {
 position: relative;
 height: 100vh;
 width: 100vw;
 scroll-snap-align: center;
 display: flex;
 align-items: center;
 justify-content: center;
font-family: "Oswald", sans-serif;
font-weight:700;
 letter-spacing: 0.15em;
 color: #fff;
 font-size: 5rem;
 text-align: center;
}
/* °øÅë ½ºÅ¸ÀÏ ÁöÁ¤ */
.sbpage {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
/* °³º° ¹è°æ À̹ÌÁö ÁöÁ¤ */
.sbpage:nth-child(n) {
 background-image: url("/home/image/room-8054836_1280.jpg");
}
.sbpage:nth-child(2n) {
 background-image: url("/home/image/room-416050_1280.jpg");
}
.sbpage:nth-child(3n) {
 background-image: url("/home/image/interior-4191529_1280.jpg");
}
.sbpage:nth-child(4n) {
 background-image: url("/home/image/ai-generated-8709665_1280.png");
}
.sbpage:nth-child(5n) {
 background-image: url("/home/image/bedroom-416062_1280.jpg");
}
.sbpage:nth-child(6n) {
 background-image: url("/home/image/kitchen-2400367_1280.jpg");
}
.sbpage:nth-child(7n) {
 background-image: url("/home/image/the-interior-of-the-4324490_1280.jpg");
}
.sbpage:nth-child(8n) {
 background-image: url("/home/image/kitchen-1687121_1280.jpg");
}
.sbpage:nth-child(9n) {
 background-image: url("/home/image/shelves-4032134_1280.jpg");
}
.sbpage:nth-child(10n) {
 background-image: url("/home/image/living-garniture-728733_1280.jpg");
}
.sbpage:nth-child(11n) {
 background-image: url("/home/image/space-4660847_1280.jpg");
}
.sbpage:nth-child(12n) {
 background-image: url("/home/image/ai-generated-8661975_1280.png");
}
.sbpage:nth-child(13n) {
 background-image: url("/home/image/kitchen-1940174_1280.jpg");
}
.sbpage:nth-child(14n) {
 background-image: url("/home/image/home-2486092_1280.jpg");
}
.sbpage:nth-child(15n) {
 background-image: url("/home/image/interior-2685522_1280.jpg");
}
.sbpage:nth-child(16n) {
 background-image: url("/home/image/home-1680800_1280.jpg");
}
.sbpage:nth-child(17n) {
 background-image: url("/home/image/chairs-2181968_1280.jpg");
}
.sbpage:nth-child(18n) {
 background-image: url("/home/image/bathroom-1597027_1280.jpg");
}
.sbpage:nth-child(19n) {
 background-image: url("/home/image/bathroom-3689922_1280.jpg");
}
.sbpage:nth-child(20n) {
 background-image: url("/home/image/home-3593729_1280.jpg");
}
.sbpage:nth-child(21n) {
 background-image: url("/home/image/office-730681_1280.jpg");
}
.sbpage:nth-child(22n) {
 background-image: url("/home/image/chairs-2181960_1280.jpg");
}
.sbpage:nth-child(23n) {
 background-image: url("/home/image/travel-1737171_1280.jpg");
}
.sbpage:nth-child(24n) {
 background-image: url("/home/image/interior-8618459_1280.jpg");
}
.sbpage .char {
 display: inline-block;
 -webkit-animation-delay: calc(0.25s + var(--char-index) * 0.1s);
 animation-delay: calc(0.25s + var(--char-index) * 0.1s);
 transition: all 0.25s calc(0.25s + var(--char-index) * 0.1s);
}
.text--enter [data-scroll='out'] .char {
 opacity: 0;
 transform: translate(0, -150%);
}
.text--enter .char {
 opacity: 1;
 transform: translate(0, 0);
}
.text--random [data-scroll='out'] .char:nth-of-type(1) {
 transform: translateX(178%) translateY(186%);
}
.text--random [data-scroll='out'] .char:nth-of-type(2) {
 transform: translateX(92%) translateY(184%);
}
.text--random [data-scroll='out'] .char:nth-of-type(3) {
 transform: translateX(44%) translateY(-49%);
}
.text--random [data-scroll='out'] .char:nth-of-type(4) {
 transform: translateX(100%) translateY(96%);
}
.text--random [data-scroll='out'] .char:nth-of-type(5) {
 transform: translateX(-93%) translateY(246%);
}
.text--random [data-scroll='out'] .char:nth-of-type(6) {
 transform: translateX(-187%) translateY(-63%);
}
.text--swapsies [data-scroll='in'] .char:nth-of-type(odd),
.text--swapsies [data-scroll='out'] .char:nth-of-type(odd) {
 transform: translateX(100%);
}
.text--swapsies [data-scroll='in'] .char:nth-of-type(even),
.text--swapsies [data-scroll='out'] .char:nth-of-type(even) {
 transform: translateX(-100%);
}
.text--swapsies [data-scroll='in'] .char {
 -webkit-animation-duration: 0.5s;
 animation-duration: 0.5s;
 -webkit-animation-fill-mode: forwards;
 animation-fill-mode: forwards;
}
.text--swapsies [data-scroll='in'] .char:nth-of-type(odd) {
 -webkit-animation-name: swap-left;
 animation-name: swap-left;
}
.text--swapsies [data-scroll='in'] .char:nth-of-type(even) {
 -webkit-animation-name: swap-right;
 animation-name: swap-right;
}
@-webkit-keyframes swap-right {
 25% {
 transform: translateX(-100%) translateY(-100%);
 }
 75% {
 transform: translateX(0) translateY(-100%);
 }
 100% {
 transform: translateX(0) translateY(0);
 }
}
@keyframes swap-right {
 25% {
 transform: translateX(-100%) translateY(-100%);
 }
 75% {
 transform: translateX(0) translateY(-100%);
 }
 100% {
 transform: translateX(0) translateY(0);
 }
}
@-webkit-keyframes swap-left {
 25% {
 transform: translateX(100%) translateY(100%);
 }
 75% {
 transform: translateX(0) translateY(100%);
 }
 100% {
 transform: translateX(0) translateY(0);
 }
}
@keyframes swap-left {
 25% {
 transform: translateX(100%) translateY(100%);
 }
 75% {
 transform: translateX(0) translateY(100%);
 }
 100% {
 transform: translateX(0) translateY(0);
 }
}
.text--fading [data-scroll='out'] .char {
 opacity: 0;
}
.text--flipping [data-scroll='out'] .char {
 transform: rotateY(180deg);
}
.text--slide .char {
 transition-delay: calc((var(--char-total) - var(--char-index)) * 0.1s);
}
.text--slide [data-scroll='out'] .char {
 opacity: 0;
 transform: translate(-300%, 0) skewX(20deg);
}
.text--karaoke .char {
 color: rgba(255,255,255,0.15);
 transition-duration: 0.1s;
}
.text--karaoke .char:after {
 color: #fff;
 visibility: visible;
}
.text--karaoke [data-scroll='in'] .char:after {
 -webkit-clip-path: inset(0 0 0 0);
 clip-path: inset(0 0 0 0);
}
.text--karaoke [data-scroll='out'] .char:after {
 -webkit-clip-path: inset(0 100% 0 0);
 clip-path: inset(0 100% 0 0);
}
.text--filling .char {
 color: rgba(255,255,255,0.15);
}
.text--filling .char:after {
 color: #fff;
 visibility: visible;
}
.text--filling [data-scroll='in'] .char:after {
 -webkit-clip-path: inset(0 0 0 0);
 clip-path: inset(0 0 0 0);
}
.text--filling [data-scroll='out'] .char:after {
 -webkit-clip-path: inset(100% 0 0 0);
 clip-path: inset(100% 0 0 0);
}
.text--blocks [data-scroll='out'] .char {
 visibility: hidden;
}
.text--blocks [data-scroll='in'] {
 overflow: hidden;
 position: relative;
}
.text--blocks [data-scroll='in'] .char {
 transition-delay: 0.5s;
}
.text--blocks [data-scroll='in']:after {
 content: '';
 height: 100%;
 width: 100%;
 position: absolute;
 top: 0;
 right: 0;
 bottom: 0;
 left: 0;
 background: #fff;
 -webkit-animation: block 0.5s 0.25s both;
 animation: block 0.5s 0.25s both;
}
@-webkit-keyframes block {
 0% {
 transform: translate(-110%, 0);
 }
 45%, 55% {
 transform: translate(0, 0);
 }
 100% {
 transform: translate(110%, 0);
 }
}
@keyframes block {
 0% {
 transform: translate(-110%, 0);
 }
 45%, 55% {
 transform: translate(0, 0);
 }
 100% {
 transform: translate(110%, 0);
 }
}
.text--scaling [data-scroll='out'] .char {
 transform: scale(0);
}
.text--turning [data-scroll='out'] .char {
 transform: rotateY(90deg);
}
.text--folding [data-scroll='out'] .char {
 transform: rotateX(90deg);
 transform-origin: bottom;
}
.text--bulge [data-scroll='in'] .char {
 -webkit-animation-name: bulge;
 animation-name: bulge;
 -webkit-animation-duration: 0.25s;
 animation-duration: 0.25s;
}
@-webkit-keyframes bulge {
 50% {
 transform: scale(1.5);
 }
}
@keyframes bulge {
 50% {
 transform: scale(1.5);
 }
}
.text--perspective {
 perspective: 1000px;
}
.text--perspective .char {
 transition: transform 0.25s calc(0.25s + var(--char-index) * 0.1s), opacity 0.05s calc(0.25s + var(--char-index) * 0.1s);
}
.text--perspective [data-scroll='out'] .char {
 opacity: 0;
 transform: translate3d(-25px, -20px, -800px);
}
.text--zipping .char {
 transition: transform 0.25s calc(0.25s + var(--char-index) * 0.1s), opacity 0.05s calc(0.25s + var(--char-index) * 0.1s);
}
.text--zipping [data-scroll='out'] .char {
 opacity: 0;
}
.text--zipping [data-scroll='out'] .char:nth-of-type(odd) {
 transform: translate(0, -100%);
}
.text--zipping [data-scroll='out'] .char:nth-of-type(even) {
 transform: translate(0, 100%);
}
.text--spinning [data-scroll='out'] .char {
 transform: rotateY(-360deg);
}
.text--tumbling .char {
 transition-delay: calc((var(--char-total) - var(--char-index)) * 0.1s);
}
.text--tumbling [data-scroll='out'] .char {
 opacity: 0;
 transform: translate(-300%, -50%) rotate(1080deg) scale(0);
}
.text--bubbling .char {
 transition-timing-function: cubic-bezier(0.75, -2, 0.75, 2);
}
.text--bubbling .char:nth-of-type(1) {
 transition-delay: 0.3s;
}
.text--bubbling .char:nth-of-type(2) {
 transition-delay: 0.2s;
}
.text--bubbling .char:nth-of-type(3) {
 transition-delay: 0.6s;
}
.text--bubbling .char:nth-of-type(4) {
 transition-delay: 0.3s;
}
.text--bubbling .char:nth-of-type(5) {
 transition-delay: 0.7s;
}
.text--bubbling .char:nth-of-type(6) {
 transition-delay: 0.7s;
}
.text--bubbling .char:nth-of-type(7) {
 transition-delay: 0.2s;
}
.text--bubbling .char:nth-of-type(8) {
 transition-delay: 0.2s;
}
.text--bubbling [data-scroll='out'] .char {
 transform: scale(0.5);
}
.text--swinging .char {
 transform-origin: calc((var(--char-total) - var(--char-index)) * 100%) -100%;
 transition-delay: calc((var(--char-total) - var(--char-index)) * 0.1s);
}
.text--swinging [data-scroll='out'] .char {
 opacity: 0;
 transform: rotate(90deg);
}
.text--rolling .char {
 transition: transform 1s, opacity 0.2s;
 transition-delay: calc((var(--char-total) - var(--char-index)) * 0.1s);
}
.text--rolling [data-scroll='out'] .char {
 opacity: 0;
 transform: translate(-500%, 0) scale(0) rotate(-1440deg);
}
.text--blowing .char {
 -webkit-animation-duration: 1s;
 animation-duration: 1s;
 -webkit-animation-fill-mode: both;
 animation-fill-mode: both;
 transform-origin: left bottom;
 -webkit-animation-delay: calc(var(--char-index) * 0.025s);
 animation-delay: calc(var(--char-index) * 0.025s);
}
.text--blowing [data-scroll='in'] .char {
 -webkit-animation-name: blowing;
 animation-name: blowing;
}
@-webkit-keyframes blowing {
 50%, 60%, 70% {
 transform: skewX(-35deg);
 }
 55%, 65%, 75% {
 transform: skewX(-40deg);
 }
}
@keyframes blowing {
 50%, 60%, 70% {
 transform: skewX(-35deg);
 }
 55%, 65%, 75% {
 transform: skewX(-40deg);
 }
}
.text--meeting .char {
 transition-delay: calc((var(--char-total) - var(--char-index)) * 0.1s);
}
.text--meeting .char:nth-of-type(even) {
 transform-origin: top right;
}
.text--meeting .char:nth-of-type(odd) {
 transform-origin: bottom left;
}
.text--meeting [data-scroll='out'] .char {
 transform: rotate(180deg);
}
.text--conveyor [data-scroll='in'] .char {
 transform-origin: left bottom;
 -webkit-animation: convey 1s both linear;
 animation: convey 1s both linear;
 -webkit-animation-delay: calc((var(--char-total) - var(--char-index)) * 0.15s);
 animation-delay: calc((var(--char-total) - var(--char-index)) * 0.15s);
 transition: none;
}
@-webkit-keyframes convey {
 0% {
 transform: translate(calc((var(--char-total) - (var(--char-total) - var(--char-index))) * -100%), 0) rotate(-180deg) translate(calc((var(--char-total) - var(--char-index)) * -100%), 0);
 }
 40% {
 transform: translate(calc((var(--char-total) - (var(--char-total) - var(--char-index))) * -100%), 0) rotate(-180deg) translate(0, 0);
 }
 50% {
 transform: translate(calc((var(--char-total) - (var(--char-total) - var(--char-index))) * -100%), 0) rotate(0deg) translate(0, 0);
 }
 100% {
 transform: translate(0, 0) rotate(0deg) translate(0, 0);
 }
}
@keyframes convey {
 0% {
 transform: translate(calc((var(--char-total) - (var(--char-total) - var(--char-index))) * -100%), 0) rotate(-180deg) translate(calc((var(--char-total) - var(--char-index)) * -100%), 0);
 }
 40% {
 transform: translate(calc((var(--char-total) - (var(--char-total) - var(--char-index))) * -100%), 0) rotate(-180deg) translate(0, 0);
 }
 50% {
 transform: translate(calc((var(--char-total) - (var(--char-total) - var(--char-index))) * -100%), 0) rotate(0deg) translate(0, 0);
 }
 100% {
 transform: translate(0, 0) rotate(0deg) translate(0, 0);
 }
}
/**********arrow3d**************/
.scrollBtn.hidden {
  opacity: 0;
}

.arrow {
  opacity: 0;
  position: absolute;
  left: 50%;
  top: 50%;
  transform-origin: 50% 50%;
  transform: translate3d(-50%, -50%, 0);
}

.arrow-first {
  -webkit-animation: arrow-movement 2s ease-in-out infinite;
          animation: arrow-movement 2s ease-in-out infinite;
}

.arrow-second {
  -webkit-animation: arrow-movement 2s 1s ease-in-out infinite;
          animation: arrow-movement 2s 1s ease-in-out infinite;
}

.arrow:before,
.arrow:after {
  background: #fff;
  content: "";
  display: block;
  height:5px;
  position: absolute;
  top: 40vh;
  left:-15px;
  width: 30px;
}

.arrow:before {
  transform: rotate(45deg) translateX(-5px);
  transform-origin: top left;
}

.arrow:after {
  transform: rotate(-45deg) translateX(5px);
  transform-origin: top right;
}

@-webkit-keyframes arrow-movement {
  0% {
    opacity: 0;
    top: 45%;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes arrow-movement {
  0% {
    opacity: 0;
    top: 45%;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}