@charset "utf-8";

/*PC（751px以上）*/

@media screen and (min-width: 751px) {

  .pc {
    display: block;
  }

  .sp {
    display: none;
  }

  .mente-area {
    width: 100%;
    padding: 50px 0;
    background-color: #eee;
  }

  .mente-area-point1 {
    background-color: #bb0000;
    font-size: 2.5vw;
    padding: 1vw;
    font-weight: bold;
    color: #fff;
    width: 90%;
    margin: 0 auto;
    text-align: center;
  }

  .mente-area-point2 {
    background-color: #ffeeff;
    font-size: 2.5vw;
    padding: 1vw;
    font-weight: bold;
    color: #bb0000;
    width: 90%;
    margin: 0 auto;
    text-align: center;
  }

  .mente-area-title {
    display: flex;
    width: 90%;
    margin: 0 auto;
  }

  .mente-area-title p {
    width: 50%;
    background-color: #fff;
    padding: 1vw;
    font-size: 1.5vw;
    line-height: 1.8;
    color: #000;
  }

  .mente-area-title p span {
    font-size: 1.1vw;
  }

  .mente-area-title img {
    width: 50%;
    height: 100%;
  }

  .mente-area-inquiry {
    width: 85%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
  }

  .mente-area-inquiry a {
    display: block;
    width: 47%;
    background-color: #000088;
    border-radius: 2vw;
    padding: 0.5vw;
    text-align: center;
    line-height: 1.5;
    font-size: 1.4vw;
    color: #fff;
    font-weight: bold;
  }

  .mente-area-inquiry a div {
    font-size: 1.2vw;
    font-weight: normal;
  }

  .mente-area-inquiry a span {
    font-size: 1vw;
    font-weight: normal;
  }

}

/*SP（750px以下）*/

@media screen and (max-width: 750px) {

  .pc {
    display: none;
  }

  .sp {
    display: block;
  }

  .mente-area {
    width: 100%;
    padding: 20px 0 50px 0;
    background-color: #eee;
  }

  .mente-area-point1 {
    background-color: #bb0000;
    font-size: 4vw;
    padding: 2vw 1vw;
    font-weight: bold;
    color: #fff;
    width: 98%;
    margin: 0 auto;
    text-align: center;
  }

  .mente-area-point2 {
    background-color: #ffeeff;
    font-size: 4vw;
    padding: 2vw 1vw;
    font-weight: bold;
    color: #bb0000;
    width: 98%;
    margin: 0 auto;
    text-align: center;
  }

  .mente-area-title {
    display: flex;
    width: 98%;
    margin: 0 auto;
    flex-direction: column-reverse;
  }

  .mente-area-title p {
    width: 100%;
    background-color: #fff;
    padding: 1vw;
    font-size: 3.8vw;
    line-height: 1.8;
    color: #000;
  }

  .mente-area-title p span {
    font-size: 3vw;
  }

  .mente-area-title img {
    width: 100%;
    height: 100%;
  }

  .mente-area-inquiry {
    width: 98%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
  }

  .mente-area-inquiry a {
    display: block;
    width: 80%;
    margin: 0 auto;
    background-color: #000088;
    border-radius: 3vw;
    padding: 0.5vw;
    text-align: center;
    line-height: 1.5;
    font-size: 4.5vw;
    color: #fff;
    font-weight: bold;
  }

  .mente-area-inquiry a:nth-of-type(1) {
    margin-bottom: 20px;
  }

  .mente-area-inquiry a div {
    font-size: 3.5vw;
    font-weight: normal;
  }

  .mente-area-inquiry a span {
    font-size: 3vw;
    font-weight: normal;
  }

}