@charset "UTF-8";
/*!
Theme Name: GRAVITY GAME ARISE Co.,Ltd.
Description: グラビティゲームアライズ株式会社
Version: 0.0.1
Author: GGA
Author URI: https://gravityga.jp
*/
/* Box sizing rules */
/* Box sizingの定義 */
*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/* Remove default padding */
/* デフォルトのpaddingを削除 */
ul[class],
ol[class] {
  padding: 0;
}

/* Remove default margin */
/* デフォルトのmarginを削除 */
body,
h1,
h2,
h3,
h4,
h5,
p,
ul[class],
ol[class],
li,
figure,
figcaption,
blockquote,
dl,
dd {
  margin: 0;
}

/* Set core body defaults */
/* bodyのデフォルトを定義 */
body {
  min-height: 100vh;
  scroll-behavior: smooth;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

/* Remove list styles on ul, ol elements with a class attribute */
/* class属性を持つul、ol要素のリストスタイルを削除 */
ul[class],
ol[class] {
  list-style: none;
}

/* A elements that don't have a class get default styles */
/* classを持たない要素はデフォルトのスタイルを取得 */
a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
/* img要素の扱いを簡単にする */
img {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
/* inputやbuttonなどのフォントは継承を定義 */
input,
button,
textarea,
select {
  font: inherit;
}

/* Remove all animations and transitions for people that prefer not to see them */
/* 見たくない人用に、すべてのアニメーションとトランジションを削除 */
@media (prefers-reduced-motion: reduce) {
  * {
    -webkit-animation-duration: 0.01ms !important;
            animation-duration: 0.01ms !important;
    -webkit-animation-iteration-count: 1 !important;
            animation-iteration-count: 1 !important;
    -webkit-transition-duration: 0.01ms !important;
            transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
/*----- LINKS -----*/
*:focus {
  outline: none;
}

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

a:hover {
  color: #00a0e9;
}

a:focus {
  outline: 0;
}

a:hover,
a:active {
  outline: 0;
}

a[href^="tel:"] {
  cursor: default;
}

.eng-font {
  font-family: "Roboto Condensed", sans-serif !important;
}

br.forPC {
  display: inline;
}

br.forSP {
  display: none;
}

@media only screen and (max-width: 768px) {
  br.forPC {
    display: none;
  }
  br.forSP {
    display: inline;
  }
}
/*----- IMAGES -----*/
img {
  max-width: 100%;
  vertical-align: bottom;
}

img[src$=".svg"] {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

svg {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

/*----- MISC -----*/
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}

::-moz-selection {
  background: rgba(0, 160, 233, 0.1);
  text-shadow: none;
}

::selection {
  background: rgba(0, 160, 233, 0.1);
  text-shadow: none;
}

::-webkit-selection {
  background: rgba(0, 160, 233, 0.1);
  text-shadow: none;
}

::-moz-selection {
  background: rgba(0, 160, 233, 0.1);
  text-shadow: none;
}

/*----- ENGLISH FONT -----*/
img {
  opacity: 1;
  -webkit-transition: all 480ms;
  transition: all 480ms;
}

/*----- ICONS -----*/
@font-face {
  font-family: "icomoon";
  src: url("fonts/icomoon.eot?utkswm");
  src: url("fonts/icomoon.eot?utkswm#iefix") format("embedded-opentype"), url("fonts/icomoon.ttf?utkswm") format("truetype"), url("fonts/icomoon.woff?utkswm") format("woff"), url("fonts/icomoon.svg?utkswm#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
i {
  font-style: normal;
}

[class^=icon],
[class*=" icon"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon.arrow5:before {
  content: "\e90b";
}

.icon.arrow4:before {
  content: "\e900";
}

.icon.arrow2:before {
  content: "\e903";
}

.icon.arrow1:before {
  content: "\e904";
}

.icon.sns-facebook:before {
  content: "\e90e";
}

.icon.sns-instagram:before {
  content: "\e90f";
}

.icon.sns-line:before {
  content: "\e910";
}

.icon.sns-twitter:before {
  content: "\e911";
}

.icon.sns-youtube:before {
  content: "\e913";
}

.icon.sns-tiktok:before {
  content: "\e914";
}

.icon.link:before {
  content: "\e90a";
}

.icon.share:before {
  content: "\e909";
}

.icon.cross:before {
  content: "\e907";
}

.icon.checkbox:before {
  content: "\e90c";
}

.icon.checked:before {
  content: "\e90d";
}

.icon.excel:before {
  content: "\e914";
}

.icon.word:before {
  content: "\e915";
}

.icon.pdf:before {
  content: "\e916";
}

.icon.powerpoint:before {
  content: "\e917";
}

.icon.download:before {
  content: "\e918";
}

.icon.contact:before {
  content: "\e902";
}

li.contact a i.icon:before {
  content: "\e902";
}

li.recruit a i.icon:before {
  content: "\e905";
}

li.news a i.icon:before {
  content: "\e908";
}

li.company a i.icon:before {
  content: "\e901";
}

li.about a i.icon:before {
  content: "\e906";
}

li.games a i.icon:before {
  content: "\e912";
}

/*----- WP CORE -----*/
.alignnone {
  margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
  display: block;
  margin: 5px auto 5px auto;
}

.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}

.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}

a img.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}

a img.alignnone {
  margin: 5px 20px 20px 0;
}

a img.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}

a img.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption {
  background: #FFF;
  border: 1px solid #F0F0F0;
  max-width: 96%;
  padding: 5px 3px 10px;
  text-align: center;
}

.wp-caption.alignnone {
  margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
  margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
  margin: 5px 0 20px 20px;
}

.wp-caption img {
  border: 0 none;
  height: auto;
  margin: 0;
  max-width: 98.5%;
  padding: 0;
  width: auto;
}

.wp-caption .wp-caption-text,
.gallery-caption {
  font-size: 11px;
  line-height: 17px;
  margin: 0;
  padding: 0 4px 5px;
}

/* Document
========================================================================== */
html {
  font-size: 62.5%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  height: 100%;
  font-family: "Roboto Condensed", helvetica, arial, "hiragino kaku gothic pro", meiryo, "ms pgothic", sans-serif;
  font-weight: 500;
  font-size: 1.6rem;
  -webkit-font-feature-settings: "palt" 1;
          font-feature-settings: "palt" 1;
  color: #333;
  background: #fff;
  line-height: 1.75;
  letter-spacing: 0.1rem;
  padding: 0;
  margin: 0;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  body {
    font-size: 1.4rem;
  }
}

body.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
}
@media screen and (min-width: 768px) {
  body.fixed {
    position: static !important;
    top: auto !important;
  }
}

body header, body .wrapper {
  opacity: 1;
  -webkit-transition: opacity 240ms;
  transition: opacity 240ms;
}
body #loader {
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all 480ms;
  transition: all 480ms;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -9999999999;
}
body.fadeout header, body.fadeout .wrapper {
  opacity: 0;
  -webkit-transition: opacity 240ms;
  transition: opacity 240ms;
}
body.fadeout #loader {
  visibility: visible;
  opacity: 1;
  -webkit-transition: all 120ms;
  transition: all 120ms;
  height: 100%;
  width: 100%;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 9999999999;
}

.wrapper {
  padding-top: 75px;
  overflow: hidden;
}
@media screen and (max-width: 900px) {
  .wrapper {
    padding-top: 50px;
  }
}

.wrapper section.pagetitlebox {
  position: relative;
  text-align: center;
  border-bottom: 2px solid #e6e6e6;
  letter-spacing: 0;
}
.wrapper section.pagetitlebox p.title {
  position: relative;
  font-size: 6rem;
  font-weight: bold;
  line-height: 1;
  display: inline-block;
  padding: 25px 0 5px;
}
@media screen and (max-width: 768px) {
  .wrapper section.pagetitlebox p.title {
    font-size: 4.2rem;
  }
}
@media screen and (max-width: 480px) {
  .wrapper section.pagetitlebox p.title {
    font-size: 8.7vw;
  }
}
.wrapper section.pagetitlebox p.title::after {
  content: "";
  width: 100%;
  height: 2px;
  display: block;
  background: #00a0e9;
  position: absolute;
  bottom: -2px;
  left: 0;
}
.wrapper section.pagetitlebox p.title a.sns-twitter {
  padding: 25px 0 5px;
  cursor: pointer;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  color: #000;
  font-size: 80%;
  margin-left: 0.5em;
}
.wrapper section.pagetitlebox p.subtitle, .wrapper section.pagetitlebox h1.subtitle {
  font-size: 1.4rem;
  font-weight: bold;
  display: block;
  background: #fff;
  padding: 0 10px;
  position: absolute;
  bottom: -1.4rem;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.wrapper section.pagetitlebox p.subtitle {
  white-space: nowrap;
}

#tri {
  position: absolute;
  width: 1px;
  height: 1px;
  top: 10%;
  left: 0;
  z-index: -999999;
}

.splide {
  position: relative;
  visibility: hidden;
}

.splide.is-initialized,
.splide.is-rendered {
  visibility: visible;
}

.splide__container {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
}

.splide__list {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.splide.is-initialized:not(.is-active) .splide__list {
  display: block;
}

.splide__slide {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  list-style-type: none !important;
  margin: 0;
  position: relative;
}

.splide__track--draggable {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
       user-select: none;
}

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

#news .splide__track {
  position: relative;
  z-index: 0;
}
#news .splide__arrows {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#news .splide__arrows .splide__arrow {
  cursor: pointer;
  padding: 0;
  margin: 0;
  border: none;
  font-size: 2.6rem;
  line-height: 1;
  background: #fff;
  border-radius: 50px;
  color: #00a0e9;
  -webkit-transition: opacity 480ms;
  transition: opacity 480ms;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#news .splide__arrows .splide__arrow:hover:not(:disabled) {
  opacity: 1;
}
#news .splide__arrows .splide__arrow:disabled {
  opacity: 0.3;
}
#news .splide__arrows .splide__arrow.splide__arrow--prev {
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
  left: 0;
}
#news .splide__arrows .splide__arrow.splide__arrow--next {
  right: 0;
}
#news .my-carousel-progress {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background: #ccc;
  margin: 0 10px;
  border-radius: 50px;
}
#news .my-carousel-progress .my-carousel-progress-bar {
  border-radius: 50px;
  background: #00a0e9;
  height: 5px;
  -webkit-transition: width 400ms ease;
  transition: width 400ms ease;
  width: 0;
}

.splide.is-focus-in .splide__pagination__page:focus {
  outline: 3px solid #0bf;
  outline-offset: 3px;
}

.splide__progress__bar {
  background: #ccc;
  height: 3px;
}

.splide__slide {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.splide__slide:focus {
  outline: 0;
}

@supports (outline-offset: -3px) {
  .splide__slide:focus-visible {
    outline: 3px solid #0bf;
    outline-offset: -3px;
  }
}
@media screen and (-ms-high-contrast: none) {
  .splide__slide:focus-visible {
    border: 3px solid #0bf;
  }
}
@supports (outline-offset: -3px) {
  .splide.is-focus-in .splide__slide:focus {
    outline: 3px solid #0bf;
    outline-offset: -3px;
  }
}
@media screen and (-ms-high-contrast: none) {
  .splide.is-focus-in .splide__slide:focus {
    border: 3px solid #0bf;
  }
  .splide.is-focus-in .splide__track > .splide__list > .splide__slide:focus {
    border-color: #0bf;
  }
}
.splide__toggle {
  cursor: pointer;
}

.splide__toggle:focus-visible {
  outline: 3px solid #0bf;
  outline-offset: 3px;
}

.splide.is-focus-in .splide__toggle:focus {
  outline: 3px solid #0bf;
  outline-offset: 3px;
}

.splide__track--nav > .splide__list > .splide__slide {
  border: 3px solid transparent;
  cursor: pointer;
}

.splide__track--nav > .splide__list > .splide__slide.is-active {
  border: 3px solid #000;
}

.splide__arrows--rtl .splide__arrow--prev {
  left: auto;
  right: 1em;
}

.splide__arrows--rtl .splide__arrow--prev svg {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}

.splide__arrows--rtl .splide__arrow--next {
  left: 1em;
  right: auto;
}

.splide__arrows--rtl .splide__arrow--next svg {
  -webkit-transform: scaleX(-1);
          transform: scaleX(-1);
}

.splide__arrows--ttb .splide__arrow {
  left: 50%;
  -webkit-transform: translate(-50%);
          transform: translate(-50%);
}

.splide__arrows--ttb .splide__arrow--prev {
  top: 1em;
}

.splide__arrows--ttb .splide__arrow--prev svg {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}

.splide__arrows--ttb .splide__arrow--next {
  bottom: 1em;
  top: auto;
}

.splide__arrows--ttb .splide__arrow--next svg {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}

.splide__pagination--ttb {
  bottom: 0;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  left: auto;
  padding: 1em 0;
  right: 0.5em;
  top: 0;
}

/*! slider
========================================================================== */
.slick-slider {
  position: relative;
  display: block;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -ms-touch-action: pan-y;
      touch-action: pan-y;
}

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

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

.slick-track {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: none;
}
.slick-slide .imgbox {
  width: 100%;
}
@media screen and (max-width: 640px) {
  .slick-slide .imgbox {
    height: 100vw;
  }
}
.slick-slide .imgbox picture {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.slick-slide .imgbox picture img {
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  font-family: "object-fit: cover;";
}
.slick-slide .item, .slick-slide .itemSP {
  width: 100%;
  background-position: 50% 50%;
  background-size: cover;
  vertical-align: bottom;
}
.slick-slide .item {
  padding-top: 37.5%;
}
.slick-slide .itemSP {
  padding-top: 100vw;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

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

/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 90px;
  width: 40px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
  z-index: 5;
  background: rgba(255, 255, 255, 0.2);
  -webkit-transition: background 240ms, left 240ms, right 240ms, opacity 240ms;
  transition: background 240ms, left 240ms, right 240ms, opacity 240ms;
}
.slick-prev:hover,
.slick-next:hover {
  outline: none;
  background: rgba(255, 255, 255, 0.6);
  color: transparent;
}
.slick-prev:hover:before,
.slick-next:hover:before {
  opacity: 1;
}
.slick-prev:before,
.slick-next:before {
  color: #00a0e9;
  font-size: 3rem;
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-slider {
  overflow: hidden;
}
.slick-slider .slick-prev {
  left: -40px;
  opacity: 0;
}
.slick-slider .slick-prev:before {
  content: "\e90b";
}
.slick-slider .slick-next {
  right: -40px;
  opacity: 0;
}
.slick-slider .slick-next:before {
  content: "\e900";
}
.slick-slider:hover .slick-prev {
  left: 0;
  opacity: 1;
}
.slick-slider:hover .slick-next {
  right: 0;
  opacity: 1;
}

/* Dots */
.mainslider .slick-dots {
  position: absolute;
  bottom: 0;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
.mainslider .slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 5px;
  padding: 0;
}
.mainslider .slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
.mainslider .slick-dots li button:hover, .mainslider .slick-dots li button:focus {
  outline: none;
}
.mainslider .slick-dots li button:hover:before, .mainslider .slick-dots li button:focus:before {
  opacity: 1;
}
.mainslider .slick-dots li button:before {
  position: absolute;
  top: 0;
  left: 0;
  content: "•";
  width: 20px;
  height: 20px;
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  text-align: center;
  color: black;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.mainslider .slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

/* Dots */
#game .slick-slider {
  padding-bottom: 30px;
}

#game .slick-dots {
  position: absolute;
  bottom: 0;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0;
  margin: 0;
  width: 100%;
}
#game .slick-dots li {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: 0 1px;
  padding: 0;
}
#game .slick-dots li button {
  border: 0;
  background: transparent;
  display: block;
  height: 20px;
  width: 20px;
  outline: none;
  line-height: 0px;
  font-size: 0px;
  color: transparent;
  padding: 5px;
  cursor: pointer;
}
#game .slick-dots li button:hover, #game .slick-dots li button:focus {
  outline: none;
}
#game .slick-dots li button:hover:before, #game .slick-dots li button:focus:before {
  opacity: 1;
}
#game .slick-dots li button:before {
  display: block;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 100px;
  background: #00a0e9;
  opacity: 0.25;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#game .slick-dots li.slick-active button:before {
  color: black;
  opacity: 0.75;
}

#feature_list {
  width: 100%;
  margin: 0 auto;
}
#feature_list .imgbox a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#feature_list .imgbox a:before, #feature_list .imgbox a:after {
  display: block;
  opacity: 0;
  -webkit-transition: opacity 480ms;
  transition: opacity 480ms;
}
#feature_list .imgbox a:before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
}
#feature_list .imgbox a:after {
  padding: 1rem;
  z-index: 10;
  color: #fff;
  font-size: 3rem;
  border: 2px solid #fff;
  border-radius: 50px;
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#feature_list .imgbox a:after {
  content: "\e90a";
}
#feature_list .imgbox a[target=_blank]:after {
  content: "\e909";
}
#feature_list .imgbox a:hover:before, #feature_list .imgbox a:hover:after {
  opacity: 1;
}
#feature_list ul.slick-dots li {
  margin: 0;
  width: 25%;
  height: 5px;
}
#feature_list ul.slick-dots .slider-progress {
  height: 5px;
  background: rgba(230, 230, 230, 0.6);
}
#feature_list ul.slick-dots .slider-progress .progress {
  width: 0%;
  height: 5px;
  background: #00A0E9;
}

.slick-dots li .slider-progress {
  position: relative;
}
.slick-dots li .progress:not(.active) {
  -webkit-transition: width 240ms;
  transition: width 240ms;
  position: absolute;
  right: 0;
}

#feature_nav {
  border-bottom: 1px solid #ededed;
}
#feature_nav .slick-slide {
  position: relative;
  -webkit-transition: color 240ms;
  transition: color 240ms;
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
}
#feature_nav .slick-slide div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
}
#feature_nav .slick-slide .nav {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 10px 15px;
  cursor: pointer;
}
@media screen and (max-width: 480px) {
  #feature_nav .slick-slide .nav {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 10px 0px;
  }
}
#feature_nav .slick-slide .nav .img {
  width: 40px;
  height: 40px;
  background-position: 50% 50%;
  background-size: cover;
}
#feature_nav .slick-slide .nav .text {
  width: calc(100% - 50px);
  font-size: 1.2rem;
  letter-spacing: 0;
  line-height: 1.2;
  font-weight: bold;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media screen and (max-width: 480px) {
  #feature_nav .slick-slide .nav .text {
    display: none;
  }
}
#feature_nav .slick-slide.slick-current, #feature_nav .slick-slide:hover {
  color: #00A0E9;
}
@media screen and (max-width: 940px) {
  #feature_nav .slick-slide:not(.slick-current) .nav .text {
    display: none !important;
  }
}
#feature_nav .slick-slide:not(:first-of-type):before {
  content: "";
  width: 1px;
  height: 40px;
  position: absolute;
  top: 50%;
  left: -1px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-image: linear-gradient(to bottom, #b2b2b2, #b2b2b2 1px, transparent 1px, transparent 3px);
  background-repeat: repeat-y;
  background-position: right top;
  background-size: 1px 4px;
}
#feature_nav .slick-track {
  width: 100% !important;
  -webkit-transform: none !important;
          transform: none !important;
}

/*! header
========================================================================== */
/* HEADER::isPC
========================================================================== */
.ly_header {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  background: rgba(255, 255, 255, 0.7);
  -webkit-backdrop-filter: saturate(180%) blur(10px);
          backdrop-filter: saturate(180%) blur(10px);
}
.ly_header_inner {
  height: 75px;
  -webkit-transition: all 100ms;
  transition: all 100ms;
}

