@font-face {
  font-family: 'Noto Sans CJK jp';
  src: url('/common/font/notosanscjkjp/notosanscjkjp-regular.eot');
  src: url('/common/font/notosanscjkjp/notosanscjkjp-regular.eot?#iefix') format('embedded-opentype'), url('/common/font/notosanscjkjp/notosanscjkjp-regular.woff') format('woff'), url('/common/font/notosanscjkjp/notosanscjkjp-regular.ttf') format('truetype'), url('/common/font/notosanscjkjp/notosanscjkjp-regular.svg#glacial_indifferencebold') format('svg');
}
@font-face {
  font-family: 'Glacial Indifference Bold';
  src: url('/common/font/glacialindifference/glacialindifference-bold.eot');
  src: url('/common/font/glacialindifference/glacialindifference-bold.eot?#iefix') format('embedded-opentype'), url('/common/font/glacialindifference/glacialindifference-bold.woff') format('woff'), url('/common/font/glacialindifference/glacialindifference-bold.ttf') format('truetype'), url('/common/font/glacialindifference/glacialindifference-bold.svg#glacial_indifferencebold') format('svg');
}
@font-face {
  font-family: 'Glacial Indifference Regular';
  src: url('/common/font/glacialindifference/glacialindifference-regular.eot');
  src: url('/common/font/glacialindifference/glacialindifference-regular.eot?#iefix') format('embedded-opentype'), url('/common/font/glacialindifference/glacialindifference-regular.woff') format('woff'), url('/common/font/glacialindifference/glacialindifference-regular.ttf') format('truetype'), url('/common/font/glacialindifference/glacialindifference-regular.svg#glacial_indifferenceregular') format('svg');
}
/* ==========================================================================
   SVG module
   ========================================================================== */
/* svgframe
   ========================================================================== */
.js-svgframe {
  -webkit-transition: 0.4s ease;
  transition: 0.4s ease;
  position: relative;
}
.mod-svgframe {
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.mod-svgframe > line {
  stroke-width: 0;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.mod-svgframe > line.top,
.mod-svgframe > line.bottom,
.mod-svgframe > line.left,
.mod-svgframe > line.right {
  stroke: #00a7d4;
}
.mod-svgframe > line.top2,
.mod-svgframe > line.bottom2,
.mod-svgframe > line.left2,
.mod-svgframe > line.right2 {
  -webkit-transition-duration: .1s;
          transition-duration: .1s;
  stroke-width: 4;
  stroke: #fff;
}
.mod-svgframe > line.top,
.mod-svgframe > line.top2 {
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
}
.mod-svgframe > line.bottom,
.mod-svgframe > line.bottom2 {
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
}
.mod-svgframe > line.left,
.mod-svgframe > line.left2 {
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%);
}
.mod-svgframe > line.right,
.mod-svgframe > line.right2 {
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
}
a:hover .mod-svgframe > line {
  stroke-width: 4;
}
a:hover .mod-svgframe > line.top,
a:hover .mod-svgframe > line.bottom,
a:hover .mod-svgframe > line.left,
a:hover .mod-svgframe > line.right {
  -webkit-transition-delay: .2s;
          transition-delay: .2s;
  -webkit-transition-duration: .2s;
          transition-duration: .2s;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
a:hover .mod-svgframe > line.top2,
a:hover .mod-svgframe > line.bottom2,
a:hover .mod-svgframe > line.left2,
a:hover .mod-svgframe > line.right2 {
  -webkit-transition-duration: .4s;
          transition-duration: .4s;
}
a:hover .mod-svgframe > line.top2 {
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
}
a:hover .mod-svgframe > line.bottom2 {
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
}
a:hover .mod-svgframe > line.left2 {
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-100%);
}
a:hover .mod-svgframe > line.right2 {
  -webkit-transform: translateY(100%);
      -ms-transform: translateY(100%);
          transform: translateY(100%);
}
