@charset "UTF-8";
/* ===================================================================
CSS information
 file name  :shared.css
 style info :共通のスタイル
=================================================================== */
/* ==========================================================
  BASE
========================================================== */
body {
  font-family: "NewRodinPro-DB", "ヒラギノ角ゴ Pro W3";
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  background: #000;
  line-height: 1.8; }
  body:focus {
    outline: none; }

div, h1, h2, h3, h4, h5, h6, ul, li, section, p, a {
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

a, a:visited, a:hover {
  color: #000;
  text-decoration: none; }

a img {
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s; }

a:hover img {
  -webkit-filter: brightness(120%);
  filter: brightness(120%);
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s; }

a:hover img.light110 {
  -webkit-filter: brightness(110%);
  filter: brightness(110%);
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s; }

a:hover img.hoverNone {
  -webkit-filter: brightness(100%);
  filter: brightness(100%); }

#wrap {
  width: 100%;
  height: 100%;
  position: relative;
  background: #0071e4; }
  @media screen and (min-width: 751px) {
    #wrap {
      min-width: 1260px; } }

/* ==========================================================
    MODULE
  ========================================================== */
@media screen and (min-width: 751px) {
  body {
    font-size: 16px;
    min-width: 1250px; }
  .pcNone {
    display: none !important; }
  .mb20 {
    margin-bottom: 20px; } }

@media screen and (max-width: 750px) {
  body {
    font-size: 2.8vw; }
  #wrap {
    overflow-x: hidden; }
  .spNone {
    display: none !important; }
  img {
    width: 100%; }
  .mb20 {
    margin-bottom: 4%; } }

/* ==========================================================
    HEADER
  ========================================================== */
header {
  width: 100%;
  background: #fff; }
  @media screen and (min-width: 751px) {
    header {
      height: 68px; } }
  @media screen and (min-width: 751px) {
    header .inner {
      width: 1100px;
      margin: 0 auto; } }
  @media screen and (max-width: 750px) {
    header .inner {
      width: 100%;
      padding: 4%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; } }
  @media screen and (min-width: 751px) {
    header .inner #logo_l5 {
      float: left;
      width: 200px;
      padding: 14px 0px 0px 15px; }
      header .inner #logo_l5 img {
        width: 100%; } }
  @media screen and (max-width: 750px) {
    header .inner #logo_l5 {
      width: 30%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      header .inner #logo_l5 a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center; } }
  header .inner #pageTitle {
    font-family: "NewRodinPro-EB", "ヒラギノ角ゴ Pro W3";
    border-left: solid 2px #d9d9d9; }
    @media screen and (min-width: 751px) {
      header .inner #pageTitle {
        font-size: 18px;
        float: left;
        padding-left: 22px;
        margin: 18px 0px 0px 25px; } }
    @media screen and (max-width: 750px) {
      header .inner #pageTitle {
        font-size: 2.6vw;
        padding-left: 2%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
        left: -9%; } }
    header .inner #pageTitle span.space {
      letter-spacing: -0.1em; }
    header .inner #pageTitle span.top {
      position: relative;
      top: -1px; }
  @media screen and (min-width: 751px) {
    header .inner ul {
      float: right;
      padding-top: 8px; } }
  @media screen and (max-width: 750px) {
    header .inner ul {
      display: none; } }
  @media screen and (min-width: 751px) {
    header .inner ul li {
      float: left;
      margin-left: 10px; } }

/* ==========================================================
    FOOTER
  ========================================================== */