.ly_header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  -webkit-transition: background 480ms, -webkit-transform 480ms;
  transition: background 480ms, -webkit-transform 480ms;
  transition: background 480ms, transform 480ms;
  transition: background 480ms, transform 480ms, -webkit-transform 480ms;
}
.ly_header.open {
  background: #ffffff;
}
.ly_header_inner {
  width: 100%;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 1.6rem;
}
.ly_header_inner .el_header_Logo {
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.ly_header_inner .el_header_Logo a {
  background: -webkit-gradient(linear, left top, right top, from(#004896), color-stop(33%, #00a0e9), color-stop(66%, #fff), to(#fff));
  background: linear-gradient(to right, #004896, #00a0e9 33%, #fff 66%, #fff);
  background-size: 300%;
  background-position: 0% 0;
  display: inline-block;
  padding: 0 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: background-position 480ms;
  transition: background-position 480ms;
}
@media only screen and (max-width: 1150px) {
  .ly_header_inner .el_header_Logo a {
    padding: 0 5vw;
  }
}
.ly_header_inner .el_header_Logo a span {
  display: block;
  width: 150px;
}
@media only screen and (max-width: 1050px) {
  .ly_header_inner .el_header_Logo a span {
    width: 125px;
  }
}

@media screen and (min-width: 1050px) {
  .ly_header .el_header_Menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .ly_header .el_header_Menu_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
  .ly_header .el_header_Menu_inner ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .ly_header .el_header_Menu_inner ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .ly_header .el_header_Menu_inner ul li.current-menu-item a {
    color: #00a0e9;
  }
  .ly_header .el_header_Menu_inner ul li.current-menu-item a i.icon {
    color: #00a0e9;
  }
  .ly_header .el_header_Menu_inner ul li.current-menu-item a:after {
    width: 100%;
  }
  .ly_header .el_header_Menu_inner ul li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #1d1d1d;
    -webkit-transition: color 480ms;
    transition: color 480ms;
    position: relative;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    letter-spacing: 0;
    padding: 0 30px;
    line-height: 1;
  }
}
@media screen and (min-width: 1050px) and (max-width: 1300px) {
  .ly_header .el_header_Menu_inner ul li a {
    padding: 0 20px;
  }
}
@media screen and (min-width: 1050px) and (max-width: 1150px) {
  .ly_header .el_header_Menu_inner ul li a {
    padding: 0 12px;
  }
}
@media screen and (min-width: 1050px) {
  .ly_header .el_header_Menu_inner ul li a div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    position: relative;
  }
  .ly_header .el_header_Menu_inner ul li a span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .ly_header .el_header_Menu_inner ul li a span:after {
    content: "";
    display: block;
    background: #00a0e9;
    height: 0px;
    width: calc(100% + 10px);
    position: absolute;
    bottom: 3px;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    -webkit-transition: height 240ms;
    transition: height 240ms;
    -webkit-transition-delay: 60ms;
            transition-delay: 60ms;
  }
  .ly_header .el_header_Menu_inner ul li a i.icon {
    color: #b4b4b4;
    padding-right: 3px;
    -webkit-transition: color 480ms;
    transition: color 480ms;
  }
  .ly_header .el_header_Menu_inner ul li.home {
    display: none;
  }
  .ly_header .el_header_Menu_inner ul li.aboutus a div span img {
    width: 30px;
    height: 30px;
    display: block;
  }
  .ly_header .el_header_Menu_inner ul li.contact a {
    color: #fff;
    -webkit-transition: -webkit-transform 480ms;
    transition: -webkit-transform 480ms;
    transition: transform 480ms;
    transition: transform 480ms, -webkit-transform 480ms;
  }
  .ly_header .el_header_Menu_inner ul li.contact a span:after {
    content: none;
  }
  .ly_header .el_header_Menu_inner ul li.contact a div span {
    padding: 12px 30px;
    background: -webkit-gradient(linear, right top, left top, from(#00a0e9), color-stop(50%, #004896), to(#004896));
    background: linear-gradient(to left, #00a0e9, #004896 50%, #004896);
    border-radius: 50px;
    background-size: 200%;
    background-position: 100% 0;
    -webkit-transition: color 480ms, background-position 480ms;
    transition: color 480ms, background-position 480ms;
  }
  .ly_header .el_header_Menu_inner ul li.contact a i.icon {
    color: #ffffff;
  }
  .ly_header .el_header_Menu_inner ul li.contact a:hover {
    color: #fff;
  }
  .ly_header .el_header_Menu_inner ul li.contact a:hover i.icon {
    color: #fff;
  }
  .ly_header .el_header_Menu_inner ul li.contact a:hover div span {
    background-position: 0% 0;
  }
  .ly_header .el_header_Menu_inner ul li a:hover {
    color: #00a0e9;
  }
  .ly_header .el_header_Menu_inner ul li a:hover i.icon {
    color: #00a0e9;
  }
  .ly_header .el_header_Menu_inner ul li a:hover span:after, .ly_header .el_header_Menu_inner ul li.current-menu-item a span:after {
    height: 5px;
  }
  .ly_header a {
    display: inline-block;
  }
  .ly_header .sub-menu,
  .ly_header .el_header_Menu_inner_tel {
    display: none !important;
  }
  .ly_header.hidden {
    -webkit-transform: translateY(-80px);
            transform: translateY(-80px);
  }
  .ly_header.hidden .el_header_Menu_inner ul li.contact a {
    -webkit-transform: translateY(80px);
            transform: translateY(80px);
  }
}
/* HEADER::isSP
========================================================================== */
@media screen and (max-width: 1050px) {
  .ly_header_inner {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    height: 50px;
  }
  .ly_header_inner .el_header_Logo a, .ly_header_inner .el_header_Logo a svg {
    -webkit-transition-delay: 360ms;
            transition-delay: 360ms;
  }
  .ly_header_inner:before {
    content: "";
    width: 100%;
    height: 0;
    background: #ffffff;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0.5;
    -webkit-transition: all 480ms;
    transition: all 480ms;
  }
  .ly_header_inner.open:before {
    height: 100vh;
    opacity: 1;
  }
  .ly_header_inner.open:after {
    content: "";
    width: 100%;
    height: 50px;
    background: #ffffff;
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0.7;
    -webkit-transition: all 480ms;
    transition: all 480ms;
  }
  .ly_header.open .el_header_Logo a {
    -webkit-transition-delay: 0ms;
            transition-delay: 0ms;
    background-position: 99% 0;
    opacity: 0;
  }
  .ly_header.open .el_header_Logo a svg {
    -webkit-transition-delay: 0ms;
            transition-delay: 0ms;
    fill: #333;
  }
  .ly_header .el_header_Menu {
    visibility: hidden;
    position: fixed;
    top: 100vh;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .ly_header .el_header_Menu_inner {
    padding: 75px 0 40px;
    width: 100%;
    font-size: 1.4rem;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    overflow-y: scroll;
    height: 100vh;
  }
  .ly_header .el_header_Menu ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 90%;
    margin: auto;
    padding: 0;
    margin: 0 auto;
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .ly_header .el_header_Menu ul li {
    opacity: 0;
    width: 100%;
    text-align: left;
    padding: 0;
    margin: 0;
  }
  .ly_header .el_header_Menu ul li a {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 10px 0;
    font-size: 10vw;
    font-weight: bold;
    height: inherit;
    line-height: 1;
    letter-spacing: 0;
    -webkit-transition: color 480ms;
    transition: color 480ms;
  }
  .ly_header .el_header_Menu ul li a div {
    display: inherit;
  }
  .ly_header .el_header_Menu ul li a span {
    position: relative;
    display: inline-block;
    overflow: hidden;
    z-index: 1;
  }
  .ly_header .el_header_Menu ul li a span:before {
    content: "";
    width: calc(200% + 2px);
    height: 100px;
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: skewX(-45deg) translateY(-50%);
            transform: skewX(-45deg) translateY(-50%);
    background: #fff;
    -webkit-transition: left 480ms;
    transition: left 480ms;
    z-index: 2;
  }
  .ly_header .el_header_Menu ul li a span:before {
    left: -350%;
  }
  .ly_header .el_header_Menu ul li a i.icon {
    display: none;
  }
  .ly_header .el_header_Menu ul li a:before {
    left: 0;
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  .ly_header .el_header_Menu ul li a:hover:before, .ly_header .el_header_Menu ul li a:active:before {
    width: 100%;
  }
  .ly_header .el_header_Menu ul li a:hover span:before {
    left: 100%;
  }
  .ly_header .el_header_Menu ul li.home {
    display: block;
  }
  .ly_header .el_header_Menu ul li.aboutus {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  .ly_header .el_header_Menu.open ul li {
    -webkit-transition: opacity 0.9s;
    transition: opacity 0.9s;
    opacity: 1;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(1) {
    -webkit-transition-delay: 60ms;
            transition-delay: 60ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(2) {
    -webkit-transition-delay: 120ms;
            transition-delay: 120ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(3) {
    -webkit-transition-delay: 180ms;
            transition-delay: 180ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(4) {
    -webkit-transition-delay: 240ms;
            transition-delay: 240ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(5) {
    -webkit-transition-delay: 300ms;
            transition-delay: 300ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(6) {
    -webkit-transition-delay: 360ms;
            transition-delay: 360ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(7) {
    -webkit-transition-delay: 420ms;
            transition-delay: 420ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(8) {
    -webkit-transition-delay: 480ms;
            transition-delay: 480ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(9) {
    -webkit-transition-delay: 540ms;
            transition-delay: 540ms;
  }
  .ly_header .el_header_Menu.open ul li:nth-child(10) {
    -webkit-transition-delay: 600ms;
            transition-delay: 600ms;
  }
  .ly_header .el_header_Menu.open {
    visibility: visible;
    top: 0;
  }
  .ly_header li.menu-item-has-children a {
    padding-bottom: 10px;
  }
  .ly_header ul.sub-menu {
    width: 100%;
    display: block !important;
  }
  .ly_header ul.sub-menu li {
    border-bottom: none;
  }
  .ly_header ul.sub-menu li a {
    padding: 15px 20px;
    font-size: 1.4rem;
  }
}
/* HAMBURGER
========================================================================== */
#hamburger {
  display: none;
}

@media screen and (max-width: 1050px) {
  #hamburger {
    display: block;
    position: absolute;
    right: 0;
    top: 0px;
    margin-right: 10px;
    width: 50px;
    height: 50px;
    z-index: 9999;
    cursor: pointer;
  }
  #hamburger span {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 30px;
    height: 2px;
    background: #00a0e9;
  }
  #hamburger span:before, #hamburger span:after {
    content: "";
    width: 100%;
    height: 100%;
    background: #00a0e9;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    -webkit-transition: background 480ms;
    transition: background 480ms;
  }
  #hamburger span:before {
    top: -8px;
    -webkit-transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
  }
  #hamburger span:after {
    top: 8px;
    -webkit-transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: background 480ms, top 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms cubic-bezier(0.23, 1, 0.32, 1);
  }
  #hamburger.open span {
    background: none;
  }
  #hamburger.open span:before, #hamburger.open span:after {
    background: #333;
  }
  #hamburger.open span:after {
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
            transform: translate(-50%, -50%) rotate(45deg);
    -webkit-transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
  }
  #hamburger.open span:before {
    top: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
            transform: translate(-50%, -50%) rotate(-45deg);
    -webkit-transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 0.15s cubic-bezier(0.23, 1, 0.32, 1), transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 480ms 0.15s cubic-bezier(0.23, 1, 0.32, 1);
  }
}
ul#menu-head_navi li.current {
  font-weight: bold;
}

/*! common
========================================================================== */
.contentWide, footer.footer div.inner div.content, #presskit, body.company_en #office, body.company_en #overview, body.company_en #business div.inner, body.company_en #contents, main.privacy-policy #contents .inner, #game, #comingsoon,
#games,
#indiegames, #contact #formbox, #recruit.single #description, #recruit #list, #recruit #balance, #recruit #flow, #recruit #message, #recruit #navibox, #single #entry, #archives #itemlist, .home #news, .home #gravitylist, body.company #member, body.company #office, body.company #overview, body.about #business div.inner, body.about #contents, .home #company div.inner, .home #message div.inner, #post-404, #recruitment.parts div.inner {
  width: 90%;
  max-width: 1100px;
  margin: auto;
}

.col-4-in:before, .col-4-in:after {
  content: "";
  display: block;
  width: calc((100% - 90px) / 4);
}
@media screen and (max-width: 1000px) {
  .col-4-in:before, .col-4-in:after {
    width: calc((100% - 55px) / 3);
  }
}
@media screen and (max-width: 768px) {
  .col-4-in:before, .col-4-in:after {
    width: calc((100% - 20px) / 2);
  }
}
@media screen and (max-width: 480px) {
  .col-4-in:before, .col-4-in:after {
    width: 100%;
  }
}
.col-4-in:before {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}

.linkbox.gradient a {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.4rem;
  letter-spacing: 0;
  color: #fff;
  -webkit-transition: color 480ms;
  transition: color 480ms;
  padding: 15px 50px;
  background: -webkit-gradient(linear, right top, left top, from(#00a0e9), color-stop(50%, #004896), to(#004896));
  background: linear-gradient(to left, #00a0e9, #004896 50%, #004896);
  border-radius: 50px;
  background-size: 200%;
  background-position: 100% 0;
  -webkit-transition: background-position 480ms, padding 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: background-position 480ms, padding 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.linkbox.gradient a i.icon {
  font-size: 1.2rem;
  margin-right: 0.5rem;
}
.linkbox.gradient a:hover {
  background-position: 0% 0;
  padding: 15px 80px;
}
.linkbox.left {
  text-align: left;
}
.linkbox.center {
  text-align: center;
}
.linkbox.right {
  text-align: right;
}

.contentitle {
  position: relative;
  font-size: 2.2rem;
  line-height: 1.4;
  border-bottom: 2px solid #e6e6e6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 35px;
}
@media screen and (max-width: 768px) {
  .contentitle {
    font-size: 2rem;
    margin: 0 0 30px;
  }
}
.contentitle .content_main {
  font-weight: bold;
  position: relative;
}
.contentitle .content_main:after {
  content: "";
  width: 100%;
  height: 2px;
  background: #00a0e9;
  display: block;
  position: absolute;
  left: 0;
  bottom: -2px;
}
.contentitle .content_sub {
  font-size: 1.4rem;
  color: #b4b4b4;
  letter-spacing: 0;
  font-weight: normal;
}
@media screen and (max-width: 768px) {
  .contentitle .content_sub {
    font-size: 1.2rem;
    position: absolute;
    bottom: -15px;
    right: 0;
  }
}

/* recruit::parts
========================================================================== */
#recruitment.parts {
  position: relative;
  z-index: 1;
  padding: 100px 0;
  background-position: 50% 50%;
  background-size: cover;
  margin-bottom: 120px;
  background-attachment: fixed;
}
@media screen and (max-width: 768px) {
  #recruitment.parts {
    margin-bottom: 60px;
  }
}
#recruitment.parts div.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 768px) {
  #recruitment.parts div.inner {
    padding: 7vw 0;
  }
}
#recruitment.parts div.textbox {
  width: 400px;
  padding: 50px;
  background: rgba(255, 255, 255, 0.75);
  -webkit-backdrop-filter: saturate(180%) blur(10px);
          backdrop-filter: saturate(180%) blur(10px);
  -webkit-box-shadow: 2px 2px 5px -1px rgba(0, 0, 0, 0.1);
          box-shadow: 2px 2px 5px -1px rgba(0, 0, 0, 0.1);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 15px;
}
@media screen and (max-width: 768px) {
  #recruitment.parts div.textbox {
    width: 100%;
    padding: 7vw;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  }
}
#recruitment.parts div.textbox h2.title {
  font-size: 4.6rem;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 1;
  margin: 0 0 2rem;
}
#recruitment.parts div.textbox div.text {
  font-size: 1.4rem;
  margin: 0 0 30px;
}
#recruitment.parts div.textbox div.text p:not(:last-of-type) {
  margin-bottom: 1.5rem;
}

/* pagination
========================================================================== */
#pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#pagination span.links.no-more, #pagination span.links a {
  width: 40px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#pagination span.links.no-more {
  color: #ccc;
  border: 2px solid #efefef;
}
#pagination div.num {
  font-size: 2.4rem;
  height: 40px;
  border: 2px solid #e6e6e6;
  margin: 0 21px;
  padding: 0 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
#pagination div.num:before, #pagination div.num:after {
  content: "";
  position: absolute;
  top: 2px;
  width: 1px;
  height: 100%;
  background-image: linear-gradient(to bottom, #b4b4b4, #b4b4b4 1px, transparent 1px, transparent 3px);
  background-repeat: repeat-y;
  background-position: left top;
  background-size: 1px 4px;
}
#pagination div.num:before {
  left: -12px;
}
#pagination div.num:after {
  right: -12px;
}
#pagination div.num span {
  font-size: 1.8rem;
  line-height: 1;
  color: #777;
}
#pagination div.num span.maxpage {
  padding-left: 1rem;
  margin-left: 1rem;
  position: relative;
}
#pagination div.num span.maxpage:before {
  content: "";
  width: 1px;
  height: 120%;
  background: #505050;
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%) rotate(25deg);
          transform: translateY(-50%) rotate(25deg);
}
#pagination div.num.latestinfo {
  padding: 0;
  -webkit-box-align: inherit;
      -ms-flex-align: inherit;
          align-items: inherit;
  border: none;
}
#pagination div.num.latestinfo a {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 25px;
  font-size: 1.4rem;
}
#pagination a {
  position: relative;
}
#pagination a:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: 2px solid #e6e6e6;
  -webkit-transition: border 240ms;
  transition: border 240ms;
}
#pagination a:hover:before {
  border: 3px solid #00a0e9;
}

#post-404 {
  padding-top: 120px;
  margin-bottom: 120px;
}
#post-404 h1 {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #post-404 h1 {
    margin-bottom: 60px;
  }
}

/*! index
========================================================================== */
/* Index::slide
========================================================================== */
.home #slide {
  position: relative;
  z-index: 2;
  background: #fff;
}
.home #slide.simple {
  margin-bottom: 100px;
}
@media screen and (max-width: 768px) {
  .home #slide.simple {
    margin-bottom: 50px;
  }
}

