.din-200 {
  font-family: "din-2014-narrow", sans-serif;
  font-weight: 200; }

.din-400 {
  font-family: "din-2014-narrow", sans-serif;
  font-weight: 400; }

@keyframes hoverin {
  0% {
    transform: translateX(-101%);
    opacity: 1; }
  100% {
    transform: translateX(0);
    opacity: 1; } }
@keyframes hoverout {
  0% {
    transform: translateX(0);
    left: 0;
    opacity: 1; }
  100% {
    transform: translateX(0);
    left: 101%;
    opacity: 1; } }
@keyframes hoverinreverse {
  0% {
    transform: translateX(101%);
    opacity: 1; }
  100% {
    transform: translateX(0);
    opacity: 1; } }
@keyframes hoveroutreverse {
  0% {
    transform: translateX(0);
    left: 0;
    opacity: 1; }
  100% {
    transform: translateX(0);
    left: -101%;
    opacity: 1; } }
@keyframes hoverupout {
  0% {
    transform: translateY(0);
    opacity: 1;
    top: 0; }
  100% {
    transform: translateY(0);
    opacity: 1;
    top: -100%; } }
@keyframes hoverupin {
  0% {
    transform: translateY(101%);
    opacity: 1; }
  100% {
    transform: translateY(0);
    opacity: 1; } }
.message main {
  position: relative;
  background: #f0f0f0;
  overflow: hidden; }
  .message main:after {
    content: none; }
  .message main:before {
    content: "";
    width: 100%;
    height: 1858px;
    background-repeat: no-repeat;
    background-size: 1920px auto;
    background-position: center top;
    background-image: url("../images/message/bg.jpg");
    position: absolute;
    left: 0;
    top: 0;
    margin-left: 0; }
  .message main section {
    position: relative;
    z-index: 10; }
  .message main .sec-message {
    width: 1280px;
    margin: 0 auto 84px;
    padding: 0 90px; }
    .message main .sec-message .wrap {
      display: flex;
      background: #fff; }
      .message main .sec-message .wrap .img {
        width: 414px; }
        .message main .sec-message .wrap .img img {
          width: 100%;
          display: block; }
      .message main .sec-message .wrap .detail {
        width: calc(100% - 414px);
        padding: 50px 60px; }
        .message main .sec-message .wrap .detail h2 {
          font-size: 29px;
          font-weight: bold;
          line-height: 1.5;
          margin: 0 0 33px;
          text-align: left; }
        .message main .sec-message .wrap .detail .text p {
          font-size: 15px;
          font-weight: 400;
          line-height: 1.8;
          letter-spacing: 0.1em; }
          .message main .sec-message .wrap .detail .text p + p {
            margin: 30px 0 0; }
        .message main .sec-message .wrap .detail .sign {
          margin: 40px 0 0; }
          .message main .sec-message .wrap .detail .sign p {
            display: flex;
            justify-content: flex-end;
            align-items: center; }
            .message main .sec-message .wrap .detail .sign p span {
              font-size: 11px;
              font-weight: 500;
              font-stretch: normal;
              font-style: normal; }
            .message main .sec-message .wrap .detail .sign p img {
              display: block;
              width: 181px;
              margin-left: 15px; }

@media (min-width: 1921px) {
  .message main:before {
    background-size: cover; } }
@media (max-width: 768px) {
  .message main:after {
    content: none; }
  .message main:before {
    height: 67.676vw;
    background-size: 100% auto;
    background-position: center top;
    background-image: url("../images/common/bg-subpage-pattern02@sp.jpg");
    position: absolute;
    left: 0;
    top: 20.313vw;
    margin-left: 0; }
  .message main .sec-message {
    width: 100%;
    margin: 0 auto 13.672vw;
    padding: 0; }
    .message main .sec-message .wrap {
      display: block;
      padding: 0; }
      .message main .sec-message .wrap .img {
        width: 100%; }
      .message main .sec-message .wrap .detail {
        width: 100%;
        padding: 13.672vw 7.617vw; }
        .message main .sec-message .wrap .detail h2 {
          font-size: 5.9vw;
          white-space: nowrap;
          letter-spacing: -0.04em; }
        .message main .sec-message .wrap .detail .text p {
          font-size: 3.223vw;
          line-height: 1.73; }
          .message main .sec-message .wrap .detail .text p + p {
            margin: 6.348vw 0 0; }
        .message main .sec-message .wrap .detail .sign {
          margin: 10.156vw 0 0; }
          .message main .sec-message .wrap .detail .sign p span {
            font-size: 2.539vw;
            letter-spacing: -0.01em; }
          .message main .sec-message .wrap .detail .sign p img {
            width: 33.496vw;
            margin-left: 3.809vw; }
  .message .btn-base {
    margin-bottom: 27.344vw; } }