@charset "UTF-8";
/* 1-setting */
/*
#Variables color

@color-default #333
@color-base #f7f7f7
@color-border #ccc

@color-main #825794
@color-sub #ffbb4d
@color-caution #e74c3c

@color-facebook #305097
@color-twitter #00aced
@color-line #00c300
@color-instagram #325C86
*/
/* Variables except color */
/* Variables font */
@font-face { font-family: 'Noto Sans CJK JP'; src: url("../fonts/notosans/NotoSansCJKjp-DemiLight.eot"); /* IE9 Compat Modes */ src: url("../fonts/notosans/NotoSansCJKjp-DemiLight.eot?#iefix") format("embedded-opentype"), url("../fonts/notosans/NotoSansCJKjp-DemiLight.woff2") format("woff2"), url("../fonts/notosans/NotoSansCJKjp-DemiLight.woff") format("woff"), url("../fonts/notosans/NotoSansCJKjp-DemiLight.ttf") format("truetype"), url("../fonts/notosans/NotoSansCJKjp-DemiLight.svg#svgFontName") format("svg"); /* Legacy iOS */ }

@font-face { font-family: 'Noto Sans CJK JP'; font-weight: bold; src: url("../fonts/notosans/NotoSansCJKjp-Bold.eot"); /* IE9 Compat Modes */ src: url("../fonts/notosans/NotoSansCJKjp-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/notosans/NotoSansCJKjp-Bold.woff2") format("woff2"), url("../fonts/notosans/NotoSansCJKjp-Bold.woff") format("woff"), url("../fonts/notosans/NotoSansCJKjp-Bold.ttf") format("truetype"), url("../fonts/notosans/NotoSansCJKjp-Bold.svg#svgFontName") format("svg"); /* Legacy iOS */ }

@font-face { font-family: 'Roboto Regular'; src: url("../fonts/roboto/Roboto-Regular.eot"); /* IE9 Compat Modes */ src: url("../fonts/roboto/Roboto-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto/Roboto-Regular.woff2") format("woff2"), url("../fonts/roboto/Roboto-Regular.woff") format("woff"), url("../fonts/roboto/Roboto-Regular.ttf") format("truetype"), url("../fonts/roboto/Roboto-Regular.svg#svgFontName") format("svg"); /* Legacy iOS */ }

@font-face { font-family: 'Roboto Light'; src: url("../fonts/roboto/Roboto-Light.eot"); /* IE9 Compat Modes */ src: url("../fonts/roboto/Roboto-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/roboto/Roboto-Light.woff2") format("woff2"), url("../fonts/roboto/Roboto-Light.woff") format("woff"), url("../fonts/roboto/Roboto-Light.ttf") format("truetype"), url("../fonts/roboto/Roboto-Light.svg#svgFontName") format("svg"); /* Legacy iOS */ }

@font-face { font-family: 'Crimson Text Roman'; src: url("../fonts/crimsontext/crimsontext-roman.eot"); /* IE9 Compat Modes */ src: url("../fonts/crimsontext/crimsontext-roman.eot?#iefix") format("embedded-opentype"), url("../fonts/crimsontext/crimsontext-roman.woff2") format("woff2"), url("../fonts/crimsontext/crimsontext-roman.woff") format("woff"), url("../fonts/crimsontext/crimsontext-roman.ttf") format("truetype"), url("../fonts/crimsontext/crimsontext-roman.svg#svgFontName") format("svg"); /* Legacy iOS */ }

@font-face { font-family: 'Source Han Serif'; src: url("../fonts/sourcehanserif/SourceHanSerifJP-Light.eot"); /* IE9 Compat Modes */ src: url("../fonts/sourcehanserif/SourceHanSerifJP-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/sourcehanserif/SourceHanSerifJP-Light.woff2") format("woff2"), url("../fonts/sourcehanserif/SourceHanSerifJP-Light.woff") format("woff"), url("../fonts/sourcehanserif/SourceHanSerifJP-Light.ttf") format("truetype"), url("../fonts/sourcehanserif/SourceHanSerifJP-Light.svg#svgFontName") format("svg"); /* Legacy iOS */ }

/* 2-mixin */
/* 3-base */
body { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; line-height: 1; word-break: break-all; }

div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, menu, nav, section, summary, time, mark, audio, video, input, textarea { margin: 0; padding: 0; border: 0; font-size: 100%; font-weight: normal; font-style: normal; vertical-align: baseline; background: transparent; }

img { vertical-align: bottom; }

main, article, aside, details, figcaption, figure, footer, header, menu, nav, section, div, address, iframe, canvas, hr, textarea { display: block; }

iframe { max-width: 100% !important; }

img, embed, object, video { max-width: 100%; }

a, label { cursor: pointer; }

blockquote { padding: 0; margin: 0; display: block; }

address, em { font-style: normal; }

hr { border: 0; margin: 0; padding: 0; }

ul, ol, li { list-style: none; }

textarea { resize: vertical; overflow: hidden; -webkit-appearance: none; border: 0; }

input, button, select { vertical-align: middle; border-radius: 0; border: 0; background: transparent; margin: 0; padding: 0; cursor: pointer; -webkit-appearance: none; }

table { border-collapse: collapse; }

*:before, *:after { padding: 0; margin: 0; line-height: 1; }

* { box-sizing: border-box; }

br { font-size: 0; }