/* Index::message
========================================================================== */
.home #message {
  position: relative;
  z-index: 1;
  padding: 130px 0;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGlkPSJTTUlMRV9GT1JfRVZFUllPTkUiIHg9IjAiIHk9IjAiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDk3NS4zOCA1NjUuOTMiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxzdHlsZT4uc3Qwe2ZpbGw6IzAwYTBlOTtmaWxsLW9wYWNpdHk6LjF9PC9zdHlsZT48cGF0aCBkPSJNNDY2LjQzIDE1My40NGMtOS4wMyAwLTE1LjU0LTIuMzItMTkuNTMtNi45NnMtNS45OC0xMi4wOC01Ljk4LTIyLjM0aC0zNi4wMWMwIDExLjk2IDIuNjYgMjIuMzQgOCAzMS4xMyA1LjMzIDguNzkgMTIuNzEgMTUuNTQgMjIuMTYgMjAuMjYgOS40NCA0LjcyIDE5LjkgNy4wOCAzMS4zNyA3LjA4IDE2LjkzIDAgMzAuMzEtNC4zNSA0MC4xNi0xMy4wNiA5Ljg1LTguNzEgMTQuNzctMjAuNzkgMTQuNzctMzYuMjUgMC0xNC4wOC0zLjkzLTI1LjY3LTExLjc4LTM0Ljc5LTcuODUtOS4xMS0yMC40NS0xNi44LTM3Ljc4LTIzLjA3LTkuOTMtNC4yMy0xNi44NS04LjMyLTIwLjc1LTEyLjI3cy01Ljg2LTguMzYtNS44Ni0xMy4yNWMwLTYuMjcgMS43NS0xMS4yNSA1LjI1LTE0Ljk1czguMzgtNS41NSAxNC42NS01LjU1YzYuNjcgMCAxMS43OCAyLjE4IDE1LjMyIDYuNTNzNS4zMSAxMC42OCA1LjMxIDE4Ljk4aDM1Ljc3YzAtMTAuNjYtMi4zLTIwLjE4LTYuOS0yOC41Ni00LjYtOC4zOC0xMS4xNy0xNC44Ny0xOS43MS0xOS40N0M0ODYuMzMgMi4zIDQ3Ni42IDAgNDY1LjcgMGMtMTYuMzYgMC0yOS44NSA0LjU0LTQwLjQ3IDEzLjYxcy0xNS45MyAyMS4xLTE1LjkzIDM2LjA3YzAgMTIuMzcgMy45MSAyMy4wOSAxMS43MiAzMi4xN3MyMC42MyAxNi45OSAzOC40NSAyMy43NGM5Ljc3IDMuOTkgMTYuNSA3LjgzIDIwLjIgMTEuNTQgMy43IDMuNyA1LjU1IDkuMTggNS41NSAxNi40Mi4wMSAxMy4yNi02LjI2IDE5Ljg5LTE4Ljc5IDE5Ljg5em0xMDIuMTItMjEuMzZsLTMuMjktNzQuMSAzNS41MiAxMjIuMmgyNC40MWwzNS41My0xMjIuMi0zLjMgNzQuMXY0OC4xaDM2LjAxVjIuNDRoLTQ2Ljg3bC0zMy40NSAxMjguNTRMNTc5LjU0IDIuNDRoLTQ2Ljg3djE3Ny43NGgzNS44OHYtNDguMXpNNzExLjMzIDIuNDRoMzUuODl2MTc3LjczaC0zNS44OVYyLjQ0em0xNTIuNDEgMTQ3Ljk1aC02Mi45OFYyLjQ0aC0zNS44OXYxNzcuNzRoOTguODd2LTI5Ljc5em0xMTAuMzEgMGgtNjYuMTZ2LTQ3LjEyaDU1LjlWNzQuMzRoLTU1LjlWMzIuMzVoNjUuOTFWMi40NEg4NzJ2MTc3Ljc0aDEwMi4wNXYtMjkuNzl6TTcwOS44NiAyMjR2LTI5LjkxaC05OC4zOXYxNzcuNzRoMzUuODl2LTcyLjUxaDU1Ljc5di0yOS43OWgtNTUuNzlWMjI0aDYyLjV6bTY5LjA1LTMyLjM1Yy0yMC4xIDAtMzUuODEgNi44Ni00Ny4xMiAyMC41N3MtMTYuOTcgMzIuNzgtMTYuOTcgNTcuMTl2MzAuNGMuMTYgMjMuNTIgNS45NCA0MS44MSAxNy4zMyA1NC44N3MyNy4wNiAxOS41OSA0NyAxOS41OWMyMC4wMiAwIDM1LjY2LTYuNTkgNDYuOTQtMTkuNzggMTEuMjctMTMuMTggMTYuOTEtMzEuNyAxNi45MS01NS41NHYtMzAuNGMtLjE2LTI0LjMzLTUuOTQtNDMuMjMtMTcuMzMtNTYuNy0xMS40MS0xMy40Ny0yNi45OS0yMC4yLTQ2Ljc2LTIwLjJ6bTI4LjA3IDEwOC40Yy0uMDggMTUuMTQtMi40IDI2LjMxLTYuOTYgMzMuNTFzLTExLjUyIDEwLjgtMjAuODcgMTAuOGMtOS42OSAwLTE2Ljg1LTMuNjgtMjEuNDgtMTEuMDUtNC42NC03LjM2LTYuOTYtMTguODItNi45Ni0zNC4zNnYtMzEuNjJjLjE2LTE1LjM4IDIuNTItMjYuODMgNy4wOC0zNC4zNnMxMS42LTExLjI5IDIxLjEyLTExLjI5YzkuNiAwIDE2LjY4IDMuOTEgMjEuMjQgMTEuNzIgNC41NiA3LjgxIDYuODQgMTkuNzQgNi44NCAzNS43N3YzMC44OGgtLjAxem0xMzcuMjgtMi42OWMxNy4xNy05LjQ0IDI1Ljc2LTI1Ljk2IDI1Ljc2LTQ5LjU2IDAtMTcuMTctNC45LTMwLjQyLTE0LjcxLTM5LjczLTkuODEtOS4zMi0yMy43LTEzLjk4LTQxLjY5LTEzLjk4aC01Ny4yNXYxNzcuNzNoMzUuODl2LTY0Ljk0aDE3LjgybDI2LjczIDY0Ljk0aDM4LjU3di0xLjcxbC0zMS4xMi03Mi43NXptLTE1LjUtMjcuNTJjLTMuNTggNC43Ni04Ljk1IDcuMTQtMTYuMTEgNy4xNGgtMjAuMzlWMjI0aDIxYzEzLjkyIDAgMjAuODcgOC45MSAyMC44NyAyNi43MyAwIDcuOTgtMS43OSAxNC4zNS01LjM3IDE5LjExek0zNS44OSA0ODYuNThIOTEuOHYtMjguOTNIMzUuODl2LTQxLjk5aDY1Ljkydi0yOS45MUgwdjE3Ny43NGgxMDIuMDVWNTMzLjdIMzUuODl2LTQ3LjEyem0xNDEuMTUgMjguMDhsLTI5Ljc4LTEyOC45MWgtMzkuOGw1MC45MSAxNzcuNzRoMzcuMzVsNTEuMjctMTc3Ljc0aC00MC4wNGwtMjkuOTEgMTI4Ljkxem0xMTEuMDYtMjguMDhoNTUuOTF2LTI4LjkzSDI4OC4xdi00MS45OWg2NS45MnYtMjkuOTFIMjUyLjIxdjE3Ny43NGgxMDIuMDVWNTMzLjdIMjg4LjF2LTQ3LjEyem0xODguMDYtNDcuMTJjMC0xNy4xNy00LjktMzAuNDItMTQuNzEtMzkuNzMtOS44MS05LjMyLTIzLjctMTMuOTgtNDEuNjktMTMuOThoLTU3LjI1djE3Ny43M2gzNS44OXYtNjQuOTRoMTcuODJsMjYuNzMgNjQuOTRoMzguNTd2LTEuNzFsLTMxLjEzLTcyLjc1YzE3LjE5LTkuNDQgMjUuNzctMjUuOTYgMjUuNzctNDkuNTZ6bS00MS4yNiAzMy4zOGMtMy41OCA0Ljc2LTguOTUgNy4xNC0xNi4xMSA3LjE0SDM5OC40VjQyN2gyMWMxMy45MiAwIDIwLjg3IDguOTEgMjAuODcgMjYuNzMgMCA3Ljk4LTEuNzkgMTQuMzUtNS4zNyAxOS4xMXptMTI3Ljg4LTg3LjA5bC0yNi43MyA3OS44NC0yNi44Ni03OS44NGgtMzkuMDZsNDcuNzMgMTEzLjI4djY0LjQ2aDM2LjM4di02NC40Nmw0Ny42MS0xMTMuMjhoLTM5LjA3em05MS4zLTIuNDRjLTIwLjEgMC0zNS44MSA2Ljg2LTQ3LjEyIDIwLjU3LTExLjMxIDEzLjcxLTE2Ljk3IDMyLjc4LTE2Ljk3IDU3LjE5djMwLjRjLjE2IDIzLjUyIDUuOTQgNDEuODEgMTcuMzMgNTQuODdzMjcuMDYgMTkuNTkgNDcgMTkuNTljMjAuMDIgMCAzNS42Ni02LjU5IDQ2Ljk0LTE5Ljc4IDExLjI3LTEzLjE4IDE2LjkxLTMxLjcgMTYuOTEtNTUuNTR2LTMwLjRjLS4xNi0yNC4zMy01Ljk0LTQzLjIzLTE3LjMzLTU2LjctMTEuNDEtMTMuNDctMjYuOTktMjAuMi00Ni43Ni0yMC4yem0yOC4wNyAxMDguNGMtLjA4IDE1LjE0LTIuNCAyNi4zMS02Ljk2IDMzLjUxcy0xMS41MiAxMC44LTIwLjg3IDEwLjhjLTkuNjkgMC0xNi44NS0zLjY4LTIxLjQ4LTExLjA1LTQuNjQtNy4zNi02Ljk2LTE4LjgyLTYuOTYtMzQuMzZ2LTMxLjYyYy4xNi0xNS4zOCAyLjUyLTI2LjgzIDcuMDgtMzQuMzZzMTEuNi0xMS4yOSAyMS4xMi0xMS4yOWM5LjYgMCAxNi42OCAzLjkxIDIxLjI0IDExLjcyczYuODQgMTkuNzQgNi44NCAzNS43N3YzMC44OGgtLjAxem0xMzcuNzcgMTAuNzRsLTUyLjYxLTExNi43aC0zNS44OXYxNzcuNzRoMzUuODlWNDQ2LjkxbDUyLjQ5IDExNi41OGgzNS44OVYzODUuNzVoLTM1Ljc3djExNi43em04Ny45Ni0xNS44N2g1NS45MXYtMjguOTNoLTU1Ljkxdi00MS45OWg2NS45MnYtMjkuOTFIODcydjE3Ny43NGgxMDIuMDVWNTMzLjdoLTY2LjE3di00Ny4xMnoiIGNsYXNzPSJzdDAiLz48L3N2Zz4=");
  background-repeat: no-repeat;
  background-position: 100% 50%;
  background-size: auto 101%;
}
@media screen and (max-width: 768px) {
  .home #message {
    padding: 10vw 0;
  }
}
.home #message h2.title {
  font-size: 7rem;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 1;
  margin: 0 0 2rem;
  color: #00a0e9;
  background: -webkit-linear-gradient(0deg, #004896, #00a0e9);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  .home #message h2.title {
    font-size: 18vw;
  }
}
.home #message div.textbox h3.subtitle {
  font-size: 3rem;
  font-weight: bold;
  line-height: 1;
  margin: 0 0 30px;
}
@media screen and (max-width: 768px) {
  .home #message div.textbox h3.subtitle {
    font-size: 2.4rem;
  }
}
.home #message div.textbox div.text {
  font-size: 1.4rem;
  color: #919191;
  margin: 0 0 30px;
}
.home #message div.textbox div.text p:not(:last-of-type) {
  margin-bottom: 1.5rem;
}

/* Index::company
========================================================================== */
.home #company {
  position: relative;
  z-index: 1;
  padding: 90px 0;
  margin-bottom: 120px;
  background-image: url("./img/index/company.jpg");
  background-position: 50% 50%;
  background-size: cover;
  background-attachment: fixed;
}
@media screen and (max-width: 768px) {
  .home #company {
    padding: 0;
    margin-bottom: 60px;
    background-attachment: scroll;
  }
}
.home #company div.inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 768px) {
  .home #company div.inner {
    padding: 20vw 0;
  }
}
.home #company div.textbox {
  width: 400px;
  padding: 50px;
  background: rgba(255, 255, 255, 0.75);
  -webkit-backdrop-filter: saturate(180%) blur(10px);
          backdrop-filter: saturate(180%) blur(10px);
  -webkit-box-shadow: 2px 2px 5px -1px rgba(0, 0, 0, 0.1);
          box-shadow: 2px 2px 5px -1px rgba(0, 0, 0, 0.1);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 15px;
}
@media screen and (max-width: 768px) {
  .home #company div.textbox {
    width: 100%;
    padding: 7vw;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
  }
}
.home #company div.textbox h2.title {
  font-size: 4.6rem;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 1;
  margin: 0 0 2rem;
}
.home #company div.textbox div.text {
  font-size: 1.4rem;
  margin: 0 0 30px;
}
.home #company div.textbox div.text p:not(:last-of-type) {
  margin-bottom: 1.5rem;
}

/*! about
========================================================================== */
body.about {
  /* about::field
  ========================================================================== */
  /* about::business
  ========================================================================== */
  /* ========================================================================== */
}
body.about #contents {
  padding-top: 60px;
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.about #contents {
    margin-bottom: 60px;
  }
}
body.about #contents div.inner {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.about #contents div.inner {
    margin-bottom: 60px;
  }
}
body.about #contents div.inner:last-of-type {
  margin-bottom: 0;
}
body.about #contents div.textbox {
  margin-bottom: 30px;
}
body.about #contents div.textbox p:not(:last-of-type) {
  margin-bottom: 1.5rem;
}
body.about #contents div.imgbox img {
  width: 100%;
  height: auto;
}
body.about #business {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.about #business {
    margin-bottom: 60px;
  }
}
body.about #business div.inner {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  body.about #business div.inner {
    margin-bottom: 30px;
  }
}
body.about #business div#area div.item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  body.about #business div#area div.item:not(:last-of-type) {
    margin-bottom: 50px;
  }
}
body.about #business div#area div.item div.imgbox {
  width: 45.45%;
  overflow: hidden;
  background-position: 50% 50%;
  background-size: cover;
}
@media screen and (min-width: 1150px) {
  body.about #business div#area div.item div.imgbox {
    height: 350px;
  }
}
@media screen and (max-width: 1150px) {
  body.about #business div#area div.item div.imgbox {
    height: 250px;
  }
}
@media screen and (max-width: 768px) {
  body.about #business div#area div.item div.imgbox {
    width: 100%;
    padding-top: 56.25%;
  }
}
body.about #business div#area div.item div.text {
  width: 54.55%;
}
@media screen and (max-width: 768px) {
  body.about #business div#area div.item div.text {
    width: 90%;
    margin: -100px auto 0;
    background: #fff;
  }
}
body.about #business div#area div.item div.text div.titlebox {
  padding-left: 15px;
  position: relative;
  -webkit-transition: margin 240ms;
  transition: margin 240ms;
  margin-bottom: 2rem;
}
body.about #business div#area div.item div.text div.titlebox:before {
  background: #00a0e9;
  content: "";
  display: block;
  width: 5px;
  height: calc(100% - 4px);
  position: absolute;
  bottom: 0;
  left: 0;
}
body.about #business div#area div.item div.text div.titlebox p.eng {
  font-size: 1.2rem;
  font-weight: bold;
  color: #00a0e9;
  letter-spacing: 0;
  line-height: 1;
  margin-bottom: 3px;
}
body.about #business div#area div.item div.text div.titlebox h3.title {
  font-size: 2rem;
  line-height: 1.4;
  font-weight: bold;
}
body.about #business div#area div.item:nth-child(odd) div.text {
  padding-left: 30px;
  padding-right: calc((100% - 1100px) / 2);
}
@media screen and (max-width: 1160px) {
  body.about #business div#area div.item:nth-child(odd) div.text {
    padding-right: 30px;
  }
}
@media screen and (max-width: 950px) {
  body.about #business div#area div.item:nth-child(odd) div.text {
    padding-left: 30px;
    padding-right: 2.5%;
  }
}
body.about #business div#area div.item:nth-child(even) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
body.about #business div#area div.item:nth-child(even) div.text {
  padding-right: 30px;
  padding-left: calc((100% - 1100px) / 2);
}
@media screen and (max-width: 1160px) {
  body.about #business div#area div.item:nth-child(even) div.text {
    padding-left: 30px;
  }
}
@media screen and (max-width: 950px) {
  body.about #business div#area div.item:nth-child(even) div.text {
    padding-right: 2.5%;
    padding-left: 2.5%;
  }
}
@media screen and (max-width: 768px) {
  body.about #business div#area div.item:nth-child(odd) div.text, body.about #business div#area div.item:nth-child(even) div.text {
    padding: 2.5%;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  }
}

/*! company
========================================================================== */
body.company {
  /* company::overview
  ========================================================================== */
  /* company::オフィス
  ========================================================================== */
  /* company::メンバー
  ========================================================================== */
}
body.company #overview h2.title {
  width: 80%;
  max-width: 320px;
  margin: auto;
  padding: 70px 0 70px;
}
body.company #overview .table {
  border-top: 1px dotted #B4B4B4;
}
body.company #overview .table:not(:first-of-type) {
  margin-top: 100px;
}
@media screen and (max-width: 768px) {
  body.company #overview .table:not(:first-of-type) {
    margin-top: 25px;
  }
}
body.company #overview .table:last-of-type {
  margin-bottom: 100px;
}
body.company #overview .table .row {
  border-bottom: 1px dotted #B4B4B4;
  padding: 15px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  body.company #overview .table .row {
    padding: 2.5vw 0;
  }
}
body.company #overview .table .row:last-of-type {
  border-bottom: 1px dotted #B4B4B4;
}
body.company #overview .table .row .col.th {
  width: 190px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  body.company #overview .table .row .col.th {
    width: 100%;
    margin-bottom: 10px;
  }
}
body.company #overview .table .row .col.td {
  position: relative;
  width: calc(100% - 190px);
}
@media screen and (max-width: 768px) {
  body.company #overview .table .row .col.td {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  body.company #overview .table .row .col.td {
    padding-left: 20px;
  }
  body.company #overview .table .row .col.td:before {
    content: "";
    height: 100%;
    width: 3px;
    border-radius: 50px;
    background: #E6E6E6;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
body.company #overview .table .row .col.td a[target=_blank] {
  font-size: 1.2rem;
  letter-spacing: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #00a0e9;
}
body.company #overview .table .row .col.td a[target=_blank]:not(:first-of-type) {
  margin-left: 1.5rem;
}
body.company #overview .table .row .col.td a[target=_blank] i.icon {
  margin-left: 2px;
}
body.company #office {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.company #office {
    margin-bottom: 60px;
  }
}
body.company #office .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 0 35px;
}
body.company #office .box .imgbox {
  width: 200px;
}
@media screen and (max-width: 768px) {
  body.company #office .box .imgbox {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
body.company #office .box .textbox {
  width: calc(100% - 220px);
}
@media screen and (max-width: 768px) {
  body.company #office .box .textbox {
    width: 100%;
  }
}
body.company #office .box .textbox p {
  padding: 2px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  position: relative;
}
body.company #office .box .textbox p:before {
  display: block;
  content: attr(data-name) "";
  width: 100px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  body.company #office .box .textbox p:before {
    width: 80px;
  }
}
body.company #office .box .textbox p:after {
  content: "";
  height: calc(100% - 12px);
  width: 3px;
  border-radius: 50px;
  background: #E6E6E6;
  display: block;
  position: absolute;
  top: 50%;
  left: 85px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  body.company #office .box .textbox p:after {
    left: 70px;
  }
}
body.company #office .box .textbox p span {
  width: calc(100% - 100px);
}
@media screen and (max-width: 768px) {
  body.company #office .box .textbox p span {
    width: calc(100% - 80px);
  }
}
body.company #office .box .textbox p a[target=_blank] {
  letter-spacing: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #00a0e9;
}
body.company #office .box .textbox p a[target=_blank] i.icon {
  margin-left: 0.5rem;
  font-size: 70%;
}
body.company #office .box .textbox p a[target=_blank]:hover {
  text-decoration: underline;
}
body.company #member {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.company #member {
    margin-bottom: 60px;
  }
}
body.company #member .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
body.company #member .box .staff {
  width: 33.3333333333%;
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  body.company #member .box .staff {
    width: 50%;
    margin-bottom: 35px;
  }
}
body.company #member .box .staff .imgbox {
  margin-bottom: 10px;
}
body.company #member .box .staff .imgbox img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 50%;
     object-position: 50% 50%;
}
body.company #member .box .staff .text p {
  font-weight: bold;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}
body.company #member .box .staff .text p.position {
  color: #00a0e9;
  font-size: 1.6rem;
  margin-bottom: 3px;
}
@media screen and (max-width: 1024px) {
  body.company #member .box .staff .text p.position {
    font-size: 1.4rem;
  }
}
@media screen and (max-width: 640px) {
  body.company #member .box .staff .text p.position {
    font-size: 1.2rem;
  }
}
body.company #member .box .staff .text p.name {
  font-size: 2.4rem;
}
@media screen and (max-width: 1024px) {
  body.company #member .box .staff .text p.name {
    font-size: 2rem;
  }
}
@media screen and (max-width: 640px) {
  body.company #member .box .staff .text p.name {
    font-size: 1.6rem;
  }
}

