@charset "UTF-8";
/* ===================================================================
  use toppage
=================================================================== */
/* CSS Document */
/* 画像サイズ調整 ---------------------------------------------------------------------------*/
/* フォントサイズ調整 ---------------------------------------------------------------------------*/
/* ブレークポイント ---------------------------------------------------------------------------*/
/*__ color _______________________*/
/*__ parts _______________________*/
/*---------------------------------------------------------------------------*/
@media screen and (min-width: 768px), print {
    .btn-links {
        width: 1080px;
        margin: 0 auto 108px;
        display: flex;
        flex-wrap: wrap;
    }

    .btn-links * {
        box-sizing: border-box !important;
    }

    .btn-item {
        width: 30%;
        height: 80px;
        margin-bottom: 32px;
        display: table;
        position: relative;
    }

    .btn-item:not(:nth-of-type(3n)) {
        margin-right: 3%;
    }

    .btn-item a {
        display: table-cell;
        width: 100%;
        height: 100%;
        vertical-align: middle;
        padding: 0 24px;
        color: #fff;
        font-size: 14px;
        font-weight: bold;
    }

    .btn-item a::after {
        content: "＞";
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
        color: #fff;
        font-size: 20px;
    }

    .btn-item a span {
        display: block;
        font-weight: normal;
    }

    .btn-item--film {
        background: linear-gradient(to right, #1e8ec4, #48c5fe);
    }

    .btn-item--ra {
        background: linear-gradient(to right, #ff0508, #ff4a63);
    }

    .btn-item--me {
        background: linear-gradient(to right, #028f1c, #22ec43);
    }

    .btn-item--bc {
        background: linear-gradient(to right, #c79f10, #dcc614);
    }

    .btn-item--design {
        background: linear-gradient(to right, #c7004b, #ff0066);
    }

    .btn-item--mc {
        background: linear-gradient(to right, #ba03c5, #ee21e6);
    }

    .btn-item--ci {
        background: linear-gradient(to right, #da6201, #ff7e00);
    }

    .is-coming-soon {
        position: absolute;
        width: 100%;
        height: 100%;
        line-height: 80px;
        text-align: center;
        background-color: rgba(0, 0, 0, 0.7);
        color: #fff;
        font-size: 16px;
        z-index: 10;
    }

    .apply-info {
        max-width: 800px;
        margin: 0 auto 120px;
    }

    .apply-info__ttl {
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        letter-spacing: 0.2rem !important;
        margin-bottom: 32px;
    }

    .apply-info__ttl span {
        font-family: 'Alata', sans-serif;
        font-size: 60px;
        padding: 0 8px;
    }

    .detailBtn {
        margin: 0 auto;
        padding: 1em;
        border: 1px solid #000;
        position: relative;
        width: 50%;
        color: #222;
        font-size: 1.6rem;
        text-align: center;
        cursor: pointer;
        transition: .4s;
    }
    .detailBtn:hover { 
        opacity: 0.7;
    }
    .detailBtn::before {
        border-top: 1px solid #222;
        position: absolute;
        top: 49%;
        right: 5%;
        width: 4%;
        content: "";
    }
    .detailBtn::after {
        border-top: 1px solid #222;
        position: absolute;
        top: 49%;
        right: 5%;
        width: 4%;
        content: "";
        transform: rotate(90deg);
    }
    /* .apply-info__tbl {  display: none;} */

    .apply-info__tbl tr:first-child th {
        background-color: #888888;
        border: 1px solid #acacac;
        border-bottom: 1px solid #fff;
        text-align: center;
        color: #fff;
    }

    .apply-info__tbl th {
        padding: 12px;
        text-align: left;
        color: #fff;
        background-color: #888888;
        border: 1px solid #acacac;
        font-size: 16px;
        font-weight: bold;
    }

    .apply-info__tbl td {
        width: 150px;
        text-align: center;
        border: 1px solid #acacac;
        font-size: 14px;
        font-weight: bold;
    }

    .apply-info__tbl td span {
        font-family: 'Alata', sans-serif;
        font-size: 16px;
        margin-right: 4px;
    }

    .apply-info .note {
        margin-top: 0.5em;
        font-size: 12px;
    }
}

@media screen and (max-width: 767px) {
    .btn-links {
        margin: 0 10px 60px;
        display: flex;
        flex-wrap: wrap;
    }

    .btn-links * {
        box-sizing: border-box !important;
    }

    .btn-item {
        width: 100%;
        height: 80px;
        margin-bottom: 20px;
        display: table;
        position: relative;
    }

    .btn-item a {
        display: table-cell;
        width: 100%;
        height: 100%;
        vertical-align: middle;
        padding: 0 20px;
        color: #fff;
        font-size: 14px;
        font-weight: bold;
    }

    .btn-item a::after {
        content: "＞";
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
        color: #fff;
        font-size: 20px;
    }

    .btn-item a span {
        display: block;
        font-weight: normal;
    }

    .btn-item--film {
        background: linear-gradient(to right, #1e8ec4, #48c5fe);
    }

    .btn-item--ra {
        background: linear-gradient(to right, #ff0508, #ff4a63);
    }

    .btn-item--me {
        background: linear-gradient(to right, #028f1c, #22ec43);
    }

    .btn-item--bc {
        background: linear-gradient(to right, #c79f10, #dcc614);
    }

    .btn-item--design {
        background: linear-gradient(to right, #c7004b, #ff0066);
    }

    .btn-item--mc {
        background: linear-gradient(to right, #ba03c5, #ee21e6);
    }

    .btn-item--ci {
        background: linear-gradient(to right, #da6201, #ff7e00);
    }

    .is-coming-soon {
        position: absolute;
        width: 100%;
        height: 100%;
        line-height: 80px;
        text-align: center;
        background-color: rgba(0, 0, 0, 0.7);
        color: #fff;
        font-size: 16px;
        z-index: 10;
    }

    .apply-info {
        padding: 0 10px;
        margin: 0 auto 60px;
    }

    .apply-info__ttl {
        text-align: center;
        font-size: 16px;
        font-weight: bold;
        letter-spacing: 0.2rem !important;
        margin-bottom: 28px;
    }

    .apply-info__ttl span {
        font-family: 'Alata', sans-serif;
        font-size: 44px;
        padding: 0 6px;
    }

    .detailBtn {
        margin: 0 auto;
        padding: 1em;
        border: 1px solid #000;
        position: relative;
        width: 80%;
        color: #222;
        font-size: 1.6rem;
        text-align: center;
        cursor: pointer;
        transition: .4s;
    }
    .detailBtn:hover { 
        opacity: 0.7;
    }
    .detailBtn::before {
        border-top: 1px solid #222;
        position: absolute;
        top: 49%;
        right: 5%;
        width: 4%;
        content: "";
    }
    .detailBtn::after {
        border-top: 1px solid #222;
        position: absolute;
        top: 49%;
        right: 5%;
        width: 4%;
        content: "";
        transform: rotate(90deg);
    }
    /* .apply-info__tbl {  display: none;} */

    .apply-info__tbl tr:first-child th {
        background-color: #888888;
        border: 1px solid #acacac;
        border-bottom: 1px solid #fff;
        text-align: center;
        color: #fff;
    }

    .apply-info__tbl th {
        padding: 10px;
        text-align: left;
        color: #fff;
        background-color: #888888;
        border: 1px solid #acacac;
        font-size: 14px;
        font-weight: bold;
    }

    .apply-info__tbl td {
        width: 100px;
        text-align: center;
        border: 1px solid #acacac;
        font-size: 12px;
        font-weight: bold;
    }

    .apply-info__tbl td span {
        font-family: 'Alata', sans-serif;
        font-size: 14px;
        margin-right: 2px;
    }

    .apply-info .note {
        margin-top: 0.5em;
        font-size: 11px;
    }
}