@charset "UTF-8";
* {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-transition: border-box;
  box-sizing: border-box;
  overflow-x: hidden;
}

body {
  -webkit-text-size-adjust: 100%;
}

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;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: 0 0;
}

h1 {
  font-size: 2em;
}

hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
}

pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
  /* 2 */
}

b, strong {
  font-weight: bold !important;
}

code, kbd, pre, samp, tt {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

small {
  font-size: 80%;
}

sub, sup {
  font-size: 75%;
  position: relative;
  vertical-align: baseline;
  border: 0;
  outline: 0;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
}

button, input {
  /* 1 */
  overflow: visible;
  -webkit-transition: all .2s ease-in-out 0s;
  transition: all .2s ease-in-out 0s;
}

button, select {
  /* 1 */
  text-transform: none;
}

input, select {
  vertical-align: middle;
}

input:focus {
  outline: 0;
}

textarea {
  overflow: auto;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

table {
  border-spacing: 0;
  border-collapse: collapse;
  table-layout: fixed;
}

progress {
  vertical-align: baseline;
}

button,
[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;
}

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

summary {
  display: list-item;
}

template, [hidden], .hidden {
  display: none;
}

blockquote, q {
  quotes: none;
}

blockquote:after,
blockquote:before,
q:after,
q:before {
  content: "";
  content: none;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section {
  display: block;
}

img {
  vertical-align: top;
  border-style: none;
  line-height: 0;
  font-size: 0;
  -ms-interpolation-mode: bicubic;
  background: 0 0;
  zoom: 1;
}

ol, ul {
  list-style: none;
}

a {
  background-color: transparent;
  text-decoration: none;
  font-size: 100%;
  vertical-align: baseline;
  text-decoration: none;
  background: 0 0;
}

a:focus {
  outline: 0;
}

a img {
  opacity: 1;
  -webkit-transition: ease-out 0.3s;
  transition: ease-out 0.3s;
}

a img:hover {
  opacity: 0.7;
  -webkit-transition: ease-out 0.3s;
  transition: ease-out 0.3s;
}

ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: 700;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

a,
button,
input {
  -webkit-transition: all .3s ease-in-out 0s;
  transition: all .3s ease-in-out 0s;
}

.pull_left {
  float: left;
}

.pull_right {
  float: right;
}

.text_left {
  text-align: left !important;
}

.text_right {
  text-align: right !important;
}

.text_center {
  text-align: center !important;
}

.text_justify {
  text-align: justify !important;
}

.text_nowrap {
  white-space: nowrap !important;
}

.text_lower {
  text-transform: lowercase !important;
}

.text_upper {
  text-transform: uppercase !important;
}

.text_capitalize {
  text-transform: capitalize !important;
}

.text_normal {
  font-weight: normal !important;
}

.text_bold {
  font-weight: bold !important;
}

.text_line {
  text-decoration: underline;
}

.text_noline {
  text-decoration: none !important;
}

.text_over {
  overflow: hidden !important;
}

.clearfix:before, .clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  zoom: 1;
}

.obj__fit, .imgfit {
  width: 100%;
  height: 100%;
  object-fit: cover;
  font-family: 'object-fit: cover;';
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    transform: translateY(100px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes scaleImg {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes scaleImg {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.8, 0.8, 0.8);
    -ms-transform: scale3d(0.8, 0.8, 0.8);
    transform: scale3d(0.8, 0.8, 0.8);
  }
  50% {
    opacity: 0.9;
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    opacity: 1;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.8, 0.8, 0.8);
    -ms-transform: scale3d(0.8, 0.8, 0.8);
    transform: scale3d(0.8, 0.8, 0.8);
  }
  50% {
    opacity: 0.9;
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    -ms-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    opacity: 1;
  }
}

@-webkit-keyframes zoomInDown {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
  }
}

@keyframes zoomInDown {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -ms-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-keyframes zoomInLeft {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
  }
}

@keyframes zoomInLeft {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -ms-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-keyframes zoomInRight {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
  }
}

@keyframes zoomInRight {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -ms-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-keyframes zoomInUp {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
  }
}

@keyframes zoomInUp {
  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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -ms-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
  }
  60% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -ms-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-keyframes zoomOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    -ms-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  100% {
    opacity: 0;
  }
}

@keyframes zoomOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    -ms-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes zoomOutDown {
  40% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
  }
  100% {
    -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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -ms-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;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

@keyframes zoomOutDown {
  40% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
  }
  100% {
    -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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -ms-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;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    -ms-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    -ms-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);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    -ms-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
  }
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    -ms-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    -ms-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);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    -ms-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
  }
}