/* Index::gravityir
========================================================================== */
.home #gravitylist {
  position: relative;
  z-index: 1;
  padding: 0;
  background-repeat: no-repeat;
  background-position: 100% 50%;
  background-size: auto 101%;
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  .home #gravitylist {
    padding: 0;
    margin-bottom: 60px;
  }
}
.home #gravitylist div.iritem {
  margin-bottom: 30px;
}
.home #gravitylist div.iritem ul li {
  padding: 10px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  border-bottom: 1px dotted #e6e6e6;
}
.home #gravitylist div.iritem ul li:first-of-type {
  border-top: 1px dotted #e6e6e6;
}
.home #gravitylist div.iritem ul li p.date {
  font-size: 1.5rem;
  width: 120px;
}
@media screen and (max-width: 768px) {
  .home #gravitylist div.iritem ul li p.date {
    margin-bottom: 5px;
  }
}
.home #gravitylist div.iritem ul li h3.title {
  font-weight: normal;
  font-size: 1.5rem;
  width: calc(100% - 120px);
}
@media screen and (max-width: 768px) {
  .home #gravitylist div.iritem ul li h3.title {
    width: 100%;
  }
}
.home #gravitylist div.iritem ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
.home #gravitylist div.iritem ul li a:hover {
  text-decoration: underline;
}
.home #gravitylist div.iritem ul li a.permalink {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
@media screen and (max-width: 768px) {
  .home #gravitylist div.iritem ul li a.permalink {
    margin-bottom: 5px;
  }
}
.home #gravitylist div.iritem ul li a.filelink {
  width: 100%;
}
.home #gravitylist div.iritem ul li a div.files {
  font-size: 1.4rem;
}
.home #gravitylist div.iritem ul li a div.files span {
  margin: 0 5px;
}
.home #gravitylist div.iritem ul li a div.files:before {
  font-family: "icomoon" !important;
  speak: none;
  font-size: 130%;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.home #gravitylist div.iritem ul li a[href$=".xls"] .files:before, .home #gravitylist div.iritem ul li a[href$=".xlsx"] .files:before {
  color: #539067;
  content: "\e914";
}
.home #gravitylist div.iritem ul li a[href$=".doc"] .files:before, .home #gravitylist div.iritem ul li a[href$=".docx"] .files:before {
  color: #466db2;
  content: "\e915";
}
.home #gravitylist div.iritem ul li a[href$=".ppt"] .files:before, .home #gravitylist div.iritem ul li a[href$=".pptx"] .files:before {
  color: #dc6545;
  content: "\e917";
}
.home #gravitylist div.iritem ul li a[href$=".pdf"] .files:before {
  color: #d62728;
  content: "\e916";
}

/* Common::news
========================================================================== */
/* Frame */
.newsitem.frame {
  margin-bottom: 50px;
  overflow: visible !important;
}
.newsitem.frame ul {
  list-style: none;
  margin: 0;
  padding: 0;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.newsitem.frame ul li {
  padding: 0;
}
.newsitem.frame ul li a {
  display: block;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-bottom: 1px solid #e6e6e6;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
.newsitem.frame ul li a .imgbox {
  position: relative;
  margin-bottom: 5px;
  padding-top: 64%;
  background-position: 50% 50%;
  background-size: cover;
}
.newsitem.frame ul li a .imgbox:before, .newsitem.frame ul li a .imgbox:after {
  display: block;
  opacity: 0;
}
.newsitem.frame ul li a .imgbox:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
  -webkit-transition: opacity 240ms;
  transition: opacity 240ms;
}
.newsitem.frame ul li a .imgbox:after {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 1rem;
  z-index: 10;
  color: #fff;
  font-size: 3rem;
  border: 2px solid #fff;
  border-radius: 50px;
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  content: "\e90a";
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition: opacity 480ms;
  transition: opacity 480ms;
}
.newsitem.frame ul li a .titlebox {
  font-size: 1.4rem;
  position: relative;
  margin-bottom: 20px;
  line-height: 1.5;
  word-break: break-all;
}
.newsitem.frame ul li a .metabox {
  margin-top: auto;
  margin-bottom: 5px;
  position: relative;
}
.newsitem.frame ul li a .metabox p {
  font-size: 1.2rem;
  line-height: 1;
}
.newsitem.frame ul li a .metabox p.category {
  color: #00a0e9;
  font-size: 1rem;
  margin-bottom: 3px;
}
.newsitem.frame ul li a .metabox i.icon {
  position: absolute;
  top: 50%;
  right: 2px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  font-size: 1.2rem;
  color: #00a0e9;
}
.newsitem.frame ul li a:hover .imgbox:before, .newsitem.frame ul li a:hover .imgbox:after {
  opacity: 1;
}

/* Index::news
========================================================================== */
.home #news {
  margin-bottom: 70px;
  /* Frame */
  /* Scrollbar */
}
.home #news .frame {
  margin: 0 !important;
  margin-bottom: 30px !important;
}
.home #news .frame ul {
  width: 100% !important;
  height: auto !important;
}
.home #news .frame ul li {
  height: auto !important;
}
.home #news .frame ul li a {
  padding-right: 15px;
}
.home #news .frame ul li.last a {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: -webkit-gradient(linear, left top, right top, from(#004896), color-stop(50%, #00a0e9), to(#00a0e9));
  background: linear-gradient(to right, #004896, #00a0e9 50%, #00a0e9);
  background-size: 200%;
  background-position: 0 0;
  color: #fff;
  font-size: 1.4rem;
  overflow: hidden;
  -webkit-transition: background-position 240ms;
  transition: background-position 240ms;
}
.home #news .frame ul li.last a span {
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-right: 0px;
  -webkit-transition: padding 240ms;
  transition: padding 240ms;
  -webkit-transition-delay: 100ms;
          transition-delay: 100ms;
}
.home #news .frame ul li.last a span i.icon {
  font-size: 3rem;
  position: absolute;
  top: 50%;
  right: -200%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: right 240ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: right 240ms cubic-bezier(0.68, 0, 0.265, 1);
}
.home #news .frame ul li.last a:hover {
  background-position: 100% 0;
}
.home #news .frame ul li.last a:hover span {
  padding-right: 40px;
  -webkit-transition-delay: 0;
          transition-delay: 0;
}
.home #news .frame ul li.last a:hover span i.icon {
  right: 0;
}
.home #news .controler {
  position: relative;
  width: 65%;
  max-width: 500px;
  margin: auto;
  margin-bottom: 30px;
  padding: 5px 0;
}
@media screen and (max-width: 768px) {
  .home #news .controler {
    display: none;
  }
}
.home #news .controler .scrollbar {
  margin: 0 auto;
  height: 5px;
  background: #ccc;
  border-radius: 50px;
  line-height: 0;
  -webkit-box-shadow: inset 0 1px 3px 0 rgba(4, 0, 0, 0.14);
          box-shadow: inset 0 1px 3px 0 rgba(4, 0, 0, 0.14);
  position: relative;
}
.home #news .controler .scrollbar .handle {
  width: 100%;
  height: 100%;
  background: #ccc;
  cursor: move;
  border-radius: 50px;
}
.home #news .controler .scrollbar .handle .swiper-scrollbar-drag {
  background: #00a0e9;
}
.home #news .controler .scrollbar button.btn {
  cursor: pointer;
  padding: 0;
  margin: 0;
  border: none;
  position: absolute;
  top: 50%;
  font-size: 2.6rem;
  background: #fff;
  border-radius: 50px;
  color: #00a0e9;
  -webkit-transition: opacity 480ms;
  transition: opacity 480ms;
}
.home #news .controler .scrollbar button.btn.prevPage {
  left: -4rem;
  -webkit-transform: translateY(-50%) scale(-1, 1);
          transform: translateY(-50%) scale(-1, 1);
}
.home #news .controler .scrollbar button.btn.nextPage {
  right: -4rem;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
.home #news .controler .scrollbar button.btn.disabled {
  cursor: not-allowed;
  opacity: 0.3;
}

/* Archive::news
========================================================================== */
#archives #itemlist {
  padding-top: 60px;
  margin-bottom: 120px;
  /* Frame */
}
#archives #itemlist .newsitem.frame ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#archives #itemlist .newsitem.frame ul li {
  width: calc((100% - 90px) / 4);
  margin-bottom: 40px;
}
@media screen and (max-width: 1000px) {
  #archives #itemlist .newsitem.frame ul li {
    width: calc((100% - 55px) / 3);
  }
}
@media screen and (max-width: 768px) {
  #archives #itemlist .newsitem.frame ul li {
    width: calc((100% - 20px) / 2);
  }
}
@media screen and (max-width: 480px) {
  #archives #itemlist .newsitem.frame ul li {
    width: 100%;
  }
}
#archives #itemlist .newsitem.frame h3.nopost {
  text-align: center;
  margin-bottom: 50px;
  font-size: 6.6rem;
  letter-spacing: 0;
  -webkit-transition: font-size 240ms;
  transition: font-size 240ms;
}
@media screen and (max-width: 768px) {
  #archives #itemlist .newsitem.frame h3.nopost {
    font-size: 4rem;
  }
}
@media screen and (max-width: 480px) {
  #archives #itemlist .newsitem.frame h3.nopost {
    font-size: 2.8rem;
  }
}

/* Archive::Navigation
========================================================================== */
#archives #itemlist .navibox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-bottom: 50px;
  /* For PC */
  /* For SP */
  /* For SP */
}
@media screen and (max-width: 900px) {
  #archives #itemlist .navibox {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
@media screen and (max-width: 600px) {
  #archives #itemlist .navibox {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
#archives #itemlist .navibox .catboxPC {
  display: block;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 900px) {
  #archives #itemlist .navibox .catboxPC {
    display: none;
  }
}
#archives #itemlist .navibox .catboxPC h2.title {
  position: relative;
  font-size: 1.8rem;
  line-height: initial;
}
#archives #itemlist .navibox .catboxPC ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#archives #itemlist .navibox .catboxPC ul li {
  line-height: initial;
}
#archives #itemlist .navibox .catboxPC ul li span {
  cursor: pointer;
}
#archives #itemlist .navibox .catboxPC ul li a, #archives #itemlist .navibox .catboxPC ul li span {
  display: block;
  padding: 10px 15px;
  font-weight: bold;
  position: relative;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#archives #itemlist .navibox .catboxPC ul li a:after, #archives #itemlist .navibox .catboxPC ul li span:after {
  content: "";
  display: block;
  background: #00a0e9;
  height: 0px;
  width: calc(100% - 20px);
  position: absolute;
  bottom: 3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-transition: height 240ms;
  transition: height 240ms;
  -webkit-transition-delay: 60ms;
          transition-delay: 60ms;
}
#archives #itemlist .navibox .catboxPC ul li.current-cat a {
  color: #00a0e9;
}
#archives #itemlist .navibox .catboxPC ul li.current-cat a:after, #archives #itemlist .navibox .catboxPC ul li a:hover:after, #archives #itemlist .navibox .catboxPC ul li span:hover:after {
  height: 5px;
}
#archives #itemlist .navibox .catboxSP {
  display: none;
}
@media screen and (max-width: 900px) {
  #archives #itemlist .navibox .catboxSP {
    display: block;
  }
}
#archives #itemlist .navibox .irbox {
  display: none;
}
@media screen and (max-width: 900px) {
  #archives #itemlist .navibox .irbox {
    display: block;
  }
}
#archives #itemlist .navibox .selectbox {
  cursor: pointer;
  position: relative;
  margin-right: 20px;
}
#archives #itemlist .navibox .selectbox div.text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.2rem;
  padding: 5px 15px;
  padding-right: 10px;
  border: 2px solid #e6e6e6;
  border-radius: 3px;
  -webkit-transition: all 240ms;
  transition: all 240ms;
}
#archives #itemlist .navibox .selectbox div.text span {
  padding-right: 3rem;
}
#archives #itemlist .navibox .selectbox div.text i {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
#archives #itemlist .navibox .selectbox:hover div.text {
  border: 2px solid #00a0e9;
  color: #00a0e9;
}
#archives #itemlist .navibox .selectbox select {
  opacity: 0.01;
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 16px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
#archives #itemlist .navibox .selectbox select option {
  background-color: #fff;
  color: #333;
}
#archives #itemlist .navibox .selectbox select::-ms-expand {
  display: none;
}
#archives #itemlist .navibox .selectbox select:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #828c9a;
}
#archives #itemlist .navibox .irbox {
  cursor: pointer;
  position: relative;
}
@media screen and (max-width: 600px) {
  #archives #itemlist .navibox .irbox {
    margin-top: 15px;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
#archives #itemlist .navibox .irbox div.text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.2rem;
  padding: 5px 15px;
  padding-right: 10px;
  border: 2px solid #e6e6e6;
  border-radius: 3px;
  -webkit-transition: all 240ms;
  transition: all 240ms;
}
#archives #itemlist .navibox .irbox div.text span {
  padding-right: 2rem;
}
#archives #itemlist .navibox .irbox:hover div.text {
  border: 2px solid #00a0e9;
  color: #00a0e9;
}

.modal {
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999999;
}
.modal__bg {
  background: rgba(0, 0, 0, 0.85);
  height: 100vh;
  position: absolute;
  width: 100%;
}
.modal__content {
  width: 375px;
  background: #fff;
  text-align: center;
  left: 50%;
  padding: 20px 0 15px;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.modal__content a {
  -webkit-transition: color 240ms;
  transition: color 240ms;
  text-decoration: underline;
}
.modal__content p {
  font-size: 1.4rem;
  margin-bottom: 10px;
}
.modal__content i.icon {
  margin-left: 0.5rem;
}
.modal__content span.js-modal-close {
  font-size: 1.4rem;
  cursor: pointer;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
.modal__content span.js-modal-close:hover {
  color: #00a0e9;
}

/* Single::news
========================================================================== */
#single #entry {
  padding-top: 60px;
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #single #entry {
    margin-bottom: 60px;
  }
}
#single #entry div.metabox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 3px solid #e6e6e6;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #single #entry div.metabox {
    margin-bottom: 5px;
  }
}
#single #entry div.metabox p {
  position: relative;
  padding: 10px 0;
  line-height: initial;
}
#single #entry div.metabox p:before {
  content: "";
  display: block;
  height: 3px;
  width: 100%;
  position: absolute;
  top: -3px;
  left: 0;
}
#single #entry div.metabox p.date {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  #single #entry div.metabox p.date {
    font-size: 1.6rem;
  }
}
#single #entry div.metabox p.date:before {
  background: #00a0e9;
}
#single #entry div.metabox p.category {
  font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
  #single #entry div.metabox p.category {
    font-size: 1.4rem;
  }
}
#single #entry div.metabox p.category:before {
  background: #333;
}
#single #entry h1.entrytitle {
  font-size: 2.8rem;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #single #entry h1.entrytitle {
    font-size: 2.2rem;
    margin-bottom: 30px;
  }
}
#single #entry div.contentbox {
  padding-bottom: 90px;
  margin-bottom: 30px;
  border-bottom: 2px solid #e6e6e6;
}
@media screen and (max-width: 768px) {
  #single #entry div.contentbox {
    padding-bottom: 60px;
  }
}
#single #entry div.contentbox img {
  max-width: 100%;
  height: auto;
}
#single #entry div.contentbox p {
  margin-bottom: 1.5rem;
}
#single #entry div.contentbox p a {
  color: #004896;
  text-decoration: underline;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#single #entry div.contentbox p a:hover {
  color: #00a0e9;
}
#single #entry div.contentbox .filebox {
  font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
  #single #entry div.contentbox .filebox {
    font-size: 1.4rem;
  }
}
#single #entry div.contentbox .filebox a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border: 3px solid #f0f0f0;
  border-radius: 15px;
  padding: 20px 25px;
  line-height: 1;
  align-items: center;
  overflow: hidden;
  word-break: break-all;
  -webkit-transition: border 480ms, color 480ms;
  transition: border 480ms, color 480ms;
}
#single #entry div.contentbox .filebox a:hover {
  border: 3px solid #00a0e9;
}
#single #entry div.contentbox .filebox a span {
  display: inline-block;
  white-space: nowrap;
  margin-left: 1rem;
}
#single #entry div.contentbox .filebox a:after {
  content: "\e918";
  padding-left: 1rem;
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-transform: translateY(-300%);
          transform: translateY(-300%);
  opacity: 0;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition: opacity 480ms, -webkit-transform 480ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: opacity 480ms, -webkit-transform 480ms cubic-bezier(0.68, 0, 0.265, 1);
  transition: transform 480ms cubic-bezier(0.68, 0, 0.265, 1), opacity 480ms;
  transition: transform 480ms cubic-bezier(0.68, 0, 0.265, 1), opacity 480ms, -webkit-transform 480ms cubic-bezier(0.68, 0, 0.265, 1);
}
#single #entry div.contentbox .filebox a:hover:after {
  opacity: 1;
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
}
#single #entry div.contentbox .filebox a:before {
  padding-right: 0.5rem;
  font-family: "icomoon" !important;
  speak: none;
  font-size: 200%;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#single #entry div.contentbox .filebox a[href$=".xls"]:before, #single #entry div.contentbox .filebox a[href$=".xlsx"]:before {
  color: #539067;
  content: "\e914";
}
#single #entry div.contentbox .filebox a[href$=".doc"]:before, #single #entry div.contentbox .filebox a[href$=".docx"]:before {
  color: #466db2;
  content: "\e915";
}
#single #entry div.contentbox .filebox a[href$=".ppt"]:before, #single #entry div.contentbox .filebox a[href$=".pptx"]:before {
  color: #dc6545;
  content: "\e917";
}
#single #entry div.contentbox .filebox a[href$=".pdf"]:before {
  color: #d62728;
  content: "\e916";
}

/*! RECRUIT
========================================================================== */
#recruit {
  /* progress bar */
  /* Navigation
  ========================================================================== */
  /* recruit::joboffer
  ========================================================================== */
  /* recruit::message
  ========================================================================== */
  /* recruit::flow
  ========================================================================== */
  /* recruit::balance
  ========================================================================== */
  /* recruit::list
  ========================================================================== */
}
#recruit .pagetitlebox {
  margin-bottom: 30px;
}
#recruit .slider-wrapper {
  width: 100%;
}
#recruit .slider-wrapper .slider {
  width: 100%;
}
#recruit .slider-wrapper .slider .slide {
  width: 100%;
}
#recruit .slider-wrapper .slider .slide img {
  width: 100%;
}
#recruit .slider-progress {
  width: 100%;
  height: 2px;
  background: rgba(230, 230, 230, 0.6);
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
}
#recruit .slider-progress .progress {
  width: 0%;
  height: 2px;
  background: #00a0e9;
}
#recruit #navibox {
  padding-top: 60px;
  margin-bottom: 50px;
}
#recruit #navibox ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#recruit #navibox ul li {
  line-height: initial;
}
@media screen and (max-width: 640px) {
  #recruit #navibox ul li {
    width: 33.3333333333%;
    font-size: 1.2rem;
    border-top: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
  }
  #recruit #navibox ul li:nth-child(1) {
    border-left: 1px solid #e6e6e6;
  }
  #recruit #navibox ul li:nth-child(2) {
    border-left: 1px solid #e6e6e6;
  }
  #recruit #navibox ul li:nth-child(3) {
    border-left: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6;
  }
}
#recruit #navibox ul li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 10px 15px;
  font-weight: bold;
  position: relative;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
