@charset "UTF-8";
@import url("base.css");
/*共通設定-------------------------------------------------------------------------------------------------------------------------------------*/
/*基本設定*/
#message {
  width: 80%;
  margin: 5em auto 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  #message #m_inner {
    width: 48%;
    position: relative; }
    #message #m_inner h1 {
      font-size: 350%;
      color: #171c61;
      margin: 0 0 0.5em; }
    #message #m_inner p {
      width: calc(100% - 250px);
      font-size: 120%;
      margin: 0 0 0 250px; }
      #message #m_inner p i {
        display: block;
        color: #faee00;
        font-size: 180%;
        font-weight: bold;
        margin: 1em 0; }
      #message #m_inner p span {
        font-size: 150%;
        vertical-align: middle;
        margin: 0 0 0 1em; }
    #message #m_inner figure {
      position: absolute;
      bottom: 0%;
      left: 0%;
      display: block;
      width: 230px; }
  #message figure {
    width: 48%; }

#company {
  width: 70%;
  margin: 10em auto 0;
  background-color: #171c61;
  padding: 2em 5%;
  position: relative; }
  #company .h2_right {
    position: absolute;
    right: 0;
    top: -2.4em;
    background-image: url("../img/base/track_b.png");
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 80px auto;
    padding: 1em 75px 0 90px;
    font-family: "Anton", sans-serif;
    font-size: 150%;
    color: #171c61; }
  #company .h2_right02 {
    position: absolute;
    right: 0;
    top: -3.8em;
    width: 65px; }
  #company h2 {
    position: absolute;
    top: -2.4em;
    left: 0;
    font-size: 200%;
    color: #171c61;
    padding: 1em 0 0 70px;
    background-image: url("../img/base/house02_b.png");
    background-repeat: no-repeat;
    background-size: 60px auto;
    background-position: left bottom; }
  #company table {
    color: #fff;
    width: 100%; }
    #company table tr {
      border-bottom: 1px solid #fff; }
      #company table tr:last-child {
        border-bottom: none; }
    #company table th {
      border-right: 1px solid #fff;
      padding: 1em 2%;
      width: 26%;
      vertical-align: top; }
    #company table td {
      padding: 1em 2%;
      width: 66%; }
      #company table td a {
        color: #fff;
        text-decoration: none; }
        #company table td a:hover, #company table td a:active {
          color: #fff;
          text-decoration: underline; }

.back_w {
  width: 100%;
  background-color: #fff;
  padding: 2.5em 0%;
  margin: 10em auto 0; }

#supprt {
  width: 80%;
  margin: 0 auto;
  padding: 0;
  position: relative; }
  #supprt .h2_right {
    position: absolute;
    right: 0;
    top: -4.1em;
    background-image: url("../img/base/track_w.png");
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 80px auto;
    padding: 1em 75px 0 90px;
    font-family: "Anton", sans-serif;
    font-size: 150%;
    color: #fff; }
  #supprt .h2_right02 {
    position: absolute;
    right: 0;
    top: -6.4em;
    width: 65px; }
  #supprt h2 {
    position: absolute;
    top: -3.7em;
    left: 0;
    font-size: 200%;
    color: #fff;
    padding: 1em 0 0 70px;
    background-image: url("../img/base/house02_w.png");
    background-repeat: no-repeat;
    background-size: 60px auto;
    background-position: left bottom; }
  #supprt ul li dl {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between; }
    #supprt ul li dl dt {
      width: 200px;
      height: 200px;
      border-radius: 50%;
      background-image: radial-gradient(circle, #0000000d 5px, transparent 5px);
      background-position: 0 0;
      background-size: 35px 35px;
      color: #171c61;
      position: relative; }
      #supprt ul li dl dt span {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        font-size: 150%;
        text-align: center;
        font-weight: bold; }
        #supprt ul li dl dt span img {
          display: block;
          width: 50px;
          margin: 0 auto 0.5em; }
      #supprt ul li dl dt.c01 {
        background-color: #8fc31f; }
      #supprt ul li dl dt.c02 {
        background-color: #00d2ff; }
      #supprt ul li dl dt.c03 {
        background-color: #bf8fb7; }
      #supprt ul li dl dt.c04 {
        background-color: #faee00; }
      #supprt ul li dl dt.c05 {
        background-color: #ee87b4; }
    #supprt ul li dl dd {
      width: calc(100% - 250px); }
  #supprt ul li:nth-child(n+2) {
    margin: 3em 0 0; }

/*共通設定ここまで-------------------------------------------------------------------------------------------------------------------------------------*/
/* pc */
@media screen and (min-width: 1300px) {
  /*メイン*/ }
/* tablet以下共通 ------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 1299px) {
  /*メイン*/ }
/* tablet以下共通ここまで ------------------------------------------------------------------------------------------*/
/* tablet1 */
@media only screen and (min-width: 1024px) and (max-width: 1299px) {
  /*メイン*/
  #message #m_inner h1 {
    font-size: 300%; }
  #message #m_inner p {
    width: 100%;
    margin: 0; }
  #message #m_inner figure {
    display: none; } }
/* tablet2  */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /*基本設定*/
  /*メイン*/
  #message {
    margin: 150px auto 0;
    flex-direction: column-reverse; }
    #message #m_inner {
      width: 100%;
      margin: 1em 0 0; }
      #message #m_inner h1 {
        font-size: 350%;
        margin: 0 0 0.5em; }
      #message #m_inner p {
        width: 100%;
        font-size: 120%;
        margin: 0; }
        #message #m_inner p i br {
          display: none; }
      #message #m_inner figure {
        display: none; }
    #message figure {
      width: 100%; } }
/* tablet3  */
@media only screen and (max-width: 767px) {
  /*基本設定*/
  /*メイン*/
  #message {
    width: 90%;
    margin: 120px auto 0;
    flex-direction: column-reverse; }
    #message #m_inner {
      width: 100%;
      margin: 1em 0 0; }
      #message #m_inner h1 {
        font-size: 250%; }
      #message #m_inner p {
        width: 100%;
        font-size: 120%;
        margin: 0; }
        #message #m_inner p i br {
          display: none; }
      #message #m_inner figure {
        display: none; }
    #message figure {
      width: 100%; }

  #company {
    width: 80%; }
    #company .h2_right {
      display: none; }
    #company .h2_right02 {
      display: none; }

  .back_w {
    width: 100%;
    background-color: #fff;
    padding: 2.5em 0%;
    margin: 10em auto 0; }

  #supprt {
    width: 90%; }
    #supprt .h2_right {
      display: none; }
    #supprt .h2_right02 {
      display: none; }
    #supprt ul li dl {
      flex-direction: column; }
      #supprt ul li dl dt {
        width: 150px;
        height: 150px;
        margin: 0 0 1em; }
        #supprt ul li dl dt span {
          font-size: 130%; }
      #supprt ul li dl dd {
        width: 100%; }
    #supprt ul li:nth-child(n+2) {
      margin: 3em 0 0; } }
/* smartPhone1 */
@media only screen and (max-width: 499px) {
  /*基本設定*/
  /*メイン*/ }