@-webkit-keyframes zoomOutUp {
  40% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
  }
  100% {
    -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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -ms-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;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

@keyframes zoomOutUp {
  40% {
    -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);
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -ms-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
  }
  100% {
    -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);
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -ms-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;
    -ms-transform-origin: center bottom;
    transform-origin: center bottom;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: cubic-bezier(0, 0.5, 0.3, 1);
  animation-timing-function: cubic-bezier(0, 0.5, 0.3, 1);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

@-webkit-keyframes kvTtlAnimation {
  0% {
    -webkit-clip-path: inset(100% 0 0 0);
            clip-path: inset(100% 0 0 0);
    -webkit-transform: translateY(2rem);
    transform: translateY(2rem);
  }
  60% {
    -webkit-clip-path: inset(-5% 0 0 0);
            clip-path: inset(-5% 0 0 0);
  }
  100% {
    -webkit-clip-path: inset(0 0 0 0);
            clip-path: inset(0 0 0 0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes kvTtlAnimation {
  0% {
    -webkit-clip-path: inset(100% 0 0 0);
            clip-path: inset(100% 0 0 0);
    -webkit-transform: translateY(2rem);
    transform: translateY(2rem);
  }
  60% {
    -webkit-clip-path: inset(-5% 0 0 0);
            clip-path: inset(-5% 0 0 0);
  }
  100% {
    -webkit-clip-path: inset(0 0 0 0);
            clip-path: inset(0 0 0 0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

.fontNT {
  font-family: "Noto Sans JP", sans-serif;
}

.fontNTS {
  font-family: "Noto Serif", serif;
}

.fontZen {
  font-family: "Zen Old Mincho", serif;
}

.fontPlus {
  font-family: "M PLUS Rounded 1c", sans-serif;
}

.delay0 {
  -webkit-animation-delay: 0s;
          animation-delay: 0s;
}

.delay1 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}

@media all and (max-width: 575px) {
  .delay1 {
    -webkit-animation-delay: 0.15s;
            animation-delay: 0.15s;
  }
}

.delay2 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}

@media all and (max-width: 575px) {
  .delay2 {
    -webkit-animation-delay: 0.3s;
            animation-delay: 0.3s;
  }
}

.delay3 {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

@media all and (max-width: 575px) {
  .delay3 {
    -webkit-animation-delay: 0.45s;
            animation-delay: 0.45s;
  }
}

.delay4 {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}

@media all and (max-width: 575px) {
  .delay4 {
    -webkit-animation-delay: 0.6s;
            animation-delay: 0.6s;
  }
}

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

@media all and (max-width: 575px) {
  .delay5 {
    -webkit-animation-delay: 0.75s;
            animation-delay: 0.75s;
  }
}

.delay6 {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}

@media all and (max-width: 575px) {
  .delay6 {
    -webkit-animation-delay: 0.9s;
            animation-delay: 0.9s;
  }
}

.delay7 {
  -webkit-animation-delay: 1.4s;
          animation-delay: 1.4s;
}

@media all and (max-width: 575px) {
  .delay7 {
    -webkit-animation-delay: 1.05s;
            animation-delay: 1.05s;
  }
}

.delay8 {
  -webkit-animation-delay: 1.6s;
          animation-delay: 1.6s;
}

@media all and (max-width: 575px) {
  .delay8 {
    -webkit-animation-delay: 1.2s;
            animation-delay: 1.2s;
  }
}

.delay9 {
  -webkit-animation-delay: 1.8s;
          animation-delay: 1.8s;
}

@media all and (max-width: 575px) {
  .delay9 {
    -webkit-animation-delay: 1.35s;
            animation-delay: 1.35s;
  }
}

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

@media all and (max-width: 575px) {
  .delay10 {
    -webkit-animation-delay: 1.5s;
            animation-delay: 1.5s;
  }
}

@keyframes scaleImg {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

.scaleImg {
  -webkit-animation-name: scaleImg;
  animation-name: scaleImg;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  animation-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

html, body {
  overflow-x: hidden;
  scroll-behavior: smooth;
}

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-list,
.slick-slider .slick-track {
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:after,
.slick-track:before {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}

.slick-next,
.slick-prev {
  position: absolute;
  display: block;
  /* height: 20px;
  width: 20px; */
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
}

/* .slick-next:focus,
.slick-next:hover,
.slick-prev:focus,
.slick-prev:hover {
  outline: none;
  background: transparent;
  color: transparent;
}

.slick-next:focus:before,
.slick-next:hover:before,
.slick-prev:focus:before,
.slick-prev:hover:before {
  opacity: 1;
} */

/* .slick-next.slick-disabled:before,
.slick-prev.slick-disabled:before {
  opacity: 0.25;
} */

.slick-prev:hover {
  opacity: 0.75;
}

/* .slick-next:before,
.slick-prev:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  color: white;
  opacity: 0.75;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
} */

/* .slick-prev {
  left: -25px;
} */

[dir=rtl] .slick-prev {
  left: auto;
  right: -25px;
}

/* .slick-prev:before {
  content: "←";
} */

[dir=rtl] .slick-prev:before {
  content: "→";
}

/* .slick-next {
  right: -25px;
} */

[dir=rtl] .slick-next {
  left: -25px;
  right: auto;
}

/* .slick-next:before {
  content: "→";
} */

[dir=rtl] .slick-next:before {
  content: "←";
}

.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -10.5%;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  /* height: 20px;
  width: 20px;
  margin: 0 5px; */
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  width: 100%;
  /* height: 100%; */
  padding-bottom: 100%;
  /* height: 20px;
  width: 20px; */
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  cursor: pointer;
}

.slick-dots li button:focus,
.slick-dots li button:hover {
  outline: none;
}

.slick-dots li button:focus:before,
.slick-dots li button:hover:before {
  opacity: 1;
}

.slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  /* content: "•"; */
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: black;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

body {
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 500;
  max-width: 750px;
  margin: 0 auto;
  background: #F0F0F0;
}

body p {
  color: #374149;
}

/* img, svg {
  max-width: 100%;
} */

.fontNoto {
  font-family: "Noto Sans JP", sans-serif;
}

.fontNotoserif {
  font-family: "Noto Serif", serif;
}

.fontship {
  font-family: "Shippori Mincho", serif;
}

.fontkaku {
  font-family: "Zen Kaku Gothic New", sans-serif;
}

.dflex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.dflex-start {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.dflex-end {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.dflex-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.dflex-nowrap {
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
}

.container {
  padding: 0 3%;
  width: 100%;
}

@media all and (max-width: 414px) {
  .container {
    padding: 0 10px;
  }
}

.dispc, .breakpc {
  display: block;
}

@media all and (max-width: 575px) {
  .dispc, .breakpc {
    display: none;
  }
}

.dissp, .breaksp {
  display: block;
}

@media all and (min-width: 576px) {
  .dissp, .breaksp {
    display: none;
  }
}

.header {
  background: url(../images/bg-banner.png) no-repeat top center;
  background-size: 100%;
  padding-top: 19.5%;
  padding-bottom: 18%;
  position: relative;
}

.header::after{
  content: "";
  display: block;
  position: absolute;
  bottom: 5%;
  left: 0;
  width: 100%;
  height: 11%;
  background: url(../images/union-btom.png) no-repeat bottom center;
  background-size: cover;
}

.imgbanner{
  text-align: center;
  position: relative;
}

.imgbanner .img1{
  margin: 0 auto;
  width: 89.7%;
  margin-left: 6.8%;
  display: block;
}

.imgbanner .img2{
  margin: 0 auto;
  margin-top: -5.1%;
  display: block;
  position: relative;
  width: 89.7%;
}

.imgbanner .img3{
  margin: 0 auto;
  width: 89.8%;
  margin-top: -2.2%;
  display: block;
  position: relative;
  margin-left: 6.4%;
}

.imgbanner .img4{
  display: block;
  position: absolute;
  width: 15.3%;
  bottom: 5.5%;
  left: 4.7%;
}

.imgbanner .img5{
  display: block;
  position: absolute;
  width: 22.3%;
  bottom: 40.3%;
  right: 7.8%;
}

.imgbanner .img6{
  display: block;
  position: absolute;
  width: 29.3%;
  top: -5%;
  left: 8%;
}

.imgbanner .img4 img,
.imgbanner .img5 img,
.imgbanner .img6 img{
  width: 100%;
}

.imgbanner.active .img1,
.imgbanner.active .img2,
.imgbanner.active .img3,
.imgbanner.active .img4,
.imgbanner.active .img5,
.imgbanner.active .img6{
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: cubic-bezier(0, 0.5, 0.3, 1);
  animation-timing-function: cubic-bezier(0, 0.5, 0.3, 1);
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.imgbanner.active .img2{
  -webkit-animation-delay: 0.45s;
  animation-delay: 0.45s;
}

.imgbanner.active .img3{
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

.imgbanner.active .img4{
  -webkit-animation-delay: 0.75s;
  animation-delay: 0.75s;
}

.imgbanner.active .img5{
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}

.imgbanner.active .img6{
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.sns{
  margin: 0 auto;
  margin-bottom: 10.5%;
  margin-top: 2.2%;
  width: 65%;
  position: relative;
  z-index: 2;
}

.sns a {
  display: block;
}

.sns li{
  flex: 0 0 25%;
}

@media all and (min-width: 576px) {
  .sns{
    margin-top: 3%;
  }
}

.sns img{
  min-width: 60px;
}

h1{
  font-size: inherit;
}

.header .logo {
  display: block;
  text-align: center;
  width: 23%;
  min-width: 86px;
  /* max-width: 172px; */
  margin: 0 auto;
}

.header .logo img{
  /* max-height: 48px; */
  min-height: 24px;
  max-width: 100%;
}

.header h1{
  position: relative;
  z-index: 2;
}

.header .btn{
  margin: 0 auto;
  margin-top: -3.2%;
  width: 78%;
  position: fixed;
  bottom: 2%;
  left: 50%;
  margin-left: -39%;
  z-index: 9;
}

.header .btn a {
  display: block;
  text-align: center;
  max-width: 590px;
  margin: 0 auto;
  box-shadow: 2px 4px 15px rgba(0, 0, 0, 0.3);
  border-radius: 50px;
}

.header .btn img{
  width: 100%;
}

.footer {
  background: url(../images/union-top.png) repeat-x top center;
  background-size: contain;
  margin-top: 7%;
  padding-top: 1%;
}

.footer .text_center{
  background: #374149;
}

.footer ul {
  padding: 3.5% 3%;
  padding-bottom: 14%;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.footer li {
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 32%;
      -ms-flex: 1 1 32%;
          flex: 1 1 32%;
  margin: 2% 0 2%;
}

.footer li:nth-child(2), .footer li:nth-child(4) {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 58%;
      -ms-flex: 0 0 58%;
          flex: 0 0 58%;
}

@media all and (max-width: 575px) {
  .footer li {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 33%;
        -ms-flex: 1 1 33%;
            flex: 1 1 33%;
    margin: 1.5% 0;
  }
}

@media all and (min-width: 576px) {
  .footer li {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 34%;
        -ms-flex: 1 1 34%;
            flex: 1 1 34%;
  }
}

.footer li a {
  color: #808080;
  font-size: 3.3vw;
  font-style: normal;
  font-weight: 500;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.footer .container{
  background: #fff;
}

.footer p.copyright {
  padding: 2% 0;
  color: #fff;
  font-size: 3.3vw;
  font-style: normal;
  font-weight: 400;
}

.contact {
  padding: 0 6.4%;
  margin-top: 5%;
}

.contact .container {
  padding: 0;
}

.contact .error {
  color: #FF285E;
  display: block;
  font-weight: 500;
  font-size: 3vw;
  margin-top: 1.5%;
}

@media all and (max-width: 480px) {
  .contact .error {
    font-size: 3.2vw;
  }
}

.contact table {
  width: 100%;
}

.contact table tr:first-child th {
  padding-top: 0;
}

.contact table th, .contact table td {
  display: block;
  width: 100%;
  -moz-text-align-last: left;
       text-align-last: left;
}

.contact table th {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  padding-top: 7%;
}

#contact table th.imagesUpload{
  padding-top: 4%;
}

.contact table td {
  padding-top: 2%;
}

.contact table input, .contact table textarea {
  padding: 4.8% 4%;
  outline: none;
  width: 100%;
  border: none;
  border-radius: 8px;
}

.contact table textarea{
  line-height: 1.6;
  padding-top: 4.5%;
  padding-bottom: 4.5%;
}

.contact table input::-webkit-input-placeholder, .contact table textarea::-webkit-input-placeholder {
  color: #808080;
}

.contact table input::-moz-placeholder, .contact table textarea::-moz-placeholder {
  color: #808080;
}

.contact table input:-ms-input-placeholder, .contact table textarea:-ms-input-placeholder {
  color: #808080;
}

.contact table input::-ms-input-placeholder, .contact table textarea::-ms-input-placeholder {
  color: #808080;
}

.contact table input::placeholder, .contact table textarea::placeholder {
  color: #808080;
}

.contact table input, .contact table textarea {
  font-size: 3.16vw;
}

.contact table textarea {
  height: 44vw;
  max-height: 165px;
}

@media all and (min-width: 750px) {
  .contact table textarea {
    height: 44vw;
    max-height: 330px;
  }
}

.contact button {
  border: none;
}

/* .contact button {
  color: #516FFF;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  border-radius: 10px;
  border: 1px solid #516FFF;
  background: #fff;
  box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.25);
  padding: 11px 30px 14px;
  margin-top: 25px;
  cursor: pointer;
  display: inline-block;
  min-width: 220px;
} */

/* @media all and (max-width: 575px) {
  .contact button {
    font-size: 16px;
  }
} */

.contact .pp {
  margin-top: 8%;
  border-top: 1px dashed #414141;
  padding-top: 4%;
  font-size: 2.8vw;
  margin-bottom: 10%;
  font-weight: 400;
}

.contact .pp a {
  color: #408FC9;
  text-decoration: underline;
  font-weight: bold;
}

@media all and (min-width: 576px) {
  .contact .pp {
    font-size: 16px;
  }
}

.contact .btnimg {
  margin-top: 11.5%;
}

.contact .btnimg button, .contact .btnimg a {
  background: none;
  display: block;
  border: none;
  outline: none;
  box-shadow: none;
  width: 90%;
  margin: 0 auto;
  padding: 0;
}

.contact .btnimg button.backbutton {
  display: block;
  border: none;
  outline: none;
  box-shadow: none;
  width: 32%;
  margin: 0 auto;
  padding: 0;
  margin-top: 5%;
}

.contact a.backlink {
  font-size: 3.6vw;
  margin-top: 5%;
  color: #414141;
  text-decoration: underline;
}

@media all and (min-width: 576px) {
  .contact a.backlink {
    font-size: 21px;
  }
  .contact .btnimg{
    margin-top: 12%;
  }
}

.contact .error-form p {
  font-size: 16px;
}

.contact .error-form .backbutton input {
  color: #414141;
  text-align: center;
  font-size: 25px;
  font-style: normal;
  font-weight: 500;
  border-radius: 10px;
  border: 1px solid #414141;
  background: #fff;
  box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.25);
  padding: 11px 30px 14px;
  margin-top: 25px;
  cursor: pointer;
  display: inline-block;
  min-width: 220px;
}

@media all and (max-width: 575px) {
  .contact .error-form .backbutton input {
    font-size: 16px;
  }
}

.contact-completed {
  padding-top: 10%;
}

.contact-completed h2 {
  font-size: 5vw;
  font-weight: 500;
  margin-bottom: 7%;
}

@media all and (min-width: 576px) {
  .contact-completed h2 {
    font-size: 30px;
  }
}

.contact-completed P {
  font-weight: 400;
}

.contact-completed .btnimg {
  margin-top: 15%;
}

.txtResult {
  padding-bottom: 2.5%;
  width: 88%;
  margin: 0 auto;
  font-size: 3.8vw;
}

.txtResult span {
  color: #7655F9;
}

.backtop {
  width: 88%;
  margin: 0 auto;
  margin-top: 5%;
}

.backtop a {
  display: block;
}

@media all and (min-width: 576px) {
  .backtop a:hover {
    opacity: .7;
  }
}

.stores {
  overflow-x: hidden;
}

.stores #searchform .input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.stores #searchform .input input {
  background: #fff;
  border: none;
  color: #000;
  padding: 4.4% 5%;
  width: 100%;
  font-size: 3.2vw;
  line-height: 1.5;
}

.stores #searchform .input input::placeholder {
  color: #808080;
}

@media all and (max-width: 480px) {
  .stores #searchform .input input {
    padding: 2.5% 5%;
  }
}

.stores #searchform button {
  background: #B49DFF;
  border: none;
  outline: none;
  width: 15%;
  padding: 1.7% 0;
  cursor: pointer;
}

.stores #searchform button img{
  width: 38%;
}

.stores p.txt {
  margin: 0 auto;
  font-size: 2.3vw;
  font-weight: 400;
  width: 96%;
}

@media all and (min-width: 576px) {
  .stores p.txt {
    font-size: 13px;
  }
}

.stores ul.dflex {
  margin-top: 2%;
  margin-bottom: 6.5%;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 1%;
  position: relative;
}

.stores ul.dflex li {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 24%;
      -ms-flex: 0 0 24%;
          flex: 0 0 24%;
  max-width: 24%;
  border: 1px solid #A0A0A0;
  background: #FFF;
  text-align: center;
  margin-bottom: 2%;
  position: relative;
  cursor: pointer;
}

.stores ul.dflex li .selectbox, .stores ul.dflex li .select2 {
  display: none;
}

.stores ul.dflex li .selectbox.select2-container--open, .stores ul.dflex li .select2.select2-container--open {
  display: block;
}

.stores ul.dflex li .txt {
  line-height: 1;
  font-size: 3.2vw;
  margin-bottom: 5px;
  font-weight: 500;
}

@media all and (min-width: 576px) {
  .stores ul.dflex li .txt {
    font-size: 19px;
  }
}

.stores ul.dflex li span.fontGothic {
  color: #818181;
  text-align: center;
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
  padding: 8% 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
  width: 100%;
  position: relative;
}

.stores ul.dflex li span.fontGothic::after {
  position: absolute;
  content: '';
  border-bottom: 5px solid #A3BDD9;
  width: 100%;
  height: 5px;
  left: 0;
  bottom: 0;
  opacity: 0;
}

@media all and (max-width: 575px) {
  .stores ul.dflex li span.fontGothic::after {
    border-bottom: 4px solid #A3BDD9;
    height: 3px;
  }
}

.stores ul.dflex li span.fontGothic small {
  font-size: 2.8vw;
  display: block;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 100%;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  line-height: 1;
}

@media all and (min-width: 576px) {
  .stores ul.dflex li span.fontGothic small {
    font-size: 14px;
  }
}

@media all and (min-width: 576px) {
  .stores ul.dflex li span.fontGothic {
    font-size: 18px;
    padding: 12% 0 8%;
  }
}

.stores ul.dflex li span.fontGothic.active {
  color: #414141;
}

.stores ul.dflex li span.fontGothic.active::after {
  opacity: 1;
}

.stores ul.dflex li.disabled {
  background: #F0F0F0;
  border: none;
  opacity: 0.5;
}

.stores dl {
  width: 80%;
  margin: 0 auto;
}

@media all and (max-width: 575px) {
  .stores dl {
    width: 86%;
  }
}

.stores dl dt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  margin-bottom: 15px;
}

.stores dl input {
  padding: 15px 10px;
  border-radius: 10px;
  border: 1px solid #414141;
  width: 100%;
  margin-right: 10px;
  height: 50px;
}

@media all and (max-width: 575px) {
  .stores dl input {
    font-size: 4vw;
  }
}

.stores dl button {
  color: #516FFF;
  text-align: center;
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
  border-radius: 10px;
  border: 1px solid #516FFF;
  background: #fff;
  box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.25);
  padding: 0 10px;
  cursor: pointer;
  display: inline-block;
  width: 120px;
  height: 48px;
}

@media all and (max-width: 575px) {
  .stores dl button {
    font-size: 4vw;
    padding: 0 5px;
  }
}

.stores .areaResults {
  margin-bottom: 1.7%;
}

.stores .result {
  margin: 0 auto;
  width: 98%;
}

.stores .result .title {
  background: #E1EBFF;
  padding: 1.5% 4% 1.7%;
  position: relative;
  cursor: pointer;
}

.stores .result .title::after {
  position: absolute;
  content: '';
  top: 50%;
  right: 5%;
  width: 8px;
  height: 8px;
  background: transparent;
  border-top: 2px solid #414141;
  border-right: 2px solid #414141;
  -webkit-transition: all .3s;
  transition: all .3s;
  margin-top: -6px;
  -webkit-transform: rotate(135deg);
      -ms-transform: rotate(135deg);
          transform: rotate(135deg);
}

.stores .result .title h3 {
  font-size: 23px;
  color: #414141;
  font-weight: 500;
}

@media all and (max-width: 575px) {
  .stores .result .title h3 {
    font-size: 3.9vw;
  }
}

.stores .result .title.open::after {
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
  margin-top: -3px;
}

/* .stores .result p.txt {
  font-size: 12px;
  border-bottom: 1px solid #232323;
  margin-bottom: 40px;
  padding-bottom: 5px;
}

@media all and (max-width: 575px) {
  .stores .result p.txt {
    margin-bottom: 25px;
  }
} */

.stores .listItem {
  width: 90%;
  margin: 0 auto;
  /* display: none; */
}

.stores .listItem .item {
  background: #fff;
  border-radius: 16px;
  padding: 5% 6%;
  margin-bottom: 3%;
  margin-top: 3%;
}

.stores .listItem:last-child .item:last-child {
  border-bottom: 0;
  padding-bottom: 8%;
}

.stores .listItem .tit {
  font-size: 5vw;
  font-weight: 600;
  line-height: 1.4;
  color: #020200;
  margin-bottom: 4%;
  padding-bottom: 3%;
  letter-spacing: 0.05em;
  border-bottom: 3px solid #7655F9;
}

@media all and (max-width: 575px) {
  .stores .listItem .tit {
    font-size: 4vw;
  }
}


.stores .listItem table {
  width: 100%;
}

.stores .listItem .address {
  color: #020200;
  font-size: 3.5vw;
  margin-top: 3%;
  font-weight: 400;
}

.stores .listItem .note {
  color: #808080;
  font-size: 2.65vw;
  margin-top: 5%;
  font-weight: 400;
}

.stores .listItem .note a{
  color: #366AFF;
  font-weight: 400;
  text-decoration: underline;
}

.stores .listItem .map {
  margin: 0 auto;
  text-align: center;
  margin-top: 5.5%;
  width: 62.2%;
}

.stores .listItem .map a{
  display: block;
}

.stores .listItem .map.disable a{
  pointer-events: none;
}


.stores .listItem .map.disable img{
  filter: grayscale(100%);
}

.stores .listItem .map img{
  width: 100%;
}

.stores .listItem table th {
  font-weight: 400;
  -moz-text-align-last: left;
       text-align-last: left;
  width: 22%;
  min-width: 100px;
  color: #020200;
  font-size: 3.5vw;
}

/* @media all and (max-width: 575px) {
  .stores .listItem table th {
    font-size: 3.8vw;
  }
} */

.stores .listItem table td {
  padding: 3% 0 0;
  font-size: 3.5vw;
  font-weight: 400;
  color: #020200;
}

@media all and (max-width: 575px) {
  .stores .listItem table td {
    font-size: 3.2vw;
  }
}

@media all and (min-width: 751px) {
  .stores .listItem .tit {
    font-size: 36px;
  }
  .stores .listItem table td, .stores .listItem table th, .stores .listItem .address {
    font-size: 26px;
  }
  .stores .listItem .note{
    font-size: 20px;
  }
}

.stores .listItem table td.appbutton div {
  margin-bottom: 1.5%;
}

.stores .listItem table td.appbutton div:last-child {
  margin-bottom: 0;
}

.stores .listItem table td span:not(.tel-link), .stores .listItem table td button {
  color: #FFF;
  border-radius: 12px;
  padding: 2% 3%;
  border: none;
  font-weight: bold;
  font-size: 2.8vw;
  min-width: 190px;
  max-width: 196px;
  width: 52%;
}

@media all and (max-width: 575px) {
  .stores .listItem table td span:not(.tel-link), .stores .listItem table td button {
    max-width: 188.89px;
    min-width: 170px;
  }
}

@media all and (min-width: 576px) {
  .stores .listItem table td span:not(.tel-link), .stores .listItem table td button {
    font-size: 15px;
  }
}

.stores .listItem table td span:not(.tel-link).btnpro, .stores .listItem table td button.btnpro {
  background: #009;
}

.stores .listItem table td span:not(.tel-link).btnplus, .stores .listItem table td button.btnplus {
  background: #9FC0FF;
}

.stores .listItem table td span:not(.tel-link).btnmini, .stores .listItem table td button.btnmini {
  background: #FAA;
}

.stores .listItem table a {
  color: #408FC9;
  word-wrap: break-word;
  word-break: break-all;
  display: block;
  white-space: pre-line;
  text-decoration: underline;
}

.stores .listItem table .maplink {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  color: #6D91B7;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  border: 1px solid #6D91B7;
  background: #fff;
  box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.25);
  cursor: pointer;
  margin-top: 5%;
  padding: 1.2% 16% 1.4%;
  text-decoration: none;
}

@media all and (max-width: 575px) {
  .stores .listItem table .maplink {
    font-size: 3.8vw;
  }
}

.stores .listItem table .maplink:hover {
  text-decoration: none;
}

.searchItem .listItem {
  display: block;
  border-bottom: 2px solid #232323;
}

.searchItem .listItem .item {
  border-bottom: 0;
  margin-top: 8%;
}

.searchItem .listItem .item:last-child {
  margin-bottom: 1%;
}

.select2-container {
  z-index: 999;
}

.select2-container .selection {
  display: none !important;
}

.select2-dropdown {
  min-width: 105px;
  z-index: 99;
}

.select2-dropdown li {
  font-size: 13px !important;
}

.imganimation {
  position: relative;
  overflow: hidden;
}

.imganimation img {
  opacity: 0;
  -webkit-mask-image: -webkit-linear-gradient(top, #000, #000 33%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(to bottom, #000, #000 33%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0) 100%);
  -webkit-mask-size: 100% 300%;
  mask-size: 100% 300%;
  -webkit-mask-position: 0 100%;
  mask-position: 0 100%;
  display: block;
  will-change: mask-image;
  -webkit-transform: scale(1.001) scale(1.035);
      -ms-transform: scale(1.001) scale(1.035);
          transform: scale(1.001) scale(1.035);
}

.imganimation.is-loaded img {
  opacity: 1;
  -webkit-mask-position: 0% 0%;
  mask-position: 0% 0%;
  transition: transform, -webkit-mask-position;
  -webkit-transition: -webkit-mask-position, -webkit-transform;
  transition: -webkit-mask-position, -webkit-transform;
  transition: mask-position, transform;
  transition: mask-position, transform, -webkit-mask-position, -webkit-transform;
  transition: mask-position, transform, -webkit-mask-position;
  -webkit-transition-duration: 1.5s;
          transition-duration: 1.5s;
  -webkit-transition-timing-function: cubic-bezier(0, 0.79, 0.27, 1.06);
          transition-timing-function: cubic-bezier(0, 0.79, 0.27, 1.06);
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}

.main-body{
  position: relative;
  z-index: 2;
}

.page-home h2{
  text-align: center;
  margin: 0 auto;
  line-height: 1;
}

.page-home .sec1 h2{
  width: 94%;
}

.page-home .sec2 h2{
  width: 108%;
  margin-left: -4%;
}

.page-home h2 img{
  width: 100%;
}

.sec1{
  margin-top: -2.8%;
  position: relative;
  z-index: 2;
}

.slick{
  margin: 0 auto;
  margin-top: 7.5%;
}

.slick .item{
  text-align: center;
  border-radius: 16px;
  overflow: hidden;
}

.slick .item img{
  width: 100%;
}

.slick-prev::before,
.slick-next::before{
  content: '';
  opacity: 1;
}

.slick-prev{
  background: #fff url(../images/arr-prev.svg) no-repeat center center;
  background-size: 100%;
  width: 9%;
  height: 9%;
  padding-bottom: 9%;
  left: -2.5%;
  z-index: 9;
  border-radius: 100%;
  overflow: hidden;
}

.slick-next{
  background: #fff url(../images/arr-next.svg) no-repeat center center;
  background-size: 100%;
  width: 9%;
  height: 9%;
  padding-bottom: 9%;
  right: -2.5%;
  z-index: 9;
  border-radius: 100%;
  overflow: hidden;
}

.slick-dots li{
  width: 2.25%;
  height: 2.25%;
  border-radius: 100%;
  overflow: hidden;
  /* padding: 0; */
  margin: 0 1.4%;
}

.slick-dots li button{
  background: #C9C9C9;
}

.slick-dots li.slick-active button{
  background: #B49DFF;
}

.slick-dots li button:before{
  width: 8px;
  height: 8px;
  padding: 0;
}

.sec2{
  background: #fff;
  border-radius: 16px;
  width: 92%;
  margin: 0 auto;
  margin-top: 14%;
  padding: 6% 2% 5.5%;
}

.listnew{
  margin-top: 3%;
}

.listnew dl{
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 1px solid #C9C9C9;
  padding: 2.5% 0;
  color: #374149;
}

.listnew dl dt{
  background: url(../images/ico-outlink.svg) no-repeat right center;
  background-size: 12%;
  flex: 0 0 26%;
  padding-right: 5%;
  margin-right: 5%;
}

.listnew dl dt,
.listnew dl dd{
  font-size: 3.3vw;
}

.listnew a{
  color: #374149;
  text-decoration: underline;
  white-space: pre-line;
}

.liststep{
  margin: 0 auto;
  margin-top: 12%;
  width: 92%;
}

.liststep li{
  margin-bottom: 4.5%;
}

.liststep li a{
  display: block;
}

.liststep li a img{
  width: 100%;
}

.num{
  display: flex;
  justify-content: center;
  align-items: center;
  background: #B49DFF;
}

.liststep li .num{
  min-width: 56px;
  align-self: stretch;
  padding: 5.5% 0;
  margin-right: 5%;
  flex: 0 0 14.55%;
}

.liststep li span:not(.num){
  font-size: 4.3vw;
}

.step{
  margin: 0 auto;
  margin-top: 19%;
  width: 96%;
  background: #fff;
  border-radius: 16px;
  padding: 13% 5% 3.5%;
  position: relative;
}

.step .num{
  position: absolute;
  left: 50%;
  aspect-ratio: 1/1;
  top: -25px;
  width: 14.55%;
  border-radius: 100%;
  margin-left: -7%;
}

.step h3{
  margin: 0 auto;
  margin-bottom: 7%;
  line-height: 1;
}


#step1 + .step p{
  text-align: center;
  width: 80%;
  margin: 0 auto;
}

#step1 + .step .img{
  width: 110%;
  margin: 0 auto;
  margin-left: -5%;
  margin-top: 4%;
  margin-bottom: 1%;
}

.step p.note{
  width: 80%;
  margin: 0 auto;
}

.substep {
  position: relative;
}

.substep::before{
  content: "";
  position: absolute;
  left: 3.8%;
  top: 0;
  width: 1px;
  height: 0;
  background: #F2C3FF;
  transition: height 1s ease;
  transition-delay: 1s;
  interpolate-size: allow-keywords;
}

.substep.step4::before{
  background: none;
}

.icostep{
  background: #F2C3FF;
  border-top-right-radius: 28px;
  border-bottom-right-radius: 28px;
  position: absolute;
  left: -6%;
  top: -3.4%;
  width: 20%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 3% 0;
}

.substep .txt{
  padding-left: 17.5%;
}

.substep .txt h4{
  font-size: 3.8vw;
  margin-bottom: 2%;
  color: #374149;
  font-weight: 800;
}

.substep .txt p{
  width: 98%;
}

.substep .txt .img{
  width: 98.38%;
  margin-top: 8%;
}

.substep .txt .img img{
  width: 100%;
}

.step1{
  margin-top: 12%;
}

.step2{
  margin-top: 9%;
}

.step3{
  margin-top: 10%;
}

.step4{
  margin-top: 10%;
}

.step4 .icon{
  width: 96%;
  margin-left: -4%;
  margin-top: 13%;
  justify-content: flex-start;
}

.step4 .icon > div{
  width: 30%;
}

#step2 + .step{
  padding-bottom: 8.5%;
}

.course h4{
  margin: 0 auto;
  width: 98%;
  line-height: 1;
}

.course1{
  margin-top: 11.5%;
}

.course .img{
  width: 96%;
  margin: 0 auto;
  margin-top: 4%;
  margin-bottom: 6%;
}

.course .dl{
  line-height: 1.5;
}

.course dl{
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 800;
  color: #374149;
}

.course dl dt{
  flex: 0 0 35%;
  margin-right: 0;
  text-align: right;
  font-size: 3.5vw;
}

.course dl dd{
  margin-left: 0;
  margin-right: auto;
  padding-left: 6%;
  font-size: 3.5vw;
}

.txtpay{
  margin: 0 auto;
  width: 94%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 4.55%;
}

.txtpay img{
  width: 94%;
}

.txtinfo {
  width: 96%;
  margin: 0 auto;
  margin-bottom: 2%;
}

.txtpay span{
  overflow: hidden;
  margin-right: 8px;
  box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
  flex: 0 0 11.2%;
}

.txtpay span img{
  width: 100%;
}

.course .img2{
  width: 85.1%;
  margin-top: 6%;
}

.course .img2 img{
  width: 100%;
}

.course1{
  background: url(../images/ico-dot.png) repeat-x left bottom;
  background-size: contain;
  padding-bottom: 4%;
  margin-bottom: 9.5%;
}

.txtsns{
  width: 83%;
  margin: 0 auto;
}

.banner{
  margin-top: 8%;
  margin-bottom: 4%;
}

.banner .item{
  overflow: hidden;
  aspect-ratio: 1/1;
  padding: 0 10px;
  display: flex !important;
  justify-content: center;
  align-items: center;
}

.banner .item img{
  width: 100%;
  border: 1px solid #fff;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.banner .item img:hover{
  transform: scale(1.05) translateY(-8px) translateZ(0);
}

@media all and (min-width: 751px) {
  .banner .item{
    padding: 0 20px;
  }
  .banner .item img{
    border-radius: 16px;
    border: 2px solid #fff;
  }
}

.sec4 .btn{
  margin: 0 auto;
  width: 83.09%;
  display: block;
  margin-bottom: 6.5%;
}

.sec4 .btn img{
  width: 100%;
}

@media all and (min-width: 580px) {
  .slick .item{
    border-radius: 32px;
  }
}

.sec4 .sns {
  margin-top: 7%;
  width: 68%;
  margin-bottom: 0;
}

.sec4 p:not(.note){
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-weight: 800;
  font-size: 3.8vw;
}

.sec4 p.note{
  margin: 0 auto;
  width: 92%;
  font-size: 3.2vw;
  margin-top: 7%;
}

@media all and (min-width: 575px) {
  .sec2{
    padding-top: 6%;
    margin-top: 15%;
  }
  .liststep li{
    border-radius: 32px;
    margin-bottom: 5%;
  }
  .liststep li .num{
    flex: 0 0 17%;
  }
  .liststep li:first-child .num img{
    width: 18%;
  }
  .liststep li:nth-child(2) .num img{
    width: 28%;
  }
  .liststep li:nth-child(3) .num img{
    width: 28%;
  }
  .step .num{
    width: 15%;
    top: -50px;
  }
  .step .num img{
    width: 21%;
  }
  #step1 + .step .img {
    width: 112%;
    margin-left: -6%;
    margin-top: 3%;
    margin-bottom: 0%;
  }
  #step2 + .step .num img,
  #step3 + .step .num img{
    width: 29%;
  }
  .icostep{
    border-top-right-radius: 56px;
    border-bottom-right-radius: 56px;
    padding: 2.5% 0;
    width: 19%;
  }
  .icostep img{
    width: 38%;
  }
  .substep::before{
    left: 2.8%;
  }
  .step2{
    margin-top: 10%;
  }
  .step4 .icon img{
    width: 100%;
  }
  .course1{
    padding-bottom: 5%;
  }
  .course .img{
    margin-top: 4%;
  }
  .course dl{
    line-height: 1.2;
  }
  .course dl dt,.course dl dd{
    font-size: 4.5vw;
  }
  .course .img2{
    margin-top: 7%;
    width: 85%;
  }
  .course2 .img{
    margin-bottom: 7.5%;
  }
  .banner {
    margin-top: 9%;
    margin-bottom: 4%;
  }
  .sec4 .sns{
    margin-top: 8%;
  }
  .footer li{
    margin-top: 3%;
    margin-bottom: 2%;
  }
}

@media all and (min-width: 750px) {
  .step {
    padding-top: 13%;
  }
  .step h3{
    font-size: 40px;
  }
  .listnew dl{
    padding: 2.7% 0;
  }
  .listnew dl dt, .listnew dl dd, .txtpa, .sec4 p.note, .footer li a, .footer p.copyright{
    font-size: 24px;
  }
  .liststep li span:not(.num){
    font-size: 32px;
  }
  #step1 + .step p, .substep .txt h4, .substep .txt p, .course dl dt, .course dl dd, .sec4 p:not(.note){
    font-size: 28px;
  }
  .step p.note{
    font-size: 24px !important;
  }
  .course dl{
    line-height: 1.5;
  }
  .course .img2{
    margin-top: 6%;
  }
  .sns{
    margin-top: 2%;
  }
  .step h3{
    margin-bottom: 7.5%;
  }
  #step1 + .step .img{
    margin-top: 3%;
  }
  .step4 .icon{
    margin-top: 14%;
  }
  .course1{
    margin-bottom: 9%;
  }
  .banner{
    margin-top: 9%;
    margin-bottom: 4%;
  }
  .sec4 .sns{
    margin-top: 7%;
  }
}