@media screen and (max-width: 640px) {
  #recruit #navibox ul li a {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 10px 7px;
  }
}
#recruit #navibox ul li a:after {
  content: "";
  display: block;
  background: #00a0e9;
  height: 0px;
  width: calc(100% - 20px);
  position: absolute;
  bottom: 3px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-transition: height 240ms;
  transition: height 240ms;
  -webkit-transition-delay: 60ms;
          transition-delay: 60ms;
}
@media screen and (max-width: 640px) {
  #recruit #navibox ul li a:after {
    width: calc(100% - 10px);
  }
}
#recruit #navibox ul li a i.icon {
  color: #00a0e9;
  padding-left: 1rem;
}
@media screen and (max-width: 640px) {
  #recruit #navibox ul li a i.icon {
    padding-left: 0;
  }
}
#recruit #navibox ul li.current-cat a {
  color: #00a0e9;
}
#recruit #navibox ul li.current-cat a:after, #recruit #navibox ul li a:hover:after {
  height: 5px;
}
#recruit #joboffer {
  margin-bottom: 120px;
}
#recruit #joboffer div.inner {
  width: 90%;
  max-width: 1100px;
  margin: auto;
  position: relative;
}
#recruit #joboffer div.inner ul {
  position: relative;
  padding: 70px 25px;
  margin: 0;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 30px 50px;
}
@media screen and (max-width: 950px) {
  #recruit #joboffer div.inner ul {
    padding: 5vw 2.5vw;
  }
}
@media screen and (max-width: 640px) {
  #recruit #joboffer div.inner ul {
    padding: 10vw 5vw;
    gap: 3vw;
  }
}
#recruit #joboffer div.inner ul::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 15px;
  padding: 5px;
  background: linear-gradient(45deg, #004896, #00a0e9);
  -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) content-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  z-index: -1;
}
#recruit #joboffer div.inner ul li {
  -ms-flex-preferred-size: 25%;
      flex-basis: 25%;
  text-align: center;
  border-radius: 500px;
}
@media screen and (max-width: 950px) {
  #recruit #joboffer div.inner ul li {
    -ms-flex-preferred-size: 40%;
        flex-basis: 40%;
  }
}
@media screen and (max-width: 640px) {
  #recruit #joboffer div.inner ul li {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
  }
}
#recruit #joboffer div.inner ul li span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 5px;
}
#recruit #joboffer div.inner ul li i {
  display: block;
  font-size: 12px;
  line-height: 1;
}
#recruit #joboffer div.inner ul li.fullstaff {
  padding: 10px;
  color: #b4b4b4;
  border: 3px solid #f0f0f0;
}
#recruit #joboffer div.inner ul li.active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#recruit #joboffer div.inner ul li a {
  position: relative;
  overflow: hidden;
  -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 10px;
  border-radius: 500px;
  border: 3px solid #00a0e9;
  font-weight: bold;
  -webkit-transition: color 240ms, background-color 240ms;
  transition: color 240ms, background-color 240ms;
}
#recruit #joboffer div.inner ul li a:hover {
  color: #fff;
  background-color: #00a0e9;
}
#recruit #message {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #recruit #message {
    margin-bottom: 60px;
  }
}
#recruit #message div.textbox p:not(:last-of-type) {
  margin-bottom: 1.5rem;
}
#recruit #flow {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #recruit #flow {
    margin-bottom: 60px;
  }
}
#recruit #flow div.flowbox div.flow {
  text-align: center;
}
#recruit #flow div.flowbox div.flow.step {
  position: relative;
  /* for pseudos */
  margin: 0;
  margin-bottom: 30px;
  border: 3px solid #f0f0f0;
  border-radius: 15px;
  padding: 20px 25px;
  -webkit-transition: border-color 480ms;
  transition: border-color 480ms;
}
@media screen and (max-width: 768px) {
  #recruit #flow div.flowbox div.flow.step {
    margin-bottom: 25px;
    border: 3px solid rgba(0, 160, 233, 0.3);
  }
}
#recruit #flow div.flowbox div.flow.step:before, #recruit #flow div.flowbox div.flow.step:after {
  content: "";
  position: absolute;
}
#recruit #flow div.flowbox div.flow.step:after {
  border: 3px solid #f0f0f0;
  border-radius: 0 50px 0 0;
  width: 30px;
  height: 30px;
  bottom: -30px;
  border-bottom: none;
  border-left: none;
  left: calc(50% - 15px);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 3;
  -webkit-transition: border-color 480ms;
  transition: border-color 480ms;
}
@media screen and (max-width: 768px) {
  #recruit #flow div.flowbox div.flow.step:after {
    width: 21px;
    height: 21px;
    bottom: -21px;
    left: calc(50% - 10px);
    border: 3px solid rgba(0, 160, 233, 0.3);
    border-bottom: none;
    border-left: none;
  }
}
#recruit #flow div.flowbox div.flow.step:before {
  width: 60px;
  border: 7px solid #fff;
  bottom: -8px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 2;
}
@media screen and (max-width: 768px) {
  #recruit #flow div.flowbox div.flow.step:before {
    width: 40px;
  }
}
#recruit #flow div.flowbox div.flow.step h3 {
  font-size: 2rem;
}
@media screen and (max-width: 768px) {
  #recruit #flow div.flowbox div.flow.step h3 {
    font-size: 1.8rem;
  }
}
#recruit #flow div.flowbox div.flow.step h3:before, #recruit #flow div.flowbox div.flow.step h3:after {
  content: "";
  position: absolute;
  z-index: 2;
  bottom: -40px;
}
@media screen and (max-width: 768px) {
  #recruit #flow div.flowbox div.flow.step h3:before, #recruit #flow div.flowbox div.flow.step h3:after {
    bottom: -35px;
  }
}
#recruit #flow div.flowbox div.flow.step h3:before {
  width: 45px;
  border-bottom: 10px solid #fff;
  left: calc(50% - 2px);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
#recruit #flow div.flowbox div.flow.step h3:after {
  width: 30px;
  height: 30px;
  border-right: 3px solid #f0f0f0;
  border-bottom: 3px solid #f0f0f0;
  left: calc(50% - 2px);
  -webkit-transform: translateX(-50%) rotate(45deg);
          transform: translateX(-50%) rotate(45deg);
  z-index: 3;
  -webkit-transition: border-color 480ms;
  transition: border-color 480ms;
}
@media screen and (max-width: 768px) {
  #recruit #flow div.flowbox div.flow.step h3:after {
    border-right: 3px solid rgba(0, 160, 233, 0.3);
    border-bottom: 3px solid rgba(0, 160, 233, 0.3);
  }
}
#recruit #flow div.flowbox div.flow.decision {
  position: relative;
  margin: 0;
  border: 3px solid #f0f0f0;
  border-radius: 15px;
  padding: 20px 25px;
  -webkit-transition: border-color 480ms;
  transition: border-color 480ms;
  font-size: 3rem;
}
@media screen and (max-width: 768px) {
  #recruit #flow div.flowbox div.flow.decision {
    font-size: 2.4rem;
    border: 3px solid rgba(0, 160, 233, 0.3);
  }
}
#recruit #flow div.flowbox div.flow span {
  font-size: 1.2rem;
}
#recruit #flow div.flowbox div.flow div.linkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#recruit #flow div.flowbox div.flow div.linkbox a {
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#recruit #flow div.flowbox div.flow div.linkbox a i.icon {
  font-size: 1.4rem;
  margin-right: 0.5rem;
}
#recruit #flow div.flowbox div.flow:hover {
  border: 3px solid #00a0e9;
}
#recruit #flow div.flowbox div.flow:hover.step:after {
  border: 3px solid #00a0e9;
  border-bottom: none;
  border-left: none;
}
#recruit #flow div.flowbox div.flow:hover.step h3:after {
  border-right: 3px solid #00a0e9;
  border-bottom: 3px solid #00a0e9;
}
#recruit #balance {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #recruit #balance {
    margin-bottom: 60px;
  }
}
#recruit #balance div.contentbox {
  line-height: initial;
}
#recruit #balance div.contentbox h3.title {
  font-size: 2.2rem;
  text-align: center;
  letter-spacing: 0;
  padding-bottom: 20px;
  border-bottom: 1px solid #e6e6e6;
}
#recruit #balance div.contentbox h3.title span {
  padding-bottom: 10px;
  position: relative;
}
#recruit #balance div.contentbox h3.title span:before {
  content: "";
  width: 100%;
  height: 2px;
  position: absolute;
  bottom: 0%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: #00a0e9;
  z-index: -1;
}
#recruit #balance div.contentbox h3.title:not(:first-of-type) {
  padding-top: 60px;
}
#recruit #balance div.contentbox div.content {
  border-bottom: 1px solid #e6e6e6;
}
#recruit #balance div.contentbox h4.title {
  cursor: pointer;
  font-size: 2rem;
  position: relative;
  padding: 20px 0;
  padding-right: 30px;
  -webkit-transition: color 240ms;
  transition: color 240ms;
  z-index: 99;
}
@media screen and (max-width: 768px) {
  #recruit #balance div.contentbox h4.title {
    font-size: 1.8rem;
  }
}
#recruit #balance div.contentbox h4.title:hover, #recruit #balance div.contentbox h4.title.active {
  color: #00a0e9;
}
#recruit #balance div.contentbox h4.title i.icon {
  font-size: 2rem;
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: font-size 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, top 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, right 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, -webkit-transform 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms;
  transition: font-size 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, top 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, right 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, -webkit-transform 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms;
  transition: transform 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, font-size 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, top 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, right 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms;
  transition: transform 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, font-size 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, top 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, right 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms, -webkit-transform 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 240ms;
  -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
  background: #fff;
  z-index: 5;
  border-radius: 50%;
}
#recruit #balance div.contentbox h4.title.active i.icon {
  font-size: 4rem;
  top: calc(100% - 1.5rem);
  right: -1.5rem;
  -webkit-transform: rotate(-225deg);
          transform: rotate(-225deg);
}
#recruit #balance div.contentbox div.peek-a-box {
  position: relative;
}
#recruit #balance div.contentbox div.peek-a-box .text {
  padding: 0 0 30px;
}
#recruit #balance div.contentbox div.peek-a-box .text .box {
  position: relative;
  /* for pseudos */
  margin: 0;
  border: solid 3px #00a0e9;
  border-radius: 15px;
  padding: 20px 25px;
}
#recruit #balance div.contentbox div.peek-a-box .text a {
  color: #00a0e9;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#recruit #balance div.contentbox div.peek-a-box .text a:hover {
  color: #004896;
}
#recruit #list {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #recruit #list {
    margin-bottom: 60px;
  }
}
#recruit #list h2.contentitle {
  margin-bottom: 70px;
}
#recruit #list div.item {
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #recruit #list div.item {
    margin-bottom: 30px;
  }
}
#recruit #list div.item a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#recruit #list div.item a div.imgbox {
  width: 45%;
  min-height: 200px;
  position: relative;
  background-position: 50% 50%;
  background-size: cover;
}
#recruit #list div.item a div.imgbox:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: 1px solid #00a0e9;
  z-index: 2;
  -webkit-transition: border 240ms;
  transition: border 240ms;
}
@media screen and (max-width: 768px) {
  #recruit #list div.item a div.imgbox {
    display: none;
  }
}
#recruit #list div.item a div.infobox {
  position: relative;
  width: calc(55% - 30px);
  border-bottom: 1px solid #e6e6e6;
  -webkit-transition: color 240ms;
  transition: color 240ms;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  #recruit #list div.item a div.infobox {
    width: 100%;
  }
}
#recruit #list div.item a div.infobox.noimage {
  width: 100%;
}
#recruit #list div.item a div.infobox:before {
  content: "";
  width: 0;
  height: 1px;
  position: absolute;
  bottom: -1px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background: #00a0e9;
  -webkit-transition: all 240ms;
  transition: all 240ms;
  z-index: 2;
}
#recruit #list div.item a div.infobox div.titlebox {
  color: #00a0e9;
  padding-left: 10px;
  position: relative;
  margin-bottom: 10px;
}
#recruit #list div.item a div.infobox div.titlebox:before {
  content: "";
  width: 3px;
  height: calc(100% - 0.5rem);
  position: absolute;
  top: 0;
  left: 0;
  background: #00a0e9;
  z-index: 2;
}
#recruit #list div.item a div.infobox div.titlebox p.status {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
#recruit #list div.item a div.infobox div.titlebox p.status span {
  font-size: 1.2rem;
  line-height: 1;
  padding: 4px 5px 3px;
  margin-bottom: 5px;
  border-radius: 5px;
  border: 1px solid #00a0e9;
}
#recruit #list div.item a div.infobox div.titlebox p.status span:not(:last-of-type) {
  margin-right: 5px;
}
#recruit #list div.item a div.infobox div.titlebox h3.title {
  font-size: 1.6rem;
}
#recruit #list div.item a div.infobox div.description {
  font-size: 1.4rem;
}
#recruit #list div.item a div.infobox p.more {
  width: 100%;
  font-size: 1.2rem;
  padding: 5px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: initial;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
#recruit #list div.item a div.infobox p.more i.icon {
  font-size: 1.3rem;
  color: #00a0e9;
}
#recruit #list div.item a:hover div.imgbox:before {
  border: 5px solid #00a0e9;
}
#recruit #list div.item a:hover div.infobox:before {
  width: 100%;
}
#recruit #list.archives {
  padding-top: 80px;
}

/*! RECRUIT::single
========================================================================== */
#recruit.single #imgbox {
  width: 100%;
  height: 400px;
  background-position: 50% 50%;
  background-size: cover;
  margin-top: 50px;
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  #recruit.single #imgbox {
    height: auto;
    padding-top: 56.25%;
    margin-bottom: 30px;
  }
}
#recruit.single #description {
  padding-top: 60px;
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #recruit.single #description {
    margin-bottom: 100px;
  }
}
#recruit.single #description div.titlebox {
  color: #00a0e9;
  padding-left: 10px;
  position: relative;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  #recruit.single #description div.titlebox {
    margin-bottom: 30px;
  }
}
#recruit.single #description div.titlebox:before {
  content: "";
  width: 3px;
  height: calc(100% - 0.5rem);
  position: absolute;
  top: 0;
  left: 0;
  background: #00a0e9;
  z-index: 2;
}
#recruit.single #description div.titlebox p.status {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
#recruit.single #description div.titlebox p.status span {
  font-size: 1.2rem;
  line-height: 1;
  padding: 4px 5px 3px;
  margin-bottom: 5px;
  border-radius: 5px;
  border: 1px solid #00a0e9;
}
#recruit.single #description div.titlebox p.status span:not(:last-of-type) {
  margin-right: 5px;
}
#recruit.single #description div.titlebox h1.title {
  font-size: 2.6rem;
  line-height: 1.4;
}
#recruit.single #description #main .textbox {
  margin-bottom: 50px;
}
#recruit.single #description .table {
  border-top: 1px dotted #b4b4b4;
  margin-bottom: 70px;
}
#recruit.single #description .table:last-of-type {
  margin-bottom: 100px;
}
#recruit.single #description .table .row {
  border-bottom: 1px dotted #b4b4b4;
  padding: 15px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  #recruit.single #description .table .row {
    padding: 2.5vw 0;
  }
}
#recruit.single #description .table .row:last-of-type {
  border-bottom: 1px dotted #b4b4b4;
}
#recruit.single #description .table .row .col.th {
  width: 190px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  #recruit.single #description .table .row .col.th {
    width: 100%;
    margin-bottom: 10px;
  }
}
#recruit.single #description .table .row .col.td {
  position: relative;
  width: calc(100% - 190px);
}
@media screen and (max-width: 768px) {
  #recruit.single #description .table .row .col.td {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  #recruit.single #description .table .row .col.td {
    padding-left: 20px;
  }
  #recruit.single #description .table .row .col.td:before {
    content: "";
    height: 100%;
    width: 3px;
    border-radius: 50px;
    background: #e6e6e6;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
#recruit.single #description .table .row .col.td a[target=_blank] {
  font-size: 1.2rem;
  letter-spacing: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #00a0e9;
}
#recruit.single #description .table .row .col.td a[target=_blank]:not(:first-of-type) {
  margin-left: 1.5rem;
}
#recruit.single #description .table .row .col.td a[target=_blank] i.icon {
  margin-left: 2px;
}

/*! CONTACT
========================================================================== */
#contact {
  /* contact::contactnavi
  ========================================================================== */
  /* contact::formbox
  ========================================================================== */
}
#contact #contactnavi {
  width: 75%;
  max-width: 550px;
  padding-top: 60px;
  margin: auto;
  margin-bottom: 60px;
  position: relative;
}
#contact #contactnavi::before {
  content: "";
  display: block;
  width: calc(100% - 20px);
  height: 1px;
  background: #D3F1FF;
  position: absolute;
  bottom: 10px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: -1;
}
#contact #contactnavi .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  #contact #contactnavi .box {
    margin-bottom: 30px;
  }
}
#contact #contactnavi .box .step {
  font-size: 1.4rem;
}
#contact #contactnavi .box .step p {
  margin-bottom: 10px;
}
#contact #contactnavi .box .step i.circle {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#contact #contactnavi .box .step i.circle:before, #contact #contactnavi .box .step i.circle:after {
  content: "";
  display: block;
  border-radius: 50px;
}
#contact #contactnavi .box .step i.circle:before {
  width: 10px;
  height: 10px;
  background: #00a0e9;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 2;
}
#contact #contactnavi .box .step i.circle:after {
  width: 22px;
  height: 22px;
  background: #fff;
  z-index: 1;
}
#contact .mw_wp_form_input .step.input i.circle:after {
  background: #D3F1FF !important;
}
#contact .mw_wp_form_confirm .step.confirm i.circle:after {
  background: #D3F1FF !important;
}
#contact .mw_wp_form_complete .step.complete i.circle:after {
  background: #D3F1FF !important;
}
#contact .mw_wp_form_confirm .zipbox .postcode, #contact .mw_wp_form_confirm .bl_contactCheckUnit, #contact .mw_wp_form_confirm .no-confirm {
  display: none;
}
#contact .mwwp_sendmessage, #contact .mwwp_sendmessage_text {
  width: 90%;
  max-width: 550px;
  margin: 0 auto 50px;
}
#contact #formbox {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  #contact #formbox {
    margin-bottom: 60px;
  }
}
#contact #formbox .mw-inner {
  margin-bottom: 30px;
}
#contact #formbox .mwtitlebox {
  font-weight: bold;
  font-size: 3.4rem;
  color: #00a0e9;
  padding: 40px 0;
  line-height: 1.4;
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
}
#contact #formbox .contact-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-bottom: 1px solid #cccccc;
  padding: 20px 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media screen and (max-width: 840px) {
  #contact #formbox .contact-row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 15px 0;
  }
}
#contact #formbox .contact-row .title {
  width: 250px;
  font-size: 1.6rem;
  font-weight: bold;
}
@media screen and (max-width: 840px) {
  #contact #formbox .contact-row .title {
    width: 100%;
    padding: 0 0 10px;
  }
}
#contact #formbox .contact-row .title p {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#contact #formbox .contact-row .title p.op_notice {
  width: 100%;
  font-size: 10px;
  padding-top: 5px;
}
@media screen and (max-width: 840px) {
  #contact #formbox .contact-row .title p {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
#contact #formbox .contact-row .content {
  width: calc(100% - 280px);
}
@media screen and (max-width: 840px) {
  #contact #formbox .contact-row .content {
    width: 100%;
  }
}
#contact #formbox .contact-row .content.zipbox input#zip {
  width: 200px;
}
#contact #formbox .contact-row .content.zipbox input:not(:last-of-type) {
  margin-bottom: 15px;
}
#contact #formbox .contact-row .content.zipbox span.postcode {
  color: #aaa;
}
#contact #formbox .contact-row .content.filebox p.caution1, #contact #formbox .contact-row .content.filebox p.caution2 {
  font-size: 1.2rem;
}
#contact #formbox .contact-row .content.filebox p.caution1 {
  color: #666;
}
#contact #formbox .contact-row .content.filebox p.caution2 {
  color: #aaa;
  margin-bottom: 15px;
}
#contact #formbox .contact-row .content input, #contact #formbox .contact-row .content textarea {
  width: 100%;
  font-size: 1.6rem;
  padding: 5px 15px;
  background: #F5F5F5;
  border: 1px solid #DEDEDE;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 0;
}
@media screen and (max-width: 840px) {
  #contact #formbox .contact-row .content input, #contact #formbox .contact-row .content textarea {
    padding: 10px 15px;
  }
}
#contact #formbox .contact-row .content input[type=radio], #contact #formbox .contact-row .content textarea[type=radio] {
  width: auto;
}
#contact #formbox .contact-row .content input[type=file], #contact #formbox .contact-row .content textarea[type=file] {
  background: #fff;
  border: none;
  width: 100%;
  font-size: 1.4rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 5px 0;
}
#contact #formbox .contact-row .required:before {
  content: "必須";
  font-size: 1.2rem;
  color: #fff;
  background: #E60012;
  display: inline-block;
  padding: 4px 4px 3px;
  line-height: 1;
  border-radius: 2px;
}
#contact #formbox .bl_contactCheckUnit {
  text-align: center;
  /* Hide Default Checkbox */
  /* Create a Box */
  /* Checked Style */
}
#contact #formbox .bl_contactCheckUnit h3 {
  font-size: 1.6rem;
}
#contact #formbox .bl_contactCheckUnit p.policy {
  margin-bottom: 30px;
}
#contact #formbox .bl_contactCheckUnit p.policy a[target=_blank] {
  letter-spacing: 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #00a0e9;
  text-decoration: underline;
}
#contact #formbox .bl_contactCheckUnit p.policy a[target=_blank] i.icon {
  padding-left: 10px;
}
#contact #formbox .bl_contactCheckUnit .mwform-checkbox-field {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#contact #formbox .bl_contactCheckUnit input[type=checkbox] {
  opacity: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  position: absolute;
}
#contact #formbox .bl_contactCheckUnit input[type=checkbox] + span::after {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#contact #formbox .bl_contactCheckUnit input[type=checkbox] + span:after {
  padding-top: 5px;
  font-size: 4rem;
  display: block;
  content: "\e90c";
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#contact #formbox .bl_contactCheckUnit input[type=checkbox] + span:hover:after {
  color: #00a0e9;
}
#contact #formbox .bl_contactCheckUnit input[type=checkbox]:checked + span:after {
  content: "\e90d";
  color: #00a0e9;
}
#contact #formbox .submitbox {
  margin-top: 60px;
  text-align: center;
}
#contact #formbox .submitbox input {
  cursor: pointer;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.4rem;
  letter-spacing: 0;
  color: #fff;
  -webkit-transition: color 480ms;
  transition: color 480ms;
  padding: 15px 50px;
  background: -webkit-gradient(linear, right top, left top, from(#00a0e9), color-stop(50%, #004896), to(#004896));
  background: linear-gradient(to left, #00a0e9, #004896 50%, #004896);
  border-radius: 50px;
  background-size: 200%;
  background-position: 100% 0;
  -webkit-transition: background-position 480ms, padding 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 480ms;
  transition: background-position 480ms, padding 360ms cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 480ms;
  border: none;
  margin: auto;
}
#contact #formbox .submitbox input:hover {
  background-position: 0% 0;
  padding: 15px 80px;
}
#contact #formbox .submitbox input[disabled] {
  opacity: 0.3;
  pointer-events: none;
}
#contact #formbox .submitbox button.back {
  margin-top: 3vh;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.4rem;
  letter-spacing: 0;
  padding: 10px 40px;
  border-radius: 50px;
  border: none;
  -webkit-transition: all 480ms;
  transition: all 480ms;
  cursor: pointer;
}
#contact #formbox .submitbox button.back:hover {
  background: #4a4a4a;
  color: #fff;
}
#contact #formbox .mw_wp_form .error {
  font-size: 1.2rem;
  color: #B70000;
  display: block;
}
#contact #formbox .mw_wp_form .error + input, #contact #formbox .mw_wp_form .error + textarea, #contact #formbox .mw_wp_form .error ~ span label {
  background: #f2c4c4 !important;
}
#contact #formbox .mw_wp_form .error ~ span label {
  padding: 5px;
}

