html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;

    vertical-align: baseline
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block
}
body {
    line-height: 1
}
ol,
ul {
    list-style: none
}
blockquote,
q {
    quotes: none
}
blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}
body {
    margin: 0
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
    display: block
}
audio,
canvas,
progress,
video {
    display: inline-block
}
audio:not([controls]) {
    display: none;
    height: 0
}
progress {
    vertical-align: baseline
}
template,
[hidden] {
    display: none
}
a {
    background-color: transparent;
    -webkit-text-decoration-skip: objects
}
a:active,
a:hover {
    outline-width: 0
}
abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}
b,
strong {
    font-weight: inherit
}
b,
strong {
    font-weight: 900
}
dfn {
    font-style: italic
}
h1 {
    font-size: 2em;
    margin: 0.67em 0
}
mark {
    background-color: #ff0;
    color: #000
}
small {
    font-size: 80%
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}
sub {
    bottom: -0.25em
}
sup {
    top: -0.5em
}
img {
    border-style: none
}
svg:not(:root) {
    overflow: hidden
}
code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}
figure {
    margin: 1em 40px
}
hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}
button,
input,
select,
textarea {

    margin: 0
}
optgroup {
    font-weight: 900
}
button,
input {
    overflow: visible
}
button,
select {
    text-transform: none
}
button,
html [type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText
}
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em
}
legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}
textarea {
    overflow: auto
}
[type="checkbox"],
[type="radio"] {
    box-sizing: border-box;
    padding: 0
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto
}
[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}
::-webkit-input-placeholder {
    color: inherit;
    opacity: 0.54
}
::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