@media all and (max-width: 750px) {
  img{
    max-width: 100%;
  }
}

.footer .backtop {
  width: 100%;
  max-width: 100%;
  position: fixed;
  z-index: 8;
  bottom: 10%;
  right: 0;
}

.footer .backtop--icon {
  cursor: pointer;
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  zoom: 1;
  text-align: right;
  z-index: 8;
}

@media all and (max-width: 960px) {
  .footer .backtop--icon {
    left: inherit;
  }
}

.footer .backtop--icon img {
  width: 80px;
}

@media all and (max-width: 575px) {
  .footer .backtop--icon img {
    width: 60px;
  }
}

.secondpage .header{
  padding: 1.8% 0;
  background: url(../images/bghead.png) no-repeat center center;
  background-size: 100%;
}

.secondpage .header a{
  display: block;
  text-align: center;
  width: 45%;
  margin: 0 auto;
}

.secondpage .header::after{
  background: none;
}

.head h1{
  margin-top: 4.2%;
  width: 100%;
}

.head h1 img{
  width: 100%;
}

.titSearch{
  padding: 0 4%;
  line-height: 1;
  margin-bottom: 2.6%;
}

#searchform{
  margin: 0 auto;
  width: 92%;
  margin-top: 1%;
}

.blockFilter{
  background: #E2E2E2;
  padding-top: 5.4%;
  padding-bottom: 9%;
  margin-bottom: 4.3%;
}