#autozip {
  background: #E60012 !important;
  border-radius: 0 !important;
}
#autozip #zip_close {
  margin-left: 1rem;
}
#autozip #zip_close a {
  color: #fff;
}
#autozip #zip_footer {
  display: none;
}

.mwform-file-delete {
  display: none;
}

/* Index::games
========================================================================== */
#games {
  padding-top: 60px;
}

#comingsoon,
#games.indiegames {
  padding-top: 60px;
}
#comingsoon h2,
#games.indiegames h2 {
  font-size: clamp(3rem, 3rem + (1vw - 0.64rem) * 2.7778, 4rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 20px;
  letter-spacing: 0;
}
#comingsoon h2::before, #comingsoon h2::after,
#games.indiegames h2::before,
#games.indiegames h2::after {
  content: "";
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background-color: #00a0e9;
  display: block;
  height: 2px;
}
#comingsoon h2 span,
#games.indiegames h2 span {
  padding: 0 10px;
}

#comingsoon div.contents a.item,
#games div.contents a.item {
  aspect-ratio: 1/1;
}
#comingsoon div.contents a.item:before,
#games div.contents a.item:before {
  aspect-ratio: 1/1;
}
#comingsoon div.contents a.item:after,
#games div.contents a.item:after {
  top: 25%;
}

#comingsoon div.contents a.item,
#indiegames div.contents a.item {
  pointer-events: none;
  aspect-ratio: 540/360;
}
#comingsoon div.contents a.item:before,
#indiegames div.contents a.item:before {
  aspect-ratio: 540/360;
}
#comingsoon div.contents a.item:after,
#indiegames div.contents a.item:after {
  top: 15%;
}

#comingsoon,
#games,
#indiegames {
  margin-bottom: 90px;
}
#comingsoon .contentitle.indies,
#games .contentitle.indies,
#indiegames .contentitle.indies {
  margin-top: 70px;
}
#comingsoon div.contents,
#games div.contents,
#indiegames div.contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /* Index::トップ一覧
  ========================================================================== */
  /* Index::アーカイブ
  ========================================================================== */
}
#comingsoon div.contents a.item,
#games div.contents a.item,
#indiegames div.contents a.item {
  width: calc((100% - 90px) / 4);
  background: #ededed;
  border-radius: 5px;
  background-position: 50% 50%;
  background-size: cover;
  position: relative;
  overflow: hidden;
  margin-bottom: 30px;
}
@media screen and (max-width: 1000px) {
  #comingsoon div.contents a.item,
  #games div.contents a.item,
  #indiegames div.contents a.item {
    width: calc((100% - 55px) / 3);
  }
}
@media screen and (max-width: 768px) {
  #comingsoon div.contents a.item,
  #games div.contents a.item,
  #indiegames div.contents a.item {
    width: calc((100% - 20px) / 2);
  }
}
@media screen and (max-width: 480px) {
  #comingsoon div.contents a.item,
  #games div.contents a.item,
  #indiegames div.contents a.item {
    width: 100%;
  }
}
#comingsoon div.contents a.item:before, #comingsoon div.contents a.item:after,
#games div.contents a.item:before,
#games div.contents a.item:after,
#indiegames div.contents a.item:before,
#indiegames div.contents a.item:after {
  content: "";
  display: block;
  opacity: 0;
}
#comingsoon div.contents a.item:before,
#games div.contents a.item:before,
#indiegames div.contents a.item:before {
  background: rgba(0, 0, 0, 0.4);
  -webkit-transition: opacity 240ms;
  transition: opacity 240ms;
}
#comingsoon div.contents a.item:after,
#games div.contents a.item:after,
#indiegames div.contents a.item:after {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  padding: 1rem;
  z-index: 10;
  color: #fff;
  font-size: 3rem;
  border: 2px solid #fff;
  border-radius: 50px;
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition: opacity 480ms;
  transition: opacity 480ms;
}
#comingsoon div.contents a.item:after,
#games div.contents a.item:after,
#indiegames div.contents a.item:after {
  content: "\e90a";
}
#comingsoon div.contents a.item[target=_blank]:after,
#games div.contents a.item[target=_blank]:after,
#indiegames div.contents a.item[target=_blank]:after {
  content: "\e909";
}
#comingsoon div.contents a.item div.textbox,
#games div.contents a.item div.textbox,
#indiegames div.contents a.item div.textbox {
  background: rgba(255, 255, 255, 0.8);
  padding: 10px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  z-index: 5;
}
#comingsoon div.contents a.item div.textbox div.titlebox,
#games div.contents a.item div.textbox div.titlebox,
#indiegames div.contents a.item div.textbox div.titlebox {
  padding-left: 15px;
  position: relative;
  -webkit-transition: margin 240ms;
  transition: margin 240ms;
}
#comingsoon div.contents a.item div.textbox div.titlebox:before,
#games div.contents a.item div.textbox div.titlebox:before,
#indiegames div.contents a.item div.textbox div.titlebox:before {
  background: #00a0e9;
  content: "";
  display: block;
  width: 5px;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
#comingsoon div.contents a.item div.textbox div.titlebox p.genre,
#games div.contents a.item div.textbox div.titlebox p.genre,
#indiegames div.contents a.item div.textbox div.titlebox p.genre {
  font-size: 1.2rem;
  color: #00a0e9;
  letter-spacing: 0;
  line-height: 1;
  margin-bottom: 3px;
}
#comingsoon div.contents a.item div.textbox div.titlebox h3.title,
#games div.contents a.item div.textbox div.titlebox h3.title,
#indiegames div.contents a.item div.textbox div.titlebox h3.title {
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: 1.4;
  font-weight: bold;
}
#comingsoon div.contents a.item div.textbox div.links, #comingsoon div.contents a.item div.textbox p.links,
#games div.contents a.item div.textbox div.links,
#games div.contents a.item div.textbox p.links,
#indiegames div.contents a.item div.textbox div.links,
#indiegames div.contents a.item div.textbox p.links {
  text-align: right;
  font-size: 1.2rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  letter-spacing: 0;
  position: absolute;
  bottom: 10px;
  right: 15px;
  opacity: 0;
  -webkit-transform: translateX(-10px);
          transform: translateX(-10px);
  -webkit-transition: all 240ms;
  transition: all 240ms;
}
#comingsoon div.contents a.item div.textbox div.links i.icon, #comingsoon div.contents a.item div.textbox p.links i.icon,
#games div.contents a.item div.textbox div.links i.icon,
#games div.contents a.item div.textbox p.links i.icon,
#indiegames div.contents a.item div.textbox div.links i.icon,
#indiegames div.contents a.item div.textbox p.links i.icon {
  font-size: 1.1rem;
  color: #00a0e9;
  padding-left: 2px;
}
#comingsoon div.contents a.item:hover:before, #comingsoon div.contents a.item:hover:after,
#games div.contents a.item:hover:before,
#games div.contents a.item:hover:after,
#indiegames div.contents a.item:hover:before,
#indiegames div.contents a.item:hover:after {
  opacity: 1;
}
#comingsoon div.contents a.item:hover div.textbox div.titlebox,
#games div.contents a.item:hover div.textbox div.titlebox,
#indiegames div.contents a.item:hover div.textbox div.titlebox {
  margin-bottom: 20px;
}
#comingsoon div.contents a.item:hover div.textbox div.links, #comingsoon div.contents a.item:hover div.textbox p.links,
#games div.contents a.item:hover div.textbox div.links,
#games div.contents a.item:hover div.textbox p.links,
#indiegames div.contents a.item:hover div.textbox div.links,
#indiegames div.contents a.item:hover div.textbox p.links {
  opacity: 1;
  -webkit-transition-delay: 120ms;
          transition-delay: 120ms;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
#comingsoon div.contents div.item,
#games div.contents div.item,
#indiegames div.contents div.item {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#comingsoon div.contents div.item:not(:last-of-type),
#games div.contents div.item:not(:last-of-type),
#indiegames div.contents div.item:not(:last-of-type) {
  margin-bottom: 80px;
}
@media screen and (max-width: 1000px) {
  #comingsoon div.contents div.item,
  #games div.contents div.item,
  #indiegames div.contents div.item {
    width: calc(50% - 25px);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media screen and (max-width: 640px) {
  #comingsoon div.contents div.item,
  #games div.contents div.item,
  #indiegames div.contents div.item {
    width: 100%;
  }
}
#comingsoon div.contents div.item div.imgbox,
#games div.contents div.item div.imgbox,
#indiegames div.contents div.item div.imgbox {
  max-width: 440px;
  margin-right: 20px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
@media screen and (max-width: 1000px) {
  #comingsoon div.contents div.item div.imgbox,
  #games div.contents div.item div.imgbox,
  #indiegames div.contents div.item div.imgbox {
    margin-right: 0;
  }
}
@media screen and (max-width: 640px) {
  #comingsoon div.contents div.item div.imgbox,
  #games div.contents div.item div.imgbox,
  #indiegames div.contents div.item div.imgbox {
    width: 100%;
    max-width: inherit;
  }
}
#comingsoon div.contents div.item div.imgbox img,
#games div.contents div.item div.imgbox img,
#indiegames div.contents div.item div.imgbox img {
  width: 100%;
  height: auto;
}
#comingsoon div.contents div.item div.imgbox a,
#games div.contents div.item div.imgbox a,
#indiegames div.contents div.item div.imgbox a {
  display: block;
  position: relative;
}
#comingsoon div.contents div.item div.imgbox a:before, #comingsoon div.contents div.item div.imgbox a:after,
#games div.contents div.item div.imgbox a:before,
#games div.contents div.item div.imgbox a:after,
#indiegames div.contents div.item div.imgbox a:before,
#indiegames div.contents div.item div.imgbox a:after {
  content: "";
  display: block;
  opacity: 0;
  position: absolute;
}
#comingsoon div.contents div.item div.imgbox a:before,
#games div.contents div.item div.imgbox a:before,
#indiegames div.contents div.item div.imgbox a:before {
  width: 100%;
  height: 100%;
  display: block;
  background: rgba(0, 0, 0, 0.4);
  -webkit-transition: opacity 240ms;
  transition: opacity 240ms;
  top: 0;
  left: 0;
}
#comingsoon div.contents div.item div.imgbox a:after,
#games div.contents div.item div.imgbox a:after,
#indiegames div.contents div.item div.imgbox a:after {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 1rem;
  z-index: 10;
  color: #fff;
  font-size: 3rem;
  border: 2px solid #fff;
  border-radius: 50px;
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition: opacity 480ms;
  transition: opacity 480ms;
}
#comingsoon div.contents div.item div.imgbox a:after,
#games div.contents div.item div.imgbox a:after,
#indiegames div.contents div.item div.imgbox a:after {
  content: "\e90a";
}
#comingsoon div.contents div.item div.imgbox a[target=_blank]:after,
#games div.contents div.item div.imgbox a[target=_blank]:after,
#indiegames div.contents div.item div.imgbox a[target=_blank]:after {
  content: "\e909";
}
#comingsoon div.contents div.item div.imgbox a:hover:before, #comingsoon div.contents div.item div.imgbox a:hover:after,
#games div.contents div.item div.imgbox a:hover:before,
#games div.contents div.item div.imgbox a:hover:after,
#indiegames div.contents div.item div.imgbox a:hover:before,
#indiegames div.contents div.item div.imgbox a:hover:after {
  opacity: 1;
}
#comingsoon div.contents div.item p.genre,
#games div.contents div.item p.genre,
#indiegames div.contents div.item p.genre {
  font-size: 1.6rem;
  color: #00a0e9;
  letter-spacing: 0;
  line-height: 1;
  margin-bottom: 3px;
}
#comingsoon div.contents div.item h3.title,
#games div.contents div.item h3.title,
#indiegames div.contents div.item h3.title {
  font-size: 3rem;
  letter-spacing: 0;
  line-height: 1.4;
  font-weight: bold;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  #comingsoon div.contents div.item h3.title,
  #games div.contents div.item h3.title,
  #indiegames div.contents div.item h3.title {
    font-size: 2.2rem;
  }
}
#comingsoon div.contents div.item div.textbox,
#games div.contents div.item div.textbox,
#indiegames div.contents div.item div.textbox {
  position: relative;
  padding-left: 20px;
}
@media screen and (max-width: 1000px) {
  #comingsoon div.contents div.item div.textbox,
  #games div.contents div.item div.textbox,
  #indiegames div.contents div.item div.textbox {
    padding-top: 20px;
    padding-left: 0;
  }
}
#comingsoon div.contents div.item div.textbox:before,
#games div.contents div.item div.textbox:before,
#indiegames div.contents div.item div.textbox:before {
  background: #00a0e9;
  content: "";
  display: block;
  width: 5px;
  height: calc(100% - 4px);
  position: absolute;
  top: 0;
  left: 0;
}
@media screen and (max-width: 1000px) {
  #comingsoon div.contents div.item div.textbox:before,
  #games div.contents div.item div.textbox:before,
  #indiegames div.contents div.item div.textbox:before {
    content: none;
  }
}
#comingsoon div.contents div.item div.textbox .infobox p,
#games div.contents div.item div.textbox .infobox p,
#indiegames div.contents div.item div.textbox .infobox p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  position: relative;
}
#comingsoon div.contents div.item div.textbox .infobox div.links::before, #comingsoon div.contents div.item div.textbox .infobox p:before, #comingsoon div.contents div.item div.textbox .infobox div.environment_long::before, #comingsoon div.contents div.item div.textbox .infobox div.platform::before,
#games div.contents div.item div.textbox .infobox div.links::before,
#games div.contents div.item div.textbox .infobox p:before,
#games div.contents div.item div.textbox .infobox div.environment_long::before,
#games div.contents div.item div.textbox .infobox div.platform::before,
#indiegames div.contents div.item div.textbox .infobox div.links::before,
#indiegames div.contents div.item div.textbox .infobox p:before,
#indiegames div.contents div.item div.textbox .infobox div.environment_long::before,
#indiegames div.contents div.item div.textbox .infobox div.platform::before {
  display: block;
  content: attr(data-name) "";
  width: 180px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  #comingsoon div.contents div.item div.textbox .infobox div.links::before, #comingsoon div.contents div.item div.textbox .infobox p:before, #comingsoon div.contents div.item div.textbox .infobox div.environment_long::before, #comingsoon div.contents div.item div.textbox .infobox div.platform::before,
  #games div.contents div.item div.textbox .infobox div.links::before,
  #games div.contents div.item div.textbox .infobox p:before,
  #games div.contents div.item div.textbox .infobox div.environment_long::before,
  #games div.contents div.item div.textbox .infobox div.platform::before,
  #indiegames div.contents div.item div.textbox .infobox div.links::before,
  #indiegames div.contents div.item div.textbox .infobox p:before,
  #indiegames div.contents div.item div.textbox .infobox div.environment_long::before,
  #indiegames div.contents div.item div.textbox .infobox div.platform::before {
    width: 120px;
  }
}
#comingsoon div.contents div.item div.textbox .infobox div.links div.link, #comingsoon div.contents div.item div.textbox .infobox p span,
#games div.contents div.item div.textbox .infobox div.links div.link,
#games div.contents div.item div.textbox .infobox p span,
#indiegames div.contents div.item div.textbox .infobox div.links div.link,
#indiegames div.contents div.item div.textbox .infobox p span {
  width: calc(100% - 180px);
}
@media screen and (max-width: 768px) {
  #comingsoon div.contents div.item div.textbox .infobox div.links div.link, #comingsoon div.contents div.item div.textbox .infobox p span,
  #games div.contents div.item div.textbox .infobox div.links div.link,
  #games div.contents div.item div.textbox .infobox p span,
  #indiegames div.contents div.item div.textbox .infobox div.links div.link,
  #indiegames div.contents div.item div.textbox .infobox p span {
    width: calc(100% - 120px);
  }
}
#comingsoon div.contents div.item div.textbox .infobox div.links,
#games div.contents div.item div.textbox .infobox div.links,
#indiegames div.contents div.item div.textbox .infobox div.links {
  margin: 0.5em 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#comingsoon div.contents div.item div.textbox .infobox div.links div.link,
#games div.contents div.item div.textbox .infobox div.links div.link,
#indiegames div.contents div.item div.textbox .infobox div.links div.link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px 0;
}
#comingsoon div.contents div.item div.textbox .infobox div.links div.link a i.share,
#games div.contents div.item div.textbox .infobox div.links div.link a i.share,
#indiegames div.contents div.item div.textbox .infobox div.links div.link a i.share {
  margin-left: 0.5rem;
}
#comingsoon div.contents div.item div.textbox .infobox p.links a,
#games div.contents div.item div.textbox .infobox p.links a,
#indiegames div.contents div.item div.textbox .infobox p.links a {
  text-decoration: underline;
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long,
#games div.contents div.item div.textbox .infobox div.environment_long,
#indiegames div.contents div.item div.textbox .infobox div.environment_long {
  -webkit-perspective: 1000;
          perspective: 1000;
  padding: 0;
  margin: 0 0 0.5em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long div.inner,
#games div.contents div.item div.textbox .infobox div.environment_long div.inner,
#indiegames div.contents div.item div.textbox .infobox div.environment_long div.inner {
  width: calc(100% - 180px);
}
@media screen and (max-width: 768px) {
  #comingsoon div.contents div.item div.textbox .infobox div.environment_long div.inner,
  #games div.contents div.item div.textbox .infobox div.environment_long div.inner,
  #indiegames div.contents div.item div.textbox .infobox div.environment_long div.inner {
    width: calc(100% - 120px);
  }
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long h4,
#games div.contents div.item div.textbox .infobox div.environment_long h4,
#indiegames div.contents div.item div.textbox .infobox div.environment_long h4 {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-weight: normal;
  margin: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: color 480ms;
  transition: color 480ms;
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long h4 i.icon,
#games div.contents div.item div.textbox .infobox div.environment_long h4 i.icon,
#indiegames div.contents div.item div.textbox .infobox div.environment_long h4 i.icon {
  margin-left: 1rem;
  font-size: 120%;
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long div.peekaboo,
#games div.contents div.item div.textbox .infobox div.environment_long div.peekaboo,
#indiegames div.contents div.item div.textbox .infobox div.environment_long div.peekaboo {
  position: relative;
  overflow: hidden;
  max-height: 800px;
  margin: 1em 0;
  opacity: 1;
  -webkit-transform: translate(0, 0);
          transform: translate(0, 0);
  z-index: 2;
  -webkit-transition: all 480ms ease-in-out;
  transition: all 480ms ease-in-out;
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long div.peekaboo div.inner,
#games div.contents div.item div.textbox .infobox div.environment_long div.peekaboo div.inner,
#indiegames div.contents div.item div.textbox .infobox div.environment_long div.peekaboo div.inner {
  background: #ccc;
  padding: 15px;
  margin-bottom: 15px;
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox],
#games div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox],
#indiegames div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox] {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ h4.question,
#games div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ h4.question,
#indiegames div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ h4.question {
  color: #bf9976;
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ h4.question svg,
#games div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ h4.question svg,
#indiegames div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ h4.question svg {
  fill: #e5dabd;
  -webkit-transform: translateY(-50%) rotate(0deg);
          transform: translateY(-50%) rotate(0deg);
}
#comingsoon div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ div.peekaboo,
#games div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ div.peekaboo,
#indiegames div.contents div.item div.textbox .infobox div.environment_long input[type=checkbox]:checked ~ div.peekaboo {
  margin-top: 0;
  margin-bottom: 0;
  max-height: 0;
  opacity: 0;
  -webkit-transform: translate(0, 10%);
          transform: translate(0, 10%);
}
#comingsoon div.contents div.item div.textbox .infobox div.platform,
#games div.contents div.item div.textbox .infobox div.platform,
#indiegames div.contents div.item div.textbox .infobox div.platform {
  -webkit-perspective: 1000;
          perspective: 1000;
  padding: 0;
  margin: 0.5em 0 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#comingsoon div.contents div.item div.textbox .infobox div.platform span i:not(:first-of-type)::before,
