/* ================================
BASE
================================ */
.pc {
  display: block; }
  @media screen and (max-width: 897px) {
    .pc {
      display: none; } }

.sp {
  display: none; }
  @media screen and (max-width: 897px) {
    .sp {
      display: block; } }

.inner {
  max-width: 1080px;
  margin: auto;
  padding: 0 20px; }
  @media screen and (max-width: 897px) {
    .inner {
      padding: 0;
      margin: 0; } }

.wrapper {
  margin: auto;
  padding: 0;
  border-bottom: 1px solid #eee; }
  .wrapper img {
    border: 0;
    padding: 0;
    margin: 0;
    vertical-align: bottom;
    width: 100%; }
  .wrapper a:hover {
    opacity: 0.6; }

.mainview {
  max-width: 1600px;
  margin: auto; }

/* ================================
BASE
================================ */
.cta {
  padding: 60px 0;
  background: #f7f7f7; }
  @media screen and (max-width: 897px) {
    .cta {
      padding: 20px; } }
  .cta__box {
    max-width: 960px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 40px;
    margin: auto; }
    @media screen and (max-width: 897px) {
      .cta__box {
        padding: 20px; } }
    .cta__box__headline {
      padding: 0 0 20px 0; }
      @media screen and (max-width: 897px) {
        .cta__box__headline {
          padding: 0 0 12px 0; } }
      .cta__box__headline h2 {
        font-size: 2.6rem;
        text-align: center;
        font-weight: 700; }
        @media screen and (max-width: 897px) {
          .cta__box__headline h2 {
            font-size: 1.7rem; } }
    .cta__box__btn {
      display: flex;
      justify-content: space-between;
      align-items: center; }
      @media screen and (max-width: 897px) {
        .cta__box__btn {
          display: block; } }
      .cta__box__btn__item {
        width: 48%;
        border-radius: 8px; }
        @media screen and (max-width: 897px) {
          .cta__box__btn__item {
            width: 100%; } }
        .cta__box__btn__item a {
          position: relative;
          background: #222;
          min-height: 80px;
          display: flex;
          align-items: center;
          justify-content: center;
          text-align: center;
          color: #fff;
          padding: 0 60px;
          font-size: 1.7rem; }
          @media screen and (max-width: 897px) {
            .cta__box__btn__item a {
              font-size: 1.4rem;
              min-height: 60px; } }
          .cta__box__btn__item a .btn__text {
            display: inline-block; }
          .cta__box__btn__item a .arrow-icon {
            position: absolute;
            right: 20px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 1em; }
          .cta__box__btn__item a:hover {
            opacity: 0.8 !important;
            color: #eee; }
        @media screen and (max-width: 897px) {
          .cta__box__btn__item:not(:last-of-type) {
            padding: 0 0 20px 0; } }

.fair {
  padding: 60px 0; }
  @media screen and (max-width: 897px) {
    .fair {
      padding: 0;
      margin: 0; } }
  .fair p {
    margin: 0;
    padding: 0; }
  .fair .inbox {
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; }
    @media screen and (max-width: 897px) {
      .fair .inbox {
        box-shadow: none; } }

.club {
  padding: 60px 0; }
  @media screen and (max-width: 897px) {
    .club {
      padding: 20px; } }
  .club__headline {
    padding: 0 0 20px 0; }
    @media screen and (max-width: 897px) {
      .club__headline {
        padding: 0 0 12px 0; } }
    .club__headline h2 {
      font-size: 3.2rem;
      text-align: center;
      font-weight: 700; }
      @media screen and (max-width: 897px) {
        .club__headline h2 {
          font-size: 1.8rem; } }
  .club__box {
    max-width: 800px;
    margin: auto; }