.blockFilter.filtered{
  margin-bottom: 2.5%;
}

#searchform select{
  -webkit-appearance: none;  /* Safari/Chrome */
  -moz-appearance: none;     /* Firefox */
  appearance: none;          /* Tiêu chuẩn */
  margin: 0 auto;
  border: none;
  width: 100%;
  background: #fff url(../images/ico-arrow.png) no-repeat right 5% center;
  background-size: 5%;
  border-radius: 32px;
  padding: 4.4% 4.55%;
  font-size: 3.2vw;
  outline: none;
  color: #020200;
}

#searchform .dflex{
  margin-top: 6.5%;
  border-radius: 32px;
  background: #fff;
  overflow: hidden;
}

.txtfirst p {
  text-align: center;
  width: 88%;
  margin: 0 auto;
  position: relative;
}

.txtfirst p.text{
  margin-top: 7%;
}

.txtfirst p.text.nodata{
  margin-top: 5%;
}

.txtfirst .icon{
  width: 5%;
  margin: 0 auto;
  text-align: center;
  position: absolute;
  top: 11%;
  right: 22%;
}

.txtfirst .text.nodata img{
  margin-top: 5px;
  margin-left: 1%;
}

.txtfirst .nodata{
  display: none;
}

.txtfirst .ico img{
  width: 30%;
}