#games div.contents div.item div.textbox .infobox div.platform span i:not(:first-of-type)::before,
#indiegames div.contents div.item div.textbox .infobox div.platform span i:not(:first-of-type)::before {
  content: " / ";
}
#comingsoon div.contents div.item div.textbox .snsbox,
#games div.contents div.item div.textbox .snsbox,
#indiegames div.contents div.item div.textbox .snsbox {
  line-height: 1;
  font-size: 4rem;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}

body.archive #games .post-type-archive-games div.contents {
  padding-top: 60px;
}

/* Single::game
========================================================================== */
#game {
  margin-bottom: 120px;
  padding-top: 60px;
}
@media screen and (max-width: 840px) {
  #game {
    margin-bottom: 60px;
  }
}
#game div.titlebox {
  width: 100%;
  margin-bottom: 30px;
}
#game div.titlebox h1.gametitle {
  font-size: 3.6rem;
  line-height: 1.4;
}
#game div.contwrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
#game div.contwrap div.mainbox {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: relative;
  margin-bottom: 50px;
}
#game div.contwrap div.mainbox div.slidebox {
  width: calc(100% - (260px + 40px));
}
@media screen and (max-width: 840px) {
  #game div.contwrap div.mainbox div.slidebox {
    width: 100%;
    margin-bottom: 30px;
  }
}
#game div.contwrap div.mainbox div.slidebox #slidcol .slick-slide {
  margin: 0 10px;
}
#game div.contwrap div.mainbox div.slidebox .playerbox {
  position: relative;
  padding-top: 56.25%;
}
#game div.contwrap div.mainbox div.slidebox .playerbox .player {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#game div.contwrap div.mainbox div.slidebox .playerbox .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#game div.contwrap div.mainbox div.sidebox {
  width: 260px;
  text-align: right;
  top: 0;
  right: 0;
}
@media screen and (min-width: 840px) {
  #game div.contwrap div.mainbox div.sidebox {
    position: absolute !important;
  }
}
@media screen and (max-width: 840px) {
  #game div.contwrap div.mainbox div.sidebox {
    position: relative;
    margin: auto;
    width: 380px;
  }
}
#game div.contwrap div.mainbox div.sidebox .sideinner {
  padding: 10px 0 10px;
  -webkit-transition: margin 480ms, padding 480ms;
  transition: margin 480ms, padding 480ms;
}
#game div.contwrap div.mainbox div.sidebox.is-affixed .sideinner {
  margin-top: 0 !important;
  padding: 30px 0 10px;
}
#game div.contwrap div.mainbox div.sidebox h2.peek-a-title {
  font-size: 2.4rem;
  line-height: 1.4;
  margin-bottom: 30px;
  opacity: 0;
  -webkit-transition: opacity 480ms;
  transition: opacity 480ms;
}
@media screen and (max-width: 840px) {
  #game div.contwrap div.mainbox div.sidebox h2.peek-a-title {
    display: none;
  }
}
#game div.contwrap div.mainbox div.sidebox h2.peek-a-title span {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(80%, transparent), color-stop(80%, rgba(0, 160, 233, 0.5)));
  background: linear-gradient(transparent 80%, rgba(0, 160, 233, 0.5) 80%);
}
#game div.contwrap div.mainbox div.sidebox.is-affixed h2.peek-a-title {
  opacity: 1;
}
#game div.contwrap div.mainbox div.sidebox h3.price {
  font-size: 2.2rem;
  line-height: 1.3;
  margin-bottom: 20px;
}
#game div.contwrap div.mainbox div.sidebox h3.price:before {
  font-size: 1.6rem;
  content: attr(data-name) "";
  font-weight: bold;
}
#game div.contwrap div.mainbox div.sidebox h3.price span.in-app {
  display: block;
  font-size: 1.6rem;
}
#game div.contwrap div.mainbox div.sidebox h3.price div.opt {
  font-size: 1.4rem;
}
#game div.contwrap div.mainbox div.sidebox h3.price div.inline {
  display: inline-block;
}
#game div.contwrap div.mainbox div.sidebox div.appslink {
  margin-bottom: 20px;
}
@media screen and (max-width: 840px) {
  #game div.contwrap div.mainbox div.sidebox div.appslink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
#game div.contwrap div.mainbox div.sidebox p.links {
  line-height: 1;
}
#game div.contwrap div.mainbox div.sidebox p.links a {
  display: inline-block;
  vertical-align: bottom;
}
#game div.contwrap div.mainbox div.sidebox p.links a img {
  vertical-align: bottom;
}
#game div.contwrap div.mainbox div.sidebox p.links:nth-child(2) {
  margin-top: 10px;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-negative: 1;
      flex-shrink: 1;
}
@media screen and (max-width: 840px) {
  #game div.contwrap div.mainbox div.sidebox p.links:nth-child(2) {
    margin-top: 0;
    margin-left: 15px;
  }
}
#game div.contwrap div.mainbox div.sidebox p.links.apple img {
  width: 163px;
}
#game div.contwrap div.mainbox div.sidebox p.links.google img {
  width: 201px;
}
#game div.contwrap div.mainbox div.sidebox div.snsbox {
  line-height: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media screen and (max-width: 840px) {
  #game div.contwrap div.mainbox div.sidebox div.snsbox {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
#game div.contwrap div.mainbox div.sidebox div.snsbox a {
  line-height: 1;
  font-size: 3rem;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#game div.contwrap div.mainbox div.sidebox div.snsbox a:not(:first-of-type) {
  margin-left: 5px;
}
#game div.contwrap div.textbox {
  width: calc(100% - (260px + 40px));
}
@media screen and (max-width: 840px) {
  #game div.contwrap div.textbox {
    width: 100%;
  }
}
#game div.contwrap div.textbox h3, #game div.contwrap div.textbox h4, #game div.contwrap div.textbox h5 {
  margin-bottom: 1rem;
}
#game div.contwrap div.textbox p:not(:last-of-type) {
  margin-bottom: 2rem;
}
#game div.contwrap .singleinfobox {
  border-top: 1px solid #ccc;
  margin-top: 50px;
}
#game div.contwrap .singleinfobox p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  position: relative;
  margin-bottom: 0 !important;
  border-bottom: 1px solid #ccc;
  padding: 8px 15px;
}
#game div.contwrap .singleinfobox div.links::before, #game div.contwrap .singleinfobox p:before {
  display: block;
  content: attr(data-name) "";
  width: 150px;
  font-weight: bold;
}
@media screen and (max-width: 640px) {
  #game div.contwrap .singleinfobox div.links::before, #game div.contwrap .singleinfobox p:before {
    width: 80px;
  }
}
#game div.contwrap .singleinfobox p span {
  width: calc(100% - 150px);
}
@media screen and (max-width: 640px) {
  #game div.contwrap .singleinfobox p span {
    width: calc(100% - 80px);
  }
}
#game div.contwrap .singleinfobox p.links a {
  text-decoration: underline;
}

.items {
  position: relative;
  width: 100%;
}
.items img {
  width: 100%;
}

.player-box {
  position: relative;
  padding-top: 56.25%;
}
.player-box .player {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.player-box .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.snsbox {
  margin-top: 15px;
}
.snsbox a i.sns-twitter {
  color: #000;
}
.snsbox a i.sns-facebook {
  color: #4267b2;
}
.snsbox a i.sns-instagram {
  color: #c13584;
}
.snsbox a i.sns-line {
  color: #00b900;
}
.snsbox a i.sns-youtube {
  color: #ff0000;
}
.snsbox a i.sns-tiktok {
  color: #000000;
}

/* Page::PRIVACY POLICY
========================================================================== */
main.privacy-policy #contents {
  padding-top: 60px;
  margin-bottom: 120px;
}
main.privacy-policy #contents .inner {
  padding: 3%;
  z-index: 5;
  position: relative;
}
@media screen and (max-width: 768px) {
  main.privacy-policy #contents .inner {
    padding: 5%;
  }
}
main.privacy-policy #contents .inner .content:not(:last-of-type) {
  margin-bottom: 4rem;
}
main.privacy-policy #contents .inner .content ol {
  padding: 1rem 0;
  padding-left: 3rem;
  margin: 0;
}
main.privacy-policy #contents .inner .content h2, main.privacy-policy #contents .inner .content h3 {
  font-size: 1.6rem;
  margin-bottom: 1rem;
}
@media screen and (max-width: 480px) {
  main.privacy-policy #contents .inner .content h2, main.privacy-policy #contents .inner .content h3 {
    font-size: 4.4666666667vw;
  }
}
main.privacy-policy #contents .inner .content a {
  color: #00a0e9;
}
main.privacy-policy #contents .inner .content a:hover {
  color: #004896;
}

/*! about
========================================================================== */
body.company_en {
  /* about::field
  ========================================================================== */
  /* about::business
  ========================================================================== */
  /* company::overview
  ========================================================================== */
  /* company::オフィス
  ========================================================================== */
}
body.company_en #contents {
  padding-top: 60px;
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.company_en #contents {
    margin-bottom: 60px;
  }
}
body.company_en #contents div.inner {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.company_en #contents div.inner {
    margin-bottom: 60px;
  }
}
body.company_en #contents div.inner:last-of-type {
  margin-bottom: 0;
}
body.company_en #contents div.textbox {
  margin-bottom: 30px;
}
body.company_en #contents div.textbox p:not(:last-of-type) {
  margin-bottom: 1.5rem;
}
body.company_en #contents div.imgbox img {
  width: 100%;
  height: auto;
}
body.company_en #business {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.company_en #business {
    margin-bottom: 60px;
  }
}
body.company_en #business div.inner {
  margin-bottom: 60px;
}
@media screen and (max-width: 768px) {
  body.company_en #business div.inner {
    margin-bottom: 30px;
  }
}
body.company_en #business div#area div.item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  body.company_en #business div#area div.item:not(:last-of-type) {
    margin-bottom: 50px;
  }
}
body.company_en #business div#area div.item div.imgbox {
  width: 45.45%;
  overflow: hidden;
  background-position: 50% 50%;
  background-size: cover;
}
@media screen and (min-width: 1150px) {
  body.company_en #business div#area div.item div.imgbox {
    height: 350px;
  }
}
@media screen and (max-width: 1150px) {
  body.company_en #business div#area div.item div.imgbox {
    height: 250px;
  }
}
@media screen and (max-width: 768px) {
  body.company_en #business div#area div.item div.imgbox {
    width: 100%;
    padding-top: 56.25%;
  }
}
body.company_en #business div#area div.item div.text {
  width: 54.55%;
}
@media screen and (max-width: 768px) {
  body.company_en #business div#area div.item div.text {
    width: 90%;
    margin: -100px auto 0;
    background: #fff;
  }
}
body.company_en #business div#area div.item div.text div.titlebox {
  padding-left: 15px;
  position: relative;
  -webkit-transition: margin 240ms;
  transition: margin 240ms;
  margin-bottom: 2rem;
}
body.company_en #business div#area div.item div.text div.titlebox:before {
  background: #00a0e9;
  content: "";
  display: block;
  width: 5px;
  height: calc(100% - 4px);
  position: absolute;
  bottom: 0;
  left: 0;
}
body.company_en #business div#area div.item div.text div.titlebox p.eng {
  font-size: 1.2rem;
  font-weight: bold;
  color: #00a0e9;
  letter-spacing: 0;
  line-height: 1;
  margin-bottom: 3px;
}
body.company_en #business div#area div.item div.text div.titlebox h3.title {
  font-size: 2rem;
  line-height: 1.4;
  font-weight: bold;
}
body.company_en #business div#area div.item:nth-child(odd) div.text {
  padding-left: 30px;
  padding-right: calc((100% - 1100px) / 2);
}
@media screen and (max-width: 1160px) {
  body.company_en #business div#area div.item:nth-child(odd) div.text {
    padding-right: 30px;
  }
}
@media screen and (max-width: 950px) {
  body.company_en #business div#area div.item:nth-child(odd) div.text {
    padding-left: 30px;
    padding-right: 2.5%;
  }
}
body.company_en #business div#area div.item:nth-child(even) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
body.company_en #business div#area div.item:nth-child(even) div.text {
  padding-right: 30px;
  padding-left: calc((100% - 1100px) / 2);
}
@media screen and (max-width: 1160px) {
  body.company_en #business div#area div.item:nth-child(even) div.text {
    padding-left: 30px;
  }
}
@media screen and (max-width: 950px) {
  body.company_en #business div#area div.item:nth-child(even) div.text {
    padding-right: 2.5%;
    padding-left: 2.5%;
  }
}
@media screen and (max-width: 768px) {
  body.company_en #business div#area div.item:nth-child(odd) div.text, body.company_en #business div#area div.item:nth-child(even) div.text {
    padding: 2.5%;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  }
}
body.company_en #overview h2.title {
  width: 80%;
  max-width: 320px;
  margin: auto;
  padding: 70px 0 70px;
}
body.company_en #overview .table {
  border-top: 1px dotted #b4b4b4;
}
body.company_en #overview .table:not(:first-of-type) {
  margin-top: 100px;
}
@media screen and (max-width: 768px) {
  body.company_en #overview .table:not(:first-of-type) {
    margin-top: 25px;
  }
}
body.company_en #overview .table:last-of-type {
  margin-bottom: 100px;
}
body.company_en #overview .table .row {
  border-bottom: 1px dotted #b4b4b4;
  padding: 15px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  body.company_en #overview .table .row {
    padding: 2.5vw 0;
  }
}
body.company_en #overview .table .row:last-of-type {
  border-bottom: 1px dotted #b4b4b4;
}
body.company_en #overview .table .row .col.th {
  width: 190px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  body.company_en #overview .table .row .col.th {
    width: 100%;
    margin-bottom: 10px;
  }
}
body.company_en #overview .table .row .col.td {
  position: relative;
  width: calc(100% - 190px);
}
@media screen and (max-width: 768px) {
  body.company_en #overview .table .row .col.td {
    width: 100%;
  }
}
@media screen and (min-width: 768px) {
  body.company_en #overview .table .row .col.td {
    padding-left: 20px;
  }
  body.company_en #overview .table .row .col.td:before {
    content: "";
    height: 100%;
    width: 3px;
    border-radius: 50px;
    background: #e6e6e6;
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
body.company_en #overview .table .row .col.td a[target=_blank] {
  font-size: 1.2rem;
  letter-spacing: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #00a0e9;
}
body.company_en #overview .table .row .col.td a[target=_blank]:not(:first-of-type) {
  margin-left: 1.5rem;
}
body.company_en #overview .table .row .col.td a[target=_blank] i.icon {
  margin-left: 2px;
}
body.company_en #office {
  margin-bottom: 120px;
}
@media screen and (max-width: 768px) {
  body.company_en #office {
    margin-bottom: 60px;
  }
}
body.company_en #office .box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 0 35px;
}
body.company_en #office .box .imgbox {
  width: 200px;
}
@media screen and (max-width: 768px) {
  body.company_en #office .box .imgbox {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
body.company_en #office .box .textbox {
  width: calc(100% - 220px);
}
@media screen and (max-width: 768px) {
  body.company_en #office .box .textbox {
    width: 100%;
  }
}
body.company_en #office .box .textbox p {
  padding: 2px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  position: relative;
}
body.company_en #office .box .textbox p:before {
  display: block;
  content: attr(data-name) "";
  width: 100px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  body.company_en #office .box .textbox p:before {
    width: 80px;
  }
}
body.company_en #office .box .textbox p:after {
  content: "";
  height: calc(100% - 12px);
  width: 3px;
  border-radius: 50px;
  background: #e6e6e6;
  display: block;
  position: absolute;
  top: 50%;
  left: 85px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  body.company_en #office .box .textbox p:after {
    left: 70px;
  }
}
body.company_en #office .box .textbox p span {
  width: calc(100% - 100px);
}
@media screen and (max-width: 768px) {
  body.company_en #office .box .textbox p span {
    width: calc(100% - 80px);
  }
}
body.company_en #office .box .textbox p a[target=_blank] {
  letter-spacing: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #00a0e9;
}
body.company_en #office .box .textbox p a[target=_blank] i.icon {
  margin-left: 0.5rem;
  font-size: 70%;
}
body.company_en #office .box .textbox p a[target=_blank]:hover {
  text-decoration: underline;
}
body.company_en .linkbox {
  margin-bottom: 100px;
}
body.company_en .linkbox a {
  font-size: 1.6rem;
}
body.company_en .linkbox a i.icon {
  font-size: 1.6rem;
}

#supportpage .box {
  border-radius: 15px;
  position: relative;
  padding: 30px 2vw 10px;
  margin-bottom: 50px;
  border: 1px solid #00A0E9;
}
@media screen and (max-width: 768px) {
  #supportpage .box {
    padding: 2.5vw 2.5vw 1vw;
  }
}
#supportpage .box h2 {
  width: 100%;
  font-size: 2.4rem;
  line-height: 1.4;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  #supportpage .box h2 {
    font-size: 2rem;
  }
}
#supportpage .box h2 span.icon {
  width: 60px;
  height: auto;
  display: inline-block;
  border-radius: 15px;
  overflow: hidden;
  margin-right: 15px;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
#supportpage p {
  margin: 0 0 1.5rem;
}
#supportpage ol, #supportpage ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
#supportpage ul li {
  width: 49%;
  background: #fff;
  border-radius: 10px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-bottom: 20px;
}
@media screen and (max-width: 1000px) {
  #supportpage ul li {
    margin-bottom: 10px;
    width: 100%;
  }
}
#supportpage ul li a {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 10px 15px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-decoration: none;
  -webkit-transition: background 240ms;
  transition: background 240ms;
}
#supportpage ul li a i.icon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
#supportpage ul li a i.icon svg {
  -webkit-transition: fill 240ms;
  transition: fill 240ms;
  width: 48px;
  height: auto;
  display: block;
  fill: #00A0E9;
}
@media screen and (max-width: 640px) {
  #supportpage ul li a i.icon svg {
    width: 36px;
  }
}
#supportpage ul li a p.text {
  width: calc(100% - 63px);
  margin: 0;
  color: #00A0E9;
  font-size: 2rem;
  font-weight: bold;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
@media screen and (max-width: 640px) {
  #supportpage ul li a p.text {
    width: calc(100% - 50px);
  }
}
@media screen and (max-width: 480px) {
  #supportpage ul li a p.text {
    font-size: 3.6vw;
  }
}
#supportpage ul li a p.text span {
  font-size: 1.2rem;
  font-weight: normal;
  display: block;
  color: #333;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
