@charset "utf-8";

* {position: relative;}

/* css Reset */
header,
footer,
section,
article,
aside,
nav,
hgroup,
details,
menu,
figure,
figcaption {
    display: block
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'SpocaHanSans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #222527;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
    letter-spacing: -0.5px;
    scroll-behavior: smooth;
}

.spca {font-family: 'SpocaHanSans', sans-serif;}

p,
div,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
li,
dl,
dt,
dd,
table,
th,
td,
form,
fieldset,
legend,
input,
textarea,
select,
button,
code,
label,
em,
span,
strong {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    color: inherit;
    word-break: keep-all;
}

form {
    display: inline;
    margin: none
}

img,
fieldset {
    border: 0
}

hr {
    display: none
}

li {
    list-style: none
}

em,
address {
    font-style: normal
}

label,
input,
select,
textarea {
    vertical-align: middle;
    -webkit-appearance: none
}

legend {
    position: absolute;
    left: -5000px;
    font-size: 0;
    overflow: hidden
}

table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

caption {
    position: relative;
    left: -5000px;
    height: 0;
    line-height: 0;
    text-indent: -5000px;
    overflow: hidden
}

a:link,
a:active,
a:visited,
a {
    text-decoration: none;
    font: inherit;
    color: inherit
}

a:hover {
    text-decoration: none;
    color: inherit
}

label,
input,
button,
select,
img {
    vertical-align: middle
}

button {
    cursor: pointer;
    outline: none;
    background: none
}

input[type="button"],
input[type="text"],
input[type="image"],
input[type="submit"],
input[type="password"],
input[type="tel"],
input[type="number"],
select,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0;
    box-sizing: border-box;
    background: none;
}

input[type="checkbox"] {
    -webkit-appearance: checkbox;
    -moz-appearance: checkbox;
}

input[type="radio"] {
    -webkit-appearance: radio;
    -moz-appearance: radio;
}

input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus {
    outline: none;
}

section .inner {
    max-width: 1396px;
    width: 100%;
    margin: 0 auto;
}

.trigger_top_off {bottom: -5rem; opacity: 0; transition: 1.4s}
.trigger_top_on {bottom: 0; opacity: 1; transition: 1.4s}

.trigger_left_off {right: -5rem; opacity: 0; transition: 1.4s;}
.trigger_left_on {right: 0; opacity: 1; transition: 1.4s;}

.trigger_right_off {left: -5rem; opacity: 0; transition: 1.4s;}
.trigger_right_on {left: 0; opacity: 1; transition: 1.4s;}

.trigger_bot_off {top: -5rem; opacity: 0; transition: 1.4s}
.trigger_bot_on {top: 0; opacity: 1; transition: 1.4s}

.trigger_opa_off {opacity: 0; transition: 1.4s}
.trigger_opa_on {opacity: 1; transition: 1.4s}

.trigger_fil_off {filter: blur(20px); opacity: 0; transition: 1.4s}
.trigger_fil_on {filter: blur(0); opacity: 1; transition: 1.4s}

.fillter_blur {filter: blur(20px); opacity: 0; transition: 1.4s}
.fillter_blur.fillter_off {filter: blur(0); opacity: 1; transition: 1.4s}

.fillter_left {right: -5rem; opacity: 0; transition: 1.4s;}
.fillter_left.fillter_off {right: 0; opacity: 1; transition: 1.4s;}

.fillter_top {bottom: -5rem; opacity: 0; transition: 1.4s;}
.fillter_top.fillter_off {bottom: 0; opacity: 1; transition: 1.4s;}