@media all and (min-width: 751px) {
  #searchform select, .stores #searchform .input input{
    font-size: 24px;
  }
}

@media all and (max-width: 575px) {
  #searchform select, #searchform .dflex{
    border-radius: 16px;
  }
}

.stores .result .title{
  display: none;
}

.marquee-wrapper {
  max-width: 750px;
  margin: 0 auto;
}

.marquee-container {
  position: relative;
  width: 100%;
  margin: 0 auto;
  margin-top: 40px;
  transition: height 0.3s ease;
}


.marquee-track {
  position: absolute;
  display: flex;
  height: 100%;
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
}

.marquee-item {
  flex: none;
  overflow: hidden;
  position: relative;
  transition: transform 0.3s ease, opacity 0.3s ease;
  aspect-ratio: 1/1;
}

.marquee-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  backface-visibility: hidden;
  transform: translateZ(0);
  transition: all 0.3s ease;
  border: 2px solid #fff;
}

@media all and (max-width: 514px) {
  .marquee-container {
    margin-top: 18px;
  }
  .marquee-image {
    border: 1px solid #fff;
  }
}

.marquee-item {
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  transform: translateZ(0);
}

.marquee-item:hover {
  transform: scale(1.05) translateY(-8px) translateZ(0);
}

.marquee-image {
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  transform: translateZ(0);
}