#supportpage ul li a:hover {
  background: #00A0E9;
}
#supportpage ul li a:hover i.icon svg {
  fill: #fff;
}
#supportpage ul li a:hover p.text {
  color: #fff;
}
#supportpage ul li a:hover p.text span {
  color: #fff;
}
#supportpage ul.normal li {
  border: 3px solid #00A0E9;
}
#supportpage ul.other {
  margin-top: 20px;
  border-radius: 10px;
  background: #00a0e9;
  border: 3px solid #00A0E9;
  padding: 15px;
  -webkit-transition: background 240ms;
  transition: background 240ms;
}
#supportpage ul.other li {
  border: 3px solid #fff;
  margin-bottom: 0;
  -webkit-transition: border 240ms;
  transition: border 240ms;
}
@media screen and (max-width: 1000px) {
  #supportpage ul.other li:not(:last-of-type) {
    margin-bottom: 15px;
  }
}
#supportpage ul.other li.title {
  background: none;
  width: 100%;
  border: none;
  color: #fff;
  font-weight: bold;
  font-size: 2.4rem;
  margin-bottom: 20px;
}
#supportpage ul.other:hover {
  background: #fff;
}
#supportpage ul.other:hover li:not(.title) {
  border: 3px solid #00A0E9;
}
#supportpage ul.other:hover li.title {
  color: #333;
}

/*! presskit
========================================================================== */
#presskit {
  padding-top: 60px;
  margin-bottom: 90px;
}
#presskit h2 {
  font-size: clamp(3rem, 3rem + (1vw - 0.64rem) * 2.7778, 4rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 20px;
  letter-spacing: 0;
}
#presskit h2::before, #presskit h2::after {
  content: "";
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background-color: #00a0e9;
  display: block;
  height: 2px;
}
#presskit h2 span {
  padding: 0 0.5em;
}
#presskit .kitbox {
  margin-bottom: 100px;
}

/*! footer
========================================================================== */
footer.footer div.inner {
  letter-spacing: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(#004896), to(#00a0e9));
  background: linear-gradient(to bottom, #004896, #00a0e9);
}
footer.footer div.inner div.content {
  padding: 45px 0 35px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  color: #fff;
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content {
    padding: 30px 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
@media screen and (max-width: 768px) {
  footer.footer div.inner div.content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
footer.footer div.inner div.content div.linkbox {
  padding-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: calc(100% - 270px - 70px);
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox {
    padding-top: 0;
  }
}
@media screen and (max-width: 768px) {
  footer.footer div.inner div.content div.linkbox {
    margin-bottom: 50px;
    width: 100%;
  }
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item {
    width: 100%;
  }
  footer.footer div.inner div.content div.linkbox div.item:not(:last-of-type) {
    margin-bottom: 15px;
  }
}
footer.footer div.inner div.content div.linkbox div.item h3.title {
  opacity: 0.45;
  line-height: 1;
  font-size: 2.4rem;
  margin: 0 0 10px;
}
footer.footer div.inner div.content div.linkbox div.item h3.title:nth-of-type(2) {
  margin-top: 30px;
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item h3.title:nth-of-type(2) {
    margin-top: 15px;
  }
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item h3.title {
    font-size: 2rem;
    margin: 0;
  }
}
@media screen and (max-width: 768px) {
  footer.footer div.inner div.content div.linkbox div.item h3.title {
    text-align: center;
  }
}
footer.footer div.inner div.content div.linkbox div.item ul.list {
  padding: 0;
  margin: 0;
  list-style: none;
  font-size: 1.2rem;
  border-left: 1px solid rgba(255, 255, 255, 0.35);
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item ul.list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    border-left: none;
  }
}
@media screen and (max-width: 768px) {
  footer.footer div.inner div.content div.linkbox div.item ul.list {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
footer.footer div.inner div.content div.linkbox div.item ul.list.multi {
  margin-bottom: 15px;
}
footer.footer div.inner div.content div.linkbox div.item ul.list li {
  padding-left: 15px;
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item ul.list li {
    padding-left: 0;
  }
  footer.footer div.inner div.content div.linkbox div.item ul.list li:not(:last-of-type):after {
    content: "|";
    padding: 0 1rem;
    opacity: 0.4;
  }
}
footer.footer div.inner div.content div.linkbox div.item ul.list li a {
  color: #fff;
  display: block;
  padding: 3px 0;
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item ul.list li a {
    display: inline-block;
  }
}
footer.footer div.inner div.content div.linkbox div.item ul.last {
  padding: 0;
  margin: 0;
  list-style: none;
  font-size: 1.2rem;
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item ul.last li {
    padding-left: 0;
  }
  footer.footer div.inner div.content div.linkbox div.item ul.last li:not(:last-of-type):after {
    content: "|";
    padding: 0 1rem;
    opacity: 0.4;
  }
}
footer.footer div.inner div.content div.linkbox div.item ul.last li a {
  color: #fff;
  display: block;
  padding: 3px 0;
}
@media screen and (max-width: 950px) {
  footer.footer div.inner div.content div.linkbox div.item ul.last li a {
    display: inline-block;
  }
}
footer.footer div.inner div.content div.info {
  font-size: 1.2rem;
  text-align: center;
}
footer.footer div.inner div.content div.info div.logo {
  display: block;
  width: 175px;
  height: 43px;
  margin: auto;
  margin-bottom: 15px;
}
footer.footer div.inner div.content div.info div.logo svg {
  fill: #fff;
}
footer.footer div.inner div.content div.info p {
  margin-bottom: 1rem;
}
footer.footer div.inner div.content div.info ul {
  padding: 0;
  margin: 0;
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
footer.footer div.inner div.content div.info ul li a {
  padding: 3px 0;
  color: #fff;
}
footer.footer div.inner div.content div.info ul li:not(:first-of-type):before {
  content: "/";
  padding: 0 0.5rem;
}
footer.footer div.inner div.content.simple {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
footer.footer .copyright {
  text-align: center;
  font-size: 1.2rem;
  padding: 10px 0 8px;
  letter-spacing: 0;
  border-bottom: 2px solid #00a0e9;
}

#pageTop {
  width: 56px;
  height: 56px;
  position: fixed;
  bottom: -58px;
  right: 20px;
  border-radius: 50%;
  overflow: hidden;
  -webkit-transition: -webkit-transform 480ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: -webkit-transform 480ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: transform 480ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: transform 480ms cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 480ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  z-index: 998;
}
@media screen and (max-width: 768px) {
  #pageTop {
    width: 45px;
    height: 45px;
    right: 10px;
    bottom: -70px;
  }
}
#pageTop a {
  display: block;
  background: #00a0e9;
  -webkit-transition: background 240ms;
  transition: background 240ms;
}
#pageTop a svg #arrow {
  fill: none;
  stroke: #fff;
  stroke-miterlimit: 10;
}
#pageTop a:hover {
  background: #004896;
}
#pageTop.active {
  -webkit-transform: translate3d(0, -82px, 3px);
          transform: translate3d(0, -82px, 3px);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

/*! simple
========================================================================== */
/* LINK
========================================================================== */
.simplewrap {
  line-height: 1.6;
}
.simplewrap a {
  color: #00a0e9;
  text-decoration: underline;
  -webkit-transition: color 240ms;
  transition: color 240ms;
}
.simplewrap a:hover {
  color: #004896;
}
.simplewrap a[target=_blank]:after {
  content: "\e909";
  padding-left: 1rem;
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* HEADER
========================================================================== */
.simplewrap h1.title {
  padding: 10px 0 0;
  margin: 0 auto 50px;
  font-size: 2rem;
  position: relative;
  z-index: 1;
  border-bottom: solid 2px #ededed;
  text-align: center;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  .simplewrap h1.title {
    font-size: 1.6rem;
  }
}
.simplewrap h1.title span {
  display: inline-block;
  position: relative;
  padding-bottom: 5px;
}
.simplewrap h1.title span:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  left: 0;
  bottom: -2px;
  background: #00a0e9;
}

/* GO TO TOP
========================================================================== */
.gotosimple {
  text-align: center;
  margin-bottom: 50px;
}
.gotosimple a {
  display: inline-block;
  color: #333;
  text-decoration: none;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  line-height: 1;
  font-size: 5rem;
}

/* CONTAINER
========================================================================== */
.container {
  max-width: 1000px;
  width: 95%;
  margin: auto;
}
.container.textpage {
  margin-bottom: 100px;
}

/* textpage
========================================================================== */
.textpage h2 {
  margin: 15px 0 5px;
  font-size: 2rem;
}
.textpage h3 {
  margin: 10px 0;
  font-size: 1.8rem;
}
@media screen and (max-width: 768px) {
  .textpage h2 {
    font-size: 1.8rem;
  }
  .textpage h3 {
    font-size: 1.6rem;
  }
}
.textpage p {
  margin: 0 0 1.5rem;
}
.textpage ol, .textpage ul {
  padding: 0;
  margin-left: 2.5rem;
  margin-bottom: 3rem;
}
.textpage ol li, .textpage ul li {
  padding: 5px 0;
}
.textpage ul.circle {
  list-style: circle;
}
.textpage ol.list_parentheses {
  padding: 0 0 0 2.5em;
  margin: 0;
  margin-bottom: 3rem;
}
.textpage ul ul.nomargin {
  margin-bottom: 0;
}
.textpage ol ol.list_parentheses {
  margin-bottom: 1.5rem;
}
.textpage ol.list_parentheses li {
  position: relative;
  list-style-type: none;
  list-style-position: inside;
  counter-increment: cnt;
}
.textpage ol.list_parentheses li:before {
  position: absolute;
  top: 0;
  left: -4rem;
  padding: 5px 0;
  display: marker;
  content: "(" counter(cnt) ") ";
}
.textpage table {
  border-collapse: collapse;
  border: solid 2px #ededed;
  margin-bottom: 2rem;
}
.textpage table th {
  background: #f5f5f5;
}
.textpage table td {
  border: dashed 1px #ededed;
}
.textpage hr {
  border: 0;
  margin: 5rem auto;
  max-width: 100%;
  background-position: 50%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  height: 1px;
  background-image: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 0%, 0)), color-stop(50%, hsla(0, 0%, 0%, 0.5)), to(hsla(0, 0%, 0%, 0)));
  background-image: linear-gradient(90deg, hsla(0, 0%, 0%, 0), hsla(0, 0%, 0%, 0.5) 50%, hsla(0, 0%, 0%, 0) 100%);
}

/* 子ページ一覧
========================================================================== */
.textpage .childbox {
  width: 95%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: auto;
}

/* 資金決済法に基づく表示
========================================================================== */
body.fund {
  /* NAVIGATION
  ========================================================================== */
  /* TABLE
  ========================================================================== */
}
body.fund nav.nav {
  width: 95%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: auto;
  margin-bottom: 50px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-size: 1.4rem;
}
@media screen and (max-width: 768px) {
  body.fund nav.nav {
    margin-bottom: 50px;
  }
}
body.fund nav.nav ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
body.fund nav.nav ul li a {
  padding: 5px 10px;
  display: block;
  position: relative;
  overflow: hidden;
  -webkit-transition: padding 240ms;
  transition: padding 240ms;
  color: #333;
  text-decoration: none;
}
body.fund nav.nav ul li a span {
  background: #fff;
  position: relative;
  z-index: 1;
  padding: 0 5px;
  -webkit-transition: padding 240ms;
  transition: padding 240ms;
}
body.fund nav.nav ul li a:before, body.fund nav.nav ul li a:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  z-index: -1;
}
body.fund nav.nav ul li a:before {
  background: #00a0e9;
  left: 0;
  height: 1px;
  width: 10%;
  -webkit-transition: width 240ms cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: width 240ms cubic-bezier(0.645, 0.045, 0.355, 1);
}
body.fund nav.nav ul li a:after {
  content: "";
  right: 0;
  -webkit-transform: translate(10px, -50%) rotate(45deg);
          transform: translate(10px, -50%) rotate(45deg);
  border-top: 3px solid #00a0e9;
  border-right: 3px solid transparent;
  border-bottom: 3px solid transparent;
  border-left: 3px solid transparent;
  -webkit-transition: -webkit-transform 240ms;
  transition: -webkit-transform 240ms;
  transition: transform 240ms;
  transition: transform 240ms, -webkit-transform 240ms;
}
body.fund nav.nav ul li a:hover {
  padding-left: 2px;
  padding-right: 18px;
}
body.fund nav.nav ul li a:hover:before {
  width: 100%;
}
body.fund nav.nav ul li a:hover:after {
  -webkit-transition-delay: 120ms;
          transition-delay: 120ms;
  -webkit-transform: translate(-2px, -50%) rotate(45deg);
          transform: translate(-2px, -50%) rotate(45deg);
}
body.fund .tablebox {
  margin-top: 0;
}
body.fund .tablebox .table {
  border-top: 1px solid #cbcbcb;
  margin: 50px auto;
}
body.fund .tablebox .table:first-of-type {
  margin-top: 0px;
}
body.fund .tablebox .table .row {
  border-bottom: 1px solid #ededed;
  padding: 30px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  body.fund .tablebox .table .row {
    padding: 2.5vw 0;
  }
}
body.fund .tablebox .table .row:last-of-type {
  border-bottom: 1px solid #cbcbcb;
}
body.fund .tablebox .table .row .col.th {
  width: 250px;
  font-weight: bold;
}
@media screen and (max-width: 768px) {
  body.fund .tablebox .table .row .col.th {
    width: 100%;
    margin-bottom: 10px;
  }
}
body.fund .tablebox .table .row .col.td {
  width: calc(100% - 250px);
}
@media screen and (max-width: 768px) {
  body.fund .tablebox .table .row .col.td {
    width: 100%;
  }
}
body.fund .tablebox .table ul {
  padding: 0;
  padding-left: 1.5rem;
  margin: 0;
  margin-left: 1rem;
}
body.fund .tablebox .table ul.kome {
  padding: 0;
  padding-left: 1.5rem;
  margin: 0;
  margin-left: 1rem;
  list-style: none;
}
body.fund .tablebox .table ul.kome li {
  position: relative;
}
body.fund .tablebox .table ul.kome li:before {
  content: "※";
  position: absolute;
  top: 0;
  left: -2rem;
}

/* 取得させていただく情報
========================================================================== */
body.page-template-page-apps-data .container {
  max-width: 550px;
  width: 90%;
  margin: auto;
}
body.page-template-page-apps-data .box {
  position: relative;
  background: -webkit-gradient(linear, left top, left bottom, from(#00a0e9), to(rgba(0, 160, 233, 0)));
  background: linear-gradient(to bottom, #00a0e9, rgba(0, 160, 233, 0));
  padding: 30px 5vw 25px;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  body.page-template-page-apps-data .box {
    padding: 5vw;
  }
}
body.page-template-page-apps-data .box:after {
  content: "";
  height: calc(100% - 2px);
  width: calc(100% - 2px);
  display: block;
  background: #fff;
  position: absolute;
  top: 1px;
  left: 1px;
  z-index: 0;
}
body.page-template-page-apps-data .box h2 {
  width: 100%;
  text-align: center;
  font-size: 1.6rem;
  overflow: hidden;
  height: 60px;
  line-height: 1.4;
  position: absolute;
  top: -30px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  body.page-template-page-apps-data .box h2 {
    font-size: 1.4rem;
  }
}
body.page-template-page-apps-data .box h2 span {
  position: relative;
  background: #fff;
  padding: 0 15px;
}
body.page-template-page-apps-data .box h2 span:before, body.page-template-page-apps-data .box h2 span:after {
  content: "";
  height: 11px;
  width: 1px;
  display: block;
  background: #00a0e9;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
body.page-template-page-apps-data .box h2 span:before {
  left: 0;
}
body.page-template-page-apps-data .box h2 span:after {
  right: 0;
}
body.page-template-page-apps-data .box h2 i {
  font-size: 1.2rem;
  font-style: normal;
  display: block;
  letter-spacing: 0;
}
body.page-template-page-apps-data div.caution {
  font-size: 1.2rem;
  padding: 2rem;
  margin-bottom: 100px;
  color: #666;
}
body.page-template-page-apps-data ol, body.page-template-page-apps-data ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
  z-index: 1;
}
body.page-template-page-apps-data ol li, body.page-template-page-apps-data ul li {
  border-bottom: 1px solid #ddd;
  padding-bottom: 10px;
}
body.page-template-page-apps-data ol li:before, body.page-template-page-apps-data ul li:before {
  content: attr(data-title);
  display: block;
  padding: 20px 0 5px;
  font-weight: bold;
}

/* 取得させていただく情報
========================================================================== */
body.page-template-page-apps-data2 nav.nav {
  max-width: 550px;
  width: 95%;
  margin: auto;
}
body.page-template-page-apps-data2 nav.nav ul {
  padding-left: 2rem;
}
body.page-template-page-apps-data2 .container {
  max-width: 550px;
  width: 95%;
  margin: auto;
  margin-top: 50px;
}
body.page-template-page-apps-data2 .box {
  position: relative;
  background: linear-gradient(to bottom, #00a0e9 calc(100% - 300px), rgba(0, 160, 233, 0));
  padding: 20px 20px 25px;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  body.page-template-page-apps-data2 .box {
    padding: 5vw;
  }
}
body.page-template-page-apps-data2 .box:after {
  content: "";
  height: calc(100% - 2px);
  width: calc(100% - 2px);
  display: block;
  background: #fff;
  position: absolute;
  top: 1px;
  left: 1px;
  z-index: 0;
}
body.page-template-page-apps-data2 .box h2, body.page-template-page-apps-data2 .box h3.cat_name {
  width: 100%;
  font-size: 1.6rem;
  overflow: hidden;
  line-height: 1.4;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  body.page-template-page-apps-data2 .box h2, body.page-template-page-apps-data2 .box h3.cat_name {
    font-size: 1.4rem;
  }
}
body.page-template-page-apps-data2 .box h2 ~ h3, body.page-template-page-apps-data2 .box h3.cat_name ~ h3 {
  margin-top: 50px;
}
body.page-template-page-apps-data2 .box h2 span, body.page-template-page-apps-data2 .box h3.cat_name span {
  position: relative;
  background: #fff;
}
body.page-template-page-apps-data2 .box h2 span:before, body.page-template-page-apps-data2 .box h3.cat_name span:before {
  content: "";
  height: 10px;
  width: 100%;
  display: block;
  background: -webkit-gradient(linear, left bottom, left top, from(#00a0e9), to(rgba(0, 160, 233, 0)));
  background: linear-gradient(to top, #00a0e9, rgba(0, 160, 233, 0));
  position: absolute;
  bottom: -2px;
}
body.page-template-page-apps-data2 .box h2 span:before, body.page-template-page-apps-data2 .box h3.cat_name span:before {
  left: 0;
}
body.page-template-page-apps-data2 .box h2 span:after, body.page-template-page-apps-data2 .box h3.cat_name span:after {
  right: 0;
}
body.page-template-page-apps-data2 .box h2 i, body.page-template-page-apps-data2 .box h3.cat_name i {
  font-style: normal;
  position: relative;
}
body.page-template-page-apps-data2 .box ol, body.page-template-page-apps-data2 .box ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
  z-index: 1;
}
body.page-template-page-apps-data2 .box ol li, body.page-template-page-apps-data2 .box ul li {
  border-bottom: 1px solid #ddd;
  padding-bottom: 5px;
}
@media screen and (max-width: 768px) {
  body.page-template-page-apps-data2 .box ol li, body.page-template-page-apps-data2 .box ul li {
    font-size: 1.2rem;
  }
}
body.page-template-page-apps-data2 .box ol li:before, body.page-template-page-apps-data2 .box ul li:before {
  content: attr(data-title);
  display: block;
  padding: 10px 0 0;
  font-weight: bold;
}
body.page-template-page-apps-data2 div.caution {
  font-size: 1.2rem;
  padding: 2rem;
  margin-bottom: 100px;
  color: #666;
}

#debugmenu {
  position: fixed;
  font-size: 1.2rem;
  top: 0%;
  left: -250px;
  width: 250px;
  padding: 15px;
  background: #fff;
  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
  -webkit-transition: left 480ms;
  transition: left 480ms;
  z-index: 99999;
}
#debugmenu span {
  color: rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 0;
  right: 0;
  height: 20px;
  padding: 0 5px;
  line-height: 20px;
  /* background: #ff0; */
  display: block;
  -webkit-transform-origin: top right;
          transform-origin: top right;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}
#debugmenu ul {
  padding: 0;
  padding-left: 1rem;
  margin: 0;
  list-style: disc;
}
#debugmenu ul li ul {
  padding: 0;
  padding-left: 1.5rem;
  margin: 0;
  list-style: circle;
}
#debugmenu:hover {
  left: 0;
}