@charset "UTF-8";

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.7.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2018 Daniel Eden
 */
@keyframes move {
	0%   { left:-0.5rem; }	50%  { left: 1rem; }	100% { left:  -0.5rem; }
}



@-webkit-keyframes mouse-wheel {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(10px);
        -ms-transform: translateY(10px);
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}
@-moz-keyframes mouse-wheel {
    0% { top: 1px; }
    25% { top: 2px; }
    50% { top: 3px;}
    75% { top: 2px;}
    100% { top: 1px;}
}
@-webkit-keyframes mouse-scroll {
    0%   { opacity: 0;}
    50%  { opacity: .5;}
    100% { opacity: 1;}
}
@-moz-keyframes mouse-scroll {
    0%   { opacity: 0; }
    50%  { opacity: .5; }
    100% { opacity: 1; }
}
@-o-keyframes mouse-scroll {
    0%   { opacity: 0; }
    50%  { opacity: .5; }
    100% { opacity: 1; }
}
@keyframes mouse-scroll {
    0%   { opacity: 0; }
    50%  { opacity: .5; }
    100% { opacity: 1; }
}
@-webkit-keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

@keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes wobble {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

@keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes heartBeat {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  14% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  28% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  42% {
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
  }

  70% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.heartBeat {
  -webkit-animation-name: heartBeat;
  animation-name: heartBeat;
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
}

@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

.bounceOut {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -40%, 0);
    transform: translate3d(0, -40%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -40%, 0);
    transform: translate3d(0, -40%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
    transform: translate3d(-20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-20%, 0, 0);
    transform: translate3d(-20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(20%, 0, 0);
    transform: translate3d(20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(20%, 0, 0);
    transform: translate3d(20%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 40%, 0);
    transform: translate3d(0, 40%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 40%, 0);
    transform: translate3d(0, 40%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUpSmall {
  -webkit-animation-name: fadeInUpSmall;
  animation-name: fadeInUpSmall;
}





@-webkit-keyframes fadeInUpSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 80px, 0);
    transform: translate3d(0, 80px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUpSmall {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 80px, 0);
    transform: translate3d(0, 80px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUpSmall {
  -webkit-animation-name: fadeInUpSmall;
  animation-name: fadeInUpSmall;
}





@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  from {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
      rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
      rotate3d(0, 1, 0, 0deg);
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}


.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

@-webkit-keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes jackInTheBox {
  from {
    opacity: 0;
    -webkit-transform: scale(0.1) rotate(30deg);
    transform: scale(0.1) rotate(30deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
  }

  50% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }

  70% {
    -webkit-transform: rotate(3deg);
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.jackInTheBox {
  -webkit-animation-name: jackInTheBox;
  animation-name: jackInTheBox;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.animated.delay-2s {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

.animated.delay-3s {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.animated.delay-4s {
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}

.animated.delay-5s {
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}

.animated.fast {
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms;
}

.animated.faster {
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
}

.animated.slow {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.slower {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

@media (print), (prefers-reduced-motion) {
  .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important;
  }
}








@charset "utf-8";

/*------------------------------------
	common 
------------------------------------*/
.inner {margin:0 auto; max-width:1680px;}

.table_ty1 {width: 100%; border-top:2px solid var(--sub-color4);}
.table_ty1 tbody {}
.table_ty1 tbody tr {}
.table_ty1 tbody tr th {padding:2rem 0; border-bottom:1px solid #ccc;}
.table_ty1 tbody tr td {padding:2rem 0;border-bottom:1px solid #ccc;}

@media (max-width: 1680px) {
	.inner{max-width:100%; width: auto; padding:0 5%;}
}


:root {
	--main-color1:#9E1E63; --main-color2:#7D184E; --main-color3:#F4811F; 
	--sub-color1:#fff; --sub-color2:#F5F5F5; --sub-color3:#666666;  --sub-color4:#000000;
}


/*------------------------------------
  header
------------------------------------*/
#max-header { width:100%; height:110px;position: absolute; z-index:3;	}
#max-header .header-menu {display:flex; height: 100%; align-items: center;}
#max-header .header-menu .top_logo { display: block; position: relative; width: auto; height: auto;}
#max-header .header-menu .top_logo a {width: 204px; height: 62px; display: inline-block;background-repeat:no-repeat; background-position:left top;background-size:contain; background-image:url(../images/common/top_logo_w.png);}
#max-header .header-menu .top_menu {height: 100%; position: absolute; left: 50%; transform: translateX(-50%);}
#max-header .header-menu .top_menu > ul {display:flex;    height: 100%;}
#max-header .header-menu .top_menu > ul > li {position:relative;width: 180px;height: 100%;  text-align: center;} 
#max-header .header-menu .top_menu > ul > li > a {font-weight: 500;color:var(--sub-color2);height: 100%;display: flex;font-size: 1.2em;align-items: center;justify-content: center;}
#max-header .header-menu .top_menu > ul > li > a:hover {color:var(--main-color2);}
#max-header .header-menu .top_menu > ul > li > ul {	display:none; position: absolute;background: var(--main-color2); width: 90%; padding: 5%;}
#max-header .header-menu .top_menu > ul > li > ul::before {content:''; width:8px; height: 8px; background: var(--main-color2); position: absolute; transform:translate(-50%, 0%);top:-20px; left:50%;border-radius:100%;}
#max-header .header-menu .top_menu > ul > li:hover > ul {display:block;}
#max-header .header-menu .top_menu > ul > li > ul > li:hover {font-weight: bold;}
#max-header .header-menu .top_menu > ul > li > ul > li  {text-align:left;	}
#max-header .header-menu .top_menu > ul > li > ul > li > a {color:var(--sub-color1);padding: 1rem;width: 100%;text-align:left;display: inline-block;}
#max-header .gnb {position: absolute;right:0; top:0; display:flex; align-items: center;}
#max-header .gnb .fullmenu {display: inline-block;}
#max-header .gnb .fullmenu a {position: relative; display: block;width: 110px; height: 110px; background: var(--main-color1);cursor: pointer;}
#max-header .gnb .fullmenu a svg {position: absolute; left:50%; top:50%; width:40px; height:40px; color:var(--sub-color1); transform:translate(-50%, -50%);}
#max-header .gnb .go-admin {margin:0 2rem}
#max-header .gnb .go-admin li a{display:flex; color:var(--sub-color2); font-weight: 600;}
#max-header .gnb .go-admin li a i {margin-right:1rem;}
#max-header .gnb .language {width: 100px;display: flex;align-items: center;margin-right: 10%;}
#max-header .gnb .language li {width: 100%;}
#max-header .gnb .language li .lan_group {width: 100%;position: relative;}
#max-header .gnb .language li .lan_group p {width: 100%;border-bottom: 2px solid var(--sub-color2);margin: 0;  position: relative;}
#max-header .gnb .language li .lan_group p a::before {position: absolute; right:0; top: 50%; transform: translate(0%, -50%);content:''; width: 0px;  height: 0px;border-top: 8px solid  var(--sub-color2);border-left: 6px solid transparent;  border-right: 6px solid transparent;}
#max-header .gnb .language li .lan_group p a {padding: 1rem 0;width: 100%;display: inline-block;font-weight: 500; color:var(--sub-color2); }
#max-header .gnb .language li .lan_group ul {position: absolute;background: var(--sub-color4);width: 100%;}
#max-header .gnb .language li .lan_group ul li {padding: 1rem 0;}
#max-header .gnb .language li .lan_group ul li a {color: var(--sub-color1);padding: 0 1rem;display:block;font-size: 1.4rem;font-weight: bold;}

#max-header .progress-bar {position: absolute; bottom:0;  width: 0%;  height: 3px; z-index:99; max-width: 100%; background-color:var(--main-color1); -webkit-transition: width .4s ease; -o-transition: width .4s ease;    transition: width .4s ease;}

#max-header.white .header-menu .top_logo a {background-image:url(../images/common/top_logo.png);}
#max-header.white .header-menu .top_menu > ul > li > a{color:var(--sub-color4);}
#max-header.white .gnb .language li .lan_group p {    border-bottom: 2px solid var(--sub-color4);}
#max-header.white .gnb .language li .lan_group p a {color: var(--sub-color4);}
#max-header.white .gnb .language li .lan_group p a::before {border-top: 8px solid var(--sub-color4);}
#max-header.white .gnb .go-admin li a {color:var(--sub-color4);}


#max-header.fixed { height: 90px;position: fixed;background:#fff;z-index:5; box-shadow: 0px 1px 10px 0px rgb(0 0 0 / 21%);}
#max-header.fixed .header-menu .top_logo a {background-image:url(../images/common/top_logo.png);width: 180px; height: 55px;}
#max-header.fixed .header-menu .top_menu > ul > li > a{color:var(--sub-color4);}
#max-header.fixed .gnb .language li .lan_group p {    border-bottom: 2px solid var(--sub-color4);}
#max-header.fixed .gnb .language li .lan_group p a {color: var(--sub-color4);}
#max-header.fixed .gnb .language li .lan_group p a::before {border-top: 8px solid var(--sub-color4);}
#max-header.fixed .gnb .go-admin li a {color:var(--sub-color4);}
#max-header.fixed .gnb .fullmenu a {width: 90px; height: 90px;}

/* header : full menu */
#max-fullmenu.fullmenu {display:none; position:fixed; width:100%;top:0; right:-100%; height:100vh; z-index:2000; } 
#max-fullmenu.fullmenu .box {width:35%; height:100%;position:absolute; top:0; right:0; background-color:var(--main-color1); color:#181818; overflow-y:auto;}
#max-fullmenu.fullmenu .box .fullmenu_title {position: absolute; right:0; top:0; display:flex;justify-content: flex-end; align-items: center;z-index: 2;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language {position: absolute;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language {width: 100px;display: flex;align-items: center;margin-right: 120px;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li {width: 100%;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li .lan_group {width: 100%;position: relative;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li .lan_group p {width: 100%;border-bottom: 2px solid var(--sub-color2);margin: 0;  position: relative;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li .lan_group p a::before {position: absolute; right:0; top: 50%; transform: translate(0%, -50%);content:''; width: 0px;  height: 0px;border-top: 8px solid  var(--sub-color2);border-left: 6px solid transparent;  border-right: 6px solid transparent;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li .lan_group p a {padding: 1rem 0;width: 100%;display: inline-block;font-weight: 500; color:var(--sub-color2); }
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li .lan_group ul {position: absolute;background: var(--sub-color4);width: 100%;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li .lan_group ul li {padding: 1rem 0;}
#max-fullmenu.fullmenu .box .fullmenu_title ul.language li .lan_group ul li a {color: var(--sub-color1);padding: 0 1rem;display:block;font-size: 1.4rem;font-weight: bold;}
#max-fullmenu.fullmenu .box .fullmenu_title a.bt_sitemap_close {width: 110px; height:110px; background-color:var(--main-color1); display:inline-block;position: relative; cursor: pointer; }
#max-fullmenu.fullmenu .box .fullmenu_title svg {color:var(--sub-color1);width: 45px; height: 45px; position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
#max-fullmenu.fullmenu .box .fullmenu_quick {width: 100%; display:flex; }
#max-fullmenu.fullmenu .box .fullmenu_quick .quick {flex-basis:50%;display:flex; align-items: center; justify-content: center; padding:1rem 0; color:var(--sub-color1);}
#max-fullmenu.fullmenu .box .fullmenu_quick .quick svg {width:22px; height:22px; margin-right:.3rem; }
#max-fullmenu.fullmenu .box .fullmenu_quick .quick span {}
#max-fullmenu.fullmenu .box .fullmenu_quick .quick1 {background-color:var(--main-color1);}
#max-fullmenu.fullmenu .box .fullmenu_quick .quick2 {background-color:var(--main-color2);}
#max-fullmenu.fullmenu .box .fullmenu_content {position: relative;}
#max-fullmenu .full_menu_area{ width: 20%; height: 100vh; display: flex; flex-direction: column; justify-content: center; background: var(--main-color2);}
#max-fullmenu .menu_box{width: 100%; height: auto;}
#max-fullmenu .menu_box:nth-child(1) .dep1{border-top:1px solid rgb(255 255 255 / 27%);}
#max-fullmenu .menu_box .dep1{display: flex;text-align: center;align-items: center; width: 100%; border-bottom:1px solid rgb(255 255 255 / 27%);opacity:0.5;text-decoration:none;color:var(--sub-color1);font-weight:400;position:relative;transition:.3s ease-in-out;flex-direction: column;justify-content: center;height: 130px;}
#max-fullmenu .menu_box .title {font-weight: 300;}
#max-fullmenu .menu_box .icon{display:block;margin-bottom:5px; width: 35px; height: 35px; background-repeat:no-repeat; background-position:center;}
#max-fullmenu .menu_box:nth-child(1) .icon{background-image:url(../images/common/menu_icon1.png);}
#max-fullmenu .menu_box:nth-child(2) .icon{background-image:url(../images/common/menu_icon2.png);}
#max-fullmenu .menu_box:nth-child(3) .icon{background-image:url(../images/common/menu_icon3.png);}
#max-fullmenu .menu_box:nth-child(4) .icon{background-image:url(../images/common/menu_icon4.png);}
#max-fullmenu .menu_box .content{display:none;  padding:0 5%;width: 70%;position: absolute;right: 0;top: 180px;}
#max-fullmenu .menu_box .content ul li:first-child a{ border-top: 1px solid rgba(255,255,255,.3); }
#max-fullmenu .menu_box .content ul li a {color: var(--sub-color1);display: block;padding: 3rem 5%;border-bottom: 1px solid rgba(255,255,255,.3);display: flex;align-items: center;justify-content: space-between;}
#max-fullmenu .menu_box .content ul li a > span {opacity:.3;}
#max-fullmenu .menu_box .content ul li:hover a {background-color:rgba(255,255,255,0.1);}
#max-fullmenu .menu_box .content ul li:hover a > span {opacity:1; animation: move 1s infinite;}
#max-fullmenu .menu_box.active .dep1 {background:var(--main-color1); color:var(--sub-color1);opacity:1 !important;}
#max-fullmenu .menu_box.active .title {font-weight: 500;}
#max-fullmenu .full_bg {display:none;background:rgba(0,0,0,0.5);width:100%; height:100%;position:fixed;transform:translate(-50%, 0%); left:50%;top:0;z-index:-1}



@media screen and (max-width: 1400px) {


}
@media screen and (max-width: 1024px) {
	#max-header .header-menu .top_menu {display: none;}

	#max-fullmenu.fullmenu .box {width: 75%;}
}
@media screen and (max-width: 768px) { 
	#max-header {height: 90px;}
	#max-header .header-menu .top_logo a {width: 140px; height: 45px;}

	#max-header .gnb .fullmenu a {width: 90px; height: 90px}

	#max-fullmenu.fullmenu .box .fullmenu_title a.bt_sitemap_close {width: 90px;height: 90px;}
	#max-fullmenu .menu_box .content {top:150px}
	#max-fullmenu .menu_box .content ul li a {padding:2rem 5%;}
}
@media screen and (max-width: 568px) { 
	#max-header {height:60px;}
	
	#max-header .header-menu .top_logo a {width: 110px; height: 35px;background-position: center;}
	#max-header .gnb .go-admin {display: none;}
	#max-header .gnb .language {display: none;}
	
	#max-header .gnb .fullmenu a {width:60px; height: 60px}
	#max-header .gnb .fullmenu a svg {width: 30px; height: 30px;}

	#max-header.fixed  {height:60px;}
	#max-header.fixed .header-menu .top_logo a {width: 110px; height: 35px;}
	#max-header.fixed .gnb .fullmenu a{width:60px; height: 60px}


	#max-fullmenu.fullmenu .box {width: 100%;}
	#max-fullmenu .full_menu_area {width: 30%;}
	#max-fullmenu .menu_box .dep1 {height: 100px;}
	#max-fullmenu .menu_box .title {}
	#max-fullmenu .menu_box .content {width: 60%; top:100px;}
	#max-fullmenu .menu_box .content ul li a {padding:1.5rem 5%;}

	#max-fullmenu.fullmenu .box .fullmenu_title ul.language {margin-right:80px;     width: 80px;}
	#max-fullmenu.fullmenu .box .fullmenu_title a.bt_sitemap_close {width: 60px;height: 60px;}
	#max-fullmenu.fullmenu .box .fullmenu_title svg {width: 30px; height: 30px;}

}





/*------------------------------------
  footer
------------------------------------*/

#max-footer {position: relative; background: var(--sub-color4);width: 100%;  font-style: normal; padding:5rem 0;margin-top: 9rem;	}
#max-footer .inner {display:flex; position: relative;}
#max-footer .foot_logo { display: block; position: relative; width: auto; height: auto;}
#max-footer .foot_logo a {width: 204px; height: 62px; display: inline-block;background-repeat:no-repeat; background-position:left top;background-size:contain; background-image:url(../images/common/top_logo_w.png);}
#max-footer .copyright {margin-left:5rem;}
#max-footer .copyright ul  {color:#fff; display:flex; width:55%;flex-wrap: wrap;}
#max-footer .copyright ul li {margin-right:2.5rem;line-height: 200%;font-size: .9em;}
#max-footer .copyright ul li > p {font-weight: 600;}
#max-footer .copyright > p {margin-top:2rem; color:#fff; opacity:.6;font-size:.8em;}
#max-footer .copyright > p a {color:currentColor}
#max-footer .foot_menu {right:0; position: absolute;width: auto;}
#max-footer .foot_menu ul { display:flex; flex-wrap: wrap;flex-direction: column;}
#max-footer .foot_menu ul li {flex-basis:50%;text-align:right;}
#max-footer .foot_menu ul li a {color:#fff;font-size: .9em; padding: 0.5rem 0;display: inline-block;}
#max-footer .foot_menu ul li a i {display: inline-block;margin-left: 0.5rem;}

#bt_top {position:absolute; top:-6rem; right:2rem;}
#bt_top a {display:block;color: var(--sub-color4);display: flex; align-items: center;}
#bt_top a p {margin-left:1rem; border:0; width:40px; height:40px; background: var(--sub-color4); position: relative; border-radius: 100%}
#bt_top a p svg {position: absolute; left:50%; top:50%;transform: translate(-50%, -50%); color:#fff; } 
#bt_top a span {display:block;line-height:1;font-size: .6em;}

@media screen and (max-width: 1400px) {


}
@media screen and (max-width: 1024px) {
	#max-footer .inner {display: inline-block;}
	#max-footer .foot_menu {position: relative; display: block;width: 100%;     margin-bottom: 5%;}
	#max-footer .foot_menu ul {justify-content: space-between;}
	#max-footer .foot_menu ul li {flex-basis:auto;}

	#max-footer .copyright {margin:0;}

}
@media screen and (max-width: 768px) { 
	#max-footer {padding:0 0 5rem;}
	#max-footer .foot_menu {border-bottom: 1px solid #545454;}
	#max-footer .foot_menu ul li a {font-size: 1.4rem; padding:1.5rem 0; }
	#max-footer .foot_logo a {width: 140px; height: 45px;}
	#max-footer .copyright ul {width: 100%;}

}
@media screen and (max-width: 568px) { 
	#max-footer .foot_logo a {width: 110px; height: 35px;}
	#max-footer .foot_menu ul li a {font-size: 1.4rem; padding:1.2rem 0; }
	#max-footer .copyright ul li {font-size: 1.3rem; margin-right:1.5rem;line-height: 150%;}
}


/*------------------------------------
  sub layout
------------------------------------*/
.sub-warp  {margin-top:20rem;}
.sub-warp .sub_top {position: relative;}
.sub-warp .sub_top .breadcrumb ul {display:flex;align-items: center;}
.sub-warp .sub_top .breadcrumb ul li { display: flex;align-items: center; font-size:.9em;}
.sub-warp .sub_top .breadcrumb .home { background: var(--main-color1); width: 40px; height: 40px; position: relative; border-radius: 100%;} 
.sub-warp .sub_top .breadcrumb .home > svg {width: 24px;height: 24px;color:#fff; margin:0; position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);} 
.sub-warp .sub_top .breadcrumb ul li > svg { color: #bbb; width: 15px; height: 15px; margin: 0 1rem;}
.sub-warp .sub_top > h2 {font-size:3em; margin:5rem 0 3rem; line-height: 100%;}
.sub-warp .sub_top .product_inquiry {position: absolute; right: 0; bottom: 0; display: flex; align-items: center; background: var(--main-color1); padding: 1.5rem 3rem;  color: #fff; border-radius: 4rem;}
.sub-warp .sub_top .product_inquiry > svg {margin-right:1rem; }
.sub-warp .sub_menu {position: relative;}
.sub-warp .sub_menu .dep2_menu {width: 100%;}
.sub-warp .sub_menu .dep2_menu ul {display:flex;align-items: center; padding: 1.5rem 0; width: 100% !important;}
.sub-warp .sub_menu .dep2_menu ul li {position: relative; margin-right:4rem;}
.sub-warp .sub_menu .dep2_menu ul li.active a{position: relative; font-weight: bold; color:var(--main-color1) ;    padding-bottom: 1.5rem;}
.sub-warp .sub_menu .dep2_menu ul li a {width: 100%; line-height: 100%;}
.sub-warp .sub_menu .dep2_menu ul li a:hover{color:var(--main-color1) ;}
.sub-warp .sub_menu .dep2_menu ul li.active a::before {content:''; width: 100%; height: 2px; position: absolute; bottom:0px; left:0; background:var(--main-color1);	}
.sub-warp .sub_menu .product_menu ul {display:flex;align-items: center; padding: 1rem 0;border-top:1px solid #eee;border-bottom:1px solid #eee;}
.sub-warp .sub_menu .product_menu ul li a{position: relative; margin:0 1rem;font-size: .9em;  background-color:var(--sub-color2) ;  border-radius: 3rem; padding: 1rem 2rem;display: inline-block; }
.sub-warp .sub_menu .product_menu ul li.active a{position: relative; font-weight: bold; background-color:var(--main-color1) ;   color: #fff;}





@media screen and (max-width: 1400px) {
	
}
@media screen and (max-width: 1024px) {
	.sub-warp {margin-top:15rem;}
	.sub-warp .sub_menu .dep2_menu ul{align-items: flex-start; white-space:nowrap; width: 800px !important;padding: 1rem 0 0;  }
	.sub-warp .sub_menu .dep2_menu ul li{display:inline-block;margin-right:2rem;}
	.sub-warp .sub_menu .dep2_menu ul li a{ display: block; }

}
@media screen and (max-width: 768px) { 
	.sub-warp {margin-top:12rem;}

	.sub-warp .sub_top .breadcrumb ul li > svg {margin:0 .5rem;}
	.sub-warp .sub_top .breadcrumb .home {width: 30px; height: 30px;}
	.sub-warp .sub_top .breadcrumb .home > svg {width: 19px; height: 19px;}
	.sub-warp .sub_top > h2 {margin:2.5rem 0 1rem;}
	.sub-warp .sub_top .product_inquiry {padding: 1rem 2rem;}
	.sub-warp .sub_top .product_inquiry > svg {width: 20px; height: 20px;}

	.sub-warp .sub_menu .dep2_menu ul {}
	.sub-warp .sub_menu .dep2_menu ul li a {font-size:1.1em;}
	.sub-warp .sub_menu .dep2_menu ul li.active a{padding-bottom:1rem;}
	.sub-warp .sub_menu .product_menu ul {padding: 0.5rem 0; flex-wrap: wrap;}
	.sub-warp .sub_menu .product_menu ul li { padding: .5rem 0;}
	.sub-warp .sub_menu .product_menu ul li a {margin:0 0.5rem;}
	.sub-warp .sub_menu .product_menu ul li.active a {padding: 1rem 1rem;}
}
@media screen and (max-width: 568px) { 
	.sub-warp {margin-top:10rem;}
	.sub-warp .sub_top .breadcrumb .home {width: 20px; height: 20px;}
	.sub-warp .sub_top .breadcrumb .home > svg {width: 13px; height: 13px;}
	.sub-warp .sub_top > h2  {font-size:2em;}
	.sub-warp .sub_top .product_inquiry  {padding:1rem;}
	.sub-warp .sub_top .product_inquiry > svg  {margin:0;}
	.sub-warp .sub_top .product_inquiry span {	display: none;}

	
}











@charset "utf-8";

/*------------------------------------
	main_Layout
------------------------------------*/

#max-contanier {position: relative;  overflow-x: hidden;}
#max-contanier hr {border:0;}
#max-contanier section {position: relative; width: 100%;}
#max-contanier section .inner_c {width: 100%; margin:0 auto;}

@media screen and (max-width:1400px) {
	#max-contanier {overflow:hidden;}
	#max-contanier section .inner_c {width: 90%; margin: 0 auto;}
}


/*------------------------------------
	Main-visaul
------------------------------------*/
#mainvisual {width: 100%; height:100vh;position: relative;}
#mainvisual .main_visual {display: block; width: 100%; height:100%;}
#mainvisual .main_visual ul.main_slide {height: 100%;}
#mainvisual .main_visual ul.main_slide li.item {height: 100vh; display: block; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center;}
#mainvisual .main_visual ul.main_slide li.bg_01 {background-image:url(../images/main/vis_01.png);}
#mainvisual .main_visual ul.main_slide li.bg_02 {background-image:url(../images/main/vis_02.png);}
#mainvisual .main_visual ul.main_slide li.bg_03 {background-image:url(../images/main/vis_03.png);}
#mainvisual .main_visual ul.main_slide li.item .text_box {position: absolute; top:50%; transform:translateY(-50%);color:#fff; }
#mainvisual .main_visual ul.main_slide li.item .text_box h2 {position: relative; font-size:12rem;text-transform: uppercase;font-weight:900;line-height: 100%;}
#mainvisual .main_visual ul.main_slide li.item .text_box span::before {content:''; width: 30px;height: 4px; background: #fff;transform: rotate( -45deg ); position: absolute; top:0; left:0;}
#mainvisual .main_visual ul.main_slide li.item .text_box span {display: block;font-size: 4rem;font-weight: 200;padding-top:30px;}

#mainvisual .main_visual ul.main_slide li.item .text_box > p {margin-top:5rem; font-size: 2rem;}

#mainvisual .main_visual ul.main_slide li.item .text_box > * {transform:translateX(100px); opacity:0;}
#mainvisual .main_visual ul.main_slide li.item.slick-current .text_box > * {transform:translateX(0); transition:.5s; opacity:1;}
#mainvisual .main_visual ul.main_slide li.item.slick-current .text_box span {transition-delay:.3s;}
#mainvisual .main_visual ul.main_slide li.item.slick-current .text_box h2 {transition-delay:.6s;}
#mainvisual .main_visual ul.main_slide li.item.slick-current .text_box p {transition-delay:.9s;}



#mainvisual .main_visual ul.main_slide .slick-dots { position: absolute; top: 50%;transform: translateY(-50%); right: 0; width:300px;  bottom: auto;  display: flex; flex-direction: column;}
#mainvisual .main_visual ul.main_slide .slick-dots li {    width: 100%; height: auto; margin: 0; opacity: .5;}
#mainvisual .main_visual ul.main_slide button {color: #fff; font-size: 20px;padding: 20px 0;  width: 100%; text-align: left; position: relative; text-transform: uppercase; line-height: 100%;   height: auto; display: inline-block;}
#mainvisual .main_visual ul.main_slide button::before {display: none;}
#mainvisual .main_visual ul.main_slide .slick-dots li.slick-active {opacity:1; }
#mainvisual .main_visual ul.main_slide .slick-dots li.slick-active button {font-weight: 500;}
#mainvisual .main_visual ul.main_slide .slick-dots li.slick-active button::before {content:''; display: block; position: absolute; width: 100%; height: 2px; background: #fff; top: 95%;}


/* mouse wheel */
.mouse_wp {position: absolute;bottom: 8%;left: 5%;width:auto;z-index: 2;display: flex;align-items: flex-end;}
.mouse_wp p {font-size: 1.2rem;font-weight: 300;color: #fff;margin-left: 2rem;text-transform: uppercase;letter-spacing: .3rem;opacity: .6;}
.mouse_wp .txt {margin: 0 0 0 -21px !important;}
.mouse_scroll {display:block;margin:0 auto; width:22px;-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);}
.m_scroll_arrows{  display: block; -ms-transform: rotate(45deg);  -webkit-transform: rotate(45deg);  transform: rotate(45deg); border-right: 1.5px solid #fff;  border-bottom: 1.5px solid #fff; width: 12px;  height: 12px;}
.m_scroll_arrows_one, .m_scroll_arrows_two{ -webkit-animation: mouse-scroll 1s infinite;  -moz-animation: mouse-scroll 1s infinite;}
.m_scroll_arrows_one{ -webkit-animation-delay: .1s;  -moz-animation-delay: .1s;  -webkit-animation-direction: alternate;  margin-top: 3px;} 
.m_scroll_arrows_two{  -webkit-animation-delay: .3s; -moz-animation-delay: .3s; -webkit-animation-direction: alternate;  margin-top: -5px;} 
.mouse{height: 40px;width:100%;border-radius:50px;transform:none; border:2px solid #e1ddd9;}
.wheel{height:8px; width:4px; display:block; margin:5px auto; background:#e1ddd9; position:relative; -webkit-border-radius:50px; border-radius:50px;}
.wheel{-webkit-animation:mouse-wheel 2.5s ease-in-out infinite; -moz-animation:mouse-wheel 2.5s ease-in-out infinite;}

@media screen and (max-width: 1400px) {


}
@media screen and (max-width: 1024px) {
	#mainvisual .main_visual ul.main_slide .slick-dots { width: 100%; flex-direction: row; text-align: center;  bottom: 0;  transform: none;  height: auto;  align-items: flex-end;height: 60px; bottom: 0; top: auto;}
	#mainvisual .main_visual ul.main_slide button {text-align: center;background: rgba(0,0,0,.8);}
	#mainvisual .main_visual ul.main_slide .slick-dots li.slick-active button {background: var(--main-color1);}
	#mainvisual .main_visual ul.main_slide .slick-dots li.slick-active button::before {display: none;}
	#mainvisual .main_visual ul.main_slide li.item .text_box {left: 50%;transform: translate(-50%, -50%); text-align: center;width: 100%; }
	#mainvisual .main_visual ul.main_slide li.item .text_box span::before {left:50%;}
	.mouse_wp {bottom: 15%; left: 50%;transform: translateX(-50%);}
}
@media screen and (max-width: 768px) { 
	#mainvisual {height:80vh;}
	#mainvisual .main_visual ul.main_slide li.item {height:80vh;background-position:80% bottom;}
	#mainvisual .main_visual ul.main_slide li.item .text_box {transform: translate(-50%, -70%);}
	#mainvisual .main_visual ul.main_slide li.item .text_box span::before {width: 20px; height: 3px;	}
	#mainvisual .main_visual ul.main_slide li.item .text_box span {font-size: 1.5em;}
	#mainvisual .main_visual ul.main_slide li.item .text_box h2  {font-size: 5em;}
	#mainvisual .main_visual ul.main_slide li.item .text_box > p {
    font-size: 1.2em;
}
	#mainvisual .main_visual ul.main_slide button {font-size: 1em;}
	.mouse_wp p {font-size:1rem;display: none;}

}
@media screen and (max-width: 568px) { 
	#mainvisual .main_visual ul.main_slide li.item .text_box span {font-size: 1.6rem;}
	#mainvisual .main_visual ul.main_slide li.item .text_box h2 {font-size: 5rem;}
	#mainvisual .main_visual ul.main_slide li.item .text_box > p {font-size: 1.4rem;}
	#mainvisual .main_visual ul.main_slide button  {font-size: 1.4rem;}
}




/*------------------------------------
	main-con
------------------------------------*/

/* =================================== */
section.wrap_ourcomp {position: relative; padding:20rem 0 18rem; background:url(../images/main/bg_ourcomp.png) no-repeat bottom right; color:var(--sub-color4);}
section.wrap_ourcomp::before {content:'';width: 150px; height: 150px; background:url(../images/main/product_bg_img3.png) no-repeat center/cover;position: absolute; right:0; bottom:0;}
section.wrap_ourcomp .ourcomp_area { display:flex; justify-content: space-between; align-items: flex-end; }
section.wrap_ourcomp .ourcomp_area .text_box {width: 100%;}
section.wrap_ourcomp .ourcomp_area .text_box .title_name {position: relative;font-weight: 600;padding-top: 2rem;}
section.wrap_ourcomp .ourcomp_area .text_box .title_name::before {content:'';width: 16px;height: 3px;position: absolute; left:0; top:0; background-color:var(--main-color1);transform: rotate( -45deg );}
section.wrap_ourcomp .ourcomp_area .text_box > h2 { margin: 10rem 0 7rem; font-size: 5.8rem; font-weight: 400;  letter-spacing: -.2rem; line-height: 110%;}
section.wrap_ourcomp .ourcomp_area .text_box > h2 > span { font-weight: 900; font-size: 1.3em;}
section.wrap_ourcomp .ourcomp_area .text_box > h2 > span > em { font-style: inherit; color: var(--main-color1);}
section.wrap_ourcomp .ourcomp_area .text_box > p {width: 100%;line-height: 180%;}
section.wrap_ourcomp .ourcomp_area .text_box > p > span { display: block; margin-bottom: 1rem; font-weight: 600; font-size: 1.2em;}
section.wrap_ourcomp .ourcomp_area a.ourcomp_btn {  border: 1px solid #000;  background: #fff;  width: 250px;  height: 70px;  position: relative;overflow: hidden; z-index:0; box-sizing:border-box;}
section.wrap_ourcomp .ourcomp_area a.ourcomp_btn > span {  position: absolute;  top: 50%;left:50%;transform: translate(-50%, -50%);  width: 100%;  text-align: center; font-size: 1.4rem; font-weight: 700;  color: var(--sub-color4);}
section.wrap_ourcomp .ourcomp_area a.ourcomp_btn:after {position:absolute; top:0; left:0; z-index:-1; content:''; display:block; width:0; height:100%;background: var(--sub-color4); transition:all .5s;}
section.wrap_ourcomp .ourcomp_area a.ourcomp_btn:hover {color:#fff; border:1px solid #1C1D36;}
section.wrap_ourcomp .ourcomp_area a.ourcomp_btn:hover:after {width:100%;}
section.wrap_ourcomp .ourcomp_area a.ourcomp_btn:hover > span {color:var(--sub-color1);}
@media screen and (max-width: 1400px) {
	
}
@media screen and (max-width: 1024px) {
	section.wrap_ourcomp {padding: 10rem 0; background-size: auto;}
	section.wrap_ourcomp::before {width: 100px; height: 100px;}
	section.wrap_ourcomp .ourcomp_area {align-items: flex-start;    flex-direction: column;}
	section.wrap_ourcomp .ourcomp_area .text_box > h2 {margin: 5rem 0 3rem; }
	section.wrap_ourcomp .ourcomp_area a.ourcomp_btn {margin-top:3rem;width: 200px; height: 60px;}

}
@media screen and (max-width: 768px) { 
	section.wrap_ourcomp .ourcomp_area .text_box > h2 {margin: 5rem 0 3rem;font-size: 2.5em; } 
	section.wrap_ourcomp .ourcomp_area a.ourcomp_btn {font-size: inherit;}
}
@media screen and (max-width: 568px) { 
	section.wrap_ourcomp {padding:11rem 0 9rem; background-size: auto;}
	section.wrap_ourcomp .ourcomp_area .text_box > h2 {font-size: 2em;}
	section.wrap_ourcomp::before {width: 50px; height: 50px;}
	section.wrap_ourcomp .ourcomp_area a.ourcomp_btn {margin-top:3rem;width: 170px; height:45px;}
	section.wrap_ourcomp .ourcomp_area a.ourcomp_btn > span {}
}


/* =================================== */
section.wrap_product {position: relative; width: 100%;  padding:15rem 0; background:#101010;}
section.wrap_product::before {content:'';width: 150px; height: 150px; background:url(../images/main/product_bg_img1.png) no-repeat center/cover;position: absolute; right:0; bottom:0;}
section.wrap_product::after {content:'';width: 140px; height:140px; background:url(../images/main/product_bg_img2.png) no-repeat center/cover;position: absolute; left:0; top:0;}
section.wrap_product .product_area {display:flex; justify-content: space-between;align-items: flex-start;}
section.wrap_product .product_area .tabmenu {display: flex; flex-direction: column;}
section.wrap_product .product_area .tabmenu button  {width:100%;cursor: pointer; height:auto; opacity:.3; margin:3rem 0;text-align:left; display:inline-block; padding: 0; border: 0; background: transparent; color: #fff;}
section.wrap_product .product_area .tabmenu button > span {    font-size: 1.4em;}
section.wrap_product .product_area .tabmenu button > p {font-size:4em;font-weight: 500;}
section.wrap_product .product_area .tabmenu button.active {  color:#fff; opacity:1;}
section.wrap_product .tabs { flex-basis: 50%;position: relative;}
section.wrap_product .tab { display:none;}
section.wrap_product .tab.active { display:block; width: 100%;}
section.wrap_product .slider {  width:800px; height: 100%;}
section.wrap_product .item { position: relative;  height:600px;}
section.wrap_product .slick-arrow  {position: absolute;width:60px; height:60px; top:60px; border:2px solid #fff;  border-radius:100%; opacity:.5;}
section.wrap_product .slick-prev:before, section.wrap_product .slick-next:before {content:'';width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; background-position: center; background-repeat: no-repeat; }
section.wrap_product .slick-prev { right: 75px; left: auto; z-index:2;}
section.wrap_product .slick-prev:before {background-image:url(../images/common/arrow-prev.png);}
section.wrap_product .slick-next {right:0; }
section.wrap_product .slick-next:before {background-image:url(../images/common/arrow-next.png);}
section.wrap_product .slick-arrow:hover {opacity:1;}
section.wrap_product .item .product_area {position: relative; display:flex;flex-direction: column; align-items: flex-start;width: 100%;  height: 100%;	}
section.wrap_product .item .product_area .title {margin-bottom:3rem;width: 80%;}
section.wrap_product .item .product_area .title span {color: var(--main-color3);margin-bottom: 1rem;display: block;}
section.wrap_product .item .product_area .title h3 {color: var(--sub-color1);font-weight: 600;font-size: 2.5em;line-height: 110%;width: 100%;}
section.wrap_product .item .product_area .title p {color: var(--sub-color1); font-weight: 400; line-height: 110%; width: 100%; margin-top:2rem;}
section.wrap_product .item .product_area .machin_img {width: 90%; margin: 0 auto;position: absolute; bottom: 0;  left: 50%;  transform: translateX(-50%);}
section.wrap_product .item .product_area .machin_img img {margin: 0 auto;}
section.wrap_product .item .product_area .machin_img a.detail {position: absolute; cursor: pointer;width: 50px;height: 50px;border-radius:100%;background: var(--main-color1);right: 0; top: 0px;}
section.wrap_product .item .product_area .machin_img a.detail i {position: absolute; left:50%; top:50%;transform:translate(-50%, -50%); color:#fff;}
section.wrap_product .item .product_area .machin_img a.detail::before{ content: ''; width: 70px; height: 70px; background: var(--main-color1); opacity: .6;  position: absolute; left: 0; top: 0; transform: translate(-15%, -15%); z-index: -1;  border-radius: 100%;}
section.wrap_product .item .product_area .machin_img a.detail::after{ content: ''; width: 95px; height: 95px;  opacity: .3;border:1px solid #fff;  position: absolute; left: 0; top: 0; transform: translate(-25%, -25%); z-index: -1;  border-radius: 100%;}
section.wrap_product .item .product_area .info {display: none; position: absolute;top: 25px; right: 20px;background: rgba(255,255,255,.7);padding: 3rem;border-radius: 1rem;z-index: 1;color: #000;backdrop-filter:blur(5px);max-width: 60%;}
section.wrap_product .item .product_area .info a.detail_close {position: absolute;cursor: pointer; width: 50px;height: 50px;border-radius:100%;background: var(--main-color1);right: -20px;  top: -25px;z-index: 999!important;}
section.wrap_product .item .product_area .info a.detail_close i {position: absolute;left:50%;top:50%;transform:translate(-50%, -50%);color:#fff;z-index: 999;}
section.wrap_product .item .product_area .info h4 {font-size: 2.2rem; margin-bottom:1rem;}
section.wrap_product .item .product_area .info ul {}
section.wrap_product .item .product_area .info ul li {position: relative;padding-left:1.5rem;font-size: .9em;}
section.wrap_product .item .product_area .info ul li::before {content:''; width:3px; height:3px; background:#000; position: absolute;left:0; top:1rem;	}
@media screen and (max-width: 1400px) {
	section.wrap_product .product_area .tabmenu button > p {}
}
@media screen and (max-width: 1024px) {
	section.wrap_product::before {width: 100px; height: 100px;	}
	section.wrap_product::after {width: 100px; height: 100px;	}
	section.wrap_product .product_area {flex-direction: column;}
	section.wrap_product .product_area .tabmenu {width: 100%;flex-direction: row; width: 100%;}
	section.wrap_product .product_area .tabmenu button {text-align: center;    width: 50%;}
	section.wrap_product .product_area .tabmenu button > p {font-size: 2em;}
	section.wrap_product .product_area .tabmenu button > span {}
	section.wrap_product .slider {    margin-top: 5rem;	}

}
@media screen and (max-width: 768px) { 
	section.wrap_product .tabs {height: auto;}
	section.wrap_product .slider {    margin-top: 5rem;	width: 650px; height: auto;} 
	section.wrap_product .item .product_area {height: 650px;}
	section.wrap_product .item .product_area .machin_img {width: 100%;}
	section.wrap_product .item .product_area .machin_img a.detail {display: none;}
	section.wrap_product .item .product_area .title span {}
	section.wrap_product .item .product_area .title h3 {font-size: 2.5em;}
	section.wrap_product .item .product_area .info {    top: auto; left: 0; bottom: 0; width: 90%;backdrop-filter: none; padding: 0; position: relative;  margin: 0 5%;    background: none;  color: #fff;	}
	section.wrap_product .item .product_area .info ul li::before {background:#fff;}
	section.wrap_product .item .product_area .info {display: block; width: 100%; max-width: initial; margin:0;}
	section.wrap_product .item .product_area .info a.detail_close {display:none;}
	section.wrap_product .item .product_area .info h4 {font-size: 1.2em;}
	section.wrap_product .item .product_area .info ul li {font-size: inherit;}
	section.wrap_product .item {height: auto;}
	section.wrap_product .slick-arrow {top:30px; width:40px; height: 40px;}
	section.wrap_product .slick-prev {right:45px;}
}
@media screen and (max-width: 568px) { 
	section.wrap_product {padding:8rem 0;}
	section.wrap_product::before {width: 50px; height: 50px;	}
	section.wrap_product::after {width: 50px; height: 50px;	}
	section.wrap_product .tabs {margin:0 auto;}
	section.wrap_product .item .product_area {height:470px;}
	section.wrap_product .item .product_area .title h3 {font-size:2em;}
	section.wrap_product .item .product_area .machin_img img {width: 80%;}
	section.wrap_product .product_area .tabmenu {flex-wrap: wrap;justify-content: space-evenly;}
	
	section.wrap_product .product_area .tabmenu button {width: auto;margin:1rem 0;}
	section.wrap_product .product_area .tabmenu button > p {font-size:1.6rem;}
	section.wrap_product .product_area .tabmenu button > span {font-size:1.2rem;}
	section.wrap_product .slider {    margin-top: 5rem;	width:320px; height: auto;} 
	
}
@media screen and (max-width: 375px) { 
	section.wrap_product .slider {    margin-top: 5rem;	width:320px; } 
}
/* =================================== */
section.wrap_media {position: relative;width: 100%;  padding:15rem 0; }
section.wrap_media .title_box {position: relative;display:flex;justify-content: space-between; align-items: center;  margin-bottom: 3rem;}
section.wrap_media .title_box .title {position: relative;padding-top: 2rem;}
section.wrap_media .title_box .title::before {content:'';width: 16px;height: 3px;position: absolute; left:0; top:0; background-color:var(--main-color1);transform: rotate( -45deg );}
section.wrap_media .title_box .title > h3 {font-size: 3em;font-weight: 600;}
section.wrap_media .title_box .title > p {}
section.wrap_media .title_box .arrow_btn {display: flex;}
section.wrap_media .title_box .arrow_btn a {position: relative; width: 70px; height: 70px; background: var(--sub-color2); margin: 0 0.5rem; opacity:.6;cursor: pointer;}
section.wrap_media .title_box .arrow_btn a i {position: absolute; left: 50%; top: 50%;    transform: translate(-50%, -50%);}
section.wrap_media .title_box .arrow_btn a:hover { opacity:1;}
section.wrap_media .title_box .arrow_btn a.active { opacity:1;}
section.wrap_media .view_list { margin-left: 10%; width: 90%;}
section.wrap_media .view_list ul {}
section.wrap_media .view_list ul li {}
section.wrap_media .view_list .view_box { width: 450px;margin-top:3rem;}
section.wrap_media .view_list .view_box .thumb {position: relative; height: auto;width: 100%;}
section.wrap_media .view_list .view_box .thumb::before {content:''; width: 100%; height: 100%; background: rgba(0,0,0,0.5);position: absolute; left:0; top:0; 	}
section.wrap_media .view_list .view_box .thumb img{width: 100%;}
section.wrap_media .view_list .view_box .text {margin-top: 2rem;}
section.wrap_media .view_list .view_box .text span.category {color: var(--sub-color3);}
section.wrap_media .view_list .view_box .text p {margin-top: 1rem;font-size: 1.3em;word-break: keep-all;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3; /* 라인수 */-webkit-box-orient: vertical;word-wrap: break-word;line-height: 1.2em;height: 3.6em; /* line-height 가 1.2em 이고 3라인을 자르기 때문에 height는 1.2em * 3 = 3.6em */}
section.wrap_media .view_list ul li.slick-center  .view_box  { position: relative;margin-top:1rem;}
section.wrap_media .view_list ul li.slick-center  .view_box .thumb {box-shadow:0px 12px 20px 1px rgb(120 92 98 / 50%)}
section.wrap_media .view_list ul li.slick-center  .view_box .thumb::before {display: none;	}
section.wrap_media .view_list ul li.slick-center  .view_box .thumb::after { content:''; width: 0px;height: 0px;border-bottom:60px solid var(--main-color1); border-left: 60px solid transparent;position: absolute; right:0; bottom:0; 	} 
@media screen and (max-width: 1400px) {
	section.wrap_media .view_list {margin: 0 5%;}
	section.wrap_media .view_list .view_box {width: 100%;}
	section.wrap_media .view_list ul li {margin: 0 20px;}
}
@media screen and (max-width: 1024px) {
	section.wrap_media {padding:10rem 0;}
	section.wrap_media .view_list .view_box {margin-left: -45rem;}
	section.wrap_media .title_box .title > h3 {font-size: 3.5rem;}
}
@media screen and (max-width: 768px) { 
	section.wrap_media {padding:7rem 0 2rem}
	section.wrap_media .view_list .view_box {margin-left:0;}
	section.wrap_media .view_list ul li {margin: 0 10px;} 

}
@media screen and (max-width: 568px) { 
	
	section.wrap_media .title_box .title > h3 {font-size: 2.5rem;}
	section.wrap_media .title_box .arrow_btn a {width: 50px; height: 50px;	}
}
/* =================================== */

section.wrap_link { padding: 0; }
section.wrap_link ul {display:flex;}
section.wrap_link ul li {width: 100%;position: relative;}
section.wrap_link ul li .link_box::after {content:''; width: 100%; height: 100%; position: absolute; left:0; top:0; background: rgba(0,0,0,.5);z-index:3;transition: all 0.5s;}
section.wrap_link ul li:hover .link_box::after {background:rgba(0,0,0,0);}
section.wrap_link ul li:hover .link_box {margin-top:-1rem; transition: all 0.5s;}
section.wrap_link .link_box  {position: relative; width: 100%;display: block;height: 660px; background-repeat:no-repeat; background-size:cover;}
section.wrap_link .link_box p.title {position: absolute;left:10%;bottom:8%;color:#fff;font-size: 1.8em;font-weight: 500;z-index:4;}
section.wrap_link .link_box .more {position: absolute; right:0; bottom:0; background: #fff; z-index:4; width: 95px; height: 95px; opacity:0; color:var(--main-color1);}
section.wrap_link .link_box .more svg {width: 33px; height: 33px;position: absolute; left:50%; top:50%; transform:translate(-50%, -50%);}
section.wrap_link ul li:hover .link_box .more {opacity:1;} 
section.wrap_link .link_box::before {position: absolute;left: -15%;top: 25%;transform: rotate( 90deg );text-align: left;width: 50%;letter-spacing: 1rem;text-transform: uppercase;font-size: .5em;font-weight: 700;color: #fff;}
section.wrap_link .link_box.link-01 {background-image:url(../images/main/link-bg1.png);}
section.wrap_link .link_box.link-01::before {content:'VISION & VALUE';}
section.wrap_link .link_box.link-02 {background-image:url(../images/main/link-bg2.png);}
section.wrap_link .link_box.link-02::before {content:'Certification';}
section.wrap_link .link_box.link-03 {background-image:url(../images/main/link-bg3.png);}
section.wrap_link .link_box.link-03::before {content:'Organization';}
section.wrap_link .link_box.link-04 {background-image:url(../images/main/link-bg4.png);}
section.wrap_link .link_box.link-04::before {content:'LOCATION';}
@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {
	section.wrap_link .link_box {height: 400px;}
	section.wrap_link .link_box p.title {font-size:1.2em;}
	section.wrap_link .link_box .more {width: 65px; height: 65px;}
	
}
@media screen and (max-width: 768px) { 
	section.wrap_link {padding-top:0;}
	section.wrap_link ul {flex-wrap:wrap;	}
	section.wrap_link ul li{width: 50%;}
	section.wrap_link .link_box {height: 200px;}
	section.wrap_link ul li:hover .link_box {margin:0;}
	section.wrap_link .link_box::before {display: none;}
}
@media screen and (max-width: 568px) { 
	section.wrap_link .link_box::before {display: none;}
	section.wrap_link ul li{width: 100%;} 
	section.wrap_link .link_box {height: 100px; background-position:center 35%;}
	section.wrap_link .link_box p.title {bottom:50%;transform: translateY(50%); }
	section.wrap_link .link_box .more {width: 100px; height: 100px;}
}



@charset "utf-8";
/*------------------------------------
	sub_Layout
------------------------------------*/
#max-contanier.sub-contanier {padding: 8rem 0 0;}
#max-contanier.sub-contanier .image_box {display: inline-block;  background-position: center;background-repeat: no-repeat;background-size: cover;}
#max-contanier,#max-sublayout {position: relative;overflow-x: hidden;height: auto;}
#max-contanier hr {border:0;}
#max-contanier section,#max-sublayout section  {position: relative;width: 100%;}
.inner_c {width: 1400px; margin:0 auto;}

@media screen and (max-width: 1400px) {
	.inner_c {width:90%; margin:0 5%;}
}
@media screen and (max-width: 1024px) {
	#max-contanier.sub-contanier {padding:5em 0;	}
}
@media screen and (max-width: 768px) { 

}




/*------------------------------------
  sub1 - overview
-------------------------------------*/
#max-contanier.overview {position: relative;}
#max-contanier.overview section {}
#max-contanier.overview .visual_img_wrap {width: auto; height: 400px; background: url(../images/sub/overview_img1.png) no-repeat center / cover; display: flex; align-items: center; padding-left: 5%;}
#max-contanier.overview .visual_img_wrap .logo {width: 350px; margin-bottom:2rem;}
#max-contanier.overview .visual_img_wrap .logo img {width: 100%;}
#max-contanier.overview .introduce_wrap {display:flex; margin-top:5rem;}
#max-contanier.overview .introduce_wrap .lt_cont {flex-basis:50%;display:flex;flex-direction: column;     justify-content: flex-start;}
#max-contanier.overview .introduce_wrap .lt_cont .title {font-size:2em; line-height: 120%;    margin: 1.5rem 0;}
#max-contanier.overview .introduce_wrap .lt_cont .title > span {font-weight: 900;font-size: 1.5em;}
#max-contanier.overview .introduce_wrap .lt_cont .title > span > em {font-style:normal; color:var(--main-color1);}
#max-contanier.overview .introduce_wrap .rt_cont {flex-basis:50%;}
#max-contanier.overview .introduce_wrap .rt_cont > p {margin:1.5rem 0; line-height:200%; word-break: keep-all;}
#max-contanier.overview .introduce_wrap .rt_cont > p > strong {font-size:1.2em;font-weight: 600;}
#max-contanier.overview .overview_wrap {margin-top:10rem;}
#max-contanier.overview .overview_wrap table a {text-decoration:underline;display: flex; align-items: center;}
#max-contanier.overview .overview_wrap table a > em {margin-left:1rem; width: 30px; height: 30px; position: relative; border-radius:100%; background:var(--main-color1);color:#fff;	}
#max-contanier.overview .overview_wrap table a > em > i{position: absolute; left:50%; top:50%; transform:translate(-50%, -50%);	}

@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {	
	#max-contanier.overview .introduce_wrap .lt_cont .title {font-size: 1.5em; margin:0;}
	#max-contanier.overview .introduce_wrap .rt_cont > p {line-height: 180%;}

}
@media screen and (max-width: 768px) { 
	#max-contanier.overview .visual_img_wrap .logo {width: 250px;}
	#max-contanier.overview .visual_img_wrap {height: 200px;}
	#max-contanier.overview .introduce_wrap {flex-direction: column;}
	#max-contanier.overview .introduce_wrap .rt_cont {margin-top:3rem;}

	#max-contanier.overview .table_ty1 {width: 100%;display: flex;}
	#max-contanier.overview .table_ty1 tbody {width: 100%;}
	#max-contanier.overview .table_ty1 tbody tr {display: flex; flex-wrap: wrap;  width: 100%;}
	#max-contanier.overview .table_ty1 tbody tr th {display: block; width: 30%;}
	#max-contanier.overview .table_ty1 tbody tr td {display: block; width: 70%;}
	#max-contanier.overview .overview_wrap {margin-top:4rem}

}
@media screen and (max-width: 568px) { 
	#max-contanier.overview .visual_img_wrap .logo {width: 150px;}
	#max-contanier.overview .visual_img_wrap {height: 150px;}
	#max-contanier.overview .introduce_wrap .rt_cont > p > strong br {display: none;}	
}


/*------------------------------------
  sub1 - greeting
-------------------------------------*/
#max-contanier.greeting {}
#max-contanier.greeting::before {content:''; width:680px; height:600px; background:url(../images/common/sub_bg_point.png) no-repeat center;position: absolute; right:0; top:0; z-index:-2;}
#max-contanier.greeting section {}
#max-contanier.greeting section.greeting_title {margin:10rem 0 8rem}
#max-contanier.greeting section.greeting_title h2 {font-size: 2em; font-weight: 500; line-height: 140%; letter-spacing:-0.1rem;word-break: keep-all;	}

#max-contanier.greeting section.greeting_content {position: relative; }
#max-contanier.greeting section.greeting_content::before {content:''; width: 100%;; height:85%; position: absolute; left:0 ; bottom:0; background:var(--sub-color2);z-index:-1;	}
#max-contanier.greeting section.greeting_content .greeting_img {position: absolute; top:0; left:0; width: 45%; height:85%;background:url(../images/sub/greeting_img1.png) no-repeat center / cover; box-shadow: 3px 17px 20px 9px rgb(0 0 0 / 19%);}
#max-contanier.greeting section.greeting_content .inner_c {display:flex;justify-content: flex-end;}
#max-contanier.greeting section.greeting_content .content_box {flex-basis:50%; }
#max-contanier.greeting section.greeting_content .content_box .logo {width: 300px;}
#max-contanier.greeting section.greeting_content .content_box .logo img {width: 100%;}
#max-contanier.greeting section.greeting_content .content_box .text {margin:8rem 0;}
#max-contanier.greeting section.greeting_content .content_box .text p {margin:2.5rem 0; line-height: 150%;}
#max-contanier.greeting section.greeting_content .content_box .text .sign {text-align:right;margin-top:4rem; font-size: 1.2em;font-weight: 500; }

 
@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {
	#max-contanier.greeting section.greeting_title {margin:4rem 0;}
	#max-contanier.greeting section.greeting_title h2 {font-size: 1.8em	; font-weight: 400; }
	#max-contanier.greeting section.greeting_content .content_box .logo {width: 200px;}
	#max-contanier.greeting section.greeting_content .content_box .text {margin:5rem 0;}

}
@media screen and (max-width: 768px) { 
	#max-contanier.greeting section.greeting_title h2 {text-align: center;}
	#max-contanier.greeting section.greeting_content .greeting_img {width: 40%; height: 94%;}
	#max-contanier.greeting section.greeting_content .content_box {flex-basis: 55%;}
}
@media screen and (max-width: 568px) { 
	#max-contanier.greeting section.greeting_title h2 {font-size: 1.4em; }
	#max-contanier.greeting section.greeting_title h2 br {display: none;	}
	#max-contanier.greeting section.greeting_content .greeting_img {width: 90%; height: 260px; position: relative; }
	#max-contanier.greeting section.greeting_content .content_box .logo {width: 180px;}
	#max-contanier.greeting section.greeting_content .content_box .text {margin:3rem 0 5rem; }

	#max-contanier.greeting section.greeting_content .content_box {flex-basis: 100%; margin-top: 5rem;}
}


/*------------------------------------
  sub1 - history
-------------------------------------*/
#max-contanier.history {}
#max-contanier.history section {margin-bottom:10rem;}
#max-contanier.history section:last-child {margin:0;}
#max-contanier.history .his_visual {width: 100%; height:400px; background-position:center; background-repeat:no-repeat; background-size:cover;}
#max-contanier.history .his_visual.his_bg1 {background-image:url(../images/sub/history_img1.png);}
#max-contanier.history .his_visual.his_bg2 {background-image:url(../images/sub/history_img2.png);}
#max-contanier.history .his_visual.his_bg3 {background-image:url(../images/sub/history_img3.png);}
#max-contanier.history .his_content {display:flex;justify-content: space-evenly;}
#max-contanier.history .his_content .title_box {background:var(--main-color1); width: 250px; height: 140px; color:#fff; padding:6rem;border-radius:0 5rem 0 0; margin-top:-5rem;}
#max-contanier.history .his_content .title_box > h2 {font-size: 2em;}
#max-contanier.history .his_content .title_box > h2 > span {display: block;font-size: .5em; opacity:.5;}
#max-contanier.history .his_content .title_box > p {margin-top:3rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.3);}
#max-contanier.history .his_content .history_box {width: 50%; margin-top: 6rem;}
#max-contanier.history .his_content .history_box .his_pt {display:flex;}
#max-contanier.history .his_content .history_box .his_pt .year {font-size: 1.5em;position: relative;width: 20%;font-weight: 700;line-height: 100%;padding-top: 5px;}
#max-contanier.history .his_content .history_box .his_pt .year::after {content:''; width: 18px; height: 18px; background:url(../images/common/bullet.png) no-repeat center;  position: absolute; right:-9px; top:10px;z-index:2;}
#max-contanier.history .his_content .history_box .his_pt ul.month-list {position: relative;padding-left:5rem;width: 80%;}
#max-contanier.history .his_content .history_box .his_pt ul.month-list::before {content:''; width:1px; height: 100%; background: #eee; position: absolute; left:0; top:0;}
#max-contanier.history .his_content .history_box .his_pt ul.month-list li {display:flex;margin:.5rem 0;}
#max-contanier.history .his_content .history_box .his_pt ul.month-list > li:last-child {padding-bottom:5rem;}
#max-contanier.history .his_content .history_box .his_pt ul.month-list li p.month {font-weight: 600;  margin:.5rem 1.5rem .5rem 0;  line-height: 150%;}
#max-contanier.history .his_content .history_box .his_pt ul.month-list li > ul  {position: relative; }
#max-contanier.history .his_content .history_box .his_pt ul.month-list li > ul > li {padding-left:1rem; position: relative;    word-break: keep-all;}
#max-contanier.history .his_content .history_box .his_pt ul.month-list li > ul > li::before {content:''; width: 3px; height: 3px; background: var(--main-color1);  position: absolute; left:0; top:12px;}

#max-contanier.history section.reverse .his_content  {flex-direction: row-reverse;}
#max-contanier.history section.reverse .his_content .title_box{background:var(--main-color3);}

@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {
	#max-contanier.history .his_content .title_box {padding:3rem;}
}
@media screen and (max-width: 768px) { 
	#max-contanier.history section {margin-bottom:0;}
	#max-contanier.history .his_content {flex-direction: column;}
	#max-contanier.history .his_content .history_box {width: 100%;}
	#max-contanier.history .his_visual {height: 200px;}

	#max-contanier.history .his_content .title_box {margin-top:0; width: auto; height: auto;border-radius: 0;}
	#max-contanier.history .his_content .title_box > p {margin-top:1rem; padding-top:1rem;}
	#max-contanier.history .his_content .history_box {margin-top:0;}
	#max-contanier.history .his_content .history_box .his_pt:first-child .year {padding-top:5rem;}
	#max-contanier.history .his_content .history_box .his_pt:first-child .year::after {top:5.2rem;}
	#max-contanier.history .his_content .history_box .his_pt .year {padding-top:1.5rem;}
	#max-contanier.history .his_content .history_box .his_pt .year::after {top:1.5rem;}
	#max-contanier.history .his_content .history_box .his_pt:first-child ul.month-list {padding-top:4rem;}	
	#max-contanier.history section.reverse .his_content {display: block;}
}
@media screen and (max-width: 568px) { 
	#max-contanier.history .his_content .history_box .his_pt {flex-direction: column;}
	#max-contanier.history .his_content .history_box .his_pt .year {padding-left:3rem;    padding-top:2rem; position: absolute;}
	#max-contanier.history .his_content .history_box .his_pt .year::after {left:-8px;top: 2rem;}
	#max-contanier.history .his_content .history_box .his_pt:first-child ul.month-list {padding-top:5rem;}
	#max-contanier.history .his_content .history_box .his_pt ul.month-list {padding:3rem;padding-top:5rem; padding-right: 0; width: auto;}
	#max-contanier.history .his_content .history_box .his_pt ul.month-list > li:last-child {padding-bottom: 0;}
}


/*------------------------------------
  sub1 - vision
-------------------------------------*/
#max-contanier.vision {position: relative;}
#max-contanier.vision section {margin:5rem 0; display:flex; align-items: center;}
#max-contanier.vision .title {position: relative;flex-basis:30%;font-size: 1.5em;font-weight: 600;}
#max-contanier.vision .title::after {content:''; width:20%; height:2px; background:var(--main-color2);position: absolute; right:15%; top:50%; }
#max-contanier.vision .content {flex-basis:70%;}
#max-contanier.vision .content ul {display:flex;    justify-content: space-between;}
#max-contanier.vision .content ul li {flex-basis:22%;}
#max-contanier.vision .st_1 {position: relative;text-align: center;width: 100%;border:2px solid #ddd;padding:4rem 0;border-radius:10rem;}
#max-contanier.vision .st_1 > p {font-size: 2em;font-weight: 600;}
#max-contanier.vision .st_1 > span {font-size: 1.2em;}
#max-contanier.vision .st_1 > span > em {font-weight: 600;}
#max-contanier.vision .st_2 {position: relative;}
#max-contanier.vision .st_2 li {position: relative; border-radius:100%; border:2px solid #ddd;padding-bottom: 22%;}
#max-contanier.vision .st_2 li .text {position: absolute; font-size: 2rem;width: 100%; left:50%; top:50%;text-align: center;transform:translate(-50%, -50%);}
#max-contanier.vision .st_2 li .text > span {margin-bottom:1rem;display: block;}
#max-contanier.vision .st_2 li .text > p {font-size: 1.5em;font-weight: bold;}
#max-contanier.vision .st_3 {position: relative;}
#max-contanier.vision .st_3 li {position: relative; border-radius:2rem; background:var(--main-color1); color:#fff; min-height:22rem; display:flex; align-items: center;}
#max-contanier.vision .st_3 li .text { width: 100%; text-align:center; padding:2rem;}
#max-contanier.vision .st_3 li .text > p {font-weight: bold;margin-bottom:1rem;font-size: 1.3em; }
#max-contanier.vision .st_3 li .text > span {}
#max-contanier.vision .st_4 {position: relative;}
#max-contanier.vision .st_4 li {position: relative; border-radius:2rem;  border:1px solid var(--main-color1); display:flex; justify-content: center; align-items: center; min-height:22rem;}
#max-contanier.vision .st_4 li .text {text-align:center; padding:2rem; word-break:keep-all;}
#max-contanier.vision .st_4 li .text > svg {width: 40px; height: 40px; color:var(--main-color1);}
#max-contanier.vision .st_4 li .text > p {margin-top:1rem;}


@media screen and (max-width: 1400px) {
	#max-contanier.vision section {align-items: stretch; flex-direction: column;}
	#max-contanier.vision .title {margin-bottom:2rem;}
	#max-contanier.vision .title::after {display: none;}
}
@media screen and (max-width: 1024px) {
	#max-contanier.vision .title br	{display: none;	}
	#max-contanier.vision .st_4 li .text > p br {display:none;}
}
@media screen and (max-width: 768px) { 
	#max-contanier.vision .st_2 li .text > span {margin: 0;}
	#max-contanier.vision .st_3 li .text br {display:none;}
}
@media screen and (max-width: 568px) { 
	#max-contanier.vision .title::after {display: block; width: 15px; height: 3px; top: -15px;  left: 0;  transform: rotate( 135deg );}
	#max-contanier.vision .st_1 {padding:2rem 0;border: 0; background-color: var(--main-color1); color: #fff; border-radius: 1rem;}
	#max-contanier.vision .st_1 > p {font-size: 1.5em;}
	#max-contanier.vision .content {flex-basis:100%;}
	#max-contanier.vision .content ul {flex-wrap: wrap;justify-content: center; }
	#max-contanier.vision .content ul li {flex: 47%; margin: 1%; min-height: auto; width: 47%;} 
	#max-contanier.vision .st_3 li .text,
	#max-contanier.vision .st_4 li .text {padding:25% 8%;}
	#max-contanier.vision .st_4 li .text > svg {width:3.2rem; height:3.2rem;}
}


/*------------------------------------
  sub1 - certification
-------------------------------------*/
#max-contanier.certification{position:relative;}
#max-contanier.certification ul.certifi_wrap{display:flex;flex-wrap:wrap;}
#max-contanier.certification ul.certifi_wrap li.certifi_area{margin-bottom:5rem;flex-basis:18%;text-align:center;padding:0 1%;}
#max-contanier.certification ul.certifi_wrap li.certifi_area > img{width:100%;}
#max-contanier.certification ul.certifi_wrap li.certifi_area > p{margin-top:1rem;}

@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {
	#max-contanier.certification ul.certifi_wrap li.certifi_area {flex-basis: 23%;}
}
@media screen and (max-width: 768px) { 
	#max-contanier.certification ul.certifi_wrap li.certifi_area {flex-basis: 31%;}
}
@media screen and (max-width: 568px) { 
	#max-contanier.certification ul.certifi_wrap li.certifi_area {flex-basis: 48%;}
}


/*------------------------------------
  sub1 - organization
-------------------------------------*/
#max-contanier.organization {position: relative;}
/* #max-contanier.organization .organ_wrap{padding-bottom: 5rem; width: 100%; border-bottom:1px solid #ddd;} */
#max-contanier.organization .organ_wrap .dept1_area {position: relative;	padding-bottom: 15rem;}
#max-contanier.organization .organ_wrap .dept1_area::before {content:''; width: 1px; height: 15rem; background: #ccc; position: absolute;left:50%; bottom:0;}
#max-contanier.organization .organ_wrap .dept1_area .ceo_box {display:flex; border:2px solid #0000fd; width: 50%;margin: 0 auto;  align-items: center; justify-content: center; padding:3rem 0; border-radius:0 4rem 0 0;	}
#max-contanier.organization .organ_wrap .dept1_area .ceo_box .logo {width: 180px;}
#max-contanier.organization .organ_wrap .dept1_area .ceo_box .logo img {width: 100%;}
#max-contanier.organization .organ_wrap .dept1_area .ceo_box .title {font-size: 1.5em; /*margin-left:2rem;*/ }
#max-contanier.organization .organ_wrap .dept1_area .ceo_box .title > span{font-weight: 600;}
#max-contanier.organization .organ_wrap .dept1_area .lab_box {position: absolute;left:50%;border:2px solid #0000fd;padding:2rem 0;width: 200px;text-align: center;margin-left: 12rem;bottom: 15%;border-radius:0 2rem 0 0;}
#max-contanier.organization .organ_wrap .dept1_area .lab_box::before {content:''; width: 12rem; height: 1px; background: #ccc;position: absolute;left: -12rem; bottom:50%;z-index:1;}
#max-contanier.organization .organ_wrap .dept2_area {position: relative;width: 100%;}
#max-contanier.organization .organ_wrap .dept2_area .dep_box {display:flex;justify-content: space-evenly;padding-top:5rem}
#max-contanier.organization .organ_wrap .dept2_area .dep_box::before{content:''; width: 75%; height: 1px;background: #ccc;position: absolute; top:0; left:50%;transform:translateX(-50%);}
#max-contanier.organization .organ_wrap .dept2_area .dep_box > li {position: relative;width: 100%;text-align: center;}
#max-contanier.organization .organ_wrap .dept2_area .dep_box > li::before {content:'';width: 1px; height: 5rem; background: #ccc; position: absolute; top:-5rem;left:50%;}
#max-contanier.organization .organ_wrap .dept2_area .dep_box .title {margin: 1rem; padding: 2rem 0; margin-top: 0; background: #0000fd; color: #fff; border-radius: 0 2rem 0 0;}
#max-contanier.organization .organ_wrap .dept2_area .dep_box p {background: #eee; margin: 1rem; padding: 2rem 0;}

@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {
	#max-contanier.organization .organ_wrap .dept1_area .ceo_box{ width: 80%;}

	#max-contanier.organization .lineup_wrap .lineup_area ul {flex-wrap: wrap;	}
	#max-contanier.organization .lineup_wrap .lineup_area ul li {flex-basis:31%; margin:1%;}
}
@media screen and (max-width: 768px) { 
	#max-contanier.organization .organ_wrap .dept1_area .lab_box,
	#max-contanier.organization .organ_wrap .dept2_area .dep_box > li{}

	#max-contanier.organization .organ_wrap .dept1_area .ceo_box {flex-direction: column;}
	#max-contanier.organization .organ_wrap .dept1_area .ceo_box .title {margin: 0;}
	#max-contanier.organization .organ_wrap .dept1_area::before {left: 30%;height: 15rem;}
	#max-contanier.organization .organ_wrap .dept1_area .lab_box {width: 40%; left: 38%; margin-left: 20%;}
	#max-contanier.organization .organ_wrap .dept1_area .lab_box::before {width: 70%; left: -70%;}
	#max-contanier.organization .organ_wrap .dept2_area .dep_box .title {margin:1rem 0;font-weight: bold;}
	#max-contanier.organization .organ_wrap .dept2_area .dep_box::before {width: 30%; left:0;transform: none; }
	#max-contanier.organization .organ_wrap .dept2_area .dep_box::after {content:''; width: 1px; height:80.5%; position: absolute; left:0; top:0;background: #ccc;	}
	#max-contanier.organization .organ_wrap .dept2_area .dep_box {flex-direction: column;align-items: flex-end;}
	#max-contanier.organization .organ_wrap .dept2_area .dep_box > li {width: 90%;  padding-left: 10%;}
	#max-contanier.organization .organ_wrap .dept2_area .dep_box > li::before {width: 10%; height: 1px; top:4rem; left:0;}
	#max-contanier.organization .organ_wrap .dept2_area .dep_box p {margin:1rem 0;}


}
@media screen and (max-width: 568px) { 
	#max-contanier.organization .organ_wrap .dept1_area {padding:2rem 0; padding-bottom:10rem;}
	#max-contanier.organization .organ_wrap .dept1_area::before { height: 10rem;}
	#max-contanier.organization .organ_wrap .dept1_area .ceo_box {width: 100%; padding:1.5rem 0;}
	#max-contanier.organization .organ_wrap .dept1_area .ceo_box .logo {width: 130px;}
	#max-contanier.organization .organ_wrap .dept1_area .ceo_box .title {font-size: 1.5em; margin: 0;}
	#max-contanier.organization .organ_wrap .dept1_area .lab_box {bottom:0;}
	#max-contanier.organization .organ_wrap .dept2_area .dep_box {padding-top:2rem;}
		#max-contanier.organization .organ_wrap .dept2_area .dep_box::after {height:80%;}

}


/*------------------------------------
  sub1 - location
-------------------------------------*/
#max-contanier.location section{display:inline-block;margin:5rem 0;}
#max-contanier.location section.address_wrap{display:flex;justify-content:space-between;}
#max-contanier.location section.address_wrap .lt_address{width:45%;display:flex;flex-direction:column;justify-content:space-between;}
#max-contanier.location section.address_wrap .lt_address .title{font-size: 2em;line-height:110%;font-weight:500;}
#max-contanier.location section.address_wrap .rt_view{width:45%;position:relative;}
#max-contanier.location section.address_wrap .rt_view img{width:100%;display:block;}
#max-contanier.location section.address_wrap .rt_view > p{position:absolute;right:0;bottom:0;display:flex;color:#fff;align-items:center;background:rgba(0,0,0,0.5);padding:1rem;}
#max-contanier.location section.map_wrap{position:relative;margin-bottom:10rem;}

#max-contanier.location section.map_wrap .map_location{position:absolute;z-index:9;width: 90%;bottom:-5%;left:2%;background:#fff;box-shadow: 7px 12px 17px 0 rgb(0 0 0 / 19%);display:flex;align-items:center;height:15%;}
#max-contanier.location section.map_wrap .map_location .title{background:var(--main-color1);width:20%;display:flex;align-items:center;justify-content:center;height:100%;align-content:space-around;flex-wrap:wrap;}
#max-contanier.location section.map_wrap .map_location .title > span{color:#fff;font-weight:500;}
#max-contanier.location section.map_wrap .map_location .cont{width: 80%;height:100%;display:flex;align-items:center;justify-content:center;}
#max-contanier.location,#max-contanier.location section.map_wrap .map{position:relative;z-index:1;}
#max-contanier.location section.address_wrap .rt_view > p > i,#max-contanier.location section.map_wrap .map_location .title > p{margin-right:1rem;}

@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {
	#max-contanier.location section.address_wrap {flex-direction: column-reverse;margin-top: 0;}
	#max-contanier.location section.address_wrap .rt_view {width: 100%;}
	#max-contanier.location section.address_wrap .lt_address {width: 100%; margin-top: 4rem;}
	#max-contanier.location section.address_wrap .lt_address .title{margin-bottom:1rem;}

	#max-contanier.location section.map_wrap .map_location {width: 100%;}
}
@media screen and (max-width: 768px) { 
	#max-contanier.location section.address_wrap {margin:0;}
	#max-contanier.location section.address_wrap .lt_address .title {  font-size: 1.5em;}

	#max-contanier.location section.map_wrap {margin-bottom:0;}
	#max-contanier.location section.map_wrap .map .wrap_map {height:300px !important;}
	#max-contanier.location section.map_wrap .map_location {height: auto; flex-direction: column; position: relative; left:0; bottom:0;}
	#max-contanier.location section.map_wrap .map_location .title {width: 100%; padding:1rem 0;}
	#max-contanier.location section.map_wrap .map_location .cont {    width: auto; padding: 1rem; word-break: keep-all;}
}
@media screen and (max-width: 568px) { 
	#max-contanier.location section.map_wrap .map .wrap_map {height:300px !important;}
}



/*------------------------------------
  sub2 - product
-------------------------------------*/
#max-contanier.product{position:relative;}
#max-contanier.product .product_box{    position: relative; width:100%;height: 450px;background-color:#fff;display:flex;align-items:center;margin:5rem 0;    border-top: 3px solid #000;border-bottom: 1px solid #eee; }
#max-contanier.product .product_box .pro_text_wrap{width:55%;padding-left:5%;height:60%;display:flex;flex-direction:column;justify-content:space-between;}
#max-contanier.product .product_box .pro_text_wrap .text_box{height:60%;display:flex;flex-direction:column;justify-content: flex-start;  height: 100%;}
#max-contanier.product .product_box .pro_text_wrap .text_box span{margin-bottom:2rem;display:block;font-weight: 600;}
#max-contanier.product .product_box .pro_text_wrap .text_box h2{font-size: 2.5em;font-weight:600;letter-spacing:-.2rem;margin-bottom:1rem;}
#max-contanier.product .product_box .pro_text_wrap a.more-view{cursor:pointer;background:var(--main-color1);color:var(--sub-color1); display:flex;align-items:center;width:170px;justify-content:center;border-radius:5rem;padding:2rem 0;}
#max-contanier.product .product_box .pro_text_wrap a.more-view > i{}
#max-contanier.product .product_box .pro_text_wrap a.more-view > span{margin-left:2rem;}
#max-contanier.product .product_box .pro_image_wrap{width:45%;height:100%;background-repeat:no-repeat;background-size:100%;background-position:right 2rem;}
#max-contanier.product #pro_detail{display:none;position:fixed;z-index:15;top:0;left:0;width:100%;height:100%;}
#max-contanier.product #pro_detail .prod_bg{background:rgba(0,0,0,.6);width:100%;height:100%;display:block;}
#max-contanier.product #pro_detail .prod_content{position:absolute;border-radius:0 4rem 0 4rem;overflow:hidden;display:flex;top:50%;left:50%;transform:translate(-50%,-50%);width:50%;height:50%;background:#fff;}
#max-contanier.product #pro_detail .prod_content .close{position:absolute;cursor:pointer;right:2rem;bottom:2rem;border-radius:4rem;background:var(--main-color2);color:#fff;display:flex;align-items:center;padding:1.5rem 2rem;}
#max-contanier.product #pro_detail .prod_content .close > i{margin-right:1rem;}
#max-contanier.product #pro_detail .prod_content .close > span{font-weight:500;}
#max-contanier.product #pro_detail .prod_content .title{width:30%;position:relative;background-color:#000;}
#max-contanier.product #pro_detail .prod_content .title::before{content:'';position:absolute;right:0;bottom:0;background:url(../images/common/bg_shap.png) no-repeat right 90%;width:100%;height:100%;}
#max-contanier.product #pro_detail .prod_content .inner_box{margin:5rem;}
#max-contanier.product #pro_detail .prod_content .title span{font-size: .8em;color:#fff;}
#max-contanier.product #pro_detail .prod_content .title h3{font-size: 1.5em;font-weight:500;color:#fff;}
#max-contanier.product #pro_detail .prod_content .content{width:70%;}
#max-contanier.product #pro_detail .prod_content .content ul{margin-top:2rem;line-height: 180%;font-size: .9em;}
#max-contanier.product .product_box .pro_text_wrap .text_box p,#max-contanier.product #pro_detail .prod_content .content p{font-size: 1.2em;font-weight:500;}
@media screen and (max-width: 1400px) {
	#max-contanier.product .product_box .pro_text_wrap {position: absolute;}
	#max-contanier.product .product_box .pro_image_wrap {width: 100%;background-size:auto;}
}
@media screen and (max-width: 1024px) {
	#max-contanier.product .inner_c {display:flex;flex-wrap: wrap; justify-content: space-between;}
	#max-contanier.product .product_box {height:550px}
	#max-contanier.product .product_box {flex-direction: column;  margin: 0;   width: 48%;}
	#max-contanier.product .product_box .pro_text_wrap {position: relative;padding: 10%; height: auto;   width: 80%; flex-direction: column;}
	#max-contanier.product .product_box .pro_text_wrap .text_box h2 {font-size: 2.6rem;}
	#max-contanier.product .product_box .pro_image_wrap {width: 100%; background-size:100%;     background-position: center;}
	#max-contanier.product .product_box .pro_text_wrap .text_box {margin-bottom:3rem;}
	#max-contanier.product .product_box .pro_text_wrap .text_box p, #max-contanier.product #pro_detail .prod_content .content p {font-size: inherit;}
	#max-contanier.product .product_box .pro_text_wrap a.more-view {width:135px; padding:1.2rem 0;}

	#max-contanier.product #pro_detail .prod_content {width: 90%; height:auto;flex-direction: column;}
	#max-contanier.product #pro_detail .prod_content .title {width: 100%;height: auto;}
	#max-contanier.product #pro_detail .prod_content .title h3 {font-size: 1.6em;}
	#max-contanier.product #pro_detail .prod_content .title span {font-size: inherit;	}
	#max-contanier.product #pro_detail .prod_content .content {width: 100%;height: 100%;}
	#max-contanier.product #pro_detail .prod_content .inner_box {margin: 3rem;}

}
@media screen and (max-width: 768px) { 
	#max-contanier.product .product_box {height:470px;margin-bottom: 5rem;}
	#max-contanier.product #pro_detail .prod_content .close {bottom: auto; top: 3rem; z-index: 1;}
	#max-contanier.product .product_box .pro_text_wrap {padding:10% 0; width: 100%; text-align: center;}
	#max-contanier.product .product_box .pro_text_wrap .text_box span {margin-bottom:1rem;}
	#max-contanier.product .product_box .pro_text_wrap .text_box h2 {font-size: 2rem;}
	#max-contanier.product .product_box .pro_text_wrap a.more-view {margin:0 auto;}
}
@media screen and (max-width: 568px) { 
	#max-contanier section .inner_c {flex-direction: column;}
	#max-contanier.product .product_box .pro_image_wrap {background-size:80%}
	#max-contanier.product .product_box {width: 100%;margin: 1rem 0;}
	#max-contanier.product #pro_detail .prod_content .close {bottom: auto; top: 3rem; z-index: 1; width: 20px; height: 20px; padding: 1.5rem;}
	#max-contanier.product #pro_detail .prod_content .close > span {display: none;}
	#max-contanier.product #pro_detail .prod_content .close > i {margin:0;}



}


/*------------------------------------
  sub3 - research (introduce)
-------------------------------------*/
#max-contanier.introduce section{position:relative;display:inline-block;margin-bottom:10rem;}
#max-contanier.introduce .introduce_wrap .title_box{display:flex;}
#max-contanier.introduce .introduce_wrap .title_box .content{width:100%;}
#max-contanier.introduce .introduce_wrap .title_box .content > p{font-size: 1.2em; font-weight:300;margin:1.5rem 0;word-break: keep-all;}
#max-contanier.introduce .introduce_wrap .field_list_box{margin-top:5rem;}
#max-contanier.introduce .introduce_wrap .field_list_box ul{display:flex;justify-content:space-between;}
#max-contanier.introduce .introduce_wrap .field_list_box li{text-align:center;}
#max-contanier.introduce .introduce_wrap .field_list_box li img{border-radius:2rem;display:block;}
#max-contanier.introduce .introduce_wrap .field_list_box li p{margin-top:1rem;}

#max-contanier.introduce .introduce_wrap .title_box .content > p > span,#max-contanier.introduce .slogan_wrap .slogan_area > p > span{font-weight: 600;}


@media screen and (max-width: 1400px) {
	#max-contanier.introduce .introduce_wrap .field_list_box li img {width: 90%; margin: 0 auto;}

}
@media screen and (max-width: 1024px) {
	#max-contanier.introduce .introduce_wrap .title_box .content > p br{display: none;}

}
@media screen and (max-width: 768px) { 
	#max-contanier.introduce section.slogan_wrap {margin-bottom:0;}
	#max-contanier.introduce .introduce_wrap .title_box {width: 100%; flex-direction: column;}
	#max-contanier.introduce .introduce_wrap .title_box .title {width: 100%;font-size: 2em;}
	#max-contanier.introduce .introduce_wrap .title_box .content {width: 100%;}
	

	#max-contanier.introduce .introduce_wrap .field_list_box li p,
	#max-contanier.introduce .introduce_wrap .title_box .content > p {font-size: inherit;}
}
@media screen and (max-width: 568px) { 
	#max-contanier.introduce .introduce_wrap .field_list_box ul {flex-direction: column;}
	#max-contanier.introduce .introduce_wrap .field_list_box li {margin-bottom: 3rem;}
}


/*------------------------------------
  sub3 - research (field)
-------------------------------------*/
#max-contanier.field section{margin-bottom:10rem;}
#max-contanier.field .field_wrap{display:flex;justify-content:space-between;align-items:center;}
#max-contanier.field .field_wrap .field_area .title{margin-bottom:4rem;font-size: 2.5em;line-height:120%;}
#max-contanier.field .field_wrap .field_area .title > p{font-weight:900;font-size:1.2em;}
#max-contanier.field .field_wrap .field_area .title > p > span{color:var(--main-color1);}
#max-contanier.field .field_wrap .field_area ul{position:relative;}
#max-contanier.field .field_wrap .field_area ul li{position:relative;padding-left:1.5rem;margin:1rem 0;}
#max-contanier.field .field_wrap .field_area ul li::before{content:'';width:4px;height:4px;background:var(--main-color1);position:absolute;left:0;top:1rem;}
#max-contanier.field .field_wrap .image_area img{border-radius:2rem;display:block;}
#max-contanier.field .research_wrap{position:relative;display:inline-block;}
#max-contanier.field .research_wrap::before{content:'ARETECH Research';position:absolute;left:50%;top:0;width:100%;text-align:center;font-size: 5em;transform:translateX(-50%);font-weight:900;opacity:.1;}
#max-contanier.field .research_wrap .research_area{margin-top:20rem;width: 80%;height:506px;margin: 20rem auto 0;position:relative;background:url(../images/sub/lab_img6.png) no-repeat center;}
#max-contanier.field .research_wrap .research_area .research_box{position:absolute;width: 25%;}
#max-contanier.field .research_wrap .research_area .research_box > svg{width:40px;height:40px;color:var(--main-color1);margin-bottom:1rem;}
#max-contanier.field .research_wrap .research_area .research_box > p{font-size: 1.5em;font-weight:600;}
#max-contanier.field .research_wrap .research_area .research_box > span{margin-top: 1rem;display:block;font-size: .9em;}
#max-contanier.field .research_wrap .research_area .stg01{top:0;left: 5%;}
#max-contanier.field .research_wrap .research_area .stg02{right:0;top:0;}
#max-contanier.field .research_wrap .research_area .stg03{left: 5%;bottom: 0;}
#max-contanier.field .research_wrap .research_area .stg04{right:0;bottom:0;}

@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {
	#max-contanier.field .field_wrap {width: 100%;}
	#max-contanier.field .field_wrap .field_area {width: 50%;}
	#max-contanier.field .field_wrap .image_area {width: 50%;}
	#max-contanier.field .field_wrap .image_area img {width: 100%;}
	#max-contanier.field .research_wrap .research_area {width: 100%;}

	#max-contanier.field .research_wrap .research_area .stg01,
	#max-contanier.field .research_wrap .research_area .stg03  {left: 0;}
}
@media screen and (max-width: 768px) { 
	#max-contanier.field section {margin-bottom:5rem;}
	#max-contanier.field .field_wrap {flex-direction: column;}
	#max-contanier.field .field_wrap .field_area {width: 100%;}
	#max-contanier.field .field_wrap .field_area .title {font-size: 2em;}
		
	#max-contanier.field .field_wrap .image_area {width: 100%;     margin-top: 5rem;}

	#max-contanier.field .research_wrap::before {display: none;}
	#max-contanier.field .research_wrap .research_area {    margin: 0; background: none;  height: auto;     display: flex; flex-wrap: wrap;}
	#max-contanier.field .research_wrap .research_area .research_box 	{position: relative;     top: auto;  left: auto;     width: 50%;  margin: 3rem 0;  text-align: center;} 

}
@media screen and (max-width: 568px) { 

	
}





/*------------------------------------
  siteinfo
-------------------------------------*/ 
#max-contanier.siteinfo {position: relative; padding:0;}
#max-contanier.siteinfo .siteinfo-content {position: relative; font-size: 1.6rem;    padding: 2rem 0;}
#max-contanier.siteinfo .siteinfo-content h2 {font-size:1.5em;	font-weight: 500;margin:4rem 0 1.5rem; color:var(--main-color1);	}
#max-contanier.siteinfo .siteinfo-content h3 {font-size: 1.2em; font-weight: 500;margin:3rem 0 1.5rem;  color:#333;}
#max-contanier.siteinfo .siteinfo-content p {margin:1.5rem 0;font-size:1em; font-weight: 300; line-height: 130%;}
#max-contanier.siteinfo .siteinfo-content ul > li {margin:.5rem 0; line-height:130%;	font-size:1em;	font-weight: 300;}
#max-contanier.siteinfo .siteinfo-content ul > li > ul > li {padding-left:2rem;	font-size:.9em;  color:#777;}

#max-contanier.siteinfo .siteinfo-content .other_caption { margin: 2rem 0; background: #f5f5f5; padding: 2rem;  border-radius: 1rem;}
#max-contanier.siteinfo .siteinfo-content .other_caption strong{display: block;font-size: 1.2em;font-weight: 600;color: var(--main-color1);}
#max-contanier.siteinfo .siteinfo-content .other_caption span {font-size:1em;  margin-top: 1rem; display: block; line-height: 150%;}


@media screen and (max-width: 768px) { 
	#max-contanier.siteinfo .siteinfo-content {font-size: 1.4rem;}
}
@media screen and (max-width: 568px) { 

}





@charset "utf-8";


/*------------------------------------
  Common
------------------------------------*/
@import url(http://fonts.googleapis.com/earlyaccess/notosanssc.css); 


html { font-size:10px; }
body {font-size:1.8rem;}
@media only screen and (max-width: 768px) {
	body {font-size:1.4rem;}
}

body,button{overflow-x:hidden;font-family:Montserrat, BlinkMacSystemFont,'Noto Sans KR','Segoe UI','Noto Sans SC','Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';letter-spacing:-.05rem;color:#222;}
h1,h2,h3,h4,h5,h6 {margin:0; padding:0;}
a{color:#333;    text-decoration: none;}
em {font-style:normal;}
p{margin:0;}
table {
    border-spacing: 0px;
    border-style: none;
    padding: 0px;}
td {
    border-spacing: 0px;
    border-style: none;
    padding: 0px;}
ul,li,ol,{display: block;margin:0;padding:0;}
ul, li{list-style:none;margin:0;padding:0;}
select{
-webkit-appearance: none;  /* 네이티브 외형 감추기 */
  -moz-appearance: none;
  appearance: none;
  background: url(../images/ico_select.png) no-repeat 95% 50%;  
}

/* icon */
	.max-ico {display:block; position:relative; /* overflow:hidden; */}
	.max-ico:before, .max-ico:after {content:''; display:block; position:absolute; box-sizing:border-box;}
	.ico-new {font-size: 15px; right: 8px;}

	.ico-sch {width:32px; height:32px;}
	.ico-sch:before {width:20px; height:20px; border:3px solid currentColor; border-radius:100%; top:4px; left:4px;}
	.ico-sch:after {width:3px; height:10px; background-color:currentColor; transform:rotate(-45deg); top:19px; left:22px;}

	.ico-file {width:32px; height:32px; background:url("../image/board/ico_file.svg") center no-repeat; background-size:20px; font-size:0;}

	.arr-btm-small {width:16px; height:16px;}
	.arr-btm-small:before {width:6px; height:6px; border:2px solid #fff; border-right-width:0; border-top-width:0; transform:rotate(-45deg); bottom:6px; left:5px;}

	.ico-arrow {width:16px; height:16px;}
	.ico-arrow:before {width:8px; height:8px; border:1px solid currentColor; border-right-width:0; border-top-width:0; transform:rotate(-45deg); bottom:7px; left:4px;}

	.ico-more {width:32px; height:32px;}
	.ico-more:before {width:8px; height:8px; border:2px solid currentColor; border-left-width:0; border-top-width:0; transform:rotate(-45deg); top:12px; right:5px;}
	.ico-more:after {width:24px; height:2px; background-color:currentColor; top:15px; left:3px;}

	.ico-menu {width:32px; height:32px;}
	.ico-menu:before {width:30px; height:2px; background:currentColor; top:4px; left:4px; box-shadow:0 10px currentColor, 0 20px currentColor;}

	.ico-stop {width:24px; height:24px;}
	.ico-stop:before, .ico-stop:after {height:16px; width:4px; background:currentColor; top:4px; left:6px;}
	.ico-stop:after {left:14px;}

	.ico-play {width:24px; height:24px;}
	.ico-play:before  {height:22px; width:2px; background-color:currentColor; top:3px; left:12px;}
	.ico-play:after {width:16px; height:16px; border:2px solid currentColor; border-top-width:0; border-left-width:0; transform:rotate(-45deg); top:6px; left:8px;}
	.ico-play:after {left:5px;}

	.ico-plus {width:24px; height:24px;}
	.ico-plus:before, .ico-plus:after {width:20px; height:3px; background:currentColor; top:8px; left:0;}
	.ico-plus:after {width:3px; height:20px; top:0; left:9px;}

	.ico-minus {width:24px; height:24px;}
	.ico-minus:before, .ico-minus:after {width:20px; height:3px; background:currentColor; top:8px; left:0;}

	.ico-close {width:32px; height:32px; font-size:0;}
	.ico-close:before, .i-close:after {width:26px; height:1px; background-color:currentColor; top:15px; left:3px; transform:rotate(-45deg);}
	.ico-close:after {transform:rotate(45deg);}

	.ico-blank {width:24px; height:24px;}
	.ico-blank:before, .i-blank:after {width:12px; height:12px; border:1px solid currentColor; background-color:#fff; top:4px; left:4px;}
	.ico-blank:after {top:8px; left:8px;}

	.ico-mouse {width:48px; height:48px;}
	.ico-mouse:before {width:26px; height:40px; border:2px solid currentColor; border-radius:50px; top:4px; left:11px;}
	.ico-mouse:after {width:4px; height:8px; background-color:currentColor; border-radius:50px; top:16px; left:22px;}
	
	.ico-arr-prev {width:24px; height:24px;}
	.ico-arr-prev:before {width:12px; height:12px; border:1px solid currentColor; border-bottom-width:0; border-right-width:0; transform:rotate(-45deg); top:6px; left:8px;}
	.ico-arr-next {width:24px; height:24px;}
	.ico-arr-next:before {width:12px; height:12px; border:1px solid currentColor; border-top-width:0; border-left-width:0; transform:rotate(-45deg); top:6px; left:8px;}

	.ico-close {width:48px; height:48px;}
	.ico-close:before, .ico-close:after {width:40px; height:2px; background:currentColor; top:23px; left:4px; transform:rotate(-45deg);}
	.ico-close:after {transform:rotate(45deg);}

	.ico-close.middle25 {width:25px; height:25px;}
	.ico-close.middle25:before, .ico-close.middle25:after {width:25px; height:2px; top:15px; left:8px;}

	.ico-close.small16 {width:16px; height:16px;}
	.ico-close.small16:before, .ico-close.small16:after {width:10px; height:2px; top:7px; left:3px;}

	.ico-arr-more {width:40px; height:30px;}
	.ico-arr-more:before {width:12px; height:12px; border:2px solid currentColor; border-left-width:0; border-top-width:0; border-bottom-width:0; transform:rotate(-45deg); top:7px; right:6px;}
	.ico-arr-more:after {width:35px; height:2px; background-color:currentColor; top:12px; left:0px;}

	.ico-arrow1{height:15px; width:30px;}
	.ico-arrow1:before{content:''; height:15px; width:15px; display:block; border:2px solid currentColor; border-left-width:0; border-bottom-width:0; border-top-width:0; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg); position:absolute; top:5px; right:2px;}
	.ico-arrow1:after{content:''; height:2px; width:30px; display:block; background:currentColor; position:absolute; top:12px; left:0px;}

	.ico-down{width: 18px; height: 15px; border-bottom: 2px currentColor solid; overflow: hidden;}
	.ico-down:before{content: ''; height: 8px; width: 8px; display: block; border: currentColor solid; border-width: 0 2px 2px 0; position: absolute; bottom: 4px; left: 5px; transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg); }
	.ico-down:after{content: ''; height: 9px; width: 2px; display: block; background:currentColor; position: absolute; top: 0px; left: 8px;}

	.ico-arrow-right-o { box-sizing: border-box; position: relative;  display: inline-block;  width: 22px;  height: 22px; border: 2px solid;  transform: scale(var(--ggs,1));  border-radius: 20px}
	.ico-arrow-right-o::after,.ico-arrow-right-o::before{ content:"";display:block;box-sizing:border-box;position:absolute;right:4px}
	.ico-arrow-right-o::after {	width: 6px;	height: 6px;	border-top: 2px solid;	border-right: 2px solid;	transform: rotate(45deg);	bottom: 6px	}
	.ico-arrow-right-o::before { width: 10px; height: 2px; bottom: 8px; background: currentColor;}



/*------------------------------------
  form
------------------------------------*/


/* form */
	.max_it {display:block; height:auto; padding:15px 0; border-bottom:2px solid #d7d7d7; font:inherit; letter-spacing:-0.04em; -webkit-appearance:none; -webkit-border-radius:0;}
	.max_it:focus {border-bottom:2px solid #1dac6a;}
	input[type="password"] {background:url("../images/common/ico_pass_hide.png") 96% center no-repeat;}

	.max_ckit {position:relative;}
	.max_ckit input[type="checkbox"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
	.max_ckit input[type="checkbox"] + label {display:inline-block; position:relative; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; font-size:0;}
	.max_ckit input[type="checkbox"] + label:before {content:''; display:inline-block; width:32px; height:32px; line-height:32px; margin:-2px 8px 0 0; text-align:center; vertical-align:middle; background:url("../images/common/ico_check.svg") center no-repeat #d7d7d7; background-size:16px; border-radius:100%; box-sizing:border-box;}
	.max_ckit input[type="checkbox"]:checked + label:before {background-color:#181818;}
	.max_ckit.ckit_label input[type="checkbox"] + label {font-size:14px; }

	@media screen and (max-width: 900px) {
		.max_ckit.ckit_label input[type="checkbox"] + label {font-size:14px;}
	}

	.max_radio {display:inline-block; position:relative; line-height:24px;}
	.max_radio input[type="radio"] {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0;}
	.max_radio input[type="radio"] + label {display:inline-block; position:relative; padding-left:30px; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none;}
	.max_radio input[type="radio"] + label:before {content:''; position:absolute; top:0; left:0; width:20px; height:20px; text-align:center; background:#fff; border:1px solid #666; border-radius:100%;}
	.max_radio input[type="radio"]:checked + label:before {background:#fff; border:1px solid #000;}
	.max_radio input[type="radio"]:checked + label:after {content:''; position:absolute; top:6px; left:6px; width:10px; height:10px; background:#000; border-radius:100%;}

	.max_tta {width:100%; height:auto; border-bottom:2px solid #d7d7d7; margin-top:16px; line-height:1.6;}
	.max_tta:focus {border-bottom:2px solid #1dac6a;}

/* selectbox */
	.max_select {width:200px; height:42px; padding-left:10px; background:url("../images/common/ico_select.png") 93% 50% #fff no-repeat; background-size:8px; border:1px solid #d7d7d7; border-radius:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; box-sizing:border-box; letter-spacing:-1px; font-size:inherit;}
	.max_select::-ms-expand {display:none;}
	.max_select::before {}
	.max_select:focus {border-bottom:2px solid #1dac6a;}








/*------------------------------------
  etc
------------------------------------*/
.overflow-auto{overflow:auto!important;}
.overflow-hidden{overflow:hidden!important;}
.text-hidden{text-indent:-1000px;position:absolute;width:0;height:0;font-size:0;}

.mgt10 {margin-top:10px;}   .mgt20 {margin-top:30px;}   .mgt30 {margin-top:30px;}   .mgt40 {margin-top:40px;}   .mgt50 {margin-top:50px;}
.mgt60 {margin-top:60px;}   .mgt70 {margin-top:70px;}   .mgt80 {margin-top:80px;}   .mgt90 {margin-top:90px;}   .mgt100 {margin-top:100px;}
.mgt110 {margin-top:110px;} .mgt120 {margin-top:120px;} .mgt130 {margin-top:130px;} .mgt140 {margin-top:140px;}  .mgt150 {margin-top:150px;}

.mgb10 {margin-bottom:10px;}   .mgb20 {margin-bottom:30px;}   .mgb30 {margin-bottom:30px;}   .mgb40 {margin-bottom:40px;}   .mgb50 {margin-bottom:50px;}
.mgb60 {margin-bottom:60px;}   .mgb70 {margin-bottom:70px;}   .mgb80 {margin-bottom:80px;}   .mgb90 {margin-bottom:90px;}   .mgb100 {margin-bottom:100px;}
.mgb110 {margin-bottom:110px;} .mgb120 {margin-bottom:120px;} .mgb130 {margin-bottom:130px;} .mgb140 {margin-bottom:140px;}  .mgb150 {margin-bottom:150px;}

.w10 {width: 10%;}    .w20 {width: 20%;}    .w30 {width: 30%;}
.w40 {width: 40%;}    .w50 {width: 50%;}    .w60 {width: 60%;}
.w70 {width: 70%;}    .w80 {width: 80%;}    .w90 {width: 90%;}    .w100 {width: 100%;}