.imganimation.is-loaded img {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}

.step1 .icostep{
  animation-delay: 0.1s;
}

.substep.active::before{
  height: 115%;
}

.checkbox-wrapper-33{
  margin-top: 0.5%;
}

.checkbox .dflex{
  justify-content: flex-start;
  width: 100%;
}

.checkbox li{
  margin-right: 5%;
}


.checkbox li label{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  white-space: nowrap;
  font-size: 3vw;
}

.checkbox li label input{
  margin-right: 5px;
}


.checkbox-wrapper-33 {
  --s-xsmall: 0.625em;
  --s-small: 0.7em;
  --border-width: 1px;
  --c-primary: #B49DFF;
  --c-primary-20-percent-opacity: rgb(95 17 232 / 20%);
  --c-primary-10-percent-opacity: rgb(95 17 232 / 10%);
  --t-base: 0.4s;
  --t-fast: 0.2s;
  --e-in: ease-in;
  --e-out: cubic-bezier(.11,.29,.18,.98);
}

.checkbox-wrapper-33 .visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.checkbox-wrapper-33 .checkbox {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.checkbox-wrapper-33 .checkbox + .checkbox {
  margin-top: var(--s-small);
}
.checkbox-wrapper-33 .checkbox__symbol {
  display: inline-block;
  display: flex;
  margin-right: calc(var(--s-small) * 0.7);
  background: #fff;
  /* border: var(--border-width) solid var(--c-primary); */
  position: relative;
  border-radius: 0.1em;
  width: 1.3em;
  height: 1.3em;
  transition: box-shadow var(--t-base) var(--e-out), background-color var(--t-base);
  box-shadow: 0 0 0 0 var(--c-primary-10-percent-opacity);
}
.checkbox-wrapper-33 .checkbox__symbol:after {
  content: "";
  position: absolute;
  top: 0.5em;
  left: 0.5em;
  width: 0.25em;
  height: 0.25em;
  background-color: var(--c-primary-20-percent-opacity);
  opacity: 0;
  border-radius: 3em;
  transform: scale(1);
  transform-origin: 50% 50%;
}
.checkbox-wrapper-33 .checkbox .icon-checkbox {
  width: 1em;
  height: 1em;
  margin: auto;
  fill: none;
  stroke-width: 4;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
  color: var(--c-primary);
  display: inline-block;
}
.checkbox-wrapper-33 .checkbox .icon-checkbox path {
  transition: stroke-dashoffset var(--t-fast) var(--e-in);
  stroke-dasharray: 30px, 31px;
  stroke-dashoffset: 31px;
}
.checkbox-wrapper-33 .checkbox__textwrapper {
  margin: 0;
  font-size: 3.8vw;
}
/* .checkbox-wrapper-33 .checkbox__trigger:checked + .checkbox__symbol:after {
  -webkit-animation: ripple-33 1.5s var(--e-out);
          animation: ripple-33 1.5s var(--e-out);
} */
.checkbox-wrapper-33 .checkbox__trigger:checked + .checkbox__symbol .icon-checkbox path {
  transition: stroke-dashoffset var(--t-base) var(--e-out);
  stroke-dashoffset: 0px;
}

@-webkit-keyframes ripple-33 {
  from {
    transform: scale(0);
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: scale(20);
  }
}

@keyframes ripple-33 {
  from {
    transform: scale(0);
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: scale(20);
  }
}

#contact th.textarea{
  padding-top: 5.3%;
}