footer {
  width: 100%;
  background: #191919; }
  @media screen and (min-width: 751px) {
    footer {
      padding-bottom: 100px; } }
  @media screen and (max-width: 750px) {
    footer {
      padding-bottom: 2%; } }
  @media screen and (min-width: 751px) {
    footer #pageTop_pc {
      position: fixed;
      right: 10px;
      bottom: 10px;
      z-index: 9999; } }
  @media screen and (max-width: 750px) {
    footer #pageTop_pc {
      display: none; } }
  @media screen and (min-width: 751px) {
    footer #pageTop_sp {
      display: none; } }
  @media screen and (max-width: 750px) {
    footer #pageTop_sp a {
      display: block;
      padding: 4%;
      text-align: center; }
      footer #pageTop_sp a img {
        width: 16%; } }
  footer #snsArea {
    background: #4f4f4f; }
    @media screen and (min-width: 751px) {
      footer #snsArea {
        padding: 40px 0px; } }
    footer #snsArea .inner {
      margin: 0 auto; }
      @media screen and (min-width: 751px) {
        footer #snsArea .inner {
          width: 1100px; } }
      @media screen and (max-width: 750px) {
        footer #snsArea .inner {
          width: 92%;
          padding: 6% 0%; } }
      footer #snsArea .inner #snsF {
        margin: 0 auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between; }
        @media screen and (min-width: 751px) {
          footer #snsArea .inner #snsF {
            width: 510px; } }
        @media screen and (max-width: 750px) {
          footer #snsArea .inner #snsF li {
            width: 32%; } }
  @media screen and (min-width: 751px) {
    footer #bottomArea {
      padding: 20px 0px; } }
  @media screen and (max-width: 750px) {
    footer #bottomArea {
      padding-top: 4%; } }
  footer #bottomArea .inner {
    margin: 0 auto; }
    @media screen and (min-width: 751px) {
      footer #bottomArea .inner {
        width: 1100px; } }
    footer #bottomArea .inner ul#linkArea li {
      position: relative; }
      @media screen and (min-width: 751px) {
        footer #bottomArea .inner ul#linkArea li {
          float: left; } }
      @media screen and (max-width: 750px) {
        footer #bottomArea .inner ul#linkArea li {
          width: 70%;
          margin: 0% auto 2%;
          margin-bottom: 2%; } }
      footer #bottomArea .inner ul#linkArea li a {
        font-family: "FOT-ロダンNTLG Pro B", "ヒラギノ角ゴ Pro W3";
        border-radius: 100px;
        color: #fff;
        text-decoration: none;
        border: 2px solid #fff; }
        @media screen and (min-width: 751px) {
          footer #bottomArea .inner ul#linkArea li a {
            display: inline-block;
            padding: 0px 30px 0 20px;
            font-size: 14px;
            line-height: 40px; } }
        @media screen and (max-width: 750px) {
          footer #bottomArea .inner ul#linkArea li a {
            display: block;
            padding: 0.8% 2% 1.6%;
            font-size: 3.4vw;
            position: relative;
            text-align: center; } }
      footer #bottomArea .inner ul#linkArea li:after {
        content: '';
        border: 0px;
        -ms-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        position: absolute;
        top: 50%; }
        @media screen and (min-width: 751px) {
          footer #bottomArea .inner ul#linkArea li:after {
            border-top: solid 3px #fff;
            border-right: solid 3px #fff;
            width: 7px;
            height: 7px;
            right: 16px;
            margin-top: -5px; } }
        @media screen and (max-width: 750px) {
          footer #bottomArea .inner ul#linkArea li:after {
            border-top: solid 6px #fff;
            border-right: solid 6px #fff;
            width: 11px;
            height: 11px;
            top: 50%;
            right: 16px;
            margin-top: -9px; } }
  footer #copyright {
    color: #808080;
    clear: both; }
    @media screen and (min-width: 751px) {
      footer #copyright {
        font-size: 12px; } }
    @media screen and (max-width: 750px) {
      footer #copyright {
        font-size: 2.2vw; } }
    footer #copyright .inner {
      margin: 0 auto; }
      @media screen and (min-width: 751px) {
        footer #copyright .inner {
          width: 1100px; } }
      @media screen and (max-width: 750px) {
        footer #copyright .inner {
          width: 92%;
          padding: 2% 0%; } }
      footer #copyright .inner ul {
        line-height: 1.6;
        padding-left: 1em;
        text-indent: -1em; }
        @media screen and (min-width: 751px) {
          footer #copyright .inner ul {
            float: left; } }
        @media screen and (max-width: 750px) {
          footer #copyright .inner ul {
            margin-bottom: 2%; } }
      footer #copyright .inner small {
        color: #808080; }
        @media screen and (min-width: 751px) {
          footer #copyright .inner small {
            font-size: 12px;
            float: right; } }
        @media screen and (max-width: 750px) {
          footer #copyright .inner small {
            font-size: 2.2vw;
            display: block;
            text-align: center; } }