@charset "UTF-8";
/*! ress.css • v1.2.2 MIT License github.com/filipelinhares/ress */
/* # ================================================================= # Global selectors # ================================================================= */
html { box-sizing: border-box; overflow-y: scroll; /* All browsers without overlaying scrollbars */ -webkit-text-size-adjust: 100%; /* iOS 8+ */ }

*, ::before, ::after { background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements */ box-sizing: inherit; }

::before, ::after { text-decoration: inherit; /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */ vertical-align: inherit; }

/* Remove margin, padding of all elements and set background-no-repeat as default */
* { padding: 0; /* Reset `padding` and `margin` of all elements */ margin: 0; }

/* # ================================================================= # General elements # ================================================================= */
/* Add the correct display in iOS 4-7.*/
audio:not([controls]) { display: none; height: 0; }

hr { overflow: visible; /* Show the overflow in Edge and IE */ }

/* Correct `block` display not defined for any HTML5 element in IE 8/9 Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox Correct `block` display not defined for `main` in IE 11 */
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block; }

summary { display: list-item; /* Add the correct display in all browsers */ }

small { font-size: 80%; /* Set font-size to 80% in `small` elements */ }

[hidden], template { display: none; /* Add the correct display in IE */ }

abbr[title] { border-bottom: 1px dotted; /* Add a bordered underline effect in all browsers */ text-decoration: none; /* Remove text decoration in Firefox 40+ */ }

a { background-color: transparent; /* Remove the gray background on active links in IE 10 */ -webkit-text-decoration-skip: objects; /* Remove gaps in links underline in iOS 8+ and Safari 8+ */ }

a:active, a:hover { outline-width: 0; /* Remove the outline when hovering in all browsers */ }

code, kbd, pre, samp { font-family: monospace, monospace; /* Specify the font family of code elements */ }

b, strong { font-weight: bolder; /* Correct style set to `bold` in Edge 12+, Safari 6.2+, and Chrome 18+ */ }

dfn { font-style: italic; /* Address styling not present in Safari and Chrome */ }

/* Address styling not present in IE 8/9 */
mark { background-color: #ff0; color: #000; }

/* https://gist.github.com/unruthless/413930 */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sub { bottom: -0.25em; }

sup { top: -0.5em; }

/* # ================================================================= # Forms # ================================================================= */
input { border-radius: 0; }

/* Apply cursor pointer to button elements */
button, [type="button"], [type="reset"], [type="submit"], [role="button"] { cursor: pointer; }

/* Replace pointer cursor in disabled elements */
[disabled] { cursor: default; }

[type="number"] { width: auto; /* Firefox 36+ */ }

[type="search"] { -webkit-appearance: textfield; /* Safari 8+ */ }

[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; /* Safari 8 */ }

textarea { overflow: auto; /* Internet Explorer 11+ */ resize: vertical; /* Specify textarea resizability */ }

button, input, optgroup, select, textarea { font: inherit; /* Specify font inheritance of form elements */ }

optgroup { font-weight: bold; /* Restore the font weight unset by the previous rule. */ }

button { overflow: visible; /* Address `overflow` set to `hidden` in IE 8/9/10/11 */ }

/* Remove inner padding and border in Firefox 4+ */
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: 0; padding: 0; }

/* Replace focus style removed in the border reset above */
button:-moz-focusring, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { outline: 1px dotted ButtonText; }

button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; /* Correct the inability to style clickable types in iOS */ }

button, select { text-transform: none; /* Firefox 40+, Internet Explorer 11- */ }

/* Remove the default button styling in all browsers */
button, input, select, textarea { background-color: transparent; border-style: none; color: inherit; }

/* Style select like a standard input */
select { -moz-appearance: none; /* Firefox 36+ */ -webkit-appearance: none; /* Chrome 41+ */ }

select::-ms-expand { display: none; /* Internet Explorer 11+ */ }

select::-ms-value { color: currentColor; /* Internet Explorer 11+ */ }

legend { border: 0; /* Correct `color` not being inherited in IE 8/9/10/11 */ color: inherit; /* Correct the color inheritance from `fieldset` elements in IE */ display: table; /* Correct the text wrapping in Edge and IE */ max-width: 100%; /* Correct the text wrapping in Edge and IE */ white-space: normal; /* Correct the text wrapping in Edge and IE */ }

::-webkit-file-upload-button { -webkit-appearance: button; /* Correct the inability to style clickable types in iOS and Safari */ font: inherit; /* Change font properties to `inherit` in Chrome and Safari */ }

[type="search"] { -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */ outline-offset: -2px; /* Correct the outline style in Safari */ }

/* # ================================================================= # Specify media element style # ================================================================= */
img { border-style: none; /* Remove border when inside `a` element in IE 8/9/10 */ }

/* Add the correct vertical alignment in Chrome, Firefox, and Opera */
progress { vertical-align: baseline; }

svg:not(:root) { overflow: hidden; /* Internet Explorer 11- */ }

audio, canvas, progress, video { display: inline-block; /* Internet Explorer 11+, Windows Phone 8.1+ */ }

/* # ================================================================= # Accessibility # ================================================================= */
/* Hide content from screens but not screenreaders */
@media screen { [hidden~="screen"] { display: inherit; }
  [hidden~="screen"]:not(:active):not(:focus):not(:target) { position: absolute !important; clip: rect(0 0 0 0) !important; } }

/* Specify the progress cursor of updating elements */
[aria-busy="true"] { cursor: progress; }

/* Specify the pointer cursor of trigger elements */
[aria-controls] { cursor: pointer; }

/* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
[aria-disabled] { cursor: default; }

/* # ================================================================= # Selection # ================================================================= */
/* Specify text selection background color and omit drop shadow */
::-moz-selection { background-color: #b3d4fc; /* Required when declaring ::selection */ color: #000; text-shadow: none; }

::selection { background-color: #b3d4fc; /* Required when declaring ::selection */ color: #000; text-shadow: none; }

/* responsive */
/*
#styleguide
基本スタイル

```
<p>特に何も指定しないときの状態</p>
```
*/
html { -webkit-overflow-scrolling: touch; }

body { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; text-rendering: auto; font-size: 14px; font-family: "Lucida Sans W01", "Arial", "Helvetica", sans-serif; color: #fff; background-color: #fff; position: fixed; width: 100%; top: 0; left: 0; }

body.is-release { position: relative; top: auto; left: auto; }

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

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

img, svg { vertical-align: middle; }

img { width: 100%; height: auto; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

svg { fill: currentColor; }

select { color: #000; }

canvas { position: fixed; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; -webkit-transform: scale3d(1.28, 1.28, 1.28); transform: scale3d(1.28, 1.28, 1.28); transition: opacity 2.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.3s, -webkit-transform 10s cubic-bezier(0.075, 0.82, 0.165, 1) 2.3s; transition: transform 10s cubic-bezier(0.075, 0.82, 0.165, 1) 2.3s, opacity 2.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.3s; transition: transform 10s cubic-bezier(0.075, 0.82, 0.165, 1) 2.3s, opacity 2.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.3s, -webkit-transform 10s cubic-bezier(0.075, 0.82, 0.165, 1) 2.3s; }

canvas.is-show { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }

.br-pc { display: block; }

@media screen and (max-width: 719px) { .br-pc { display: none; } }

.br-tablet { display: none; }

@media screen and (max-width: 767px) { .br-tablet { display: block; } }

@media screen and (max-width: 719px) { .br-tablet { display: none; } }

.br-sp { display: none; }

@media screen and (max-width: 719px) { .br-sp { display: block; } }

#main { position: relative; padding: 0; background: none; z-index: 10; }

.pc .content-wrapper, .sp .content-wrapper { padding: 0; }

.content-wrapper { position: relative; background-color: #000; }

header#header.position-static { position: relative; }

.footer { position: relative; }

.l-container { position: relative; padding-bottom: 262px; overflow: hidden; z-index: 1; }

@media screen and (max-width: 767px) { .l-container { padding-bottom: 175px; } }

.l-section { position: relative; max-width: 1258px; margin: 0 auto; padding: 0 20px; }

.l-section--theaters { max-width: 1322px; min-height: 1059px; margin-top: 86px; }

.l-section--achievement { margin-top: 261px; }

.l-section--case-study { margin-top: 162px; }

.l-section--case-study.is-show .bracket { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.l-section--product { margin-top: 198px; }

.l-section--product:before { content: none; }

.l-section--advantage { margin-top: 191px; }

.l-section--advantage:before { content: none; }

.l-section--service { max-width: 1220px; margin-top: 191px; }

.l-section--service:before { content: none; }

@media screen and (max-width: 719px) { .l-section { padding: 0 35px; }
  .l-section--theaters { padding: 0 4px; }
  .l-section--achievement { margin-top: 97px; padding: 0 20px; }
  .l-section--product { margin-top: 97px; }
  .l-section--advantage { margin-top: 92px; }
  .l-section--service { margin-top: 96px; padding: 0 30px; } }

.bracket { position: absolute; width: 100%; opacity: 0; transition: opacity 0.7s cubic-bezier(0.785, 0.135, 0.15, 0.86), -webkit-transform 0.7s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: transform 0.7s cubic-bezier(0.785, 0.135, 0.15, 0.86), opacity 0.7s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: transform 0.7s cubic-bezier(0.785, 0.135, 0.15, 0.86), opacity 0.7s cubic-bezier(0.785, 0.135, 0.15, 0.86), -webkit-transform 0.7s cubic-bezier(0.785, 0.135, 0.15, 0.86); }

.bracket__inside { position: absolute; width: 369px; height: 1px; top: 10px; left: 10px; background-image: linear-gradient(to right, #524399 31%, #3e4692 100%); }

.bracket__inside:before { content: ''; position: absolute; width: 1px; height: 115px; background-color: #524399; }

.bracket__outside { position: absolute; width: 46px; height: 1px; top: 0; left: 0; background-color: #413580; }

.bracket__outside:before { content: ''; position: absolute; width: 1px; height: 43px; background-color: #413580; }

.bracket--left { top: 0; left: 18px; -webkit-transform: translate3d(-30px, -30px, 0); transform: translate3d(-30px, -30px, 0); }

.bracket--right { right: 20px; bottom: 0; -webkit-transform: translate3d(30px, 30px, 0); transform: translate3d(30px, 30px, 0); }

.bracket--right .bracket__inside, .bracket--right .bracket__outside { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.bracket--right .bracket__inside { width: 237px; top: auto; left: auto; right: 10px; bottom: 10px; background-image: linear-gradient(to left, #3c5ba2 31%, #3a55a5 100%); }

.bracket--right .bracket__inside:before { height: 90px; background-color: #3c5ba2; }

.bracket--right .bracket__outside { top: auto; left: auto; right: 0; bottom: 0; background-color: #3c5ba2; }

.bracket--right .bracket__outside:before { background-color: #3c5ba2; }

@media screen and (max-width: 719px) { .bracket__inside { width: 185px; top: 5px; left: 5px; }
  .bracket__inside:before { height: 57px; }
  .bracket__outside { width: 23px; }
  .bracket__outside:before { height: 23px; }
  .bracket--left { left: 15px; -webkit-transform: translate3d(-10px, -10px, 0); transform: translate3d(-10px, -10px, 0); }
  .bracket--right { right: 15px; -webkit-transform: translate3d(10px, 10px, 0); transform: translate3d(10px, 10px, 0); }
  .bracket--right .bracket__inside { width: 186px; right: 5px; bottom: 5px; }
  .bracket--right .bracket__inside:before { height: 57px; } }

.link-title { display: block; text-align: center; }

.link-title__text { position: relative; display: inline-block; right: 17px; }

.link-title__text > p { font-size: 20px; letter-spacing: .23em; }

.link-title__text-arrow { position: absolute; display: inline-block; width: 28px; height: 8px; top: 50%; right: -36px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); transition: -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1); }

.link-title__text-arrow:before, .link-title__text-arrow:after { content: ''; position: absolute; display: inline-block; }

.link-title__text-arrow:before { width: 25px; top: 50%; left: 0; border: 0.5px solid #adadae; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

.link-title__text-arrow:after { width: 0; height: 0; top: 0; right: 0; border-style: solid; border-width: 4px 0 4px 6px; border-color: transparent transparent transparent #adadae; }

.link-title__border { display: block; margin-top: 27px; width: 100%; height: 1px; background-image: linear-gradient(to right, #b361ff 0%, #6182ff 31%, #61afff 100%); -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: -webkit-transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1); transition: transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1); transition: transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1), -webkit-transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1); }

.link-title--circle .link-title__text { right: 12px; }

.link-title--circle .link-title__text > p { letter-spacing: .45em; }

.link-title--circle .link-title__text-arrow { width: 25px; right: -26px; }

.link-title--circle .link-title__border { margin-top: 22px; }

.link-title--contact .link-title__text { right: 22px; }

.link-title--contact .link-title__text > svg { width: 169px; height: 34px; }

.link-title--contact .link-title__text-arrow { right: -46px; -webkit-transform: translateY(-35%); -ms-transform: translateY(-35%); transform: translateY(-35%); }

.link-title--contact .link-title__border { margin-top: 23px; opacity: .8; transition: opacity 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1); transition: transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1), opacity 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95); transition: transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1), opacity 0.3s cubic-bezier(0.445, 0.05, 0.55, 0.95), -webkit-transform 0.43s cubic-bezier(0.39, 0.575, 0.565, 1); }

.link-title--external .link-title__border { margin-top: 31px; }

.link-title--external-corp .link-title__text { right: 15px; }

.link-title--external-corp .link-title__text > svg { width: 192px; height: 26px; }

.link-title--external-corp .link-title__text-arrow { right: -39px; -webkit-transform: translateY(-30%); -ms-transform: translateY(-30%); transform: translateY(-30%); }

.link-title--external-corp.hover .link-title__text-arrow { -webkit-transform: translate3d(8px, -30%, 0); transform: translate3d(8px, -30%, 0); }

.link-title--external-fb .link-title__text { right: 15px; }

.link-title--external-fb .link-title__text > svg { width: 198px; height: 21px; }

.link-title--external-fb .link-title__text-arrow { right: -36px; -webkit-transform: translateY(-6%); -ms-transform: translateY(-6%); transform: translateY(-6%); }

.link-title--external-fb.hover .link-title__text-arrow { -webkit-transform: translate3d(8px, -6%, 0); transform: translate3d(8px, -6%, 0); }

.link-title--external-tw .link-title__text { right: 17px; }

.link-title--external-tw .link-title__text > svg { width: 157px; height: 21px; }

.link-title--external-tw .link-title__text-arrow { right: -37px; -webkit-transform: translateY(-6%); -ms-transform: translateY(-6%); transform: translateY(-6%); }

.link-title--external-tw.hover .link-title__text-arrow { -webkit-transform: translate3d(8px, -6%, 0); transform: translate3d(8px, -6%, 0); }

.link-title--external.hover .link-title__border { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); }

@media screen and (max-width: 719px) { .link-title__text > p { font-size: 17px; }
  .link-title__text-arrow { width: 19px; right: -30px; }
  .link-title__text-arrow:before { width: 18px; top: 44%; }
  .link-title__text-arrow:after { border-width: 3px 0 3px 5px; }
  .link-title__border { margin-top: 14px; }
  .link-title--circle .link-title__text { right: 10px; }
  .link-title--circle .link-title__text-arrow { width: 19px; right: -20px; }
  .link-title--circle .link-title__text-arrow:before { width: 18px; top: 44%; }
  .link-title--circle .link-title__text-arrow:after { border-width: 3px 0 3px 5px; }
  .link-title--circle .link-title__border { margin-top: 15px; }
  .link-title--contact .link-title__text { right: 14px; }
  .link-title--contact .link-title__text > svg { width: 99px; height: 14px; }
  .link-title--contact .link-title__text-arrow { right: -29px; -webkit-transform: translateY(-20%); -ms-transform: translateY(-20%); transform: translateY(-20%); }
  .link-title--contact .link-title__text-arrow:before { top: 38%; }
  .link-title--contact .link-title__border { display: none; }
  .link-title--external .link-title__text { right: 15px; }
  .link-title--external .link-title__text-arrow { right: -28px; }
  .link-title--external .link-title__text-arrow:before { top: 38%; }
  .link-title--external .link-title__border { margin-top: 19px; }
  .link-title--external-corp .link-title__text > svg { width: 114px; height: 16px; }
  .link-title--external-fb .link-title__text > svg { width: 119px; height: 14px; }
  .link-title--external-tw .link-title__text > svg { width: 93px; height: 14px; } }

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

.textset__title { position: relative; width: 100%; height: 156px; background-image: url("../img/main_title.png"); background-size: contain; background-position: center; opacity: 0; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); transition: opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, -webkit-transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; transition: transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; transition: transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, -webkit-transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; }

.textset__title:after { content: ''; position: absolute; display: inline-block; width: 246px; height: 2px; margin: 0 auto; left: 0; right: 0; bottom: -9px; background: linear-gradient(to right, rgba(97, 175, 255, 0) 12%, rgba(97, 175, 255, 0.09) 15%, rgba(97, 159, 255, 0.4) 26%, rgba(97, 138, 255, 0.8) 40%, rgba(97, 130, 255, 0.8) 45%, rgba(179, 97, 255, 0.8) 55%, rgba(165, 110, 255, 0.8) 60%, rgba(127, 146, 255, 0.4) 74%, rgba(97, 175, 255, 0.09) 85%, rgba(97, 175, 255, 0) 88%); opacity: 0; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.7s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.7s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.7s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.7s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.7s; }

.textset__title > span { position: absolute; display: none; top: 0; left: 0; }

.textset__subtitle { position: relative; width: 100%; height: 81px; margin-top: 19px; background-image: url("../img/main_subtitle.png"); background-size: contain; background-position: center; opacity: 0; transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s; }

.textset__description { margin-top: 10px; font-size: 15px; color: #adadae; line-height: 1.75; letter-spacing: .1em; text-shadow: 0 0 41px #00000e; opacity: 0; -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); transition: opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s, -webkit-transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s; transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s, opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s; transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s, opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s, -webkit-transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.9s; }

.textset.is-show .textset__title { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.textset.is-show .textset__title:after { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }

.textset.is-show .textset__subtitle { opacity: 1; }

.textset.is-show .textset__description { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.textset--theaters { margin: 0 39.4% 0 7.9%; text-align: left; }

.textset--theaters .textset__title { height: 137px; left: -30px; background-image: url("../img/section_title/konica-theaters_ttl.png"); background-position: top left; }

.textset--theaters .textset__title:after { width: 123px; left: 31px; right: auto; bottom: 0; background: linear-gradient(to right, rgba(179, 97, 255, 0.8) 0%, rgba(97, 130, 255, 0.43) 46%, rgba(97, 130, 255, 0) 100%); -webkit-transform-origin: left; -ms-transform-origin: left; transform-origin: left; }

.textset--theaters .textset__description { margin-top: 22px; }

.textset--ahievement { margin-top: -22px; }

.textset--ahievement .textset__title { height: 115px; background-image: url("../img/section_title/achievements_ttl.png"); }

.textset--ahievement .textset__title:after { bottom: 13px; }

.textset--case-study { text-align: left; }

.textset--case-study .textset__title { height: 113px; background-image: url("../img/section_title/case-study_ttl.png"); background-position: top left; transition-delay: .6s; }

.textset--case-study .textset__title:after { content: none; }

.textset--case-study .textset__subtitle { position: absolute; width: 489px; height: 103px; margin-top: 0; top: 44px; left: 64px; background-image: url("../img/section_title/science-museum_ttl.png"); transition-delay: .9s; }

.textset--case-study .textset__subtitle:before { content: ''; position: absolute; width: 1px; height: 19px; top: 50%; left: 24px; background-color: #adadae; -webkit-transform: translateY(-52%) rotate(45deg); -ms-transform: translateY(-52%) rotate(45deg); transform: translateY(-52%) rotate(45deg); }

.textset--case-study .textset__description { text-align: left; }

.textset--product { margin-top: -5px; }

.textset--product .textset__title { height: 94px; background-image: url("../img/section_title/product-lineup_ttl.png"); }

.textset--product .textset__title:after { bottom: 4px; }

.textset--product .textset__subtitle { height: 78px; margin-top: 0; bottom: 4px; background-image: url("../img/section_title/imagination_sub-ttl.png"); }

.textset--advantage { margin-top: 25px; }

.textset--advantage .textset__title { height: 32px; margin-bottom: 27px; background-image: url("../img/section_title/advantage_ttl.png"); }

.textset--advantage .textset__title:after { bottom: -27px; }

.textset--advantage .textset__description { margin-top: 50px; }

.textset--service { margin-top: -9px; }

.textset--service .textset__title { height: 93px; background-image: url("../img/section_title/service_ttl.png"); }

.textset--service .textset__title:after { bottom: -1px; }

.textset--service .textset__description { margin-top: 26px; }

@media screen and (max-width: 939px) { .textset--theaters { margin-right: 7.9%; } }

@media screen and (max-width: 719px) { .textset__title { width: 92%; height: 0; margin: 0 auto; padding-top: 24.4%; background-image: url("../img/sp/main_title.png"); }
  .textset__title:after { width: 46.4%; bottom: -8px; }
  .textset__subtitle { height: 0; margin: 16px auto 0; padding-top: 9.62%; background-image: url("../img/sp/main_subtitle.png"); }
  .textset__description { line-height: 1.54; letter-spacing: .03em; text-align: center; }
  .textset--theaters { margin: -8px 0 0; }
  .textset--theaters .textset__title { height: 0; padding-top: 29.57%; left: auto; background-image: url("../img/sp/konica-theaters_ttl.png"); background-position: center; }
  .textset--theaters .textset__title:after { width: 46.4%; left: 0; right: 0; bottom: -11px; background: linear-gradient(to right, rgba(97, 175, 255, 0) 12%, rgba(97, 175, 255, 0.09) 15%, rgba(97, 159, 255, 0.4) 26%, rgba(97, 138, 255, 0.8) 40%, rgba(97, 130, 255, 0.8) 45%, rgba(179, 97, 255, 0.8) 55%, rgba(165, 110, 255, 0.8) 60%, rgba(127, 146, 255, 0.4) 74%, rgba(97, 175, 255, 0.09) 85%, rgba(97, 175, 255, 0) 88%); }
  .textset--theaters .textset__description { margin-top: 40px; padding: 0 36px; }
  .textset--ahievement .textset__title { margin-top: -27px; background-image: url("../img/sp/achievement_ttl.png"); }
  .textset--ahievement .textset__title:after { bottom: 10px; }
  .textset--ahievement .textset__description { margin-top: 19px; padding: 0 17px; }
  .textset--case-study { padding: 0 31px; }
  .textset--case-study .textset__title { height: 0; max-width: 171px; padding-top: 11.67%; background-image: url("../img/sp/case-study_ttl.png"); background-position: center; }
  .textset--case-study .textset__subtitle { position: relative; width: 100%; height: 0; margin-top: 8px; padding-top: 4.55%; top: 0; left: 0; background-image: url("../img/sp/science-museum_ttl.png"); }
  .textset--case-study .textset__subtitle:before { content: none; }
  .textset--product { margin-top: -2px; }
  .textset--product .textset__title { height: 0; padding-top: 34%; background-image: url("../img/sp/product-lineup_ttl.png"); }
  .textset--product .textset__title:after { bottom: -44px; transition-delay: .9s; }
  .textset--product .textset__subtitle { max-width: 187px; height: 0; padding-top: 5.85%; bottom: 7px; background-image: url("../img/sp/imagination_sub-ttl.png"); transition-delay: .7s; }
  .textset--advantage { margin-top: -2px; }
  .textset--advantage .textset__title { height: 0; margin-bottom: 12px; padding-top: 20.3%; background-image: url("../img/sp/advantage_ttl.png"); }
  .textset--advantage .textset__title:after { bottom: -12px; }
  .textset--advantage .textset__description { margin-top: 40px; }
  .textset--service { margin-top: -2px; }
  .textset--service .textset__title { height: 0; padding-top: 32.4%; background-image: url("../img/sp/service_ttl.png"); }
  .textset--service .textset__title:after { bottom: -15px; }
  .textset--service .textset__description { margin-top: 45px; } }

.achievement-list { margin-top: 94px; }

.achievement-list__inner { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; text-align: center; }

.achievement-list__item { position: relative; width: 34%; opacity: 0; transition: opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, -webkit-transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; transition: transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; transition: transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, -webkit-transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.achievement-list__item:first-child { padding-right: 3.5%; -webkit-transform: translate3d(-35px, 0, 0) scale3d(1.04, 1.04, 1.04); transform: translate3d(-35px, 0, 0) scale3d(1.04, 1.04, 1.04); }

.achievement-list__item:first-child .achievement-list__item-image { padding-top: 32%; background-image: url("../img/achievements/theaters_num.png"); }

.achievement-list__item:first-child > p { margin-top: 21px; }

.achievement-list__item:nth-child(2) { padding: 0 .7% 0 .1%; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); }

.achievement-list__item:nth-child(2):before { content: ''; position: absolute; width: 1px; height: 101%; top: -7px; left: -3.3%; background-image: linear-gradient(to bottom, #6182ff 31%, #61afff 100%); -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.95s; }

.achievement-list__item:nth-child(2) .achievement-list__item-image { padding-top: 31.6%; background-image: url("../img/achievements/peoples_num.png"); }

.achievement-list__item:nth-child(2) > p { margin-top: 12px; }

.achievement-list__item:last-child { padding-left: 2.8%; -webkit-transform: translate3d(35px, 0, 0) scale3d(1.04, 1.04, 1.04); transform: translate3d(35px, 0, 0) scale3d(1.04, 1.04, 1.04); }

.achievement-list__item:last-child:before { content: ''; position: absolute; width: 1px; height: 101%; top: -7px; left: 1.2%; background-image: linear-gradient(to bottom, #6182ff 31%, #61afff 100%); -webkit-backface-visibility: hidden; backface-visibility: hidden; opacity: 0; transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.95s; }

.achievement-list__item:last-child .achievement-list__item-image { padding-top: 32.3%; background-image: url("../img/achievements/visitor_num.png"); }

.achievement-list__item:last-child > p { margin-top: 18px; }

.achievement-list__item-image { position: relative; width: 100%; height: 0; background-size: contain; background-position: center; }

.achievement-list__item-image > img { width: 100%; height: auto; }

.achievement-list__item > p { font-size: 15px; color: #6d93ff; line-height: 1.75; letter-spacing: .11em; text-shadow: 0 0 41px #00000e; }

.achievement-list__item.is-show { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.achievement-list__item.is-show:nth-child(n + 2):before { opacity: 1; }

@media screen and (max-width: 939px) { .achievement-list__item > p { margin-top: 0; } }

@media screen and (max-width: 719px) { .achievement-list { margin-top: 47px; }
  .achievement-list__inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; }
  .achievement-list__item { width: 100%; }
  .achievement-list__item:nth-child(n + 1) { padding: 0; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); }
  .achievement-list__item:first-child .achievement-list__item-image { padding-top: 32%; background-image: url("../img/sp/theaters_num.png"); }
  .achievement-list__item:first-child > p { margin-top: 18px; }
  .achievement-list__item:nth-child(2) { margin-top: 80px; }
  .achievement-list__item:nth-child(2):before { width: 28.5%; height: 1px; margin: 0 auto; top: -44px; left: 0; right: 0; background-image: linear-gradient(to right, #6182ff 31%, #61afff 100%); -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s; }
  .achievement-list__item:nth-child(2) .achievement-list__item-image { padding-top: 31.2%; background-image: url("../img/sp/peoples_num.png"); }
  .achievement-list__item:nth-child(2) > p { margin-top: 18px; }
  .achievement-list__item:last-child { margin-top: 81px; }
  .achievement-list__item:last-child:before { width: 28.5%; height: 1px; margin: 0 auto; top: -44px; left: 0; right: 0; background-image: linear-gradient(to right, #6182ff 31%, #61afff 100%); -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.8s; }
  .achievement-list__item:last-child .achievement-list__item-image { padding-top: 33%; background-image: url("../img/sp/visitor_num.png"); }
  .achievement-list__item:last-child > p { margin-top: 19px; }
  .achievement-list__item > p { line-height: 1.54; }
  .achievement-list__item.is-show:nth-child(n + 1) { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  .achievement-list__item.is-show:nth-child(n + 2):before { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }

.advantage-list { margin-top: 93px; }

.advantage-list__inner { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin: 0 1.4%; }

.advantage-list__item { display: inline-block; width: 29.86%; padding: 0 3.48%; opacity: 0; transition: opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, -webkit-transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; transition: transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; transition: transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, opacity 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s, -webkit-transform 0.9s cubic-bezier(0.215, 0.61, 0.355, 1) 0.4s; }

.advantage-list__item:first-child { -webkit-transform: translate3d(-35px, 0, 0) scale3d(1.04, 1.04, 1.04); transform: translate3d(-35px, 0, 0) scale3d(1.04, 1.04, 1.04); }

.advantage-list__item:nth-child(2) { -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); }

.advantage-list__item:last-child { -webkit-transform: translate3d(35px, 0, 0) scale3d(1.04, 1.04, 1.04); transform: translate3d(35px, 0, 0) scale3d(1.04, 1.04, 1.04); }

.advantage-list__item-info { display: block; cursor: pointer; }

.advantage-list__item-info.hover .advantage-list__item-image:before { opacity: 1; }

.advantage-list__item-info.hover .advantage-list__item-title-arrow { -webkit-transform: translate3d(8px, -50%, 0); transform: translate3d(8px, -50%, 0); }

.advantage-list__item-info.hover .advantage-list__item-title-border { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); }

.advantage-list__item-image { position: relative; }

.advantage-list__item-image:before { content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); margin: auto; top: 0; left: -1px; right: 0; bottom: 0; border: 1px solid transparent; background: linear-gradient(135deg, #b361ff 0%, #6182ff 52%, #61afff 100%); background-origin: border-box; opacity: .4; transition: opacity 0.35s cubic-bezier(0.39, 0.575, 0.565, 1); }

.advantage-list__item-image > img { position: relative; }

.advantage-list__item-title { margin-top: 44px; padding: 0 10px; }

.advantage-list__item.is-show { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

@media screen and (max-width: 939px) { .advantage-list__item { width: 32%; padding: 0 2.8%; } }

@media screen and (max-width: 719px) { .advantage-list { margin-top: 43px; }
  .advantage-list__inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; margin: 0; padding: 0 40px; }
  .advantage-list__item { width: 100%; height: 100%; padding: 0; }
  .advantage-list__item:nth-child(n + 1) { -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); }
  .advantage-list__item-title { margin-top: 30px; padding: 0 2px; }
  .advantage-list__item ~ li { margin-top: 60px; }
  .advantage-list__item.is-show:nth-child(n + 1) { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }

.case-study { padding: 69px 5.6% 107px; }

.case-study__content { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; margin-top: 74px; padding: 0 2%; }

.case-study__content-image { -webkit-flex-basis: 367px; -ms-flex-preferred-size: 367px; flex-basis: 367px; padding: 0 38px 0 31px; }

.case-study__content-text { -webkit-flex-basis: 657px; -ms-flex-preferred-size: 657px; flex-basis: 657px; padding: 15px 0 0 58px; opacity: 0; -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s, -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s; transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s, opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s; transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s, opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s, -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s; }

.case-study__content-text > p { font-size: 15px; color: #adadae; line-height: 1.75; text-shadow: 0 0 41px #00000e; }

.case-study__content-text span:first-child { letter-spacing: .158em; }

.case-study__content-text span:nth-child(2) { letter-spacing: .162em; }

.case-study__content-text span:nth-child(3) { letter-spacing: .125em; }

.case-study__content-text span:nth-child(4) { letter-spacing: .096em; }

.case-study__content-text span:nth-child(5) { letter-spacing: .21em; }

.case-study__content-text span:nth-child(6) { letter-spacing: .13em; }

.case-study__content-text span:nth-child(7) { letter-spacing: .14em; }

.case-study__content-text span:nth-child(8) { letter-spacing: .14em; }

.case-study__content-text span:nth-child(9) { letter-spacing: .158em; }

.case-study__content-text span:last-child { letter-spacing: .1em; }

.case-study__content-text.is-show { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.case-study__content-list { position: relative; margin-top: 24px; padding-left: 33px; }

.case-study__content-list:before { content: ''; position: absolute; width: 1px; height: 105%; left: 1px; background-color: #adadae; }

.case-study__content-list > li { font-size: 13px; color: #adadae; line-height: 1; letter-spacing: .1em; text-shadow: 0 0 41px #00000e; }

.case-study__content-list > li ~ li { margin-top: 9px; }

@media screen and (max-width: 1080px) { .case-study__content-image { padding: 0 20px 0 10px; } }

@media screen and (max-width: 939px) { .case-study { padding: 69px 3% 107px; }
  .case-study__content-image { padding-right: 40px; }
  .case-study__content-text { -webkit-flex-basis: 60%; -ms-flex-preferred-size: 60%; flex-basis: 60%; padding-left: 34px; } }

@media screen and (max-width: 719px) { .case-study { padding: 77px 0 69px; }
  .case-study__content { display: block; margin-top: 45px; padding: 0; }
  .case-study__content-text { margin-top: 39px; padding: 0; text-align: center; }
  .case-study__content-text > p { line-height: 1.54; letter-spacing: .03em; }
  .case-study__content-list { margin-top: 61px; padding: 0; }
  .case-study__content-list:before { width: 23%; height: 1px; margin: 0 auto; top: -31px; left: 0; right: 0; }
  .case-study__content-list > li { font-size: 15px; line-height: 1.5; letter-spacing: .04em; }
  .case-study__content-list > li ~ li { margin-top: 1px; } }

.circle-thumb { position: absolute; display: inline-block; text-align: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; cursor: pointer; }

.circle-thumb__image { position: relative; width: 355px; height: 0; margin: 0 auto; padding-top: 100%; z-index: 0; }

.circle-thumb__image-content { position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0; -webkit-transform: scale3d(0.97, 0.97, 0.07); transform: scale3d(0.97, 0.97, 0.07); transition: opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.7s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.7s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.7s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.7s cubic-bezier(0.215, 0.61, 0.355, 1); }

.circle-thumb__image-content:before, .circle-thumb__image-content:after { content: ''; position: absolute; width: 100%; margin: auto; top: 0; left: 0; right: 0; bottom: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.circle-thumb__image-content:before { border-radius: 50%; background: linear-gradient(135deg, #b361ff 0%, #6182ff 52%, #61afff 100%); background-origin: border-box; opacity: .4; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: opacity 0.3s cubic-bezier(0.39, 0.575, 0.565, 1); }

.circle-thumb__image-content:after { width: calc(100% - 2px); background-image: url("../img/thumbnail/case_thumb.png"); background-size: contain; background-position: center; background-repeat: no-repeat; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.circle-thumb__image-line { position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: .6; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: rotate3d(0, 0, 1, -153deg) scale3d(1.17, 1.17, 1.17); transform: rotate3d(0, 0, 1, -153deg) scale3d(1.17, 1.17, 1.17); transition: -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); }

.circle-thumb__image-line:last-of-type { opacity: 0; -webkit-transform: rotate3d(0, 0, 1, 100deg) scale(1.24, 1.24); transform: rotate3d(0, 0, 1, 100deg) scale(1.24, 1.24); transition: opacity 0.5s cubic-bezier(0.39, 0.575, 0.565, 1), -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s; transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s, opacity 0.5s cubic-bezier(0.39, 0.575, 0.565, 1); transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s, opacity 0.5s cubic-bezier(0.39, 0.575, 0.565, 1), -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1) 0.2s; }

.circle-thumb__image-line:last-of-type > svg { stroke-dasharray: 198 653; }

.circle-thumb__image-line > svg { width: 100%; height: 100%; fill: transparent; stroke: #adadae; stroke-width: .03em; stroke-dasharray: 0 653; transition: stroke-dasharray 0.5s cubic-bezier(0.075, 0.82, 0.165, 1); }

.circle-thumb__title { margin-top: 73px; padding: 0 63px; opacity: 0; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s; transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s; transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s; }

.circle-thumb__logo { display: inline-block; margin-top: 23px; opacity: 0; -webkit-transform: translate3d(0, 15px, 0); transform: translate3d(0, 15px, 0); transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s, -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s; transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s, opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s; transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s, opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s, -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.6s; }

.circle-thumb__logo > svg { width: 60px; height: 37px; }

.circle-thumb.is-show .circle-thumb__image-content { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }

.circle-thumb.is-show .circle-thumb__image-line:last-of-type { opacity: .6; -webkit-transform: rotate3d(0, 0, 1, -31deg) scale(1.24, 1.24); transform: rotate3d(0, 0, 1, -31deg) scale(1.24, 1.24); }

.circle-thumb.is-show .circle-thumb__image-line:last-of-type > svg { stroke-dasharray: 198 653; }

.circle-thumb.is-show .circle-thumb__image-line > svg { stroke-dasharray: 449 653; }

.circle-thumb.is-show .circle-thumb__title, .circle-thumb.is-show .circle-thumb__logo { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.circle-thumb.hover .circle-thumb__image-content { -webkit-transform: scale3d(1.02, 1.02, 1.02); transform: scale3d(1.02, 1.02, 1.02); }

.circle-thumb.hover .circle-thumb__image-content:before { opacity: 1; transition-duration: .35s; transition-delay: 0s; }

.circle-thumb.hover .circle-thumb__image-line:last-of-type { opacity: 0; -webkit-transform: rotate3d(0, 0, 1, -82deg) scale(1.24, 1.24); transform: rotate3d(0, 0, 1, -82deg) scale(1.24, 1.24); transition: opacity 0.5s cubic-bezier(0.39, 0.575, 0.565, 1) 0.1s, -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1); transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.5s cubic-bezier(0.39, 0.575, 0.565, 1) 0.1s; transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.5s cubic-bezier(0.39, 0.575, 0.565, 1) 0.1s, -webkit-transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1); }

.circle-thumb.hover .circle-thumb__image-line > svg { stroke-dasharray: 654 653; transition-delay: 0s; }

.circle-thumb.hover .circle-thumb__title-arrow { -webkit-transform: translate3d(8px, -50%, 0); transform: translate3d(8px, -50%, 0); }

.circle-thumb.hover .circle-thumb__title-border { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); }

.circle-thumb--manten { top: 183px; right: 40px; z-index: 1; }

.circle-thumb--manten .circle-thumb__image-content:after { background-image: url("../img/thumbnail/manten_thumb.png"); }

.circle-thumb--tenku { right: 410px; bottom: 0; }

.circle-thumb--tenku .circle-thumb__image-content:after { background-image: url("../img/thumbnail/tenku_thumb.png"); }

.circle-thumb--case { position: relative; }

.circle-thumb--case .circle-thumb__image { width: 100%; }

.circle-thumb--case .circle-thumb__image-content:after { opacity: .8; }

@media screen and (max-width: 1080px) { .circle-thumb__image { width: 320px; }
  .circle-thumb--manten { top: 310px; right: 60px; }
  .circle-thumb--tenku { right: 400px; bottom: -30px; } }

@media screen and (max-width: 939px) { .circle-thumb--manten, .circle-thumb--tenku { position: relative; width: 49%; padding: 0 12px; }
  .circle-thumb--manten .circle-thumb__image, .circle-thumb--tenku .circle-thumb__image { width: 90%; padding-top: 90%; }
  .circle-thumb--manten { float: right; margin-top: 40px; top: 0; right: 0; }
  .circle-thumb--tenku { margin-top: 190px; right: -20px; bottom: 0; } }

@media screen and (max-width: 719px) { .circle-thumb { position: relative; width: 100%; padding: 0 50px; }
  .circle-thumb__image { width: 100%; }
  .circle-thumb__title { margin-top: 43px; padding: 0 24px; }
  .circle-thumb__logo { margin-top: 20px; }
  .circle-thumb__logo > svg { width: 50px; height: 27px; }
  .circle-thumb--manten, .circle-thumb--tenku { top: 0; right: 0; }
  .circle-thumb--manten { margin-top: 66px; }
  .circle-thumb--tenku { margin-top: 70px; }
  .circle-thumb--case { padding: 0 49px 0 44px; } }

.contact-area { margin-top: 190px; text-align: center; }

.contact-area__intro { width: 100%; height: 0; padding-top: 10.19%; background: url("../img/contact_intro.png") center no-repeat; background-size: contain; opacity: 0; -webkit-transform: translate3d(0, 18px, 0); transform: translate3d(0, 18px, 0); transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.contact-area__link { position: relative; display: block; width: 100%; height: 300px; margin: 38px auto 0; text-align: center; opacity: 0; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s; transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s; transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s, -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s; }

.contact-area__link-bg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: .7; transition: opacity 0.4s cubic-bezier(0.39, 0.575, 0.565, 1); }

.contact-area__link-bg:before, .contact-area__link-bg:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.contact-area__link-bg:before { border: 1px solid rgba(255, 255, 255, 0.51); z-index: 1; }

.contact-area__link-bg:after { background-image: linear-gradient(135deg, rgba(27, 63, 114, 0.9) 0%, rgba(33, 82, 152, 0.84) 63%, rgba(99, 69, 209, 0.8) 100%); }

.contact-area__link-title { position: absolute; width: 260px; margin: -19px auto 0; top: 50%; left: 0; right: 0; }

.contact-area__link.hover .contact-area__link-bg, .contact-area__link.hover .contact-area__link-title-border { opacity: 1; }

.contact-area__link.hover .contact-area__link-title-arrow { -webkit-transform: translate3d(8px, -35%, 0); transform: translate3d(8px, -35%, 0); }

.contact-area__link.hover .contact-area__link-title-border { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); }

.contact-area.is-show .contact-area__intro, .contact-area.is-show .contact-area__link { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.contact-area--menu { max-width: 400px; margin: 62px 0 0 2px; }

.contact-area--menu .contact-area__link { height: 90px; margin-top: 0; opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.contact-area--menu .contact-area__link-title { margin-top: -17px; }

.contact-area--menu .contact-area__link-title svg { width: 138px; height: 30px; }

.contact-area--menu .contact-area__link.hover .contact-area__link-title-arrow { -webkit-transform: translate3d(8px, -35%, 0); transform: translate3d(8px, -35%, 0); }

@media screen and (max-width: 767px) { .contact-area__intro { padding-top: 40%; background-image: url("../img/sp/contact_intro.png"); } }

@media screen and (max-width: 719px) { .contact-area { margin-top: 81px; padding: 0 28px; }
  .contact-area__intro { padding-top: 53.13%; }
  .contact-area__link { width: 96%; height: 126px; margin-top: 30px; }
  .contact-area__link-title { margin-top: -12px; }
  .contact-area--menu { min-width: 213px; width: 72%; height: 55px; margin: 44px 0 0; padding: 0; }
  .contact-area--menu .contact-area__link { width: 100%; height: 100%; margin: 0; }
  .contact-area--menu .contact-area__link-title { width: 100%; margin-top: -12px; padding-left: 4px; }
  .contact-area--menu .contact-area__link-title svg { width: 85px; height: 14px; }
  .contact-area--menu .contact-area__link-title-arrow { right: -27px; -webkit-transform: translateY(-10%); -ms-transform: translateY(-10%); transform: translateY(-10%); } }

/* IE10+ */
@media all and (-ms-high-contrast: none) { .contact-area--menu .contact-area__link-title { margin-top: -13px; } }

.link-area { margin-top: 57px; opacity: 0; -webkit-transform: translate3d(0, 18px, 0); transform: translate3d(0, 18px, 0); transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.link-area__inner { position: relative; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end; padding: 0 10px; }

.link-area__item { width: 260px; margin: 50px 15px 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.link-area__item:first-child { margin-right: 16.4%; }

.link-area.is-show { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

@media screen and (max-width: 767px) { .link-area { margin-top: 110px; }
  .link-area__inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }
  .link-area__item:first-child { margin: 0 0 30px; } }

@media screen and (max-width: 719px) { .link-area { margin-top: 55px; }
  .link-area__inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding: 0 43px; }
  .link-area__item { width: 100%; margin: 0; }
  .link-area__item:first-child { margin: 0; }
  .link-area__item:nth-child(2) { margin-top: 58px; }
  .link-area__item:last-child { margin-top: 27px; } }

.loading { position: fixed; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: #000; z-index: 20; transition: opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), visibility 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.loading__inner { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

.loading__text { font-family: "Copperplate Gothic W01", "Arial", "Helvetica", "メイリオ", "Meiryo", sans-serif; font-size: 20px; letter-spacing: .1em; text-align: center; }

.loading__bar { position: relative; width: 80px; height: 1px; margin-top: 10px; background-color: #fff; }

.loading__bar-state { position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to right, #b361ff 0%, #6182ff 31%, #61afff 100%); -webkit-transform-origin: left; -ms-transform-origin: left; transform-origin: left; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); transition: -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94); -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.loading.is-hide { opacity: 0; visibility: hidden; }

@media screen and (max-width: 719px) { .loading__bar { width: 100px; height: 2px; } }

@-webkit-keyframes spriteImage { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  100% { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }

@keyframes spriteImage { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  100% { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }

@-webkit-keyframes spriteImageIE { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  100% { -webkit-transform: translate3d(0, -32120px, 0); transform: translate3d(0, -32120px, 0); } }

@keyframes spriteImageIE { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  100% { -webkit-transform: translate3d(0, -32120px, 0); transform: translate3d(0, -32120px, 0); } }

.main-visual { position: relative; width: 100%; z-index: 0; }

.main-visual__content { position: relative; padding-top: 169px; }

.main-visual__title { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); transition: opacity 1s cubic-bezier(0.39, 0.575, 0.565, 1) 1.5s, -webkit-transform 1s cubic-bezier(0.39, 0.575, 0.565, 1) 1.5s; transition: transform 1s cubic-bezier(0.39, 0.575, 0.565, 1) 1.5s, opacity 1s cubic-bezier(0.39, 0.575, 0.565, 1) 1.5s; transition: transform 1s cubic-bezier(0.39, 0.575, 0.565, 1) 1.5s, opacity 1s cubic-bezier(0.39, 0.575, 0.565, 1) 1.5s, -webkit-transform 1s cubic-bezier(0.39, 0.575, 0.565, 1) 1.5s; }

.main-visual__title:after { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.1s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 2.1s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 2.1s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.1s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 2.1s, opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.1s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 2.1s; }

.main-visual__subtitle { opacity: 1; transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.4s; }

.main-visual__effect { position: absolute; width: 730px; height: 730px; margin: auto 0; top: 39%; left: 50%; bottom: 0; overflow: hidden; z-index: -1; -webkit-transform: translate3d(-51%, 0, 0); transform: translate3d(-51%, 0, 0); transition: opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 3.4s; }

.main-visual__effect-inner { display: block; position: absolute; padding-top: 4400%; top: 0; left: 0; width: 100%; background-image: url("../img/flare.png"); background-repeat: no-repeat; background-size: cover; -webkit-animation: spriteImage 3s steps(44) infinite; animation: spriteImage 3s steps(44) infinite; }

.main-visual__image { max-width: 480px; margin: -5px auto 0; transition: opacity 3s cubic-bezier(0.25, 0.46, 0.45, 0.94); -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.main-visual__description { max-width: 1164px; width: 100%; height: 0; margin: 166px auto 0; padding-top: 21.91%; background-image: url("../img/main_description.png"); background-size: contain; background-position: center; opacity: 0; transition: opacity 1.2s cubic-bezier(0.39, 0.575, 0.565, 1); }

.main-visual__description.is-show { opacity: 1; }

.main-visual.is-hidden .main-visual__title { -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); opacity: 0; }

.main-visual.is-hidden .main-visual__title:after { opacity: 0; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); }

.main-visual.is-hidden .main-visual__subtitle { opacity: 0; }

.main-visual.is-hidden .main-visual__image { opacity: 0; }

.main-visual.is-hidden .main-visual__effect { opacity: 0; }

@media screen and (max-width: 719px) { .main-visual { padding: 0 18px; }
  .main-visual__content { padding-top: 104px; }
  .main-visual__image { margin-top: 11px; padding: 0 50px; }
  .main-visual__effect { width: 600px; height: 600px; top: calc(100% - 490px); transition-delay: 3.84s; }
  .main-visual__description { margin-top: 105px; padding-top: 105%; background-image: url("../img/sp/main_description.png"); } }

@media screen and (max-width: 515px) { .main-visual__effect { width: calc(100vw + 10px); height: calc(100vw + 10px); top: 42%; } }

@media screen and (max-width: 320px) { .main-visual__effect { width: 93vw; height: 93vw; top: 47%; } }

/* IE10+ */
@media all and (-ms-high-contrast: none) { .main-visual__effect-inner { -webkit-animation-name: spriteImageIE; animation-name: spriteImageIE; } }

.menu { position: fixed; display: inline-block; width: 43px; height: 21px; padding: 4px; top: 110px; right: 49px; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 10; transition: top 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95), height 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) 4s; cursor: pointer; }

.menu__circle { position: absolute; display: none; width: 100%; top: 0; left: 0; }

.menu__circle > svg { width: 100%; height: auto; }

.menu__circle .circle-default { fill: #fff; }

.menu__circle .circle-gradient { fill: url(#gradient-menu-circle); opacity: 0; transition: opacity 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }

.menu__inner { position: relative; height: 100%; }

.menu__item { position: absolute; width: 100%; height: 1px; background: linear-gradient(to right, #b361ff 0%, #6182ff 52%, #61afff 100%); }

.menu__item:before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: white; transition: background-color 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); z-index: 1; }

.menu__item:first-child { top: 0; -webkit-transform-origin: right; -ms-transform-origin: right; transform-origin: right; -webkit-transform: scale3d(0.5, 1, 1); transform: scale3d(0.5, 1, 1); transition: -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s; }

.menu__item:nth-child(2) { margin: auto 0; top: 0; bottom: 0; transition: -webkit-transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); }

.menu__item:last-child { bottom: 0; -webkit-transform-origin: left; -ms-transform-origin: left; transform-origin: left; -webkit-transform: scale3d(0.5, 1, 1); transform: scale3d(0.5, 1, 1); transition: -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s; transition: transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s, -webkit-transform 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) 0.3s; }

.menu__item-sub { position: absolute; display: block; width: 100%; height: 100%; background: linear-gradient(to right, #b361ff 0%, #6182ff 52%, #61afff 100%); opacity: 0; transition: opacity 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.3s, -webkit-transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.3s; transition: transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.3s, -webkit-transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1); }

.menu__item-sub:before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: white; transition: background-color 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); z-index: 1; }

.menu.hover .menu__circle .circle-gradient { opacity: 1; }

.menu.hover .menu__item:before, .menu.hover .menu__item-sub:before { background-color: rgba(255, 255, 255, 0); }

.menu.is-open { height: 37px; top: 102px; transition: top 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0.3s, height 0.15s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0.3s; }

.menu.is-open .menu__item:first-child { -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); transition: -webkit-transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1); transition: transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1); transition: transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1); }

.menu.is-open .menu__item:nth-child(2) { -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); transition-delay: .3s; }

.menu.is-open .menu__item:last-child { -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); transition: -webkit-transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1); transition: transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1); transition: transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.4s cubic-bezier(0.075, 0.82, 0.165, 1); }

.menu.is-open .menu__item-sub { opacity: 1; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); transition: opacity, -webkit-transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.3s; transition: transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.3s, opacity; transition: transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.3s, opacity, -webkit-transform 0.2s cubic-bezier(0.215, 0.61, 0.355, 1) 0.3s; }

.menu.is-hidden { opacity: 0; }

@media screen and (max-width: 719px) { .menu { width: 50px; height: 50px; padding: 19px 16px; top: 73px; right: 13px; }
  .menu__circle { display: inline-block; }
  .menu.is-open { height: 50px; top: 73px; } }

/* IE10+ */
@media all and (-ms-high-contrast: none) { .menu__item { height: 2px; } }

.menu-content { position: fixed; width: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.9); z-index: 5; opacity: 0; visibility: hidden; overflow-x: hidden; overflow-y: scroll; transition: opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1), visibility 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); }

.menu-content__inner { max-width: 1248px; height: 100%; margin: 0 auto; padding: 212px 20px 0; }

.menu-content__item { position: relative; padding: 13px 60px 0; counter-increment: count; }

.menu-content__item:before { content: "0" counter(count); position: absolute; display: inline-block; top: 0; left: 0; font-family: "Copperplate Gothic W01", "Arial", "Helvetica", "メイリオ", "Meiryo", sans-serif; font-size: 20px; font-weight: 700; color: #dddddd; line-height: 1; letter-spacing: .24em; text-align: center; text-shadow: 0 0 41px #00000e; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; -webkit-transform: rotate(180deg) scale(0.8, 1); -ms-transform: rotate(180deg) scale(0.8, 1); transform: rotate(180deg) scale(0.8, 1); }

.menu-content__item:first-child .menu-content__item-text { width: 88%; }

.menu-content__item:first-child .menu-content__item-text .text-gradient { fill: url(#gradient-theaters); }

.menu-content__item:nth-child(2) { padding-top: 22px; }

.menu-content__item:nth-child(2) .menu-content__item-anchor { padding-bottom: 32px; }

.menu-content__item:nth-child(2) .menu-content__item-text { width: 79%; }

.menu-content__item:nth-child(2) .menu-content__item-text .text-gradient { fill: url(#gradient-achievements); }

.menu-content__item:nth-child(3) { padding-top: 24px; }

.menu-content__item:nth-child(3) .menu-content__item-anchor { padding-bottom: 25px; }

.menu-content__item:nth-child(3) .menu-content__item-text { width: 93%; }

.menu-content__item:nth-child(3) .menu-content__item-text .text-gradient { fill: url(#gradient-product); }

.menu-content__item:nth-child(4) { padding-top: 23px; }

.menu-content__item:nth-child(4) .menu-content__item-anchor { padding-bottom: 27px; }

.menu-content__item:nth-child(4) .menu-content__item-text { width: 58%; }

.menu-content__item:nth-child(4) .menu-content__item-text .text-gradient { fill: url(#gradient-advantage); }

.menu-content__item:last-child { padding-top: 24px; }

.menu-content__item:last-child .menu-content__item-anchor { padding-bottom: 26px; }

.menu-content__item:last-child .menu-content__item-text .text-gradient { fill: url(#gradient-service); }

.menu-content__item-anchor { position: relative; display: inline-block; max-width: 452px; width: 100%; padding-bottom: 17px; text-align: left; -webkit-backface-visibility: hidden; backface-visibility: hidden; cursor: pointer; }

.menu-content__item-anchor:after { content: ''; position: absolute; display: inline-block; width: 123px; height: 2px; left: 0; bottom: 0; background: linear-gradient(to right, rgba(179, 97, 255, 0.8) 0%, rgba(97, 131, 255, 0.43) 46%, rgba(97, 131, 255, 0) 100%); }

.menu-content__item-anchor.hover .menu-content__item-text .text-gradient { opacity: 1; }

.menu-content__item ~ li { margin-top: 24px; }

.menu-content__item-text { width: 100%; }

.menu-content__item-text > svg { width: 100%; height: auto; }

.menu-content__item-text .text-default { fill: #fff; }

.menu-content__item-text .text-gradient { opacity: 0; transition: opacity 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }

.menu-content__share { margin: 74px 0 0 3px; padding-bottom: 210px; }

.menu-content__share > p { position: relative; display: inline-block; padding-right: 27px; font-size: 13px; letter-spacing: .4em; }

.menu-content__share > p:after { content: ''; position: absolute; width: 2px; height: 2px; top: 50%; right: 0; border-radius: 50%; background-color: #fff; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

.menu-content__share-item { display: inline-block; padding-left: 22px; font-size: 13px; letter-spacing: .4em; vertical-align: top; }

.menu-content__share-item > a .text-default { fill: #fff; }

.menu-content__share-item > a .text-gradient { fill: url(#gradient-facebook); opacity: 0; transition: opacity 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }

.menu-content__share-item > a.hover .text-gradient { opacity: .8; }

.menu-content__share-item svg { width: 19px; height: 10px; }

.menu-content__share-item:last-child { padding-left: 19px; }

.menu-content__share-item:last-child > a .text-gradient { fill: url(#gradient-twitter); }

.menu-content__share-item:last-child svg { width: 25px; }

.menu-content.is-show { opacity: 1; visibility: visible; }

@media screen and (max-width: 719px) { .menu-content__inner { padding: 140px 33px 0; }
  .menu-content__item { padding: 12px 40px 0; }
  .menu-content__item:before { font-size: 12px; }
  .menu-content__item:first-child .menu-content__item-text { width: 93%; }
  .menu-content__item:nth-child(2) { padding: 14px 38px 0; }
  .menu-content__item:nth-child(2) .menu-content__item-anchor { padding-bottom: 16px; }
  .menu-content__item:nth-child(2) .menu-content__item-text { width: 81%; }
  .menu-content__item:nth-child(3) { padding: 17px 36px 0; }
  .menu-content__item:nth-child(3) .menu-content__item-anchor { padding-bottom: 15px; }
  .menu-content__item:nth-child(3) .menu-content__item-text { width: 94%; }
  .menu-content__item:nth-child(4) { padding: 17px 38px 0; }
  .menu-content__item:nth-child(4) .menu-content__item-anchor { padding-bottom: 16px; }
  .menu-content__item:nth-child(4) .menu-content__item-text { width: 60%; }
  .menu-content__item:last-child { padding: 15px 38px 0; }
  .menu-content__item:last-child .menu-content__item-anchor { padding-bottom: 14px; }
  .menu-content__item-anchor { padding-bottom: 10px; }
  .menu-content__item ~ li { margin-top: 13px; }
  .menu-content__share { margin: 53px 0 0 1px; padding-bottom: 105px; }
  .menu-content__share > p { padding-right: 16px; }
  .menu-content__share-item { padding-left: 14px; }
  .menu-content__share-item:last-child { padding-left: 13px; } }

/* IE10+ */
@media all and (-ms-high-contrast: none) { .menu-content__inner { padding-top: 160px; }
  .menu-content__item { padding-top: 0; }
  .menu-content__item:first-child .menu-content__item-text { width: 98%; }
  .menu-content__item:nth-child(n + 2) { padding-top: 0; }
  .menu-content__item:nth-child(n + 2) .menu-content__item-anchor { margin-top: -30px; padding-bottom: 0; }
  .menu-content__item:nth-child(n + 2) .menu-content__item-text { margin-bottom: -20px; }
  .menu-content__item-anchor { padding-bottom: 0; } }

@-moz-document url-prefix() { .win .menu-content__item-text .text-gradient, .win .menu-content__share-item > a .text-gradient { transition: none; } }

.modalbox { position: fixed; width: 100%; top: 0; left: 0; right: 0; bottom: 0; z-index: 10; background-color: rgba(0, 0, 0, 0.95); opacity: 0; visibility: hidden; overflow-x: hidden; overflow-y: scroll; transition: opacity 0.24s cubic-bezier(0.39, 0.575, 0.565, 1) 0.2s, visibility 0.24s cubic-bezier(0.39, 0.575, 0.565, 1) 0.2s; }

.modalbox__inner { position: relative; max-width: 1160px; margin: 0 auto; padding: 161px 60px; opacity: 0; -webkit-transform: scale(0.96); -ms-transform: scale(0.96); transform: scale(0.96); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); }

.modalbox__content-inner { display: none; padding: 132px 99px 181px; text-align: center; border: 1px solid rgba(255, 255, 255, 0.3); background-color: #000; }

.modalbox__content-title { position: relative; padding-bottom: 33px; }

.modalbox__content-title:after { content: ''; position: absolute; width: 240px; height: 2px; margin: 0 auto; left: 0; right: 0; bottom: 0; background: linear-gradient(to right, rgba(97, 175, 255, 0) 12%, rgba(97, 175, 255, 0.09) 15%, rgba(97, 159, 255, 0.4) 26%, rgba(97, 138, 255, 0.8) 40%, rgba(97, 130, 255, 0.8) 45%, rgba(179, 97, 255, 0.8) 55%, rgba(165, 110, 255, 0.8) 60%, rgba(127, 146, 255, 0.4) 74%, rgba(97, 175, 255, 0.09) 85%, rgba(97, 175, 255, 0) 88%); }

.modalbox__content-title > svg { width: 340px; height: 64px; }

.modalbox__content-subtitle { position: relative; margin-top: 20px; }

.modalbox__content-subtitle > svg { width: 200px; height: 14px; }

.modalbox__content-image { position: relative; height: 0; margin-top: 64px; padding-top: 56.32%; }

.modalbox__content-image:before { content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); margin: auto 0; top: 0; left: -1px; bottom: 0; border: 1px solid transparent; background: linear-gradient(135deg, #b361ff 0%, #6182ff 52%, #61afff 100%); background-origin: border-box; opacity: .4; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: opacity 0.35s cubic-bezier(0.39, 0.575, 0.565, 1); }

.modalbox__content-image > img { position: absolute; height: 100%; top: 0; left: 0; }

.modalbox__content-movie { margin-top: 45px; }

.modalbox__content-description { margin-top: 45px; font-size: 15px; color: #adadae; line-height: 1.75; letter-spacing: .1em; }

.modalbox__content-review { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin-top: 74px; padding: 71px 18px 0; border-top: 1px solid rgba(255, 255, 255, 0.15); }

.modalbox__content-review-title { -webkit-flex-basis: 243px; -ms-flex-preferred-size: 243px; flex-basis: 243px; position: relative; top: 13px; }

.modalbox__content-review-title > svg { width: 100%; height: auto; }

.modalbox__content-review-list { -webkit-flex-basis: 450px; -ms-flex-preferred-size: 450px; flex-basis: 450px; margin-left: 30px; }

.modalbox__content-review li { font-size: 14px; color: #adadae; line-height: 1.88; letter-spacing: .06em; text-align: left; }

.modalbox__content-review li ~ li { position: relative; padding-top: 74px; }

.modalbox__content-review li ~ li:before { content: ''; position: absolute; width: 39px; height: 1px; top: 28%; left: 0; background-color: #adadae; opacity: .2; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

.modalbox__content-daytime { margin-top: 59px; font-size: 13px; color: #5a5a5a; letter-spacing: .09em; text-align: right; }

.modalbox__close { position: absolute; width: 35px; height: 35px; top: 97px; right: 6px; cursor: pointer; }

.modalbox__close-circle { position: absolute; display: none; width: 100%; height: 100%; top: 0; left: 0; }

.modalbox__close-circle .circle-default { fill: #fff; }

.modalbox__close-circle .circle-gradient { fill: url(#gradient-close-circle); opacity: 0; transition: opacity 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }

.modalbox__close-item { position: absolute; width: 100%; height: 1px; margin: auto; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to right, #b361ff 0%, #6182ff 52%, #61afff 100%); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

.modalbox__close-item:before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: white; z-index: 1; transition: background-color 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }

.modalbox__close-item:last-of-type { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.modalbox__close.hover .modalbox__close-circle .circle-gradient { opacity: 1; }

.modalbox__close.hover .modalbox__close-item:before { background-color: rgba(255, 255, 255, 0); }

.modalbox__content-inner--tenku .modalbox__content-title > svg { width: 338px; height: 65px; }

.modalbox__content-inner--tenku .modalbox__content-subtitle { margin-top: 17px; padding-left: 3px; }

.modalbox__content-inner--tenku .modalbox__content-subtitle > svg { width: 347px; height: 13px; }

.modalbox__content-inner--tenku .modalbox__content-movie { margin-top: 80px; }

.modalbox__content-inner--tenku .modalbox__content-review-title { top: 3px; }

.modalbox__content-inner--tenku .modalbox__content-review li ~ li { padding-top: 49px; }

.modalbox__content-inner--tenku .modalbox__content-review li ~ li:before { top: 18%; }

.modalbox__content-inner--product { padding-top: 100px; padding-bottom: 171px; }

.modalbox__content-inner--product .modalbox__content-title { padding-bottom: 13px; }

.modalbox__content-inner--product .modalbox__content-title > svg { width: 225px; height: 105px; }

.modalbox__content-inner--product .modalbox__content-title--cosmo > svg { width: 281px; }

.modalbox__content-inner--product .modalbox__content-title--media > svg { width: 285px; }

.modalbox.is-open { opacity: 1; visibility: visible; transition-delay: 0s; }

.modalbox.is-open .modalbox__inner { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); transition-delay: .2s; }

@media screen and (max-width: 719px) { .modalbox__inner { padding: 112px 35px 107px; }
  .modalbox__content-inner { padding: 0; border: none; background-color: transparent; }
  .modalbox__content-title, .modalbox__content-subtitle { height: 0; }
  .modalbox__content-title > svg, .modalbox__content-subtitle > svg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
  .modalbox__content-title { padding-top: 7.56%; }
  .modalbox__content-title:after { width: 55%; height: 1px; bottom: -23px; }
  .modalbox__content-subtitle { margin-top: 43px; padding-top: 3%; }
  .modalbox__content-image { margin-top: 43px; }
  .modalbox__content-movie { margin-top: 37px; }
  .modalbox__content-description { margin-top: 29px; line-height: 1.5; letter-spacing: .03em; }
  .modalbox__content-review { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; margin-top: 61px; padding: 61px 18px 0; }
  .modalbox__content-review-title { -webkit-flex-basis: auto; -ms-flex-preferred-size: auto; flex-basis: auto; width: 100%; height: 0; padding-top: 6%; top: 0; }
  .modalbox__content-review-title > svg { position: absolute; width: 100%; height: 100%; top: 0; left: 0; }
  .modalbox__content-review-list { -webkit-flex-basis: auto; -ms-flex-preferred-size: auto; flex-basis: auto; margin: 32px 0 0; }
  .modalbox__content-review li { line-height: 1.6; letter-spacing: .03em; text-align: center; }
  .modalbox__content-review li ~ li { padding-top: 50px; }
  .modalbox__content-review li ~ li:before { width: 26%; margin: 0 auto; top: 15%; right: 0; }
  .modalbox__content-daytime { margin-top: 20px; letter-spacing: .01em; text-align: center; }
  .modalbox__close { width: 50px; height: 50px; top: 13px; right: 13px; }
  .modalbox__close-circle { display: inline-block; }
  .modalbox__close-item { width: 38%; }
  .modalbox__content-inner--tenku .modalbox__content-title > svg, .modalbox__content-inner--tenku .modalbox__content-subtitle > svg { width: 100%; height: 100%; }
  .modalbox__content-inner--tenku .modalbox__content-subtitle { padding-top: 4.7%; }
  .modalbox__content-inner--tenku .modalbox__content-subtitle { margin-top: 43px; padding-top: 2.82%; }
  .modalbox__content-inner--tenku .modalbox__content-movie { margin-top: 35px; }
  .modalbox__content-inner--tenku .modalbox__content-review-title { top: 3px; }
  .modalbox__content-inner--tenku .modalbox__content-review li ~ li { padding-top: 49px; }
  .modalbox__content-inner--product .modalbox__content-title { padding-top: 20%; }
  .modalbox__content-inner--product .modalbox__content-title:after { bottom: -7px; }
  .modalbox__content-inner--product .modalbox__content-title > svg { width: 100%; height: 100%; }
  .modalbox__content-inner--product .modalbox__content-title--cosmo > svg { width: 100%; }
  .modalbox__content-inner--product .modalbox__content-title--media > svg { width: 100%; } }

.movie { position: relative; height: 0; padding-top: 56.32%; -webkit-backface-visibility: hidden; backface-visibility: hidden; cursor: pointer; }

.movie:before { content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 3px); margin: auto; top: 0; left: -1px; right: 0; bottom: 0; border: 1px solid transparent; background: linear-gradient(135deg, #b361ff 0%, #6182ff 52%, #61afff 100%); background-origin: border-box; opacity: .4; transition: opacity 0.35s cubic-bezier(0.39, 0.575, 0.565, 1); }

.movie > iframe { position: absolute; width: 100%; height: 100%; top: 0; left: 0; border: none; }

.movie__thumb { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-image: url("../img/thumbnail/movie_thumb.jpg"); background-size: cover; background-position: center; background-repeat: no-repeat; z-index: 1; transition: opacity 0.3s cubic-bezier(0.39, 0.575, 0.565, 1), visibility 0.3s cubic-bezier(0.39, 0.575, 0.565, 1); }

.movie__thumb:before { content: ''; position: absolute; width: 17.1%; height: 30.3%; top: 50%; left: 50%; background: url("../img/btn_play.png") center no-repeat; background-size: cover; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 2; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.1s; transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.1s; transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.1s, -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1) 0.1s; }

.movie__thumb.is-hide { opacity: 0; visibility: hidden; }

.movie.hover:before { opacity: 1; }

.movie.hover .movie__thumb:before { -webkit-transform: scale3d(1.04, 1.04, 1.04) translate(-48%, -48%); transform: scale3d(1.04, 1.04, 1.04) translate(-48%, -48%); }

.movie--manten .movie__thumb { background-image: url("../img/thumbnail/movie-manten_thumb.jpg"); }

.movie--tenku .movie__thumb { background-image: url("../img/thumbnail/movie-tenku_thumb.jpg"); }

@media screen and (max-width: 719px) { .movie__thumb:before { width: 25%; height: 44.3%; } }

.pagetop { position: absolute; right: 44px; bottom: 44px; cursor: pointer; }

.pagetop__circle { display: none; }

.pagetop__circle .circle-default { fill: #fff; }

.pagetop__circle .circle-gradient { fill: url(#gradient-pagetop-circle); opacity: 0; transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1); }

.pagetop__arrow { position: relative; display: inline-block; padding: 5px; }

.pagetop__arrow > svg { width: 24px; height: 18px; }

.pagetop__arrow .icon-default { fill: #fff; }

.pagetop__arrow .icon-gradient { fill: url(#gradient-pagetop); opacity: 0; transition: opacity 0.25s cubic-bezier(0.39, 0.575, 0.565, 1); }

.pagetop.hover .pagetop__arrow .icon-gradient { opacity: .8; }

@media screen and (max-width: 719px) { .pagetop { width: 50px; height: 50px; margin: 0 auto; left: 0; right: 0; bottom: 25px; }
  .pagetop__circle { display: inline-block; position: absolute; top: 0; left: 0; }
  .pagetop__circle > svg { width: 100%; height: 100%; }
  .pagetop__arrow { width: 100%; height: 100%; padding: 13px 19px; }
  .pagetop__arrow > svg { width: 11px; height: 9px; stroke: #fff; }
  .pagetop.hover .pagetop__circle .circle-gradient { opacity: 1; }
  .pagetop.hover .pagetop__arrow .icon-gradient { opacity: 1; } }

.product-movie { margin-top: 14px; text-align: center; opacity: 0; -webkit-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0); transition: opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s, -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s; transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s, opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s; transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s, opacity 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s, -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1) 0.7s; }

.product-movie__player { max-width: 870px; width: 100%; margin: 0 auto; }

.product-movie__text { display: inline-block; margin-top: 50px; font-size: 15px; color: #adadae; line-height: 1.8; letter-spacing: .13em; text-shadow: 0 0 41px #00000e; opacity: 0; -webkit-transform: translate3d(0, 18px, 0); transform: translate3d(0, 18px, 0); transition: opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.product-movie__text.is-show { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.product-movie.is-show { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

@media screen and (max-width: 719px) { .product-movie { margin-top: 63px; }
  .product-movie__player { padding: 0; }
  .product-movie__text { margin-top: 29px; line-height: 1.54; letter-spacing: .03em; } }

@-webkit-keyframes lineFlow { 0% { margin-top: 8px;
    opacity: 1;
    -webkit-transform-origin: 0 0 0;
            transform-origin: 0 0 0;
    -webkit-transform: scale3d(1, 0, 1);
            transform: scale3d(1, 0, 1);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
            animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  25% { margin-top: 12px;
    opacity: 1;
    -webkit-transform-origin: 0 0 0;
            transform-origin: 0 0 0;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
            animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  26% { margin-top: 12px;
    opacity: 1;
    -webkit-transform-origin: 0 128px 0;
            transform-origin: 0 128px 0;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
    -webkit-animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
            animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); }
  50%, 100% { margin-top: 12px;
    opacity: 0;
    -webkit-transform-origin: 0 128px 0;
            transform-origin: 0 128px 0;
    -webkit-transform: scale3d(1, 0, 1);
            transform: scale3d(1, 0, 1);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
            animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } }

@keyframes lineFlow { 0% { margin-top: 8px;
    opacity: 1;
    -webkit-transform-origin: 0 0 0;
            transform-origin: 0 0 0;
    -webkit-transform: scale3d(1, 0, 1);
            transform: scale3d(1, 0, 1);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
            animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  25% { margin-top: 12px;
    opacity: 1;
    -webkit-transform-origin: 0 0 0;
            transform-origin: 0 0 0;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
            animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  26% { margin-top: 12px;
    opacity: 1;
    -webkit-transform-origin: 0 128px 0;
            transform-origin: 0 128px 0;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
    -webkit-animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
            animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); }
  50%, 100% { margin-top: 12px;
    opacity: 0;
    -webkit-transform-origin: 0 128px 0;
            transform-origin: 0 128px 0;
    -webkit-transform: scale3d(1, 0, 1);
            transform: scale3d(1, 0, 1);
    -webkit-animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
            animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } }

.scroll-guide { position: absolute; margin-top: -259px; left: 45px; transition: opacity 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) 4s; z-index: 1; }

.scroll-guide__text { position: relative; top: 0; font-size: 12px; color: #fff; line-height: 1; letter-spacing: .55em; text-shadow: 0 0 41px #00000e; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }

.scroll-guide__text:after { content: ''; display: inline-block; width: 2px; height: 128px; margin-top: 8px; background-image: linear-gradient(to bottom, #8761f9 0%, rgba(107, 121, 253, 0.7) 35%, rgba(97, 130, 255, 0.51) 48%, rgba(97, 136, 255, 0.4) 55%, rgba(97, 175, 255, 0) 100%); opacity: 1; -webkit-transform-origin: 0 0 0; -ms-transform-origin: 0 0 0; transform-origin: 0 0 0; -webkit-transform: scale3d(1, 0, 1); transform: scale3d(1, 0, 1); -webkit-animation: lineFlow 1.48s infinite; animation: lineFlow 1.48s infinite; }

.scroll-guide.is-hidden { opacity: 0; }

.scroll-guide.is-hidden .scroll-guide__text:after { -webkit-animation: none; animation: none; }

@media screen and (max-width: 719px) { .scroll-guide { margin-top: -200px; left: 23px; }
  .scroll-guide__text { font-size: 10px; letter-spacing: .37em; }
  .scroll-guide__text:after { margin: 9px 0 0 3px; width: 1px; height: 80px; -webkit-animation-duration: 1.6s; animation-duration: 1.6s; -webkit-animation-delay: 2.5s; animation-delay: 2.5s; } }

.section-num { position: relative; display: block; font-family: "Copperplate Gothic W01", "Arial", "Helvetica", "メイリオ", "Meiryo", sans-serif; font-size: 21px; font-weight: 700; color: #fff; line-height: 1; letter-spacing: .24em; text-align: center; text-shadow: 0 0 41px #00000e; opacity: 0; -webkit-transform: translate3d(0, -8px, 0) scale(1, 0.8); transform: translate3d(0, -8px, 0) scale(1, 0.8); transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.section-num.is-show { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale(1, 0.8); transform: translate3d(0, 0, 0) scale(1, 0.8); }

.section-num--theaters { position: absolute; display: inline-block; top: 28px; left: 3.8%; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translate3d(0, -8px, 0) rotate(-90deg) scale(0.8, 1); transform: translate3d(0, -8px, 0) rotate(-90deg) scale(0.8, 1); }

.section-num--theaters.is-show { -webkit-transform: translate3d(0, 0, 0) rotate(-90deg) scale(0.8, 1); transform: translate3d(0, 0, 0) rotate(-90deg) scale(0.8, 1); }

@media screen and (max-width: 719px) { .section-num { font-size: 13px; padding-left: 3px; letter-spacing: .2em; }
  .section-num--theaters { position: relative; display: block; top: 0; left: 0; -webkit-writing-mode: inherit; -ms-writing-mode: inherit; writing-mode: inherit; -webkit-transform: translate3d(0, -8px, 0); transform: translate3d(0, -8px, 0); }
  .section-num--theaters.is-show { -webkit-transform: translate3d(0, 0, 0) scale(1, 0.8); transform: translate3d(0, 0, 0) scale(1, 0.8); } }

.service-flow { margin-top: 70px; }

.service-flow__inner { position: relative; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

.service-flow__item { position: relative; display: inline-block; margin-top: 50px; text-align: center; vertical-align: top; }

.service-flow__item:before { content: url("../img/arrow_right.png"); position: absolute; top: 69px; left: -38px; opacity: 0; -webkit-transform: translate3d(-8px, 0, 0); transform: translate3d(-8px, 0, 0); transition: opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.3s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1); }

.service-flow__item:first-child { width: 197px; }

.service-flow__item:first-child:before { content: none; }

.service-flow__item:first-child .service-flow__image, .service-flow__item:first-child .service-flow__info { transition-delay: .5s; }

.service-flow__item:first-child .service-flow__image { padding: 0 26px 0 37px; }

.service-flow__item:first-child .service-flow__info { margin-top: 25px; }

.service-flow__item:nth-child(2) { width: 167px; margin-left: 68px; }

.service-flow__item:nth-child(2):before { left: -46px; transition-delay: .6s; }

.service-flow__item:nth-child(2) .service-flow__image, .service-flow__item:nth-child(2) .service-flow__info { transition-delay: .76s; }

.service-flow__item:nth-child(2) .service-flow__info { margin-top: 31px; }

.service-flow__item:nth-child(2) .service-flow__info-title { padding-bottom: 22px; }

.service-flow__item:nth-child(3) { width: 186px; margin-left: 82px; padding-top: 3px; }

.service-flow__item:nth-child(3):before { left: -45px; transition-delay: .88s; }

.service-flow__item:nth-child(3) .service-flow__image, .service-flow__item:nth-child(3) .service-flow__info { transition-delay: 1.04s; }

.service-flow__item:nth-child(3) .service-flow__info { margin-top: 20px; }

.service-flow__item:nth-child(4) { width: 165px; margin-left: 63px; padding-top: 20px; }

.service-flow__item:nth-child(4):before { left: -30px; transition-delay: 1.16s; }

.service-flow__item:nth-child(4) .service-flow__image, .service-flow__item:nth-child(4) .service-flow__info { transition-delay: 1.32s; }

.service-flow__item:nth-child(4) .service-flow__image { padding: 0 17px 0 13px; }

.service-flow__item:nth-child(4) .service-flow__info { margin-top: 38px; }

.service-flow__item:nth-child(4) .service-flow__info-title { padding-bottom: 46px; }

.service-flow__item:last-child { width: 204px; margin-left: 48px; padding-top: 3px; }

.service-flow__item:last-child:before { left: -22px; transition-delay: 1.44s; }

.service-flow__item:last-child .service-flow__image, .service-flow__item:last-child .service-flow__info { transition-delay: 1.60s; }

.service-flow__item:last-child .service-flow__image { padding: 0 30px 0 26px; }

.service-flow__item:last-child .service-flow__info { margin-top: 26px; }

.service-flow__item.is-show:before { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.service-flow__item.is-show .service-flow__image, .service-flow__item.is-show .service-flow__info { opacity: 1; }

.service-flow__image { opacity: 0; transition: opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.service-flow__info { opacity: 0; transition: opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.service-flow__info-title { position: relative; padding-bottom: 31px; font-size: 18px; line-height: 1.6; letter-spacing: .17em; text-shadow: 0 0 41px #00000e; word-wrap: break-word; }

.service-flow__info-title:after { content: ''; position: absolute; width: 60px; height: 2px; margin: 0 auto; left: 0; right: 0; bottom: 0; background-image: linear-gradient(to right, rgba(179, 97, 255, 0) 0%, rgba(97, 130, 255, 0.6) 25%, rgba(97, 175, 255, 0.8) 50%, rgba(97, 130, 255, 0.6) 75%, rgba(179, 97, 255, 0) 100%); }

.service-flow__info-desc { padding-top: 34px; font-size: 15px; line-height: 1.75; letter-spacing: .1em; color: #adadae; text-shadow: 0 0 41px #00000e; }

@media screen and (max-width: 739px) { .service-flow__inner { -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; padding: 0 40px; }
  .service-flow__item:nth-child(n + 1) { width: 50%; margin-left: 0; padding: 0 50px; }
  .service-flow__item:nth-child(odd):before { left: 8px; }
  .service-flow__item:nth-child(even):before { left: -10px; } }

@media screen and (max-width: 719px) { .service-flow { margin-top: 40px; }
  .service-flow__inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding: 0; }
  .service-flow__item { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; text-align: left; }
  .service-flow__item:before { content: url("../img/arrow_down.png"); top: auto; -webkit-transform: translate3d(0, -8px, 0); transform: translate3d(0, -8px, 0); }
  .service-flow__item:nth-child(n + 1) { width: 100%; margin-left: 0; padding: 0; transition-delay: .2s; }
  .service-flow__item:nth-child(n + 1):before { left: 50%; }
  .service-flow__item:nth-child(n + 1) .service-flow__info { margin-top: 0; }
  .service-flow__item:first-child .service-flow__image { padding: 4px 29px 0 23px; }
  .service-flow__item:nth-child(2) { margin-top: 57px; }
  .service-flow__item:nth-child(2):before { top: -38px; }
  .service-flow__item:nth-child(2) .service-flow__image { padding: 2px 13px 0 7px; }
  .service-flow__item:nth-child(2) .service-flow__info-title { padding-bottom: 11px; }
  .service-flow__item:nth-child(3) { margin-top: 59px; }
  .service-flow__item:nth-child(3):before { top: -40px; }
  .service-flow__item:nth-child(3) .service-flow__image { padding: 8px 7px 0px 0px; }
  .service-flow__item:nth-child(3) .service-flow__image > img { -webkit-transform: rotate(-8deg); -ms-transform: rotate(-8deg); transform: rotate(-8deg); }
  .service-flow__item:nth-child(4) { margin-top: 78px; }
  .service-flow__item:nth-child(4):before { top: -50px; }
  .service-flow__item:nth-child(4) .service-flow__image { padding: 0 25px 0 21px; }
  .service-flow__item:nth-child(4) .service-flow__info-title { padding-bottom: 10px; }
  .service-flow__item:last-child { margin-top: 67px; }
  .service-flow__item:last-child:before { top: -40px; }
  .service-flow__item:last-child .service-flow__image { padding: 9px 23px 0 20px; }
  .service-flow__image, .service-flow__info { width: 50%; }
  .service-flow__info-title { padding-bottom: 9px; font-size: 4vw; letter-spacing: .14em; }
  .service-flow__info-title:after { margin: 0; background-image: linear-gradient(to right, rgba(179, 97, 255, 0.8) 0%, rgba(97, 130, 255, 0.43) 46%, rgba(97, 130, 255, 0) 100%); }
  .service-flow__info-desc { padding-top: 9px; font-size: 3.5vw; letter-spacing: .05em; } }

.stardust { content: ''; position: absolute; background-size: contain; background-position: center; background-repeat: no-repeat; opacity: .8; z-index: -1; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: -webkit-transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), -webkit-transform 1s cubic-bezier(0.25, 0.46, 0.45, 0.94); }

.stardust01 { width: 868px; height: 836px; top: -100px; right: calc(100vw - 38%); background-image: url("../img/stardust/stardust_01.png"); }

.stardust02 { width: 1042px; height: 837px; left: calc(100vw - 40%); bottom: 20px; background-image: url("../img/stardust/stardust_02.png"); }

.stardust03 { width: 962px; height: 827px; top: 100px; right: calc(100vw - 72%); background-image: url("../img/stardust/stardust_03.png"); }

.stardust04 { width: 1056px; height: 872px; bottom: -540px; right: calc(100vw - 87%); background-image: url("../img/stardust/stardust_04.png"); }

.stardust05 { width: 1271px; height: 899px; top: -50px; left: calc(100vw - 91%); background-image: url("../img/stardust/stardust_05.png"); }

.stardust06 { width: 958px; height: 921px; bottom: -1150px; right: calc(100vw - 78%); background-image: url("../img/stardust/stardust_06.png"); }

.stardust07 { width: 1052px; height: 823px; bottom: -1100px; left: calc(100vw - 83%); background-image: url("../img/stardust/stardust_07.png"); }

.stardust08 { width: 1000px; height: 854px; bottom: -900px; right: calc(100vw - 91%); background-image: url("../img/stardust/stardust_08.png"); }

.stardust09 { width: 846px; height: 744px; bottom: -1400px; right: calc(100vw - 70%); background-image: url("../img/stardust/stardust_09.png"); }

.stardust10 { width: 1345px; height: 500px; left: calc(100vw - 70%); bottom: -600px; background: url("../img/stardust/stardust_10.png") center no-repeat; }