#contact th.imagesUpload{
  padding-top: 12.8%;
}

.btnUpload button{
  width: 100%;
}

.btnUpload img,
.btnimg img{
  width: 100%;
}

.btnUpload img{
  height: 100%;
  object-fit: contain;
}

.btnUpload .img{
  width: 56%;
  aspect-ratio: 3/2;
  background: #D9D9D9;
  border-radius: 5px;
}

@media all and (min-width: 751px) {
  .txtResult {
    font-size: 28px;
  }
  .contact table textarea,
  .checkbox-wrapper-33 .checkbox__textwrapper,
  .contact table input{
    font-size: 24px;
  }
  .checkbox-wrapper-33 .checkbox__symbol{
    width: 33px;
    height: 33px;
  }
  .checkbox-wrapper-33 .checkbox .icon-checkbox{
    width: 30px;
    height: 30px;
  }
}

#contact-confirm .note{
  width: 100%;
  line-height: 1;
  margin-top: 7%;
  margin-bottom: 7%;
}

#contact-confirm .note img{
  width: 100%;
}

#contact-confirm table td{
  font-size: 3.2vw;
}

#contact-confirm .btnUpload {
  margin-top: 3%;
}

#contact-confirm .form_submit {
  background: url(../images/line.svg) repeat-x top center;
  padding-top: 5.5%;
}