::-moz-selection { background: #ccc; color: #fff; }

::selection { background: #ccc; color: #fff; }

input::-moz-selection, textarea::-moz-selection { color: #fff; }

input::selection, textarea::selection { color: #fff; }

html { font-size: 62.5%; min-height: 100%; height: 100%; /* width: 100%; */ }

body { font-size: 16px; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; text-rendering: auto; line-height: 1.6; font-family: "Noto Sans CJK JP", "Noto Sans", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; background: #f2f3f4; color: #fff; width: 100%; height: 100%; letter-spacing: 0.02em; }

input, button, select, textarea { font-family: "Noto Sans CJK JP", "Noto Sans", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }

input:focus, button:focus, select:focus, textarea:focus, a:focus, div:focus, aside:focus { outline: none; }

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

a:hover { text-decoration: underline; }

.for-no-js, .for-old { text-align: center; width: 100%; background: #000; color: #fff; height: 40px; line-height: 40px; z-index: 501; }

.for-old { display: none; }

.lt-ie9 .for-old { display: block; }

/* 4-layout */
.l-container { width: 100%; padding: 0 30px; margin: 0 auto; position: relative; }

@media all and (min-width: 750px) { .l-container { width: 750px; padding: 0; } }

.l-container-system-section { padding: 0 10px; }

@media all and (min-width: 790px) { .l-container-system-section { width: 770px; } }

.l-container-no-padding { padding: 0; }

.l-container-carousel { padding: 0; }

@media all and (min-width: 790px) { .l-container-carousel { width: 770px; } }

.l-container-inner { padding: 0 20px; }

@media all and (min-width: 750px) { .l-container-inner { padding: 0; } }

.l-container-preloader { position: relative; height: 100%; }

.l-footer { background-color: #2b2b2b; padding: 25px 0; position: relative; z-index: 10; }

@media all and (min-width: 750px) { .l-footer { padding: 80px 0 50px; } }

.l-footer:before { display: block; content: ""; background: url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.l-footer-nav { float: left; padding-top: 13px; }

@media all and (min-width: 750px) { .l-footer-nav { padding-top: 11px; } }

.l-footer-logo { float: right; position: relative; top: 2px; left: 11px; }

@media all and (min-width: 750px) { .l-footer-logo { left: 0; top: -10px; } }

.l-footer-copyright { display: block; font-family: "Crimson Text Roman", sans-serif; font-size: 11px; letter-spacing: 0.1em; margin-top: 8px; }

@media all and (min-width: 750px) { .l-footer-copyright { font-size: 14px; position: relative; top: -45px; } }

.l-header { position: absolute; z-index: 500; width: 100%; padding-top: 12px; height: 70px; background: -webkit-linear-gradient(rgba(0, 0, 0, 0.7), rgba(19, 19, 19, 0.5) 60%, rgba(19, 19, 19, 0) 85%, rgba(19, 19, 19, 0)); background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(19, 19, 19, 0.5) 60%, rgba(19, 19, 19, 0) 85%, rgba(19, 19, 19, 0)); opacity: 0; -webkit-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; pointer-events: none; }

@media all and (min-width: 750px) { .l-header { height: 80px; background: -webkit-linear-gradient(bottom, rgba(19, 19, 19, 0), rgba(16, 16, 16, 0) 16%, rgba(11, 11, 11, 0.5) 40%, rgba(0, 0, 0, 0.7)); background: linear-gradient(to top, rgba(19, 19, 19, 0), rgba(16, 16, 16, 0) 16%, rgba(11, 11, 11, 0.5) 40%, rgba(0, 0, 0, 0.7)); padding-top: 16px; } }

@media all and (min-width: 750px) { .l-header-inner { width: 100%; padding: 0 55px; } }

.l-header-logo { pointer-events: auto; float: left; position: relative; }

@media all and (min-width: 750px) { .l-header-logo { top: -5px; left: -14px; } }

.l-header-nav { pointer-events: auto; float: right; }

.l-header.is-sticky { opacity: 1; }

.l-header-lower-pages { padding-top: 20px; }

.android .l-main { overflow-y: scroll; -webkit-overflow-scrolling: touch; }

.l-grid { text-align: left; /* Break point large */ /* Break point medium */ /* Break point small */ }

.l-grid .l-grid-inner { font-size: 0; letter-spacing: 0; }

.l-grid .l-grid-item { display: inline-block; vertical-align: top; font-size: 16px; }

.l-grid.l-grid-col2 .l-grid-item { width: 50%; }

.android .l-grid.l-grid-col2 .l-grid-item { width: 49.99999%; }

.l-grid.l-grid-col3 .l-grid-item { width: 33.3333%; }

.l-grid.l-grid-col4 .l-grid-item { width: 25%; }

.android .l-grid.l-grid-col4 .l-grid-item { width: 24.99999%; }

.l-grid.l-grid-col5 .l-grid-item { width: 20%; }

.android .l-grid.l-grid-col5 .l-grid-item { width: 19.99999%; }

.l-grid.l-grid-col6 .l-grid-item { width: 16.6666%; }

@media all and (max-width: 1024px) { .l-grid.l-grid-lg-col1 .l-grid-item { width: 100%; }
  .l-grid.l-grid-lg-col2 .l-grid-item { width: 50%; }
  .android .l-grid.l-grid-lg-col2 .l-grid-item { width: 49.99999%; }
  .l-grid.l-grid-lg-col3 .l-grid-item { width: 33.3333%; }
  .l-grid.l-grid-lg-col4 .l-grid-item { width: 25%; }
  .android .l-grid.l-grid-lg-col4 .l-grid-item { width: 24.99999%; }
  .l-grid.l-grid-lg-col5 .l-grid-item { width: 20%; }
  .android .l-grid.l-grid-lg-col5 .l-grid-item { width: 19.99999%; }
  .l-grid.l-grid-lg-col6 .l-grid-item { width: 16.6666%; } }

@media all and (max-width: 780px) { .l-grid.l-grid-md-col1 .l-grid-item { width: 100%; }
  .l-grid.l-grid-md-col2 .l-grid-item { width: 50%; }
  .android .l-grid.l-grid-md-col2 .l-grid-item { width: 49.99999%; }
  .l-grid.l-grid-md-col3 .l-grid-item { width: 33.3333%; }
  .l-grid.l-grid-md-col4 .l-grid-item { width: 25%; }
  .android .l-grid.l-grid-md-col4 .l-grid-item { width: 24.99999%; }
  .l-grid.l-grid-md-col5 .l-grid-item { width: 20%; }
  .android .l-grid.l-grid-md-col5 .l-grid-item { width: 19.99999%; }
  .l-grid.l-grid-md-col6 .l-grid-item { width: 16.6666%; } }

@media all and (max-width: 480px) { .l-grid.l-grid-sm-col1 .l-grid-item { width: 100%; }
  .l-grid.l-grid-sm-col2 .l-grid-item { width: 50%; }
  .android .l-grid.l-grid-sm-col2 .l-grid-item { width: 49.99999%; }
  .l-grid.l-grid-sm-col3 .l-grid-item { width: 33.3333%; }
  .l-grid.l-grid-sm-col4 .l-grid-item { width: 25%; }
  .android .l-grid.l-grid-sm-col4 .l-grid-item { width: 24.99999%; }
  .l-grid.l-grid-sm-col5 .l-grid-item { width: 20%; }
  .android .l-grid.l-grid-sm-col5 .l-grid-item { width: 19.99999%; }
  .l-grid.l-grid-sm-col6 .l-grid-item { width: 16.6666%; } }

.l-wrap { position: static; }

.l-wrap.is-locked { position: fixed; width: 100%; }

/* 5-module */
.hero { height: 100%; }

.hero-offset { height: 100%; position: relative; }

.hero-inner { font-size: 0; letter-spacing: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; -webkit-transform: translateZ(0); transform: translateZ(0); }

@media all and (min-width: 750px) { .hero-inner { background: url(../images/hero-pc.jpg) no-repeat center; background-size: cover; opacity: 0; }
  .hero-inner .hero-layer { display: none; } }

.hero-layer { position: absolute; height: 100vh; display: none; }

.hero-layer-canvas { display: block; }

.hero-layer-night { background: -webkit-radial-gradient(center 60%, ellipse, #111a2c, #111a2c 75%); background: radial-gradient(ellipse at center 60%, #111a2c, #111a2c 75%); mix-blend-mode: multiply; width: 811px; -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; }

.hero-logo { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) translateZ(0); transform: translate(-50%, -50%) translateZ(0); opacity: 0; }

.hero-logo-text { display: none; }

.hero-logo-image { display: block; background: url(../images/hero-logo.png) no-repeat center; background-size: contain; width: 263px; height: 84px; }

@media all and (min-width: 750px) { .hero-logo-image { background-image: url(../images/hero-logo-pc.png); width: 465px; height: 154px; } }

.hero.is-active .hero-inner { opacity: 1; }

.hero.is-static .hero-inner { background: url(../images/hero-sp.jpg) no-repeat center; background-size: cover; height: 100vh; }

@media all and (min-width: 750px) { .hero.is-static .hero-inner { background-image: url(../images/hero-pc.jpg); opacity: 1; } }

.hero.is-static .hero-layer { display: none; }

.hero.is-static .hero-logo { opacity: 1; }

.safari .hero-layer-night { display: block; }

.quick-tag { padding: 0 20px; }

.quick-tag-button { width: 100%; display: block; position: relative; text-align: center; font-size: 20px; font-weight: bold; letter-spacing: 0.1em; margin: 0; border: 1px solid #548da8; background: rgba(84, 141, 168, 0.2); }

@media all and (max-width: 780px) { .quick-tag-button { font-size: 14px; } }

.news-detail-content .quick-tag-button[target="_blank"] { color: #fff; margin: 17px 0 11px; padding: 11px 37px 11px 25px; }

.news-detail-content .quick-tag-button[target="_blank"]:before { display: none; }

.news-detail-content .quick-tag-button[target="_blank"]:after { content: ""; width: 7px; height: 7px; border: 1px solid #fff; border-left: 0; border-bottom: 0; background: transparent; position: absolute; left: auto; right: 16px; top: 50%; -webkit-transform: translateY(-50%) rotate(45deg); -ms-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); }

.wp-pagenavi { display: block; position: relative; z-index: 5; }

.wp-pagenavi select { opacity: 0; display: block; width: 100%; margin: 0 auto; font-size: 12px; color: #fff; }

.news { padding: 74px 0 47px; }

.news-item:not(:last-child) { border-bottom: 2px solid #0f0f0f; }

.news-item:last-child .news-article { padding-bottom: 0; }

.news-title { font-size: 20px; color: #7b7b7b; position: relative; left: -2px; }

.news-title.is-hidden { display: none; }

.news-list { margin-top: -3px; }

.news-detail { font-family: "Roboto Regular", "Noto Sans CJK JP", "Noto Sans", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; padding-top: 75px; position: relative; z-index: 10; }

.news-detail-header, .news-detail-sns-bottom { padding: 0 20px 25px; }

.news-detail-title { font-size: 20px; font-family: "Noto Sans CJK JP", "Noto Sans", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; letter-spacing: 0.05em; line-height: 1.5; padding-top: 10px; }

@media all and (max-width: 780px) { .news-detail-title { font-size: 16px; } }

.news-detail-type { font-size: 12px; letter-spacing: 0.07em; padding: 2px 6px 3px; border: 1px solid #fff; }

@media all and (max-width: 780px) { .news-detail-type { font-size: 10px; } }

.chrome .news-detail-type { padding: 2px 6px 3px; }

.android .news-detail-type { padding: 4px 6px 2px; }

.news-detail-type-news { color: #207189; border-color: #207189; }

.news-detail-type-special { color: #5b41b1; border-color: #5b41b1; }

.news-detail-type-update { color: #2c5ba8; border-color: #2c5ba8; }

.news-detail-type-event { color: #1b6f56; border-color: #1b6f56; }

.news-detail-datetime { text-align: right; display: block; padding-right: 2px; }

.news-detail-date, .news-detail-time { font-size: 16px; color: #7b7b7b; letter-spacing: 0; }

@media all and (max-width: 780px) { .news-detail-date, .news-detail-time { font-size: 12px; } }

.news-detail-time { letter-spacing: 0.05em; }

.news-detail-date { margin-right: 2px; }

.news-detail-time { letter-spacing: 0.02em; }

.news-detail-eyecatch { padding: 5px 10px 0; }

.news-detail-eyecatch img { width: 100%; height: auto; margin: 0 auto; }

.news-detail .news-detail-tag-list { font-size: 0; letter-spacing: 0; padding: 12px 0 0; margin: 0 -2px; }

.news-detail .news-detail-tag-item { display: inline-block; vertical-align: top; margin: 2px 3px 4px; }

.news-detail .news-detail-tag-item:before { opacity: 0; display: none; }

.news-detail-tag-text { display: block; font-size: 10px; color: #7b7b7b; border: 1px solid #7b7b7b; padding: 2px 4px; }

@media all and (max-width: 780px) { .news-detail-tag-text { font-size: 7px; } }

.news-detail-content { position: relative; z-index: 10; margin-bottom: 92px; font-family: "Noto Sans CJK JP", "Noto Sans", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }

.news-detail-content h2 { font-size: 20px; letter-spacing: 0; line-height: 1.6; margin: 60px 0 19px; padding: 16px 18px; background: #23282a url(../images/bg-pattern/intro-bg-pattern.png) repeat; }

.news-detail-content h2:nth-child(1) { margin: 30px 0 21px; }

@media all and (max-width: 780px) { .news-detail-content h2 { font-size: 14px; } }

.news-detail-content h3, .news-detail-content p, .news-detail-content dl, .news-detail-content div, .news-detail-content img { margin: 12px 0; }

.news-detail-content h3 { font-size: 20px; font-weight: bold; letter-spacing: 0; line-height: 1.9; color: #74d3ff; padding: 0 17px; }

@media all and (max-width: 780px) { .news-detail-content h3 { font-size: 14px; } }

.news-detail-content p { font-size: 16px; padding: 0 20px; line-height: 2; letter-spacing: 0; }

@media all and (max-width: 780px) { .news-detail-content p { font-size: 13px; } }

.news-detail-content a { color: #74d3ff; font-size: 16px; position: relative; }

@media all and (max-width: 780px) { .news-detail-content a { font-size: 13px; } }

.news-detail-content a:hover { text-decoration: none; }

.news-detail-content a:after { content: ""; display: block; background: #74d3ff; width: 100%; height: 1px; position: absolute; bottom: -2px; left: 0; right: 0; }

.news-detail-content a[target="_blank"] { margin-left: 12px; display: inline-block; }

.news-detail-content a[target="_blank"]:before { content: ""; display: inline-block; width: 7.5px; height: 7.5px; background-image: url(../images/icon/icon-link.svg); background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; top: 12px; left: -10px; }

@media all and (max-width: 780px) { .news-detail-content a[target="_blank"]:before { top: 9px; } }

.news-detail-content a[target="_blank"]:after { bottom: 3px; }

.news-detail-content b, .news-detail-content strong { font-weight: bold; }

.news-detail-content i:not([class]), .news-detail-content em { font-style: italic; }

.news-detail-content u { text-decoration: none; position: relative; border-bottom: 1px solid #fff; }

.news-detail-content img { max-width: 100%; height: auto; display: block; }

.news-detail-content ol, .news-detail-content ul { margin: 40px 0 44px; padding: 0 22px; position: relative; }

.news-detail-content ol li, .news-detail-content ul li { font-size: 16px; letter-spacing: 0; }

@media all and (max-width: 780px) { .news-detail-content ol li, .news-detail-content ul li { font-size: 13px; } }

.news-detail-content ol li:not(:last-child), .news-detail-content ul li:not(:last-child) { margin-bottom: 7px; }

.news-detail-content ol { counter-reset: ordered-list; }

.news-detail-content ol li { counter-increment: ordered-list; }

.news-detail-content ol li:before { content: counter(ordered-list) "."; font-size: 16px; color: #74d3ff; margin-right: 9px; }

@media all and (max-width: 780px) { .news-detail-content ol li:before { font-size: 13px; } }

.news-detail-content ol li ol { margin: 7px 0 0 -7px; }

.news-detail-content ul li:before { content: ""; display: inline-block; vertical-align: middle; width: 6px; height: 1px; background: #74d3ff; margin-right: 9px; }

.news-detail-content ul li ul { margin: 7px 0 0 -7px; }

.news-detail-content blockquote { position: relative; margin: 48px 20px 43px; }

.news-detail-content blockquote p { padding: 25px 35px 11px; letter-spacing: 0; line-height: 2; }

.news-detail-content blockquote:before, .news-detail-content blockquote:after { content: ""; display: block; position: absolute; width: 20px; height: 18px; background: url(../images/icon/icon-blockquote.svg) repeat; }

.news-detail-content blockquote:before { top: 0; left: 0; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.news-detail-content blockquote:after { bottom: 0; right: 0; }

.pagination { position: relative; z-index: 11; }

.pagination.is-hidden { display: none; }

.pagination-top { padding-top: 80px; margin-bottom: -70px; }

.pagination-top:before { content: ""; display: block; width: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #000; }

.pagination-list { position: relative; z-index: 10; font-size: 0; letter-spacing: 0; padding: 15px 0; background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; }

.pagination-item { position: relative; display: inline-block; vertical-align: middle; width: 50%; padding: 6px 0; border-left: 1px solid #7b7b7b; border-right: 1px solid #7b7b7b; }

.pagination-item:first-child { width: 25%; border: 0; }

.pagination-item:first-child a:before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); border-right: 0; }

.pagination-item:last-child { width: 25%; border: 0; }

.pagination-item:last-child a:before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); border-left: 0; top: 1px; left: -2px; }

.pagination-page { font-size: 12px; color: #fff; text-align: center; display: block; margin: 0 auto; width: 100%; opacity: 0; z-index: 2; position: relative; }

.pagination-text { font-size: 12px; font-family: "Roboto Regular", sans-serif; text-align: center; color: #fff; position: absolute; top: 50%; left: 0; right: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

.pagination-text:after { content: ""; display: block; width: 6px; height: 6px; border: 1px solid #fff; border-left: 0; border-bottom: 0; position: absolute; right: 15px; top: 50%; -webkit-transform: translateY(-71%) rotate(135deg); -ms-transform: translateY(-71%) rotate(135deg); transform: translateY(-71%) rotate(135deg); }

.pagination a { display: block; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; }

.pagination a:before { content: ""; display: block; width: 8px; height: 8px; margin: 0 auto; border: 1.5px solid #fff; border-bottom: 0; position: relative; }

.news-article { display: block; width: 100%; margin: 13px 0 10px; position: relative; z-index: 1; }

.news-article-link { display: table; width: 100%; }

.news-article-link:hover { text-decoration: none; }

.news-article-link:hover .news-article-image-container { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.news-article-item { display: table-cell; vertical-align: top; }

.news-article-item:first-child { width: 36%; }

.news-article-image { width: 100%; height: 100%; padding-top: 67%; overflow: hidden; position: relative; }

.news-article-image-container { width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; background-size: cover; background-repeat: no-repeat; background-position: center; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.25s ease-in-out; transition: -webkit-transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out; transition: transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out; }

.news-article-content { color: #fff; padding-left: 14px; position: relative; top: -3px; }

.news-article-time { float: left; }

.news-article-time span { font-size: 16px; display: block; }

@media all and (max-width: 780px) { .news-article-time span { font-size: 10px; } }

.news-article-time span:first-child:after { content: ""; display: block; width: 60%; height: 1px; margin: 0 auto; background: #7b7b7b; }

.news-article-inner-content { padding-left: 30px; }

@media all and (max-width: 780px) { .news-article-inner-content { padding-left: 20px; } }

.news-article-header { padding: 3px 5px; }

.news-article-title { font-size: 20px; font-family: "Noto Sans CJK JP", "Noto Sans", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; letter-spacing: 0; }

@media all and (max-width: 780px) { .news-article-title { font-size: 11px; } }

.news-article-type { font-size: 12px; letter-spacing: 0.07em; padding: 2px 6px 1px; border: 1px solid #fff; position: relative; left: 1px; display: inline-block; }

@media all and (max-width: 780px) { .news-article-type { top: -5px; font-size: 10px; } }

.ie .news-article-type { padding: 2px 6px; }

@media all and (max-width: 780px) { .safari .news-article-type { top: -1px; font-size: 10px; } }

.news-article-type-special-a { color: #6c4adc; border-color: #6c4adc; }

.news-article-type-special-b { color: #572de4; border-color: #572de4; }

.news-article-type-special-c { color: #7f2de4; border-color: #7f2de4; }

.news-article-latest .news-article-item:first-child { width: 53.6%; }

.news-article-latest .news-article-image { width: 100%; height: auto; padding-top: 49.67%; position: relative; }

.news-article-latest .news-article-header { position: absolute; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); }

.news-article-news .news-article-type { color: #207189; border-color: #207189; }

.news-article-special .news-article-type { color: #5b41b1; border-color: #5b41b1; }

.news-article-update .news-article-type { color: #2c5ba8; border-color: #2c5ba8; }

.news-article-event .news-article-type { color: #1b6f56; border-color: #1b6f56; }

.general-section { position: relative; background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; }

.general-section-title { font-size: 20px; letter-spacing: 0; }

.general-section-bg { position: relative; background: #0c0c0c; }

.general-section-bg-bottom .general-section-blades span:nth-child(1) { bottom: 0; height: 34.4vw; }

.general-section-bg-bottom .general-section-blades span:nth-child(2) { bottom: 13px; }

.safari .general-section-bg-bottom .general-section-blades span:nth-child(2) { bottom: 5px; }

.general-section-blades { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transform: translateZ(0); transform: translateZ(0); }

.general-section-blades span { background: #080808 url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; width: 100%; position: absolute; left: 0; }

.general-section-blades span:nth-child(1) { height: 46.9vw; bottom: -9px; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: skewY(-16deg); -ms-transform: skewY(-16deg); transform: skewY(-16deg); }

@media all and (max-width: 1024px) { .general-section-blades span:nth-child(1) { height: 762px; width: 1000px; top: -408px; bottom: auto; -webkit-transform: skew(-80deg); -ms-transform: skew(-80deg); transform: skew(-80deg); } }

@media all and (max-width: 780px) { .general-section-blades span:nth-child(1) { bottom: -328px; top: auto; } }

.general-section-blades span:nth-child(2) { height: 43.1vw; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: skewY(16deg); -ms-transform: skewY(16deg); transform: skewY(16deg); opacity: 0.5; top: initial; bottom: -56px; }

.news-preview-section { position: relative; }

.news-preview-section-list-item { border-bottom: 2px solid #000; padding-bottom: 8px; margin-top: 10px; }

@media all and (min-width: 750px) { .news-preview-section-list-item { padding-bottom: 15px; margin-top: 18px; } }

.news-preview-section-list-item:first-child { margin-top: 0; }

.news-preview-section-more { margin-top: 10px; }

@media all and (min-width: 750px) { .news-preview-section-more { margin-top: 39px; } }

.intro-section { padding: 40px 0 43px; position: relative; z-index: 10; }

@media all and (min-width: 750px) { .intro-section { padding: 50px 0 92px; margin-top: 7.8vw; } }

.intro-section-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.intro-section-bg span { background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; width: 100%; position: absolute; left: 0; }

.intro-section-bg span:nth-child(1) { height: 100%; top: 0; }

.intro-section-bg span:nth-child(2) { height: 29.1vw; bottom: 0; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: skewY(-16deg); -ms-transform: skewY(-16deg); transform: skewY(-16deg); z-index: -1; }

@media all and (min-width: 750px) { .intro-section-bg span:nth-child(2) { -webkit-transform: skewY(-8.3deg); -ms-transform: skewY(-8.3deg); transform: skewY(-8.3deg); } }

@media all and (min-width: 750px) { .intro-section-bg span:nth-child(3) { height: 18.8vw; top: 0; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: skewY(-4.5deg); -ms-transform: skewY(-4.5deg); transform: skewY(-4.5deg); z-index: -1; } }

@media all and (min-width: 750px) { .intro-section-stores { padding: 0 115px; } }

.intro-section-banner { margin-top: 15px; }

@media all and (min-width: 750px) { .intro-section-banner { padding: 0 115px; margin-top: 30px; } }

.intro-section-news { margin-top: 25px; }

@media all and (min-width: 750px) { .intro-section-news { margin-top: 48px; } }

.stores { margin: -2px -2px; }

@media all and (min-width: 750px) { .stores { margin: -2px -3px; } }

.stores-inner { display: table; border-spacing: 2px; border-collapse: separate; width: 100%; }

.stores-item { display: table-cell; }

.stores-image { width: 100%; height: auto; }

.banner { width: 100%; }

.banner:hover { text-decoration: none; }

.banner img { width: 100%; height: auto; }

.about-section { padding: 73.8vw 0 79.7vw; position: relative; }

@media all and (min-width: 1024px) { .about-section { padding: 430px 0 590px; } }

.about-section-bg span { background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; width: 100%; position: absolute; top: 0; left: 0; }

.about-section-bg span:nth-child(1) { height: 100%; opacity: 0.7; }

.about-section-bg span:nth-child(2) { height: 43.1vw; -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: skewY(14deg); -ms-transform: skewY(14deg); transform: skewY(14deg); opacity: 0.5; }

@media all and (min-width: 750px) { .about-section-bg span:nth-child(2) { -webkit-transform: skewY(8.3deg); -ms-transform: skewY(8.3deg); transform: skewY(8.3deg); height: 21.6vw; } }

.about-section-bg span:nth-child(3) { height: 43.1vw; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: skewY(16deg); -ms-transform: skewY(16deg); transform: skewY(16deg); opacity: 0.5; top: initial; bottom: -8px; }

@media all and (min-width: 750px) { .about-section-bg span:nth-child(3) { height: 22.8vw; bottom: -30px; -webkit-transform: skewY(8.3deg); -ms-transform: skewY(8.3deg); transform: skewY(8.3deg); top: auto; } }

.about-section-heading { width: 230px; height: 193px; position: relative; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); }

@media all and (min-width: 750px) { .about-section-heading { width: 460px; height: 387px; } }

.about-section-heading-text { display: none; }

.about-section-heading-anim svg { position: absolute; top: 0; left: 0; opacity: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); }

.about-section-body { margin-top: 75px; }

@media all and (min-width: 750px) { .about-section-body { margin-top: 143px; } }

.about-section-body-inner { margin: 0 -4px; }

.about-section-body-item { padding: 0 4px; }

.about-section-description { font-size: 13px; letter-spacing: -0.02em; line-height: 2; margin-top: 20px; position: relative; }

@media all and (min-width: 750px) { .about-section-description { font-size: 16px; margin-top: 9px; letter-spacing: -0.01em; } }

.about-section-description:first-of-type { margin-top: 75px; }

@media all and (min-width: 750px) { .about-section-description:first-of-type { margin-top: 143px; } }

.news-article-preview-link { display: table; width: 100%; }

.news-article-preview-link:hover { text-decoration: none; }

.news-article-preview-date, .news-article-preview-body { display: table-cell; vertical-align: top; }

.news-article-preview-date { position: relative; font-size: 10px; font-family: "Roboto Regular", sans-serif; text-align: left; width: 12px; }

@media all and (min-width: 750px) { .news-article-preview-date { width: 24px; font-size: 20px; } }

.news-article-preview-date span { display: block; line-height: 1; }

.news-article-preview-date span:nth-child(2) { width: 7px; border: 1px solid #7c7c7c; margin: 5px auto; opacity: 0.4; }

@media all and (min-width: 750px) { .news-article-preview-date span:nth-child(2) { width: 14px; } }

.news-article-preview-body { padding-left: 8px; }

@media all and (min-width: 750px) { .news-article-preview-body { padding: 2px 0 0 16px; } }

.news-article-preview-heading { font-size: 11px; letter-spacing: -0.01em; line-height: 1; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: calc(100vw - 80px); font-family: Helvetica, Arial, メイリオ, Meiryo, sans-serif; }

@media all and (min-width: 750px) { .news-article-preview-heading { width: calc(750px - 24px - 18px); font-size: 14px; line-height: 1.5; } }

.news-article-preview-heading-text { font-family: "Noto Sans CJK JP", "Noto Sans", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 20px; }

@media all and (max-width: 780px) { .news-article-preview-heading-text { font-size: 11px; } }

.news-article-preview-category { font-size: 10px; font-family: "Roboto Regular", sans-serif; letter-spacing: 0.08em; line-height: 1; border: 1px solid #fff; display: inline-block; padding: 3px 6px; position: relative; top: -2px; }

@media all and (min-width: 750px) { .news-article-preview-category { font-size: 12px; padding: 3px 8px; margin: 7px 0 0 4px; top: -1px; } }

.news-article-preview-news .news-article-preview-category { color: #207189; border-color: #207189; }

.news-article-preview-special .news-article-preview-category { color: #5b41b1; border-color: #5b41b1; }

.news-article-preview-update .news-article-preview-category { color: #2c5ba8; border-color: #2c5ba8; }

.news-article-preview-event .news-article-preview-category { color: #1b6f56; border-color: #1b6f56; }

.yuki-section { background-color: #eaeaea; padding-top: 1px; margin-top: 0px; }

.yuki-section-heading { opacity: 0; font-size: 24px; color: #fff; margin-top: -20px; }

.yuki-section-heading span { display: inline-block; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; vertical-align: top; background-color: #000; }

.character-section { position: relative; z-index: 0; padding-bottom: 10.3vw; }

@media all and (min-width: 750px) { .character-section { padding-bottom: 146px; } }

.character-section-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.character-section-bg span { background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; width: 100%; position: absolute; top: 0; left: 0; }

.character-section-bg span:nth-child(1) { height: 100%; }

.character-section-bg span:nth-child(2) { height: 29.1vw; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: skewY(-16deg); -ms-transform: skewY(-16deg); transform: skewY(-16deg); z-index: -1; }

@media all and (min-width: 750px) { .character-section-bg span:nth-child(2) { -webkit-transform: skewY(-8.3deg); -ms-transform: skewY(-8.3deg); transform: skewY(-8.3deg); } }

.character-section-image { height: 441px; overflow: hidden; position: absolute; top: -95px; right: 0; left: 0; }

@media all and (min-width: 750px) { .character-section-image { top: -160px; height: 881px; } }

@media all and (min-width: 916px) { .character-section-image { overflow: visible; } }

.character-section-image-inner { background: url(../images/characters/yuki.png) no-repeat center; background-size: contain; width: 247px; height: 441px; position: absolute; top: 0; right: -68px; }

@media all and (min-width: 750px) { .character-section-image-inner { background-image: url(../images/characters/yuki-pc.png); width: 494px; height: 881px; right: -84px; } }

.character-section-image img { width: 100%; height: auto; }

.character-section-bottom-wedge { background: #1a1a1a url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; position: absolute; bottom: 0; left: 0; width: 100%; height: 45.9vw; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: skewY(16deg); -ms-transform: skewY(16deg); transform: skewY(16deg); opacity: 0.5; }

@media all and (min-width: 750px) { .character-section-bottom-wedge { -webkit-transform: skewY(8.3deg); -ms-transform: skewY(8.3deg); transform: skewY(8.3deg); height: 22.8vw; } }

.character-section-body { position: relative; top: -55px; }

.character-section-heading { position: relative; left: -4px; width: 92px; height: 184px; }

@media all and (min-width: 750px) { .character-section-heading { width: 185px; height: 370px; top: -21px; left: 69px; } }

.character-section-heading svg { width: 92px; height: 184px; }

@media all and (min-width: 750px) { .character-section-heading svg { width: 185px; height: 370px; } }

.character-section-detail { margin-top: 28px; }

@media all and (min-width: 750px) { .character-section-detail { margin-top: 32px; } }

.character-section-detail dt { font-size: 24px; letter-spacing: -0.02em; margin-left: -2px; }

@media all and (min-width: 750px) { .character-section-detail dt { font-size: 48px; letter-spacing: 0.02em; } }

.character-section-detail dd { margin-top: 28px; font-size: 11px; letter-spacing: 0; }

.character-section-detail dd p { display: block; line-height: 2.1; margin-top: 3px; }

.character-section-detail dd p:first-of-type { margin-top: 0; }

@media all and (min-width: 750px) { .character-section-detail dd { font-size: 16px; margin-top: 61px; line-height: 2.4; }
  .character-section-detail dd p { display: block; line-height: 1.8; margin-top: 8px; }
  .character-section-detail dd p:first-of-type { margin-top: 0; } }

.character-section-cv { display: block; font-size: 11px; line-height: 1; margin: -4px 0 0 2px; }

.character-section-cv span { margin-left: 6px; }

@media all and (min-width: 750px) { .character-section-cv { font-size: 22px; margin-top: -6px; }
  .character-section-cv span { margin-left: 6px; } }

.character-section-takuya { padding-bottom: 75px; }

@media all and (min-width: 750px) { .character-section-takuya { padding-bottom: 190px; } }

.character-section-takuya .character-section-bg span { background-color: #1a1a1a; }

@media all and (min-width: 750px) { .character-section-takuya .character-section-bg span { -webkit-transform: skewY(-8.3deg); -ms-transform: skewY(-8.3deg); transform: skewY(-8.3deg); } }

.character-section-takuya .character-section-image { height: 429px; top: -52px; }

@media all and (min-width: 750px) { .character-section-takuya .character-section-image { overflow: visible; top: -72px; } }

.character-section-takuya .character-section-image-inner { background-image: url(../images/characters/takuya.png); width: 203px; height: 429px; left: -17px; }

@media all and (min-width: 750px) { .character-section-takuya .character-section-image-inner { background-image: url(../images/characters/takuya-pc.png); width: 406px; height: 858px; left: 20px; } }

.character-section-takuya .character-section-body { position: relative; top: -44px; text-align: right; }

.character-section-takuya .character-section-heading { position: relative; left: 4px; width: 91px; height: 163px; margin: 0 0 0 auto; }

@media all and (min-width: 750px) { .character-section-takuya .character-section-heading { width: 184px; height: 330px; top: -14px; left: -78px; } }

.character-section-takuya .character-section-heading svg { width: 91px; height: 163px; }

@media all and (min-width: 750px) { .character-section-takuya .character-section-heading svg { width: 184px; height: 330px; } }

.character-section-takuya .character-section-detail { display: inline-block; margin-top: 0; text-align: left; position: relative; top: -7px; left: -6px; }

@media all and (min-width: 750px) { .character-section-takuya .character-section-detail { top: -15px; left: -5px; } }

@media all and (min-width: 750px) { .character-section-takuya .character-section-detail dt { letter-spacing: -0.03em; } }

@media all and (min-width: 750px) { .character-section-takuya .character-section-detail dd p { margin-top: 10px; } }

.character-section-takuya .character-section-cv { position: relative; left: 5px; }

@media all and (min-width: 750px) { .character-section-takuya .character-section-cv { position: relative; left: 10px; }
  .character-section-takuya .character-section-cv span { margin-left: 6px; } }

.character-section-takuya .character-section-bottom-wedge-right { background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; position: absolute; top: calc(100% - 10px); right: 0; width: 100%; height: 46.9vw; -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: skewY(-16deg); -ms-transform: skewY(-16deg); transform: skewY(-16deg); }

@media all and (min-width: 750px) { .character-section-takuya .character-section-bottom-wedge-right { -webkit-transform: skewY(-8.3deg); -ms-transform: skewY(-8.3deg); transform: skewY(-8.3deg); } }

.more-button { display: block; text-align: center; }

.more-button-link { display: inline-block; font-size: 10px; font-family: "Roboto Regular", sans-serif; letter-spacing: 0.1em; text-align: center; border-bottom: 2px solid #fff; }

@media all and (min-width: 750px) { .more-button-link { font-size: 14px; padding-bottom: 1px; } }

.more-button-link:hover { text-decoration: none; }

.more-button-big .more-button-link { font-size: 12px; }

@media all and (min-width: 750px) { .more-button-big .more-button-link { font-size: 16px; padding-bottom: 7px; } }

.more-button-close .more-button-link { letter-spacing: 0; }

@media all and (min-width: 750px) { .more-button-close .more-button-link { padding-bottom: 2px; } }

.more-button-nav .more-button-link { font-size: 13px; }

@media all and (min-width: 750px) { .more-button-nav .more-button-link { font-size: 14px; } }

.story-section { position: relative; }

.story-section-more { position: relative; margin-top: -19px; }

@media all and (min-width: 750px) { .story-section-more { margin-top: -60px; } }

.system-section { position: relative; background-color: #2b2b2b; margin-top: 20px; padding: 100px 0 112px; }

@media all and (min-width: 750px) { .system-section { padding: 195px 0 202px; } }

.system-section:before { display: block; content: ""; background: url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.system-section-watermark { background: url(../images/gear-watermark.png) no-repeat center; background-size: contain; width: 87.5vw; height: 89.1vw; margin: auto; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

@media all and (min-width: 750px) { .system-section-watermark { width: 656.3px; } }

@media all and (min-width: 750px) { .system-section-watermark { height: 668px; } }

.system-section-heading { font-family: "Roboto Light", sans-serif; font-size: 20px; letter-spacing: 0; opacity: 0.4; }

@media all and (min-width: 750px) { .system-section-heading { font-size: 40px; letter-spacing: 0.01em; } }

.system-section-carousel { margin-top: -2px; }

@media all and (min-width: 750px) { .system-section-carousel { margin-top: 40px; } }

.system-section-carousel-list-item:first-child { padding-left: 0; }

.system-section-carousel-nav { margin: 27px auto 0; }

@media all and (min-width: 750px) { .system-section-carousel-nav { margin-top: 100px; } }

.system-section-carousel-nav .slick-dots { display: table; margin: auto; font-size: 0; letter-spacing: 0; }

.system-section-carousel-nav .slick-dots li { display: table-cell; padding-left: 20px; cursor: pointer; }

@media all and (min-width: 750px) { .system-section-carousel-nav .slick-dots li { padding-left: 38px; } }

.system-section-carousel-nav .slick-dots li:first-child { padding-left: 0; }

.system-section-carousel-nav .slick-dots li button { height: 4px; background-color: #4d4d4d; width: 38px; cursor: pointer; font-size: 0; -webkit-transition: background-color 0.3s ease-in-out; transition: background-color 0.3s ease-in-out; }

@media all and (min-width: 750px) { .system-section-carousel-nav .slick-dots li button { width: 76px; } }

.system-section-carousel-nav .slick-dots li.slick-active button { background-color: #fff; border-color: #fff; }

.system-article { padding: 0 10px; }

.system-article-media { position: relative; }

.system-article-media-item { width: 100%; height: auto; }

.system-article-heading { font-family: "Source Han Serif", sans-serif; font-size: 18px; margin-top: 22px; letter-spacing: 0.01em; }

@media all and (min-width: 750px) { .system-article-heading { font-size: 36px; letter-spacing: 0; } }

.system-article-description { font-size: 12px; margin-top: 14px; letter-spacing: -0.09em; line-height: 1.9; }

@media all and (min-width: 750px) { .system-article-description { font-size: 16px; margin-top: 16px; letter-spacing: -0.015em; } }

.system-article-video .system-article-media { position: relative; overflow: hidden; }

@media all and (min-width: 750px) { .system-article-video .system-article-media { height: 422px; } }

.system-article-video .system-article-media-item { width: 100%; height: auto; position: relative; }

.single-page-pagination { position: relative; z-index: 10; background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; padding: 13px 0; margin-top: 6px; }

.single-page-pagination-item { text-align: center; position: relative; height: 100%; }

.single-page-pagination-item a { display: block; padding: 5px 0; }

.single-page-pagination-item a:hover { text-decoration: none; }

.single-page-pagination-item a span { font-size: 12px; font-family: "Roboto Regular", sans-serif; letter-spacing: 0.2em; }

.single-page-pagination-item:nth-child(2):before, .single-page-pagination-item:nth-child(2):after { content: ""; display: block; height: 100%; width: 1px; background: #7b7b7b; position: absolute; top: 0; }

.single-page-pagination-item:nth-child(2):before { right: -7px; }

.single-page-pagination-item:nth-child(2):after { left: -7px; }

.single-page-pagination-prev, .single-page-pagination-next { position: relative; display: block; width: 100%; }

.single-page-pagination-prev:before, .single-page-pagination-next:before { content: ""; display: block; width: 6px; height: 6px; border: 1px solid #fff; position: absolute; top: 50%; -webkit-transform: translateY(-50%) rotate(45deg); -ms-transform: translateY(-50%) rotate(45deg); transform: translateY(-50%) rotate(45deg); }

.single-page-pagination-prev:before { left: 16px; border-right: 0; border-top: 0; }

.single-page-pagination-prev:after { right: 6px; }

.single-page-pagination-next:before { right: 16px; border-left: 0; border-bottom: 0; }

.single-page-pagination-next:after { left: 6px; }

.single-page-pagination-icon { display: inline-block; vertical-align: middle; width: 19px; height: 14px; margin: 0 auto; background-image: url(../images/icon/icon-pagination.svg); background-repeat: no-repeat; background-position: center; background-size: cover; }

.sns-section { background-color: #0f0f0f; padding: 45px 0 35px; position: relative; z-index: 10; }

@media all and (min-width: 750px) { .sns-section { padding: 90px 0 95px; } }

@media all and (min-width: 750px) { .sns-section-banner { padding: 0 115px; } }

.sns-section-list { display: block; text-align: center; margin-top: 24px; }

@media all and (min-width: 750px) { .sns-section-list { margin-top: 48px; padding-left: 14px; } }

.sns-section-list-item { display: inline-block; margin-left: 36px; }

@media all and (min-width: 750px) { .sns-section-list-item { margin: 0 30px; } }

.sns-section-list-item:first-child { margin-left: 0; }

@media all and (min-width: 750px) { .sns-section-list-item:first-child { position: relative; left: -15px; } }

.sns-section-list-item:last-child { margin-right: 0; }

.sns-section-no-banner { padding: 24px 0 35px; }

@media all and (min-width: 750px) { .sns-section-no-banner { padding: 46px 0 48px; } }

.sns-section-no-banner .sns-section-list { margin-top: 0; }

@media all and (min-width: 750px) { .sns-section-no-banner .sns-section-list { margin-top: 0; } }

.info-section { background-color: #2b2b2b; padding: 36px 0 30px; position: relative; z-index: 10; }

@media all and (min-width: 750px) { .info-section { padding: 70px 0 60px; } }

.info-section-list-item { font-size: 10px; }

@media all and (min-width: 750px) { .info-section-list-item { font-size: 14px; } }

.info-section-list-item dl dt, .info-section-list-item dl dd { border-bottom: 2px solid #000; padding: 2px 0; }

@media all and (min-width: 750px) { .info-section-list-item dl dt, .info-section-list-item dl dd { padding: 17px 0 5px; } }

.info-section-list-item dl dt { width: 100px; float: left; }

@media all and (min-width: 750px) { .info-section-list-item dl dt { width: 195px; } }

.info-section-list-item dl dd { margin-left: 106px; display: block; }

@media all and (min-width: 750px) { .info-section-list-item dl dd { margin-left: 214px; } }

.info-section-stores { margin-top: 30px; }

@media all and (min-width: 750px) { .info-section-stores { margin-top: 54px; padding: 0 115px; } }

.logo { display: block; width: 32px; }

@media all and (min-width: 750px) { .logo { width: 42px; } }

.logo:hover { text-decoration: none; }

.logo-image { width: 100%; height: auto; }

.nav-item { font-family: "Roboto Regular", sans-serif; font-size: 13px; display: inline-block; margin: 0 6px; }

@media all and (min-width: 750px) { .nav-item { margin: 0 13px; } }

.nav-item:last-child { margin-right: 0; }

.nav-link { display: block; }

.nav-link:hover { text-decoration: none; }

.sns { margin-top: 13px; position: relative; z-index: 1; }

.sns-list { font-size: 0; letter-spacing: 0; display: table; position: relative; }

.sns-item { display: table-cell; vertical-align: top; }

.sns-item:first-child { width: 122px; }

.sns-item:last-child iframe { position: absolute !important; right: -68px; }

.firefox .sns-item:last-child iframe { right: -62px; }

.sns-item .fb_iframe_widget_fluid span, .sns-item .fb_iframe_widget span, .sns-item .fb_iframe_widget iframe { vertical-align: top !important; left: -2px !important; z-index: 1; }

.sns-item .fb_iframe_widget_fluid span, .sns-item .fb_iframe_widget span, .sns-item .fb_iframe_widget iframe, .sns-item .twitter-share-button, .sns-item .line-it-button { position: relative !important; -webkit-transform: scale(0.97); -ms-transform: scale(0.97); transform: scale(0.97); }

.sns-item .twitter-share-button { left: -5px; width: 86px !important; }

.studio-logo-link { display: block; }

.studio-logo-link:hover { text-decoration: none; }

.studio-logo-image { background: url(../images/studio-logo.png) no-repeat center; background-size: contain; width: 114px; height: 78px; }

@media all and (min-width: 750px) { .studio-logo-image { background-image: url(../images/studio-logo-pc.png); width: 268px; height: 155px; } }

.footer-nav-item { margin-top: 5px; }

@media all and (min-width: 750px) { .footer-nav-item { margin-top: 12px; } }

.footer-nav-item:first-child { margin-top: 0; }

.footer-nav-item { display: block; }

.footer-nav-item .more-button { text-align: left; }

.preloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; }

.preloader-bg { background: #2b2b2b url(../images/bg-pattern/intro-bg-pattern.png) repeat; background-size: 100px; width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transition: opacity 2s cubic-bezier(0.77, 0, 0.175, 1); transition: opacity 2s cubic-bezier(0.77, 0, 0.175, 1); }

.preloader-text { width: 150px; position: absolute; top: 50%; left: 27px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); opacity: 0; -webkit-transition: opacity 1.5s cubic-bezier(0.77, 0, 0.175, 1) 1.5s; transition: opacity 1.5s cubic-bezier(0.77, 0, 0.175, 1) 1.5s; }

.preloader-svg { width: 140px; position: absolute; top: 3px; left: 5px; }

.preloader-svg svg { position: absolute; top: 0; left: 0; opacity: 0; }

.preloader.is-active .preloader-bg { opacity: 1; }

.preloader.is-active .preloader-text { opacity: 1; }

.preloader.is-stop .preloader-image { -webkit-transition: none; transition: none; opacity: 0; }

.preloader.is-stop .preloader-svg svg { opacity: 1; }

.preloader.is-end .preloader-bg { opacity: 0; }

.body-lock.is-active { overflow: hidden; position: fixed; top: 0; left: 0; }

.sample { padding: 50px 0; }

.sample-item:not(:last-child) { margin-bottom: 20px; }

.sample .news-article-type { font-size: 12px; letter-spacing: 0.07em; padding: 2px 6px 1px; border: 1px solid #fff; position: relative; left: 1px; }

.sample .news-article-type + span { color: #333; }

@media all and (max-width: 780px) { .sample .news-article-type { top: -5px; font-size: 10px; } }

.sample .news-article-type-special-a { color: #6c4adc; border-color: #6c4adc; }

.sample .news-article-type-special-b { color: #572de4; border-color: #572de4; }

.sample .news-article-type-special-c { color: #7f2de4; border-color: #7f2de4; }

/* 6-utility */
/*
Utility

This means helper class like a snippet.
Utility should always have the prefix "u-".
And you should not feel free to add a new Utility class.
*/
.u-hidden { overflow: hidden; text-indent: 120%; white-space: nowrap; }

.u-clear { zoom: 1; }

.u-clear:before, .u-clear:after { content: ""; display: block; }

.u-clear:after { clear: both; }

.u-elps { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -ms-text-overflow: ellipsis; }

.u-notap { -webkit-tap-highlight-color: transparent; }

.u-pc-hidden { display: block; }

.u-sp-hidden { display: none; }

@media all and (min-width: 750px) { .u-pc-hidden { display: none !important; }
  .u-sp-hidden { display: block !important; } }

/* 7-library */
/* Slider */
.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-track, .slick-slider .slick-list { -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; }

.slick-track:before, .slick-track:after { 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-slide:focus { outline: none; }

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

/* 8-themes */
.alignnone { display: block; width: 100%; margin: 0 auto; }

.alignnone img { width: 100%; display: block; margin: 0 auto; }

.news-detail-content .wp-caption { margin: 44px auto 35px; padding: 0 5px; }

p.wp-caption-text { color: #7b7b7b; padding: 0px 12px 0 39px; position: relative; margin-top: 16px; letter-spacing: 0; }

p.wp-caption-text:before { content: ""; display: inline-block; width: 20px; height: 1px; background: #7b7b7b; position: absolute; top: 11px; left: 11px; }
/*# sourceMappingURL=maps/style.css.map */