@charset "UTF-8";
/* breakpoint */
/* */
/* */
@import url("https://use.typekit.net/lep4jjw.css");
/* */
/* Usual */
@-webkit-keyframes example { 100% { opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); } }

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

.__se { opacity: 1; }

/* ////////////////////////// */
/* reset //////////////////// */
/* ////////////////////////// */
/* アンチエイリアス: http://creator.dwango.co.jp/14128.html */
body { -webkit-font-smoothing: subpixel-antialiased; -moz-osx-font-smoothing: unset; }

@media only screen and (-webkit-min-device-pixel-ratio: 2), (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } }

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-style: normal; font-weight: normal; font-size: 100%; */ vertical-align: baseline; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; letter-spacing: .5px; }

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

html { overflow-y: scroll; }

blockquote, q { quotes: none; }

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

ol, ul { list-style: none; }

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

caption, th { text-align: left; }

a:focus { outline: none; }

.both { clear: both; }

.inline_block { display: inline-block; *display: inline; *zoom: 1; }

input:not([type=radio]):not([type=checkbox]), input:not([type=checkbox]):not([type=radio]), select, textarea { /* reset */ -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; background: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; outline: none; margin: 0; padding: 0; /* style */ width: 100%; padding: .5em; background-color: #f8f8f8; }

input[type="button"], input[type="submit"] { cursor: pointer; }

a { color: #000000; text-decoration: none; }

a:hover { text-decoration: none; }

a:focus { outline: none; }

img { max-width: 100%; height: auto; }

table { width: 100%; }

/* login icon */
.login h1 a { /* ORIGINAL background-image: url(../images/w-logo-blue.png?ver=20131202); background-image: none,url(../images/wordpress-logo.svg?ver=20131107); background-size: 84px; background-position: center top; background-repeat: no-repeat; color: #444; height: 84px; font-size: 20px; line-height: 1.3em; margin: 0 auto 25px; padding: 0; width: 84px; text-indent: -9999px; outline: 0; display: block; */ background-image: url(../img/login_suifu.svg); background-size: auto 54px; height: 54px; width: 100%; }

/* page navi */
.pagination .screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.pagination .page-numbers { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; }

.pagination .nav-links .page-link { /* &.prev { position: absolute; left: 0; } &.next { position: absolute; right: 0; } */ font: normal bold 16px/1 "HelveticaNeue", "Helvetica", sans-serif; width: 48px; height: 48px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #808080; background-color: transparent; border: 2px solid transparent; border-radius: 6px; }

.pagination .nav-links .page-link.prev, .pagination .nav-links .page-link.next { display: none; }

.pagination .nav-links .page-link.current { color: #fff; background-color: #808080; border: 2px solid #808080; }

.pagination .nav-links .page-link.next, .pagination .nav-links .page-link.prev { color: #808080; background-color: transparent; border: 2px solid #808080; }

.pagination .nav-links .page-link.dots { font-size: 0; font-weight: normal; }

.pagination .nav-links .page-link.dots:before { content: '—'; font: normal normal 16px/1 "HelveticaNeue", "Helvetica", sans-serif; }

.wp-pagenavi { padding-top: 150px; width: 100%; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; padding-left: 36px; padding-right: 36px; /* @include mq(sm) { .larger-2, .larger-3, .smaller-3, .smaller-2 { display: none; } } */ /* .pages, .last, .first, .extend { display: none; } a, span { // text-decoration: none; // margin: 0 5px; font: normal normal 18px/1 fontfamilies(primary); width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; color: #fff; background-color: #000; } a { &:hover { } } span { &.current { background-color: colors(primary); } } .nextpostslink { margin-left: auto; width: 25%; } .previouspostslink { display: none; } @include mq(sm) { flex-wrap: wrap; a, span { width: 20%; flex: 0 0 20%; max-width: 20%; } .nextpostslink { margin-top: 1px; width: 100%; flex: 0 0 100%; max-width: 100%; } } */ }

.wp-pagenavi .previouspostslink { position: absolute; left: 0; }

.wp-pagenavi .nextpostslink { position: absolute; right: 0; }

.wp-pagenavi .pages { display: none; }

.wp-pagenavi a, .wp-pagenavi span { font: normal bold 16px/1 "HelveticaNeue", "Helvetica", sans-serif; width: 36px; height: 36px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #808080; background-color: transparent; border: 2px solid transparent; border-radius: 6px; }

@media (max-width: 768px) { .wp-pagenavi a, .wp-pagenavi span { width: 30px; height: 30px; } }

.wp-pagenavi span.current { color: #fff; background-color: #808080; border: 2px solid #808080; }

.wp-pagenavi .nextpostslink, .wp-pagenavi .previouspostslink { color: #808080; background-color: transparent; border: 2px solid #808080; }

.wp-pagenavi .extend { font-weight: normal; }

.wp-singlenavi { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -.5px; margin-top: 60px; }

.wp-singlenavi div { padding: 0 .5px; width: 33.333333333333333%; -webkit-box-flex: 0; -ms-flex: 0 0 33.333333333333333%; flex: 0 0 33.333333333333333%; max-width: 33.333333333333333%; }

.wp-singlenavi div a { font: normal normal 18px/1 "rift", "Helvetica", sans-serif; height: 60px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; background-color: #000; }

/* cms */
.cms { /* --- 古い投稿スタイル --- */ }

.cms b, .cms strong { font-weight: bold; }

.cms p { font: normal bold 14px/2 "HelveticaNeue", "Helvetica", sans-serif; text-align: justify; text-justify: inter-ideograph; }

.cms a:not([class]) { text-decoration: underline; }

.cms .wp-block-button__link { font: normal bold 18px/1.25 "HelveticaNeue", "Helvetica", sans-serif; display: inline-block; padding: 1.25em 2em; border-radius: 1.875em; color: #fff; background-color: #333; }

.cms .wp-block-button__link[target="_blank"]:after { display: inline-block; content: ''; width: 12px; height: 12px; background-position: center; background-repeat: no-repeat; background-image: url(../img/icon_external.png); background-size: cover; opacity: .5; margin-left: 6px; }

.cms h2 { font: normal bold 48px/1.5 "HelveticaNeue", "Helvetica", sans-serif; text-align: left; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

@media (max-width: 768px) { .cms h2 { font-size: 24px; } }

.cms h3 { font: normal bold 36px/1.5 "HelveticaNeue", "Helvetica", sans-serif; color: #ff6600; text-align: left; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

@media (max-width: 768px) { .cms h3 { font-size: 18px; } }

.cms h4 { font: normal bold 24px/1.5 "HelveticaNeue", "Helvetica", sans-serif; text-align: left; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

@media (max-width: 768px) { .cms h4 { font-size: 16px; } }

.cms .wp-block-image img { display: block; width: 100%; height: auto; }

.cms .wp-block-image figcaption { font: normal normal 12px/1.5 "HelveticaNeue", "Helvetica", sans-serif; color: #808080; text-align: right; margin-top: 1em; }

.cms .wp-block-columns { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -24px -24px; }

@media (max-width: 992px) { .cms .wp-block-columns { margin: -12px -12px; } }

.cms .wp-block-columns .wp-block-column { position: relative; width: 100%; min-height: 1px; -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; padding: 24px 24px; }

@media (max-width: 992px) { .cms .wp-block-columns .wp-block-column { padding: 12px 12px; -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } }

.cms .wp-block-gallery { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.cms .wp-block-gallery .blocks-gallery-caption { font: normal normal 12px/1.5 "HelveticaNeue", "Helvetica", sans-serif; color: #808080; text-align: right; margin-top: 1em; }

.cms .wp-block-gallery .blocks-gallery-grid { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -12px -12px; }

@media (max-width: 768px) { .cms .wp-block-gallery .blocks-gallery-grid { margin: -6px -6px; } }

.cms .wp-block-gallery .blocks-gallery-grid .blocks-gallery-item { padding: 12px 12px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }

@media (max-width: 768px) { .cms .wp-block-gallery .blocks-gallery-grid .blocks-gallery-item { padding: 6px 6px; -webkit-box-flex: 0 !important; -ms-flex: 0 0 50% !important; flex: 0 0 50% !important; max-width: 50% !important; } }

.cms .wp-block-gallery .blocks-gallery-grid .blocks-gallery-item figure { position: relative; }

.cms .wp-block-gallery .blocks-gallery-grid .blocks-gallery-item figure img { display: block; }

.cms .wp-block-gallery .blocks-gallery-grid .blocks-gallery-item figure figcaption { position: absolute; bottom: 0; width: 100%; max-height: 100%; overflow: auto; padding: 3em 1em 1em; color: #fff; text-align: center; font: normal normal 12px/1.5 "HelveticaNeue", "Helvetica", sans-serif; background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), color-stop(70%, rgba(0, 0, 0, 0.3)), to(transparent)); background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.3) 70%, transparent); background: linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.3) 70%, transparent); }

.cms .wp-block-gallery.columns-1 .blocks-gallery-grid .blocks-gallery-item { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; }

.cms .wp-block-gallery.columns-2 .blocks-gallery-grid .blocks-gallery-item { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }

.cms .wp-block-gallery.columns-3 .blocks-gallery-grid .blocks-gallery-item { -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.33333%; max-width: 33.33333%; }

.cms .wp-block-gallery.columns-4 .blocks-gallery-grid .blocks-gallery-item { -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; }

.cms .wp-block-gallery.columns-5 .blocks-gallery-grid .blocks-gallery-item { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; }

.cms table tr th, .cms table tr td { padding: 1em; background-color: #f0f0f0; border: 1px solid #ddd; font: normal normal 16px/1.5 "HelveticaNeue", "Helvetica", sans-serif; }

@media (max-width: 768px) { .cms table tr th, .cms table tr td { font-size: 14px; } }

.cms table tr th:first-child, .cms table tr td:first-child { white-space: nowrap; }

.cms table tr th { font-weight: bold; }

.cms ol, .cms ul { font-size: 14px; margin: -.5em 0; }

.cms ol li, .cms ul li { padding: .5em 0; position: relative; font: normal bold 14px/1.25 "HelveticaNeue", "Helvetica", sans-serif; }

.cms ol:not([class]) { list-style-type: decimal; list-style-position: inside; }

.cms ol:not([class]) li { padding-left: 1.5em; text-indent: -1.25em; }

.cms ul:not([class]) li { padding-left: 9px; }

.cms ul:not([class]) li:before { content: ''; display: inline-block; position: absolute; top: 0; left: 0; margin: 1em 6px 0 0; width: 3px; height: 3px; border-radius: 50%; background-color: #000; }

.cms ol.asterisk, .cms ul.asterisk { margin-top: 0; list-style-type: none; list-style-position: inside; font-size: 12px; }

.cms ol.asterisk li, .cms ul.asterisk li { position: relative; padding-left: 1em; font-size: 12px; font-weight: normal; }

.cms ol.asterisk li:before, .cms ul.asterisk li:before { content: '※'; display: inline-block; position: absolute; top: 0; left: 0; margin: .4em 0 0 0; }

.cms hr { margin: 72px 0; border: 0; border-top: 1px solid #ccc; }

@media (max-width: 768px) { .cms hr { margin: 36px 0; } }

.cms .wp-block-image, .cms .wp-block-gallery, .cms .wp-block-button__link, .cms table, .cms ol, .cms ul { margin-bottom: 72px; }

.cms .wp-block-columns .wp-block-column .wp-block-image { margin-bottom: 0; }

.cms p + * { margin-top: 72px; }

.cms p + p { margin-top: 24px; }

.cms p, .cms h2, .cms h3, .cms h4 { margin-bottom: 24px; }

.cms.oldpost p img { display: block; width: 100%; height: auto; }

.cms.oldpost h5, .cms.oldpost h6 { font: normal bold 24px/1.5 "HelveticaNeue", "Helvetica", sans-serif; text-align: left; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; }

@media (max-width: 768px) { .cms.oldpost h5, .cms.oldpost h6 { font-size: 16px; } }

.cms.oldpost p + p { margin-top: 12px; }

.cms.oldpost p, .cms.oldpost h2, .cms.oldpost h3, .cms.oldpost h4 { margin-bottom: 12px; }

.cms.oldpost h5, .cms.oldpost h6 { margin-bottom: 12px; }

.cms.oldpost #gallery-2 { margin: auto; display: -webkit-box; display: -ms-flexbox; display: flex; margin: -12px -12px; margin-bottom: 72px; }

.cms.oldpost #gallery-2 .gallery-item { float: none; margin-top: 0; text-align: inherit; width: 20%; padding: 12px; -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; }

.cms.oldpost #gallery-2 .gallery-item .gallery-icon a { text-decoration: none; }

.cms.oldpost #gallery-2 .gallery-item .gallery-icon a img { border: 0; }

/* styles */
html { font-size: 75%; }

@media (max-width: 768px) { html { font-size: 100%; } }

/* { font-family: fontfamilies(neutral); cursor:url("../img/cursor.png"), auto; // cursor:-webkit-image-set(url("../img/cursor.png") 1x, url("../img/cursor.png") 2x) 0 0,pointer !important } */
::-moz-selection { background: #ff6600; background-color: rgba(255, 102, 0, 0.5); }
::selection, ::-moz-selection { background: #ff6600; background-color: rgba(255, 102, 0, 0.5); }

svg#hidemotorcycle .white { fill: #fff; fill-rule: evenodd; }

#wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-height: 100vh; position: relative; }

#wrapper footer { margin-top: auto; }

article { padding-bottom: 72px; }

@media (max-width: 768px) { article { padding-bottom: 36px; } }

section { padding: 72px 0; }

@media (max-width: 768px) { section { padding: 36px 0; } }

/* section + section { padding-bottom: 0; } */
.row { margin-top: -24px; margin-bottom: -24px; }

.row [class*="col-"] { padding-top: 24px; padding-bottom: 24px; }

@media (max-width: 768px) { .row { margin-left: -12px; margin-right: -12px; }
  .row [class*="col-"] { padding-left: 12px; padding-right: 12px; } }

/* tool */
.ratio { position: relative; padding-bottom: 100%; padding-top: 0; height: 0; overflow: hidden; }

.ratio .ratioin, .ratio iframe, .ratio img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; min-height: 100%; }

.ratio._32 { padding-bottom: 66.666666666667%; }

.ratio._21 { padding-bottom: 50%; }

.ratio._169 { padding-bottom: 56.25%; }

.ratio._23 { padding-bottom: 150%; }

.ratio._silver { padding-bottom: 70.721%; }

@media (max-width: 576px) { .ratio.reset-xs { padding-bottom: 0; height: auto; }
  .ratio.reset-xs .ratioin { position: static; } }

._objectfit img, ._objectfit video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; font-family: 'object-fit: cover; object-position: center;'; }

._objectfit._contain img, ._objectfit._contain video { -o-object-fit: contain; object-fit: contain; font-family: 'object-fit: contain;'; }

._objectfit.ratio img, ._objectfit.ratio video { position: absolute; }

/* WINNER */
#pagetop { position: fixed; bottom: 0; right: 0; z-index: 9999; }

@media (max-width: 768px) { #pagetop { display: none !important; } }

#pagetop a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 90px; height: 90px; background-color: #151515; color: #fff; }

#pagetop a:before { display: inline-block; content: ''; width: 18px; height: 18px; border: 0px; border-top: solid 2px #fff; border-left: solid 2px #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: 12.73px; }

/* WINNER */
#awards { padding: 0 0; position: relative; }

#awards .box { background-color: #000; padding: 90px 30px 30px; position: relative; z-index: 1; }

@media (max-width: 768px) { #awards .box { padding: 30px 30px; } }

#awards .box .h { position: absolute; top: 30px; left: 30px; color: #fff; font: normal 600 18px/1 "rift", "Helvetica", sans-serif; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }

#awards .box .desc { margin-top: 60px; text-align: center; color: gray; font: normal normal 11px/1.5 "HelveticaNeue", "Helvetica", sans-serif; }

@media (max-width: 992px) { #awards .box .desc { margin-top: 30px; text-align: left; text-align: justify; } }

#awards .box .list { text-align: center; padding: 0 60px; }

#awards .box .list ul { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; height: 100%; border: 1px solid #404040; }

#awards .box .list ul li { position: relative; min-height: 1px; border-right: 1px solid #404040; }

#awards .box .list ul li img { display: block; width: 210px; height: auto; }

#awards .box .list ul li:last-child { border-right: 0; }

@media (max-width: 768px) { #awards .box .list { padding-left: 42px; padding-right: 0; }
  #awards .box .list ul { display: block; }
  #awards .box .list ul li { border-right: 0; border-bottom: 1px solid #404040; }
  #awards .box .list ul li img { width: 100%; }
  #awards .box .list ul li:last-child { border-bottom: 0; } }

/* the_content */
.container-fluid { padding-right: 60px; padding-left: 60px; }

@media (max-width: 768px) { .container-fluid { padding-right: 24px; padding-left: 24px; } }

.icon-lock, .icon-private { display: inline-block; width: .75em; height: .75em; background-position: center; background-repeat: no-repeat; background-image: url(../img/icon-lock.svg); background-size: contain; margin-right: .25em; background-blend-mode: lighten; background-color: rgba(255, 255, 255, 0.75); }

/* MAP */
.googlemaps.pagebottom { padding-bottom: 38.195%; position: relative; padding-top: 0; height: 0; overflow: hidden; }

.googlemaps.pagebottom .googlemaps-hdm { position: absolute; top: 0; left: 0; width: 100%; height: 100%; min-height: 100%; }

@media (max-width: 768px) { .googlemaps.pagebottom { margin: 0 -24px; padding-bottom: 133.300%; } }

/* drawer */
#drawer { position: fixed; z-index: 998; top: 0; left: 0; width: 100%; height: 100%; background-color: black; opacity: 0; visibility: hidden; -webkit-transition: .3s; transition: .3s; }

#drawer .inbox { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: 100%; padding-bottom: 2rem; }

#drawer ul { text-align: center; margin: 0 -12px; }

@media (max-width: 992px) { #drawer ul { text-align: left; } }

#drawer ul > li { display: inline-block; padding: 0 12px; color: gray; font: normal normal 30px/1.5 "rift", "Helvetica", sans-serif; position: relative; /* anima */ visibility: hidden; opacity: 0; -webkit-transform: translateY(50%); transform: translateY(50%); }

@media (max-width: 992px) { #drawer ul > li { font: normal normal 24px/1.5 "rift", "Helvetica", sans-serif; } }

@media (max-width: 992px) { #drawer ul > li { display: block; } }

#drawer ul > li.parent { padding-top: 12px; padding-bottom: 12px; }

#drawer ul > li > ul { margin: 0 -9px; padding: 0 0 0; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

@media (max-width: 992px) { #drawer ul > li > ul { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } }

#drawer ul > li > ul > li { padding: 0 9px; display: inline-block; }

#drawer ul > li a { color: gray; font: normal normal 30px/1.5 "rift", "Helvetica", sans-serif; position: relative; }

@media (max-width: 992px) { #drawer ul > li a { font: normal normal 24px/1.5 "rift", "Helvetica", sans-serif; } }

#drawer ul > li a svg.icon { display: block; width: auto; height: 21px; fill: #808080; opacity: 1; -webkit-transition: 0.6s; transition: 0.6s; }

#drawer ul > li a svg.icon.cls-1 { fill-rule: evenodd; }

#drawer ul > li a svg.icon:hover { opacity: 1; }

#drawer ul > li a svg#youtube { height: 25px; }

#drawer ul > li a:after { content: ''; position: absolute; bottom: -4px; left: 0; width: 0; height: 1px; background-color: #fff; opacity: 0; -webkit-transition: .3s; transition: .3s; }

#drawer ul > li a:hover { color: #fff; }

#drawer ul > li a:hover:after { width: 100%; opacity: 1; }

.drawer-handle._hamburger { /* button reset */ border: 0; background: none; outline: none; margin: 0 0; display: block; padding: 5px 0; width: 1rem; /* Add */ display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; width: auto; color: #fff; font-size: 12px; }

.drawer-handle._hamburger .meat { display: block; position: relative; height: 1px; background-color: #fff; /* Add */ font-size: 12px; width: 1.5em; margin-left: 1em; }

.drawer-handle._hamburger .meat:before, .drawer-handle._hamburger .meat:after { content: ''; display: block; position: absolute; left: 0; width: 100%; height: 1px; background-color: #fff; -webkit-transition: .3s; transition: .3s; }

.drawer-handle._hamburger .meat:before { top: -5px; }

.drawer-handle._hamburger .meat:after { top: 5px; }

.drawer-handle._hamburger:hover .meat { background-color: gray; }

.drawer-handle._hamburger:hover .meat:before, .drawer-handle._hamburger:hover .meat:after { background-color: gray; }

body._draweropen #header { position: fixed; background-color: transparent; }

body._draweropen #header #navi .txt { display: none; }

body._draweropen #contents { margin-top: 64px; }

body._draweropen #footer { position: fixed; z-index: 999; left: 0; bottom: 0; width: 100%; background-color: transparent; }

body._draweropen #footer .inbox { border-top: 0; }

body._draweropen #footer * { color: gray; }

body._draweropen #footer img { -webkit-filter: invert(75%); -moz-filter: invert(75%); -o-filter: invert(75%); -ms-filter: invert(75%); filter: invert(75%); }

body._draweropen #drawer { visibility: visible; opacity: 1; }

body._draweropen #drawer ul li { visibility: visible; }

body._draweropen #drawer ul li:nth-child(1) { -webkit-animation: example 0.5s ease 0.2s 1 forwards; animation: example 0.5s ease 0.2s 1 forwards; }

body._draweropen #drawer ul li:nth-child(2) { -webkit-animation: example 0.5s ease 0.4s 1 forwards; animation: example 0.5s ease 0.4s 1 forwards; }

body._draweropen #drawer ul li:nth-child(3) { -webkit-animation: example 0.5s ease 0.6s 1 forwards; animation: example 0.5s ease 0.6s 1 forwards; }

body._draweropen #drawer ul li:nth-child(4) { -webkit-animation: example 0.5s ease 0.8s 1 forwards; animation: example 0.5s ease 0.8s 1 forwards; }

body._draweropen #drawer ul li:nth-child(5) { -webkit-animation: example 0.5s ease 1s 1 forwards; animation: example 0.5s ease 1s 1 forwards; }

body._draweropen #drawer ul li:nth-child(6) { -webkit-animation: example 0.5s ease 1.2s 1 forwards; animation: example 0.5s ease 1.2s 1 forwards; }

body._draweropen #drawer ul li:nth-child(7) { -webkit-animation: example 0.5s ease 1.4s 1 forwards; animation: example 0.5s ease 1.4s 1 forwards; }

body._draweropen #drawer ul li:nth-child(8) { -webkit-animation: example 0.5s ease 1.6s 1 forwards; animation: example 0.5s ease 1.6s 1 forwards; }

body._draweropen #drawer ul li:nth-child(9) { -webkit-animation: example 0.5s ease 1.8s 1 forwards; animation: example 0.5s ease 1.8s 1 forwards; }

body._draweropen #drawer ul li:nth-child(10) { -webkit-animation: example 0.5s ease 2s 1 forwards; animation: example 0.5s ease 2s 1 forwards; }

body._draweropen .drawer-handle._hamburger .meat, body._draweropen .drawer-handle._hamburger .meat { background-color: transparent; }

body._draweropen .drawer-handle._hamburger .meat:before, body._draweropen .drawer-handle._hamburger .meat:after, body._draweropen .drawer-handle._hamburger .meat:before, body._draweropen .drawer-handle._hamburger .meat:after { top: 0; }

body._draweropen .drawer-handle._hamburger .meat:before, body._draweropen .drawer-handle._hamburger .meat:before { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

body._draweropen .drawer-handle._hamburger .meat:after, body._draweropen .drawer-handle._hamburger .meat:after { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/** Swiper 5.2.1 Most modern mobile touch slider and framework with hardware accelerated transitions http://swiperjs.com Copyright 2014-2019 Vladimir Kharlampidi Released under the MIT License Released on: November 16, 2019 */
@font-face { font-family: 'swiper-icons'; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff"); font-weight: 400; font-style: normal; }

:root { /* --swiper-theme-color: colors(primary); */ }

.swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; /* Fix of Webkit flickering */ z-index: 1; }

.swiper-container-vertical > .swiper-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

.swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; }

.swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0px, 0, 0); transform: translate3d(0px, 0, 0); }

.swiper-container-multirow > .swiper-wrapper { -ms-flex-wrap: wrap; flex-wrap: wrap; }

.swiper-container-multirow-column > .swiper-wrapper { -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

.swiper-container-free-mode > .swiper-wrapper { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; }

.swiper-slide { -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; }

.swiper-slide-invisible-blank { visibility: hidden; }

/* Auto Height */
.swiper-container-autoheight { height: auto; }

.swiper-container-autoheight .swiper-slide { height: auto; }

.swiper-container-autoheight .swiper-wrapper { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-transition-property: height, -webkit-transform; transition-property: height, -webkit-transform; transition-property: transform, height; transition-property: transform, height, -webkit-transform; }

/* 3D Effects */
.swiper-container-3d { -webkit-perspective: 1200px; perspective: 1200px; }

.swiper-container-3d .swiper-wrapper, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-cube-shadow { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; }

.swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-slide-shadow-bottom { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; }

.swiper-container-3d .swiper-slide-shadow-left { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }

.swiper-container-3d .swiper-slide-shadow-right { background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }

.swiper-container-3d .swiper-slide-shadow-top { background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }

.swiper-container-3d .swiper-slide-shadow-bottom { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); }

/* CSS Mode */
.swiper-container-css-mode > .swiper-wrapper { overflow: auto; scrollbar-width: none; /* For Firefox */ -ms-overflow-style: none; /* For Internet Explorer and Edge */ }

.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar { display: none; }

.swiper-container-css-mode > .swiper-wrapper > .swiper-slide { scroll-snap-align: start start; }

.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper { -ms-scroll-snap-type: x mandatory; scroll-snap-type: x mandatory; }

.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper { -ms-scroll-snap-type: y mandatory; scroll-snap-type: y mandatory; }

:root { --swiper-navigation-size:44px; /* --swiper-navigation-color: var(--swiper-theme-color); */ }

.swiper-button-prev, .swiper-button-next { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size) / 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(-1 * var(--swiper-navigation-size) / 2); z-index: 10; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)); outline: none; }

.swiper-button-prev.swiper-button-disabled, .swiper-button-next.swiper-button-disabled { opacity: 0.35; cursor: auto; pointer-events: none; }

.swiper-button-prev:after, .swiper-button-next:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: initial; }

.swiper-button-prev, .swiper-container-rtl .swiper-button-next { left: 10px; right: auto; }

.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after { content: 'prev'; }

.swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: 10px; left: auto; }

.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after { content: 'next'; }

.swiper-button-prev.swiper-button-white, .swiper-button-next.swiper-button-white { --swiper-navigation-color:#ffffff; }

.swiper-button-prev.swiper-button-black, .swiper-button-next.swiper-button-black { --swiper-navigation-color:#000000; }

.swiper-button-lock { display: none; }

:root { /* --swiper-pagination-color: var(--swiper-theme-color); */ }

.swiper-pagination { position: absolute; text-align: center; -webkit-transition: 300ms opacity; transition: 300ms opacity; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; }

.swiper-pagination.swiper-pagination-hidden { opacity: 0; }

/* Common Styles */
.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets { bottom: 10px; bottom: -42px; left: 0; width: 100%; }

/* Bullets */
.swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0; }

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transform: scale(0.33); transform: scale(0.33); position: relative; }

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { -webkit-transform: scale(1); transform: scale(1); }

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { -webkit-transform: scale(0.66); transform: scale(0.66); }

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { -webkit-transform: scale(0.33); transform: scale(0.33); }

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { -webkit-transform: scale(0.66); transform: scale(0.66); }

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { -webkit-transform: scale(0.33); transform: scale(0.33); }

.swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; border-radius: 100%; background: #808080; opacity: 0.25; }

button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

.swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer; }

.swiper-pagination-bullet-active { opacity: 1; background: #ff6600; }

.swiper-container-vertical > .swiper-pagination-bullets { right: 10px; top: 50%; -webkit-transform: translate3d(0px, -50%, 0); transform: translate3d(0px, -50%, 0); }

.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 6px 0; display: block; }

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 8px; }

.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; -webkit-transition: 200ms top, 200ms -webkit-transform; transition: 200ms top, 200ms -webkit-transform; transition: 200ms transform, 200ms top; transition: 200ms transform, 200ms top, 200ms -webkit-transform; }

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 4px; }

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap; }

.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: 200ms left, 200ms -webkit-transform; transition: 200ms left, 200ms -webkit-transform; transition: 200ms transform, 200ms left; transition: 200ms transform, 200ms left, 200ms -webkit-transform; }

.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: 200ms right, 200ms -webkit-transform; transition: 200ms right, 200ms -webkit-transform; transition: 200ms transform, 200ms right; transition: 200ms transform, 200ms right, 200ms -webkit-transform; }

/* Progress */
.swiper-pagination-progressbar { background: rgba(0, 0, 0, 0.25); position: absolute; }

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color, var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: left top; transform-origin: left top; }

.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { -webkit-transform-origin: right top; transform-origin: right top; }

.swiper-container-horizontal > .swiper-pagination-progressbar { width: 100%; height: 4px; left: 0; top: 0; }

.swiper-container-vertical > .swiper-pagination-progressbar { width: 4px; height: 100%; left: 0; top: 0; }

.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 100%; height: 4px; left: 0; top: 0; }

.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 4px; height: 100%; left: 0; top: 0; }

.swiper-pagination-white { --swiper-pagination-color:#ffffff; }

.swiper-pagination-black { --swiper-pagination-color:#000000; }

.swiper-pagination-lock { display: none; }

/* Scrollbar */
.swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1); }

.swiper-container-horizontal > .swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98%; }

.swiper-container-vertical > .swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98%; }

.swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0; }

.swiper-scrollbar-cursor-drag { cursor: move; }

.swiper-scrollbar-lock { display: none; }

.swiper-zoom-container { width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; }

.swiper-zoom-container > img, .swiper-zoom-container > svg, .swiper-zoom-container > canvas { max-width: 100%; max-height: 100%; -o-object-fit: contain; object-fit: contain; }

.swiper-slide-zoomed { cursor: move; }

/* Preloader */
:root { /* --swiper-preloader-color: var(--swiper-theme-color); */ }

.swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-animation: swiper-preloader-spin 1s infinite linear; animation: swiper-preloader-spin 1s infinite linear; -webkit-box-sizing: border-box; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent; }

.swiper-lazy-preloader-white { --swiper-preloader-color:#fff; }

.swiper-lazy-preloader-black { --swiper-preloader-color:#000; }

@-webkit-keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

/* a11y */
.swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; }

.swiper-container-fade.swiper-container-free-mode .swiper-slide { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }

.swiper-container-fade .swiper-slide { pointer-events: none; -webkit-transition-property: opacity; transition-property: opacity; }

.swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none; }

.swiper-container-fade .swiper-slide-active { pointer-events: auto; }

.swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto; }

.swiper-container-cube { overflow: visible; }

.swiper-container-cube .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; -webkit-transform-origin: 0 0; transform-origin: 0 0; width: 100%; height: 100%; }

.swiper-container-cube .swiper-slide .swiper-slide { pointer-events: none; }

.swiper-container-cube.swiper-container-rtl .swiper-slide { -webkit-transform-origin: 100% 0; transform-origin: 100% 0; }

.swiper-container-cube .swiper-slide-active { pointer-events: auto; pointer-events: auto; visibility: visible; }

.swiper-container-cube .swiper-slide-active .swiper-slide-active { pointer-events: auto; }

.swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-prev, .swiper-container-cube .swiper-slide-next + .swiper-slide { pointer-events: auto; visibility: visible; }

.swiper-container-cube .swiper-slide-shadow-top, .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.swiper-container-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0px; width: 100%; height: 100%; background: #000; opacity: 0.6; -webkit-filter: blur(50px); filter: blur(50px); z-index: 0; }

.swiper-container-flip { overflow: visible; }

.swiper-container-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; }

.swiper-container-flip .swiper-slide .swiper-slide { pointer-events: none; }

.swiper-container-flip .swiper-slide-active { pointer-events: auto; }

.swiper-container-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto; }

.swiper-container-flip .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

/*! PhotoSwipe main CSS by Dmitry Semenov | photoswipe.com | MIT license */
/* Styles for basic PhotoSwipe functionality (sliding area, open/close transitions) */
/* pswp = photoswipe */
.pswp { display: none; position: absolute; width: 100%; height: 100%; left: 0; top: 0; overflow: hidden; -ms-touch-action: none; touch-action: none; z-index: 1500; -webkit-text-size-adjust: 100%; /* create separate layer, to avoid paint on window.onscroll in webkit/blink */ -webkit-backface-visibility: hidden; outline: none; }

.pswp * { -webkit-box-sizing: border-box; box-sizing: border-box; }

.pswp img { max-width: none; }

/* style is added when JS option showHideOpacity is set to true */
.pswp--animate_opacity { /* 0.001, because opacity:0 doesn't trigger Paint action, which causes lag at start of transition */ opacity: 0.001; will-change: opacity; /* for open/close transition */ -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }

.pswp--open { display: block; }

.pswp--zoom-allowed .pswp__img { /* autoprefixer: off */ cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; }

.pswp--zoomed-in .pswp__img { /* autoprefixer: off */ cursor: -webkit-grab; cursor: -moz-grab; cursor: grab; }

.pswp--dragging .pswp__img { /* autoprefixer: off */ cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: grabbing; }

/* Background is added as a separate element. As animating opacity is much faster than animating rgba() background-color. */
.pswp__bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000; opacity: 0; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; will-change: opacity; }

.pswp__scroll-wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; }

.pswp__container, .pswp__zoom-wrap { -ms-touch-action: none; touch-action: none; position: absolute; left: 0; right: 0; top: 0; bottom: 0; }

/* Prevent selection and tap highlights */
.pswp__container, .pswp__img { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; }

.pswp__zoom-wrap { position: absolute; width: 100%; -webkit-transform-origin: left top; transform-origin: left top; /* for open/close transition */ -webkit-transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: transform 333ms cubic-bezier(0.4, 0, 0.22, 1), -webkit-transform 333ms cubic-bezier(0.4, 0, 0.22, 1); }

.pswp__bg { will-change: opacity; /* for open/close transition */ -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }

.pswp--animated-in .pswp__bg, .pswp--animated-in .pswp__zoom-wrap { -webkit-transition: none; transition: none; }

.pswp__container, .pswp__zoom-wrap { -webkit-backface-visibility: hidden; }

.pswp__item { position: absolute; left: 0; right: 0; top: 0; bottom: 0; overflow: hidden; }

.pswp__img { position: absolute; width: auto; height: auto; top: 0; left: 0; }

/* stretched thumbnail or div placeholder element (see below) style is added to avoid flickering in webkit/blink when layers overlap */
.pswp__img--placeholder { -webkit-backface-visibility: hidden; }

/* div element that matches size of large image large image loads on top of it */
.pswp__img--placeholder--blank { background: #222; }

.pswp--ie .pswp__img { width: 100% !important; height: auto !important; left: 0; top: 0; }

/* Error message appears when image is not loaded (JS option errorMsg controls markup) */
.pswp__error-msg { position: absolute; left: 0; top: 50%; width: 100%; text-align: center; font-size: 14px; line-height: 16px; margin-top: -8px; color: #CCC; }

.pswp__error-msg a { color: #CCC; text-decoration: underline; }

/*! PhotoSwipe Default UI CSS by Dmitry Semenov | photoswipe.com | MIT license */
/*

	Contents:

	1. Buttons
	2. Share modal and links
	3. Index indicator ("1 of X" counter)
	4. Caption
	5. Loading indicator
	6. Additional styles (root element, top bar, idle state, hidden state, etc.)

*/
/* 1. Buttons */
/* <button> css reset */
.pswp__button { width: 44px; height: 44px; position: relative; background: none; cursor: pointer; overflow: visible; -webkit-appearance: none; display: block; border: 0; padding: 0; margin: 0; float: right; opacity: 0.75; -webkit-transition: opacity 0.2s; transition: opacity 0.2s; -webkit-box-shadow: none; box-shadow: none; }

.pswp__button:focus, .pswp__button:hover { opacity: 1; }

.pswp__button:active { outline: none; opacity: 0.9; }

.pswp__button::-moz-focus-inner { padding: 0; border: 0; }

/* pswp__ui--over-close class it added when mouse is over element that should close gallery */
.pswp__ui--over-close .pswp__button--close { opacity: 1; }

.pswp__button, .pswp__button--arrow--left:before, .pswp__button--arrow--right:before { background: url(../img/photoswipe-skin.png) 0 0 no-repeat; background-size: 264px 88px; width: 44px; height: 44px; }

@media (-webkit-min-device-pixel-ratio: 1.1), (-webkit-min-device-pixel-ratio: 1.09375), (min-resolution: 105dpi), (min-resolution: 1.1dppx) { /* Serve SVG sprite if browser supports SVG and resolution is more than 105dpi */
  .pswp--svg .pswp__button, .pswp--svg .pswp__button--arrow--left:before, .pswp--svg .pswp__button--arrow--right:before { background-image: url(../img/photoswipe-skin.svg); }
  .pswp--svg .pswp__button--arrow--left, .pswp--svg .pswp__button--arrow--right { background: none; } }

.pswp__button--close { background-position: 0 -44px; }

.pswp__button--share { background-position: -44px -44px; display: none; }

.pswp__button--fs { display: none; }

.pswp--supports-fs .pswp__button--fs { display: block; display: none; }

.pswp--fs .pswp__button--fs { background-position: -44px 0; display: none; }

.pswp__button--zoom { display: none; background-position: -88px 0; }

.pswp--zoom-allowed .pswp__button--zoom { display: block; display: none; }

.pswp--zoomed-in .pswp__button--zoom { background-position: -132px 0; display: none; }

/* no arrows on touch screens */
.pswp--touch .pswp__button--arrow--left, .pswp--touch .pswp__button--arrow--right { visibility: hidden; }

/* Arrow buttons hit area (icon is added to :before pseudo-element) */
.pswp__button--arrow--left, .pswp__button--arrow--right { background: none; top: 50%; margin-top: -50px; width: 70px; height: 100px; position: absolute; }

.pswp__button--arrow--left { left: 0; }

.pswp__button--arrow--right { right: 0; }

.pswp__button--arrow--left:before, .pswp__button--arrow--right:before { content: ''; top: 35px; background-color: rgba(0, 0, 0, 0.3); height: 30px; width: 32px; position: absolute; }

.pswp__button--arrow--left:before { left: 6px; background-position: -138px -44px; }

.pswp__button--arrow--right:before { right: 6px; background-position: -94px -44px; }

/* 2. Share modal/popup and links */
.pswp__counter, .pswp__share-modal { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

.pswp__share-modal { display: block; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; top: 0; left: 0; padding: 10px; position: absolute; z-index: 1600; opacity: 0; -webkit-transition: opacity 0.25s ease-out; transition: opacity 0.25s ease-out; -webkit-backface-visibility: hidden; will-change: opacity; }

.pswp__share-modal--hidden { display: none; }

.pswp__share-tooltip { z-index: 1620; position: absolute; background: #FFF; top: 56px; border-radius: 2px; display: block; width: auto; right: 44px; -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25); -webkit-transform: translateY(6px); transform: translateY(6px); -webkit-transition: -webkit-transform 0.25s; transition: -webkit-transform 0.25s; transition: transform 0.25s; transition: transform 0.25s, -webkit-transform 0.25s; -webkit-backface-visibility: hidden; will-change: transform; }

.pswp__share-tooltip a { display: block; padding: 8px 12px; color: #000; text-decoration: none; font-size: 14px; line-height: 18px; }

.pswp__share-tooltip a:hover { text-decoration: none; color: #000; }

.pswp__share-tooltip a:first-child { /* round corners on the first/last list item */ border-radius: 2px 2px 0 0; }

.pswp__share-tooltip a:last-child { border-radius: 0 0 2px 2px; }

.pswp__share-modal--fade-in { opacity: 1; }

.pswp__share-modal--fade-in .pswp__share-tooltip { -webkit-transform: translateY(0); transform: translateY(0); }

/* increase size of share links on touch devices */
.pswp--touch .pswp__share-tooltip a { padding: 16px 12px; }

a.pswp__share--facebook:before { content: ''; display: block; width: 0; height: 0; position: absolute; top: -12px; right: 15px; border: 6px solid transparent; border-bottom-color: #FFF; -webkit-pointer-events: none; -moz-pointer-events: none; pointer-events: none; }

a.pswp__share--facebook:hover { background: #3E5C9A; color: #FFF; }

a.pswp__share--facebook:hover:before { border-bottom-color: #3E5C9A; }

a.pswp__share--twitter:hover { background: #55ACEE; color: #FFF; }

a.pswp__share--pinterest:hover { background: #CCC; color: #CE272D; }

a.pswp__share--download:hover { background: #DDD; }

/* 3. Index indicator ("1 of X" counter) */
.pswp__counter { position: absolute; left: 0; top: 0; height: 44px; font-size: 13px; line-height: 44px; color: #FFF; opacity: 0.75; padding: 0 10px; }

/* 4. Caption */
.pswp__caption { position: absolute; left: 0; bottom: 0; width: 100%; min-height: 44px; }

.pswp__caption small { font-size: 11px; color: #BBB; }

.pswp__caption__center { text-align: left; text-align: center; margin: 0 auto; font-size: 12px; padding: 10px; line-height: 1.5; color: #CCC; }

.pswp__caption--empty { display: none; }

/* Fake caption element, used to calculate height of next/prev image */
.pswp__caption--fake { visibility: hidden; }

/* 5. Loading indicator (preloader) You can play with it here - http://codepen.io/dimsemenov/pen/yyBWoR */
.pswp__preloader { width: 44px; height: 44px; position: absolute; top: 0; left: 50%; margin-left: -22px; opacity: 0; -webkit-transition: opacity 0.25s ease-out; transition: opacity 0.25s ease-out; will-change: opacity; direction: ltr; }

.pswp__preloader__icn { width: 20px; height: 20px; margin: 12px; }

.pswp__preloader--active { opacity: 1; }

.pswp__preloader--active .pswp__preloader__icn { /* We use .gif in browsers that don't support CSS animation */ background: url(../img/photoswipe-preloader.gif) 0 0 no-repeat; }

.pswp--css_animation .pswp__preloader--active { opacity: 1; }

.pswp--css_animation .pswp__preloader--active .pswp__preloader__icn { -webkit-animation: clockwise 500ms linear infinite; animation: clockwise 500ms linear infinite; }

.pswp--css_animation .pswp__preloader--active .pswp__preloader__donut { -webkit-animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite; animation: donut-rotate 1000ms cubic-bezier(0.4, 0, 0.22, 1) infinite; }

.pswp--css_animation .pswp__preloader__icn { background: none; opacity: 0.75; width: 14px; height: 14px; position: absolute; left: 15px; top: 15px; margin: 0; }

.pswp--css_animation .pswp__preloader__cut { /* The idea of animating inner circle is based on Polymer ("material") loading indicator by Keanu Lee https://blog.keanulee.com/2014/10/20/the-tale-of-three-spinners.html */ position: relative; width: 7px; height: 14px; overflow: hidden; }

.pswp--css_animation .pswp__preloader__donut { -webkit-box-sizing: border-box; box-sizing: border-box; width: 14px; height: 14px; border: 2px solid #FFF; border-radius: 50%; border-left-color: transparent; border-bottom-color: transparent; position: absolute; top: 0; left: 0; background: none; margin: 0; }

@media screen and (max-width: 1024px) { .pswp__preloader { position: relative; left: auto; top: auto; margin: 0; float: right; } }

@-webkit-keyframes clockwise { 0% { -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes clockwise { 0% { -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@-webkit-keyframes donut-rotate { 0% { -webkit-transform: rotate(0);
    transform: rotate(0); }
  50% { -webkit-transform: rotate(-140deg);
    transform: rotate(-140deg); }
  100% { -webkit-transform: rotate(0);
    transform: rotate(0); } }

@keyframes donut-rotate { 0% { -webkit-transform: rotate(0);
    transform: rotate(0); }
  50% { -webkit-transform: rotate(-140deg);
    transform: rotate(-140deg); }
  100% { -webkit-transform: rotate(0);
    transform: rotate(0); } }

/* 6. Additional styles */
/* root element of UI */
.pswp__ui { -webkit-font-smoothing: auto; visibility: visible; opacity: 1; z-index: 1550; }

/* top black bar with buttons and "1 of X" indicator */
.pswp__top-bar { position: absolute; left: 0; top: 0; height: 44px; width: 100%; }

.pswp__caption, .pswp__top-bar, .pswp--has_mouse .pswp__button--arrow--left, .pswp--has_mouse .pswp__button--arrow--right { -webkit-backface-visibility: hidden; will-change: opacity; -webkit-transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); transition: opacity 333ms cubic-bezier(0.4, 0, 0.22, 1); }

/* pswp--has_mouse class is added only when two subsequent mousemove events occur */
.pswp--has_mouse .pswp__button--arrow--left, .pswp--has_mouse .pswp__button--arrow--right { visibility: visible; }

.pswp__top-bar, .pswp__caption { background-color: rgba(0, 0, 0, 0.5); }

/* pswp__ui--fit class is added when main image "fits" between top bar and bottom bar (caption) */
.pswp__ui--fit .pswp__top-bar, .pswp__ui--fit .pswp__caption { background-color: rgba(0, 0, 0, 0.3); }

/* pswp__ui--idle class is added when mouse isn't moving for several seconds (JS option timeToIdle) */
.pswp__ui--idle .pswp__top-bar { opacity: 0; }

.pswp__ui--idle .pswp__button--arrow--left, .pswp__ui--idle .pswp__button--arrow--right { opacity: 0; }

/* pswp__ui--hidden class is added when controls are hidden e.g. when user taps to toggle visibility of controls */
.pswp__ui--hidden .pswp__top-bar, .pswp__ui--hidden .pswp__caption, .pswp__ui--hidden .pswp__button--arrow--left, .pswp__ui--hidden .pswp__button--arrow--right { /* Force paint & create composition layer for controls. */ opacity: 0.001; }

/* pswp__ui--one-slide class is added when there is just one item in gallery */
.pswp__ui--one-slide .pswp__button--arrow--left, .pswp__ui--one-slide .pswp__button--arrow--right, .pswp__ui--one-slide .pswp__counter { display: none; }

.pswp__element--disabled { display: none !important; }

.pswp--minimal--dark .pswp__top-bar { background: none; }

/** Featherlight – ultra slim jQuery lightbox Version 1.7.14 - http://noelboss.github.io/featherlight/ Copyright 2019, Noël Raoul Bossart (http://www.noelboss.com) MIT Licensed. */
html.with-featherlight { /* disable global scrolling when featherlights are visible */ overflow: hidden; }

.featherlight { display: none; /* dimensions: spanning the background from edge to edge */ position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2147483647; /* z-index needs to be >= elements on the site. */ /* position: centering content */ text-align: center; /* insures that the ::before pseudo element doesn't force wrap with fixed width content; */ white-space: nowrap; /* styling */ cursor: pointer; background: #333; /* IE8 "hack" for nested featherlights */ background: rgba(0, 0, 0, 0); }

/* support for nested featherlights. Does not work in IE8 (use JS to fix) */
.featherlight:last-of-type { background: rgba(0, 0, 0, 0.8); }

.featherlight:before { /* position: trick to center content vertically */ content: ''; display: inline-block; height: 100%; vertical-align: middle; }

.featherlight .featherlight-content { /* make content container for positioned elements (close button) */ position: relative; /* position: centering vertical and horizontal */ text-align: left; vertical-align: middle; display: inline-block; /* dimensions: cut off images */ overflow: auto; padding: 60px; /* dimensions: handling large content */ margin: 0 auto; max-height: 80%; /* styling */ background: #fff; cursor: auto; /* reset white-space wrapping */ white-space: normal; }

/* contains the content */
.featherlight .featherlight-inner { /* make sure its visible */ display: block; }

/* don't show these though */
.featherlight script.featherlight-inner, .featherlight link.featherlight-inner, .featherlight style.featherlight-inner { display: none; }

.featherlight .featherlight-close-icon { /* position: centering vertical and horizontal */ position: absolute; z-index: 9999; top: 0; right: 0; /* dimensions: 25px x 25px */ line-height: 25px; width: 25px; /* styling */ cursor: pointer; text-align: center; font-family: Arial, sans-serif; background: #fff; /* Set the background in case it overlaps the content */ background: rgba(255, 255, 255, 0.3); color: #000; border: none; padding: 0; }

/* See http://stackoverflow.com/questions/16077341/how-to-reset-all-default-styles-of-the-html5-button-element */
.featherlight .featherlight-close-icon::-moz-focus-inner { border: 0; padding: 0; }

.featherlight .featherlight-image { /* styling */ width: 100%; }

.featherlight-iframe .featherlight-content { /* removed the border for image croping since iframe is edge to edge */ border-bottom: 0; padding: 0; -webkit-overflow-scrolling: touch; }

.featherlight iframe { /* styling */ border: none; }

.featherlight * { /* See https://github.com/noelboss/featherlight/issues/42 */ -webkit-box-sizing: border-box; box-sizing: border-box; }

/* handling phones and small screens */
@media only screen and (max-width: 1024px) { .featherlight .featherlight-content { /* dimensions: maximize lightbox with for small screens */ margin-left: 0; margin-right: 0; max-height: 98%; padding: 10px 10px 0; border-bottom: 10px solid transparent; } }

/* hide non featherlight items when printing */
@media print { html.with-featherlight > * > :not(.featherlight) { display: none; } }

/* header */
#header { /* //  position: fixed; //  position: relative; position: absolute; top: 0; left: 0; */ position: fixed; z-index: 999; width: 100%; background-color: #262626; -webkit-transition: .3s; transition: .3s; padding: 18px 0; /* @include mq(sm) { // padding: 12px 0; background-color: rgba(0,0,0,0); position: absolute; } */ }

#header.hide { -webkit-transform: translateY(-100%); transform: translateY(-100%); }

#header .container { max-width: none; padding: 0 132px; }

@media (max-width: 768px) { #header .container { padding: 0 24px; } }

#header #navi { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

#header #navi .left { min-width: 150px; margin-right: auto; }

#header #navi .right { min-width: 150px; margin-left: auto; text-align: right; }

#header #navi .right > ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin: 0 -6px; }

#header #navi .right > ul > li { padding: 0 6px; }

#header #navi .right > ul > li a { display: block; -webkit-transition: .3s; transition: .3s; }

#header #navi .right > ul > li a svg.icon { display: block; width: auto; height: 16px; fill: #808080; opacity: 1; -webkit-transition: 0.6s; transition: 0.6s; }

#header #navi .right > ul > li a svg.icon.cls-1 { fill-rule: evenodd; }

#header #navi .right > ul > li a svg.icon:hover { opacity: 1; }

#header #navi .right > ul > li a svg#youtube { height: 20px; }

#header #navi .center { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; }

#header #navi .center > ul { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0 -12px; }

#header #navi .center > ul > li { padding: 0 12px; /* > ul { margin: 0 -9px; > li { padding: 0 9px; } } svg { &.icon { display: block; width: auto; height: 16px; fill: #808080; opacity: 1; transition: 0.6s; &.cls-1 { fill-rule: evenodd; } &:hover { opacity: 1; } } &#youtube { height: 20px; } } */ }

#header #navi .center > ul > li a { display: block; -webkit-transition: .3s; transition: .3s; }

#header #navi .center > ul > li.txt a { color: #bfbfbf; font: normal normal 10px/1.5 "HelveticaNeue", "Helvetica", sans-serif; position: relative; /* &:after { content: ''; position: absolute; width: 0; height: 1px; bottom: -2px; left: 0; background-color: #000; opacity: 0; transition: .3s; } */ }

#header #navi .center > ul > li.txt a:hover { color: #fff; }

#header #navi .center > ul > li.txt a:hover:after { width: 100%; opacity: 1; }

#header #navi .center > ul > li.parent ul { position: absolute; top: 100%; left: 0; width: 100%; padding: 1.5em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #ccc; color: #000; visibility: hidden; -webkit-transition: .3s; transition: .3s; }

#header #navi .center > ul > li.parent ul > li { padding: 0 12px; }

#header #navi .center > ul > li.parent ul > li a { display: block; }

#header #navi .center > ul > li.parent:hover ul { visibility: visible; -webkit-transition: .3s; transition: .3s; }

#header #navi .center > ul > li.parent:hover ul li a { color: #000; }

#header #navi .home { margin-right: auto; }

#header #navi .home a { color: #000; }

#header #navi .home a img { display: block; width: 230px; height: auto; -webkit-transition: .3s; transition: .3s; }

@media (max-width: 768px) { #header #navi .home a img { width: 186px; } }

#header #navi .home a svg#hidemotorcycle { display: block; width: 134px; height: auto; }

#header #navi .home a:hover img { opacity: 1; }

#header #navi .drawer { display: none; }

@media (max-width: 992px) { #header #navi .drawer { display: block; }
  #header #navi .right, #header #navi .center { display: none; } }

/* body.page-template-page-template-group { #header { @include mq(sm) { // padding: 12px 0; background-color: rgba(0,0,0,0); position: absolute; } } } */
/* footer */
#footer { position: relative; background-color: #222; text-align: center; padding: 24px 0; color: #fff; }

#footer * { color: #fff; }

#footer .links ul { display: -webkit-box; display: -ms-flexbox; display: flex; margin: -3px -12px; }

#footer .links ul li { padding: 3px 12px; font: normal normal 12px/1.25 "HelveticaNeue", "Helvetica", sans-serif; }

#footer .links ul li a { font: normal normal 12px/1.25 "HelveticaNeue", "Helvetica", sans-serif; }

#footer .links ul li.copyright { margin-left: auto; }

@media (max-width: 768px) { #footer .links ul { -ms-flex-wrap: wrap; flex-wrap: wrap; }
  #footer .links ul li { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; position: relative; width: 100%; min-height: 1px; } }