#contact-confirm .form_submit .txt{
  width: 90%;
  margin: 0 auto;
  position: relative;
  margin-bottom: 4.5%;
}

#contact-confirm .form_submit .txt span{
  position: absolute;
  bottom: 2%;
  width: 40%;
  left: 25%;
  line-height: 1;
  display: block;
}

#contact-confirm .form_submit .txt span a{
  width: 100%;
}

.form_submit button,
.form_submit a{
  cursor: pointer;
}

.btnimg a.backbutton{
  width: 35%;
  margin: 0 auto;
  line-height: 1;
  margin-top: 6%;
}

@media all and (min-width: 751px) {
  #contact-confirm table td{
    font-size: 24px;
  }
}

#contact-completed h3{
  line-height: 1;
  margin-top: 7.5%;
  margin-bottom: 7%;
}

#contact-completed .btnimg{
  margin-top: 10%;
}

.buttonImage{
  position: relative;
  margin-bottom: 2%;
}

.buttonImage label{
  cursor: pointer;
  display: block;
  width: 100%;
  transition: all .3s;
}

.buttonImage label:hover{
  opacity: .7;
}

.buttonImage input{
  position: absolute;
  left: 0;
  bottom: 0;
  text-indent: -9999px;
  z-index: -1;
}

.textComplete{
    font-size: 3.3vw;
    width: 94%;
    margin: 0 auto;
    text-align: justify;
    margin-bottom: 8%;
    font-weight: 400;
}

@media all and (min-width: 751px) {
  .textComplete{
    font-size: 24px;
  }
  .contact .error {
    font-size: 22px;
  }
}

.imageReview{
  width: 35%;
  /* overflow: hidden;
  aspect-ratio: 3/2;
  background: #D9D9D9; */
}

.imagePreviewWrap img, .imageReview img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ロード表示後、キャラクターをその場でふわふわ動かす */
.imgbanner .img4 img,
.imgbanner .img5 img {
  animation: mascotFloat 3.2s ease-in-out 1.2s infinite;
  transform-origin: center center;
  will-change: transform;
}

/* 2つのキャラが同じ動きにならないよう少しズラす */
.imgbanner .img5 img {
  animation-duration: 3.8s;
  animation-delay: 1.4s;
}

@keyframes mascotFloat {
  0% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
  25% {
    transform: translate3d(0, -8px, 0) rotate(-2deg);
  }
  50% {
    transform: translate3d(0, 0, 0) rotate(1deg);
  }
  75% {
    transform: translate3d(0, 6px, 0) rotate(2deg);
  }
  100% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
}

/* NEWS欄を一定高さで止めて、件数が多い時は中だけスクロール */
.sec2 .listnew {
  max-height: 220px;      /* 赤枠ぐらいの高さ。必要なら 200〜240px で調整 */
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch; /* iPhone/Androidでスワイプスクロールを滑らかに */
  padding-right: 8px;     /* スクロールバー分の余白 */
}

/* PC向け：スクロールバーを細めに */
.sec2 .listnew::-webkit-scrollbar {
  width: 6px;
}

.sec2 .listnew::-webkit-scrollbar-track {
  background: transparent;
}

.sec2 .listnew::-webkit-scrollbar-thumb {
  background: #d6c4ff;
  border-radius: 10px;
}

/* Firefox向け */
.sec2 .listnew {
  scrollbar-width: thin;
  scrollbar-color: #d6c4ff transparent;
}