* {
    -webkit-box-shadow: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@font-face {
    font-family: 'cwTeXYen';
    font-style: normal;
    font-weight: 500;
    src: url(/themes/custom/nestle_nan3/font/cwTeXYen-zhonly.eot);
    src: url(/themes/custom/nestle_nan3/font/cwTeXYen-zhonly.eot?#iefix) format("embedded-opentype"), url(/themes/custom/nestle_nan3/font/cwTeXYen-zhonly.woff2) format("woff2"), url(/themes/custom/nestle_nan3/font/cwTeXYen-zhonly.woff) format("woff"), url(/themes/custom/nestle_nan3/font/cwTeXYen-zhonly.ttf) format("truetype")
}

.wrapper-matt {
    position: absolute;

    width:100%; height: 100%;

}

/*!
 * hms
 * @description Tasty CSS-animated hms
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hms
 * @link https://github.com/jonsuh/hms
 */

.hm {
    display: inline-block;
    cursor: pointer;
    transition-property: opacity, -webkit-filter;
    transition-property: opacity, filter;
    transition-property: opacity, filter, -webkit-filter;
    transition-duration: 0.15s;
    transition-timing-function: linear;

    color: inherit;
    text-transform: none;
    background-color: transparent;
    border: 0;
    margin: 0;
    overflow: visible;
    position: absolute;
    width: 17.34375%;
    height: 100%;
    right: 0px;
    top: 0px;
    margin: 0px 1.5625% 0px 0px
}
.hm:focus {
    outline-color: transparent !important
}
.hm:hover {
    opacity: 0.8
}
.hm-box {
    width: 50%;
    height: 45%;
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}
.hm-inner {
    display: block;
    top: 40%;
    transform-origin: center center;
    height: 15%
}
.hm-inner,
.hm-inner::before,
.hm-inner::after {
    width: 100%;
    background-color: #009bde;
    border-radius: 24px;
    position: absolute;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-duration: 0.15s;
    transition-timing-function: ease
}
.hm-inner::before,
.hm-inner::after {
    content: "";
    display: block;
    height: 100%
}
.hm-inner::before {
    top: -200%
}
.hm-inner::after {
    bottom: -200%
}
.hm-3dx .hm-box {
    -webkit-perspective: 80px;
    perspective: 80px
}
.hm-3dx .hm-inner {
    transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dx .hm-inner::before,
.hm-3dx .hm-inner::after {
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dx.active .hm-inner {
    background-color: transparent;
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg)
}
.hm-3dx.active .hm-inner::before {
    -webkit-transform: translate3d(0, 10px, 0) rotate(45deg);
    transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hm-3dx.active .hm-inner::after {
    -webkit-transform: translate3d(0, -10px, 0) rotate(-45deg);
    transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hm-3dx-r .hm-box {
    -webkit-perspective: 80px;
    perspective: 80px
}
.hm-3dx-r .hm-inner {
    transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dx-r .hm-inner::before,
.hm-3dx-r .hm-inner::after {
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dx-r.active .hm-inner {
    background-color: transparent;
    -webkit-transform: rotateY(-180deg);
    transform: rotateY(-180deg)
}
.hm-3dx-r.active .hm-inner::before {
    -webkit-transform: translate3d(0, 10px, 0) rotate(45deg);
    transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hm-3dx-r.active .hm-inner::after {
    -webkit-transform: translate3d(0, -10px, 0) rotate(-45deg);
    transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hm-3dy .hm-box {
    -webkit-perspective: 80px;
    perspective: 80px
}
.hm-3dy .hm-inner {
    transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dy .hm-inner::before,
.hm-3dy .hm-inner::after {
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dy.active .hm-inner {
    background-color: transparent;
    -webkit-transform: rotateX(-180deg);
    transform: rotateX(-180deg)
}
.hm-3dy.active .hm-inner::before {
    -webkit-transform: translate3d(0, 10px, 0) rotate(45deg);
    transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hm-3dy.active .hm-inner::after {
    -webkit-transform: translate3d(0, -10px, 0) rotate(-45deg);
    transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hm-3dy-r .hm-box {
    -webkit-perspective: 80px;
    perspective: 80px
}
.hm-3dy-r .hm-inner {
    transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dy-r .hm-inner::before,
.hm-3dy-r .hm-inner::after {
    transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.hm-3dy-r.active .hm-inner {
    background-color: transparent;
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg)
}
.hm-3dy-r.active .hm-inner::before {
    -webkit-transform: translate3d(0, 10px, 0) rotate(45deg);
    transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hm-3dy-r.active .hm-inner::after {
    -webkit-transform: translate3d(0, -10px, 0) rotate(-45deg);
    transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hm-arrow.active .hm-inner::before {
    -webkit-transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);
    transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1)
}
.hm-arrow.active .hm-inner::after {
    -webkit-transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);
    transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1)
}
.hm-arrow-r.active .hm-inner::before {
    -webkit-transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1);
    transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1)
}
.hm-arrow-r.active .hm-inner::after {
    -webkit-transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1);
    transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1)
}
.hm-arrowalt .hm-inner::before {
    transition: top 0.1s 0.15s ease, -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: top 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: top 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1)
}
.hm-arrowalt .hm-inner::after {
    transition: bottom 0.1s 0.15s ease, -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: bottom 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: bottom 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1)
}
.hm-arrowalt.active .hm-inner::before {
    top: 0;
    -webkit-transform: translate3d(-8px, -10px, 0) rotate(-45deg) scale(0.7, 1);
    transform: translate3d(-8px, -10px, 0) rotate(-45deg) scale(0.7, 1);
    transition: top 0.1s ease, -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: top 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: top 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
}
.hm-arrowalt.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: translate3d(-8px, 10px, 0) rotate(45deg) scale(0.7, 1);
    transform: translate3d(-8px, 10px, 0) rotate(45deg) scale(0.7, 1);
    transition: bottom 0.1s ease, -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: bottom 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: bottom 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
}
.hm-arrowalt-r .hm-inner::before {
    transition: top 0.1s 0.15s ease, -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: top 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: top 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1)
}
.hm-arrowalt-r .hm-inner::after {
    transition: bottom 0.1s 0.15s ease, -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: bottom 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: bottom 0.1s 0.15s ease, transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.15s cubic-bezier(0.165, 0.84, 0.44, 1)
}
.hm-arrowalt-r.active .hm-inner::before {
    top: 0;
    -webkit-transform: translate3d(8px, -10px, 0) rotate(45deg) scale(0.7, 1);
    transform: translate3d(8px, -10px, 0) rotate(45deg) scale(0.7, 1);
    transition: top 0.1s ease, -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: top 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: top 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
}
.hm-arrowalt-r.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: translate3d(8px, 10px, 0) rotate(-45deg) scale(0.7, 1);
    transform: translate3d(8px, 10px, 0) rotate(-45deg) scale(0.7, 1);
    transition: bottom 0.1s ease, -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: bottom 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    transition: bottom 0.1s ease, transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22), -webkit-transform 0.15s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
}
.hm-boring .hm-inner,
.hm-boring .hm-inner::before,
.hm-boring .hm-inner::after {
    transition-property: none
}
.hm-boring.active .hm-inner {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}
.hm-boring.active .hm-inner::before {
    top: 0;
    opacity: 0
}
.hm-boring.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}
.hm-collapse .hm-inner {
    top: auto;
    bottom: 0;
    transition-duration: 0.15s;
    transition-delay: 0.15s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-collapse .hm-inner::after {
    top: -20px;
    transition: top 0.3s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear
}
.hm-collapse .hm-inner::before {
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-collapse.active .hm-inner {
    -webkit-transform: translate3d(0, -10px, 0) rotate(-45deg);
    transform: translate3d(0, -10px, 0) rotate(-45deg);
    transition-delay: 0.32s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-collapse.active .hm-inner::after {
    top: 0;
    opacity: 0;
    transition: top 0.3s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.27s linear
}
.hm-collapse.active .hm-inner::before {
    top: 0;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-collapse-r .hm-inner {
    top: auto;
    bottom: 0;
    transition-duration: 0.15s;
    transition-delay: 0.15s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-collapse-r .hm-inner::after {
    top: -20px;
    transition: top 0.3s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear
}
.hm-collapse-r .hm-inner::before {
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-collapse-r.active .hm-inner {
    -webkit-transform: translate3d(0, -10px, 0) rotate(45deg);
    transform: translate3d(0, -10px, 0) rotate(45deg);
    transition-delay: 0.32s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-collapse-r.active .hm-inner::after {
    top: 0;
    opacity: 0;
    transition: top 0.3s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.27s linear
}
.hm-collapse-r.active .hm-inner::before {
    top: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.15s 0.42s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-elastic .hm-inner {
    top: 2px;
    transition-duration: 0.4s;
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55)
}
.hm-elastic .hm-inner::before {
    top: 10px;
    transition: opacity 0.15s 0.4s ease
}
.hm-elastic .hm-inner::after {
    top: 20px;
    transition: -webkit-transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55)
}
.hm-elastic.active .hm-inner {
    -webkit-transform: translate3d(0, 10px, 0) rotate(135deg);
    transform: translate3d(0, 10px, 0) rotate(135deg);
    transition-delay: 0.1s
}
.hm-elastic.active .hm-inner::before {
    transition-delay: 0s;
    opacity: 0
}
.hm-elastic.active .hm-inner::after {
    -webkit-transform: translate3d(0, -20px, 0) rotate(-270deg);
    transform: translate3d(0, -20px, 0) rotate(-270deg);
    transition-delay: 0.1s
}
.hm-elastic-r .hm-inner {
    top: 2px;
    transition-duration: 0.4s;
    transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55)
}
.hm-elastic-r .hm-inner::before {
    top: 10px;
    transition: opacity 0.15s 0.4s ease
}
.hm-elastic-r .hm-inner::after {
    top: 20px;
    transition: -webkit-transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55)
}
.hm-elastic-r.active .hm-inner {
    -webkit-transform: translate3d(0, 10px, 0) rotate(-135deg);
    transform: translate3d(0, 10px, 0) rotate(-135deg);
    transition-delay: 0.1s
}
.hm-elastic-r.active .hm-inner::before {
    transition-delay: 0s;
    opacity: 0
}
.hm-elastic-r.active .hm-inner::after {
    -webkit-transform: translate3d(0, -20px, 0) rotate(270deg);
    transform: translate3d(0, -20px, 0) rotate(270deg);
    transition-delay: 0.1s
}
.hm-emphatic {
    overflow: hidden
}
.hm-emphatic .hm-inner {
    transition: background-color 0.2s 0.25s ease-in
}
.hm-emphatic .hm-inner::before {
    left: 0;
    transition: top 0.05s 0.2s linear, left 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, left 0.2s 0.25s ease-in;
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, left 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335)
}
.hm-emphatic .hm-inner::after {
    top: 10px;
    right: 0;
    transition: top 0.05s 0.2s linear, right 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, right 0.2s 0.25s ease-in;
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, right 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335)
}
.hm-emphatic.active .hm-inner {
    transition-delay: 0s;
    transition-timing-function: ease-out;
    background-color: transparent
}
.hm-emphatic.active .hm-inner::before {
    left: -80px;
    top: -80px;
    -webkit-transform: translate3d(80px, 80px, 0) rotate(45deg);
    transform: translate3d(80px, 80px, 0) rotate(45deg);
    transition: left 0.2s ease-out, top 0.05s 0.2s linear, -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: left 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: left 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1)
}
.hm-emphatic.active .hm-inner::after {
    right: -80px;
    top: -80px;
    -webkit-transform: translate3d(-80px, 80px, 0) rotate(-45deg);
    transform: translate3d(-80px, 80px, 0) rotate(-45deg);
    transition: right 0.2s ease-out, top 0.05s 0.2s linear, -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: right 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: right 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1)
}
.hm-emphatic-r {
    overflow: hidden
}
.hm-emphatic-r .hm-inner {
    transition: background-color 0.2s 0.25s ease-in
}
.hm-emphatic-r .hm-inner::before {
    left: 0;
    transition: top 0.05s 0.2s linear, left 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, left 0.2s 0.25s ease-in;
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, left 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335)
}
.hm-emphatic-r .hm-inner::after {
    top: 10px;
    right: 0;
    transition: top 0.05s 0.2s linear, right 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335);
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, right 0.2s 0.25s ease-in;
    transition: transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335), top 0.05s 0.2s linear, right 0.2s 0.25s ease-in, -webkit-transform 0.2s cubic-bezier(0.6, 0.04, 0.98, 0.335)
}
.hm-emphatic-r.active .hm-inner {
    transition-delay: 0s;
    transition-timing-function: ease-out;
    background-color: transparent
}
.hm-emphatic-r.active .hm-inner::before {
    left: -80px;
    top: 80px;
    -webkit-transform: translate3d(80px, -80px, 0) rotate(-45deg);
    transform: translate3d(80px, -80px, 0) rotate(-45deg);
    transition: left 0.2s ease-out, top 0.05s 0.2s linear, -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: left 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: left 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1)
}
.hm-emphatic-r.active .hm-inner::after {
    right: -80px;
    top: 80px;
    -webkit-transform: translate3d(-80px, -80px, 0) rotate(45deg);
    transform: translate3d(-80px, -80px, 0) rotate(45deg);
    transition: right 0.2s ease-out, top 0.05s 0.2s linear, -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: right 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: right 0.2s ease-out, top 0.05s 0.2s linear, transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.2s 0.25s cubic-bezier(0.075, 0.82, 0.165, 1)
}
.hm-slider .hm-inner {
    top: 2px
}
.hm-slider .hm-inner::before {
    top: 10px;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    transition-timing-function: ease;
    transition-duration: 0.2s
}
.hm-slider .hm-inner::after {
    top: 20px
}
.hm-slider.active .hm-inner {
    -webkit-transform: translate3d(0, 10px, 0) rotate(45deg);
    transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hm-slider.active .hm-inner::before {
    -webkit-transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
    transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
    opacity: 0
}
.hm-slider.active .hm-inner::after {
    -webkit-transform: translate3d(0, -20px, 0) rotate(-90deg);
    transform: translate3d(0, -20px, 0) rotate(-90deg)
}
.hm-slider-r .hm-inner {
    top: 2px
}
.hm-slider-r .hm-inner::before {
    top: 10px;
    transition-property: opacity, -webkit-transform;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    transition-timing-function: ease;
    transition-duration: 0.2s
}
.hm-slider-r .hm-inner::after {
    top: 20px
}
.hm-slider-r.active .hm-inner {
    -webkit-transform: translate3d(0, 10px, 0) rotate(-45deg);
    transform: translate3d(0, 10px, 0) rotate(-45deg)
}
.hm-slider-r.active .hm-inner::before {
    -webkit-transform: rotate(45deg) translate3d(5.71429px, -6px, 0);
    transform: rotate(45deg) translate3d(5.71429px, -6px, 0);
    opacity: 0
}
.hm-slider-r.active .hm-inner::after {
    -webkit-transform: translate3d(0, -20px, 0) rotate(90deg);
    transform: translate3d(0, -20px, 0) rotate(90deg)
}
.hm-spring .hm-inner {
    top: 2px;
    transition: background-color 0s 0.15s linear
}
.hm-spring .hm-inner::before {
    top: 10px;
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spring .hm-inner::after {
    top: 20px;
    transition: top 0.3s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.3s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.3s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spring.active .hm-inner {
    transition-delay: 0.32s;
    background-color: transparent
}
.hm-spring.active .hm-inner::before {
    top: 0;
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 10px, 0) rotate(45deg);
    transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hm-spring.active .hm-inner::after {
    top: 0;
    transition: top 0.3s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.3s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.3s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 10px, 0) rotate(-45deg);
    transform: translate3d(0, 10px, 0) rotate(-45deg)
}
.hm-spring-r .hm-inner {
    top: auto;
    bottom: 0;
    transition-duration: 0.15s;
    transition-delay: 0s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spring-r .hm-inner::after {
    top: -20px;
    transition: top 0.3s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear
}
.hm-spring-r .hm-inner::before {
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.12s 0.3s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spring-r.active .hm-inner {
    -webkit-transform: translate3d(0, -10px, 0) rotate(-45deg);
    transform: translate3d(0, -10px, 0) rotate(-45deg);
    transition-delay: 0.32s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-spring-r.active .hm-inner::after {
    top: 0;
    opacity: 0;
    transition: top 0.3s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.32s linear
}
.hm-spring-r.active .hm-inner::before {
    top: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), -webkit-transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.12s 0.18s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.15s 0.32s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-stand .hm-inner {
    transition: background-color 0s 0.1s linear, -webkit-transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.1s linear;
    transition: transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.1s linear, -webkit-transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-stand .hm-inner::before {
    transition: top 0.1s 0.1s ease-in, -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-stand .hm-inner::after {
    transition: bottom 0.1s 0.1s ease-in, -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-stand.active .hm-inner {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    background-color: transparent;
    transition: background-color 0s 0.22s linear, -webkit-transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.22s linear;
    transition: transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.22s linear, -webkit-transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-stand.active .hm-inner::before {
    top: 0;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transition: top 0.1s 0.12s ease-out, -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-stand.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: bottom 0.1s 0.12s ease-out, -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-stand-r .hm-inner {
    transition: background-color 0s 0.1s linear, -webkit-transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.1s linear;
    transition: transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0s 0.1s linear, -webkit-transform 0.1s 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-stand-r .hm-inner::before {
    transition: top 0.1s 0.1s ease-in, -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: top 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-stand-r .hm-inner::after {
    transition: bottom 0.1s 0.1s ease-in, -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.1s ease-in, transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.1s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-stand-r.active .hm-inner {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    background-color: transparent;
    transition: background-color 0s 0.22s linear, -webkit-transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.22s linear;
    transition: transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0s 0.22s linear, -webkit-transform 0.1s 0s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-stand-r.active .hm-inner::before {
    top: 0;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    transition: top 0.1s 0.12s ease-out, -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: top 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-stand-r.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: bottom 0.1s 0.12s ease-out, -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s 0.12s ease-out, transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.1s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-spin .hm-inner {
    transition-duration: 0.3s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spin .hm-inner::before {
    transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in
}
.hm-spin .hm-inner::after {
    transition: bottom 0.1s 0.34s ease-in, -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spin.active .hm-inner {
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg);
    transition-delay: 0.14s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-spin.active .hm-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out
}
.hm-spin.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    transition: bottom 0.1s ease-out, -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-spin-r .hm-inner {
    transition-duration: 0.3s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spin-r .hm-inner::before {
    transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in
}
.hm-spin-r .hm-inner::after {
    transition: bottom 0.1s 0.34s ease-in, -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-spin-r.active .hm-inner {
    -webkit-transform: rotate(-225deg);
    transform: rotate(-225deg);
    transition-delay: 0.14s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-spin-r.active .hm-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out
}
.hm-spin-r.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    transition: bottom 0.1s ease-out, -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-squeeze .hm-inner {
    transition-duration: 0.1s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-squeeze .hm-inner::before {
    transition: top 0.1s 0.14s ease, opacity 0.1s ease
}
.hm-squeeze .hm-inner::after {
    transition: bottom 0.1s 0.14s ease, -webkit-transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.14s ease, transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.14s ease, transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19)
}
.hm-squeeze.active .hm-inner {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition-delay: 0.14s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-squeeze.active .hm-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease, opacity 0.1s 0.14s ease
}
.hm-squeeze.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    transition: bottom 0.1s ease, -webkit-transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease, transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease, transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1)
}
.hm-vortex .hm-inner {
    transition-duration: 0.3s;
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
}
.hm-vortex .hm-inner::before,
.hm-vortex .hm-inner::after {
    transition-duration: 0s;
    transition-delay: 0.1s;
    transition-timing-function: linear
}
.hm-vortex .hm-inner::before {
    transition-property: top, opacity
}
.hm-vortex .hm-inner::after {
    transition-property: bottom, -webkit-transform;
    transition-property: bottom, transform;
    transition-property: bottom, transform, -webkit-transform
}
.hm-vortex.active .hm-inner {
    -webkit-transform: rotate(765deg);
    transform: rotate(765deg);
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
}
.hm-vortex.active .hm-inner::before,
.hm-vortex.active .hm-inner::after {
    transition-delay: 0s
}
.hm-vortex.active .hm-inner::before {
    top: 0;
    opacity: 0
}
.hm-vortex.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}
.hm-vortex-r .hm-inner {
    transition-duration: 0.3s;
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
}
.hm-vortex-r .hm-inner::before,
.hm-vortex-r .hm-inner::after {
    transition-duration: 0s;
    transition-delay: 0.1s;
    transition-timing-function: linear
}
.hm-vortex-r .hm-inner::before {
    transition-property: top, opacity
}
.hm-vortex-r .hm-inner::after {
    transition-property: bottom, -webkit-transform;
    transition-property: bottom, transform;
    transition-property: bottom, transform, -webkit-transform
}
.hm-vortex-r.active .hm-inner {
    -webkit-transform: rotate(-765deg);
    transform: rotate(-765deg);
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1)
}
.hm-vortex-r.active .hm-inner::before,
.hm-vortex-r.active .hm-inner::after {
    transition-delay: 0s
}
.hm-vortex-r.active .hm-inner::before {
    top: 0;
    opacity: 0
}
.hm-vortex-r.active .hm-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}
.navbar {
    position: absolute;
    width: 642px;
    height: 100%;
    background: white;
    left: -1px;
    top: -1px
}
.navbar.active>.nav-in {
    visibility: visible
}
.navbar.active>.nav-in>ul {
    -webkit-transform: translate(0%, 0%);
    -moz-transform: translate(0%, 0%);
    -ms-transform: translate(0%, 0%);
    -o-transform: translate(0%, 0%);
    transform: translate(0%, 0%)
}
.navbar>.nav {
    position: relative;
    width: 100%;
    padding-bottom: 17.34375%;
    background: white;
    left: 0px;
    top: 0px;
    z-index: 100
}
.navbar>.nav .logo {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 18.6734693877551%;
    padding: 0;
    margin: 0
}
.navbar>.nav .logo a,
.navbar>.nav .logo img {
    width: 100%
}
.navbar>.nav-in {
    position: relative;
    visibility: hidden;
    overflow: hidden;
    position: absolute;
    width: 100%;
    height: 85%;
    z-index: 100;
    font-family: 'cwTeXYen', "微軟正黑體", Century Gothic, Helvetica, Arial, Verdana, serif !important;
    -webkit-transition: 0.3s ease visibility;
    -moz-transition: 0.3s ease visibility;
    transition: 0.3s ease visibility;
    -webkit-transform-origin: right;
    -moz-transform-origin: right;
    -ms-transform-origin: right;
    -o-transform-origin: right;
    transform-origin: right
}
.navbar>.nav-in a {
    text-decoration: none;
    color: black
}
.navbar>.nav-in h2,
.navbar>.nav-in a {
    display: block;
    width: 100%;
    position: relative;
    white-space: nowrap
}
.navbar>.nav-in .purple a {
    color: #fff;
}
.navbar>.nav-in .icon {
    width: 7%;
    display: inline-block;
    vertical-align: middle;
    position: absolute;
    left: 0;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -o-transform: translate(0%, -50%);
    transform: translate(0%, -50%)
}
.navbar>.nav-in .right-icon {
    position: absolute;
    width: 25%;
    top: 50%;
    right: 12%;
    -webkit-transform: translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -o-transform: translate(0%, -50%);
    transform: translate(0%, -50%)
}
.navbar>.nav-in .right-icon-small {
    display: inline;
    width: 20%;
    margin-left: 2%;
    vertical-align: middle
}
.navbar>.nav-in>ul {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow-y: auto;
    height: 100%;
    background-color: white;
    -webkit-transition: 0.3s ease transform;
    -moz-transition: 0.3s ease transform;
    transition: 0.3s ease transform;
    -webkit-transform: translate(100%, 0%);
    -moz-transform: translate(100%, 0%);
    -ms-transform: translate(100%, 0%);
    -o-transform: translate(100%, 0%);
    transform: translate(100%, 0%)
}
.navbar>.nav-in>ul li {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}
.navbar>.nav-in>ul>li.blue {
    background-color: #d4e5f5
}
.navbar>.nav-in>ul>li.blue>ul {
    background: url(../img/menu_line01.png) #d4e5f5 center top/84% auto no-repeat
}
.navbar>.nav-in>ul>li.yellow {
    background-color: #fff4ce
}
.navbar>.nav-in>ul>li.yellow>ul {
    background: url(../img/menu_line02.png) #fff4ce center top/84% auto no-repeat
}
.navbar>.nav-in>ul>li.gray {
    background-color: #eeeeee
}
.navbar>.nav-in>ul>li.gray>ul {
    background: url(../img/menu_line03.png) #eee center top/84% auto no-repeat
}
.navbar>.nav-in>ul>li.purple {
    background-color: #371854
}
.navbar>.nav-in>ul>li.purple>ul {
    background: url(../img/nav_dot_purple.png) #371854 center top/84% auto no-repeat
}
.navbar>.nav-in>ul>li.active>a>h2:after {
    -webkit-transform: translate(0%, -50%) rotate(180deg);
    -moz-transform: translate(0%, -50%) rotate(180deg);
    -ms-transform: translate(0%, -50%) rotate(180deg);
    -o-transform: translate(0%, -50%) rotate(180deg);
    transform: translate(0%, -50%) rotate(180deg)
}
.navbar>.nav-in>ul>li.open>ul {
    display: block
}
.navbar>.nav-in>ul>li>ul {
    padding: 6% 8%;
    display: none
}
.navbar>.nav-in>ul>li>ul li a {
    padding: 4% 8%;
    font-size: 2.6em;
    padding-left: 8%
}
.navbar>.nav-in>ul>li>ul li ul {
    padding-left: 8%
}
.navbar>.nav-in>ul>li>ul li ul li a {
    font-size: 2.4em
}
.navbar>.nav-in>ul>li>a {
    padding: 6% 8%;
    display: block
}
.navbar>.nav-in>ul>li>a>h2 {
    font-size: 3.5em;
    font-weight: 900
}
.navbar>.nav-in>ul>li>a>h2:after {
    content: '';
    position: absolute;
    background: url("../img/menu_up_white.png") center/100% no-repeat;
    width: 8%;
    padding-bottom: 8%;
    top: 50%;
    right: 0%;
    -webkit-transition: 0.3s ease transform;
    -moz-transition: 0.3s ease transform;
    transition: 0.3s ease transform;
    -webkit-transform-origin: center;
    -moz-transform-origin: center;
    -ms-transform-origin: center;
    -o-transform-origin: center;
    transform-origin: center;
    -webkit-transform: translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -o-transform: translate(0%, -50%);
    transform: translate(0%, -50%)
}
.navbar>.nav-in>ul>li>a>h2.small {
    font-size: 3em
}
.navbar>.nav-in>ul>li>ul>li>ul>li>a>img{
    width: 7%;
    vertical-align: middle;
}