@charset "utf-8";
/* CSS Document */

/* ==============================
 content-title
============================== */
.content_title-wrap {
    min-height: 28vw;
}
.content_title-wrap .title-item h3 {
    font-size: min(5.333vw, 9.6rem);
    line-height: 1.14;
    margin-top: 20px;
}
.content_title-wrap .title-item {
    width: 45.72%; /* 823px */
}
.content_title-wrap .title-item .lead {
    font-size: min(1.111vw,2rem);
    margin-top: 5.8%; /* 38px */
    width: 79.58%; /* 655px */
}
.content_title-wrap .title-img {
    width: 34.7%; /* 626px */
    right: 32.43px; /* 31.02px */
}

.content_title-wrap .title-img::after {
    width: 90.32%; /* 565px */
    height: 98.52%; /* 520px */
    top: -32.43px; /* 32.43px */
    right: -32.43px; /* 31.02px */
}
@media print, screen and (max-width: 1799px) {
    .content_title-wrap .title-item h3 {
        margin-top: 3.05%; /* 20px */
    }
}
@media print, screen and (max-width: 768px) {
    .content_title-wrap {
        min-height: auto;
    }
    .content_title-wrap .title-item {
        width: 94.667vw;
        margin: 6.8vw auto 0;
    }
    .content_title-wrap .title-item h3 {
        font-size: 10.666vw;
    }
    .content_title-wrap .title-item .lead {
        font-size: 3.733vw;
        font-weight: 500;
        line-height: 2;
        margin-top: 5.067vw;
        width: 100%;
    }
    .content_title-wrap .title-img {
        width: 80.547vw;
        position: relative;
        top: 0;
        right: 0;
        margin-top: 13.467vw;
        margin-right: 3.045vw;
        margin-left: auto;
    }
    .content_title-wrap .title-img::after {
        width: 72.8vw;
        height: 66.933vw;
        top: -3.045vw;
        right: -3.045vw;
    }
}


/* ==============================
  ウィングリット 7つの特長
============================== */
#feature-list {
    background: #F3F3F3;
    margin-top: 10.55%; /* 135px */
}

#feature-list .sec-content {
    width: 88.83%; /* 1137px */
    max-width: 1137px;
    margin: 0 auto;
    padding: 3.359vw 0; /* 43px */
}

#feature-list .sec-title .title {
    font-size: min(2.5vw,3.2rem);
    font-weight: bold;
    line-height: 1;
    padding-left: 1.172vw; /* 15px */

    position: relative;
}
#feature-list .sec-title .title::before {
    content: "";
    position: absolute;

    left: 0;
    top: 0;
    height: 100%; /* 29px */
    width: 4px;
    background-color: #0053FF;
}
#feature-list ul {
    display: flex;
    gap: 0.938vw; /* 12px */

    margin-top: 2.266vw; /* 29px */
}

#feature-list ul li {
    background: #ffffff;
    flex: 1;
}

#feature-list ul li a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    height: 9.609vw;
    max-height: 123px;
    padding: 0 6.5%; /* 0 10px */
    text-align: center;

    font-size: min(1.25vw, 1.6rem);
    font-weight: bold;
    line-height: 1.5;
    color: #000000;
    text-decoration: none;
}

#feature-list ul li a span {
    width: 0;
    height: 0;
    border-left: 5px solid transparent; /* 左側の辺 */
    border-right: 5px solid transparent; /* 右側の辺 */
    border-top: 8px solid #0053FF; /* 下側の辺 */
    margin-top: 10px;
}
@media print, screen and (max-width: 768px) {

    #feature-list .sec-content {
        width: 94.8vw;
        max-width: none;
        margin: 0 auto;
        padding: 5.333vw 0 6.8vw;
    }

    #feature-list .sec-title .title {
        font-size: 5.333vw;
        padding-left: 1.82vw;
    }
    #feature-list .sec-title .title::before {
        width: 0.533vw;
    }
    #feature-list ul {
        display: flex;
        flex-wrap: wrap;
        gap: 1.333vw;

        margin-top: 4.4vw;
    }
    #feature-list ul li {
        flex: auto;
    }

    #feature-list ul li.sp-wide {
        width: 30.267vw;
    }
    #feature-list ul li a {
        height: 16.4vw;
        max-height: none;
        padding: 0 1.333vw;

        font-size: 2.667vw;
    }

    #feature-list ul li a span {
        width: 0;
        height: 0;
        border-left: 0.667vw solid transparent; /* 左側の辺 */
        border-right: 0.667vw solid transparent; /* 右側の辺 */
        border-top: 1.067vw solid #0053FF; /* 下側の辺 */
        margin-top: 1.333vw;
    }

}
/* ==============================
  ページ共通
============================== */
.feature-item .sec-content {
    width: 89.06%; /* 1140px */
    max-width: 1140px;
    margin: 0 auto;
    padding: 9.61% 0 0;
    /*padding: 123px 0 94px;*/
}

.feature-item .sec-title span {
    font-size: min(1.875vw,2.4rem);
    font-weight: bold;
    line-height: 1;
    color: #0053FF;
}

.feature-item .sec-title .title {
    font-size: min(3.125vw, 4rem);
    font-weight: bold;
    line-height: 1;

    margin-top: 2.34%; /* 30px */
}

.feature-item .sec-title .text {
    font-size: min(1.406vw, 1.8rem);
    line-height: 1.8;

    margin-top: 2.34%; /* 30px */
}
@media screen and (min-width: 1280px) {
    .feature-item .sec-content {
        padding: 123px 0 0;
    }
}
@media print, screen and (max-width: 768px) {
    .feature-item .sec-content {
        width: 95.2vw;
        max-width: none;
        padding: 19.333vw 0 0;
    }

    .feature-item .sec-title span {
        font-size: 5.333vw;
    }

    .feature-item .sec-title .title {
        font-size: 7.467vw;
        line-height: 1.55;

        margin-top: 4vw;
    }

    .feature-item .sec-title .text {
        font-size: 3.467vw;
        line-height: 2;

        margin-top: 6.667vw;
    }

}

/* ==============================
  01｜豊富な支援実績
============================== */
#feature01 .box-wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.9vw; /* 12px */
    margin-top: 3.13%; /* 40px */
}
#feature01 .box-wrap .box-item {
    background: #EEEEEE;
}
#feature01 .box-wrap .box01,
#feature01 .box-wrap .box02,
#feature01 .box-wrap .box03 {
    width: 32.63%; /* 372px */
}
#feature01 .box-wrap .box04,
#feature01 .box-wrap .box05 {
    padding: 2.72% 3.68% 4.74%; /* 31px 42px 54px */
}
#feature01 .box-wrap .box-item .title {
    font-size: min(1.875vw,2.4rem);
    font-weight: bold;
    color: #0053FF;
    text-align: center;
}
#feature01 .box-wrap .box01 .title,
#feature01 .box-wrap .box02 .title,
#feature01 .box-wrap .box03 .title {
    padding: 14.52% 0 0; /* 54px */    
}
#feature01 .box-wrap .box01 .detail .text {
    font-size: min(3.455vw,4.423rem);
    font-weight: bold;
    text-align: center;
    margin-top: 20.7%; /* 77px */
}

#feature01 .box-wrap .box01 .detail .text span {
    font-size: min(7.752vw, 9.923rem);
}

#feature01 .box-wrap .box02 .detail .img-wrap {
    width: 76.08%; /* 283px */
    margin: 17.74% auto 14.46% 9.14%; /* 66px auto 53.8px 34px */
}

#feature01 .box-wrap .box03 .detail .img-wrap {
    width: 70.16%; /* 261px */
    margin: 17.74% auto 14.46%; /* 66px auto 53.8px */
}

#feature01 .box-wrap .box04 .text,
#feature01 .box-wrap .box05 .text {
    font-size: min(1.25vw, 1.6rem);
    font-weight: 500;
    line-height: 1.5;
    margin-top: 1.93%; /* 22px */
}
@media screen and (min-width: 1280px) {
    #feature01 .box-wrap {
        gap: 0.5vw;
    }
    #feature01 .box-wrap .box01,
    #feature01 .box-wrap .box02,
    #feature01 .box-wrap .box03 {
        width: 370px;
    }
}
@media print, screen and (max-width: 768px) {
    #feature01 .box-wrap {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 2.667vw;
        grid-row-gap: 2.933vw;
        margin-top: 6.667vw;
    }
    #feature01 .box-wrap .box01 {
        grid-area: 1 / 1 / 2 / 3;
        width: auto;
    }
    #feature01 .box-wrap .box02 {
        grid-area: 2 / 1 / 3 / 2;
        width: auto;
    }
    #feature01 .box-wrap .box03 {
        grid-area: 2 / 2 / 3 / 3;
        width: auto;
    }
    #feature01 .box-wrap .box04 {
        grid-area: 3 / 1 / 4 / 3;
        width: auto;
    }
    #feature01 .box-wrap .box05 {
        grid-area: 4 / 1 / 5 / 3;
        width: auto;
    }
    #feature01 .box-wrap .box04,
    #feature01 .box-wrap .box05 {
        padding: 8.667vw 6.133vw 8.8vw;
    }
    #feature01 .box-wrap .box-item .title {
        font-size: 4vw;
        line-height: 1.3;
    }
    #feature01 .box-wrap .box01 .title,
    #feature01 .box-wrap .box02 .title,
    #feature01 .box-wrap .box03 .title {
        padding: 4.6vw 0 0;
    }
    #feature01 .box-wrap .box01 .detail .text {
        font-size: 5.897vw;
        margin: 3.133vw auto 4.267vw;
    }

    #feature01 .box-wrap .box01 .detail .text span {
        font-size: 13.231vw;
    }

    #feature01 .box-wrap .box02 .detail .img-wrap {
        width: 37.84vw;
        margin: 6.533vw auto 3.379vw 3.067vw;
    }

    #feature01 .box-wrap .box03 .detail .img-wrap {
        width: 34.92vw;
        margin: 6.533vw auto 3.441vw;
    }

    #feature01 .box-wrap .box04 .text,
    #feature01 .box-wrap .box05 .text {
        font-size: 3.2vw;
        line-height: 1.55;
        margin-top: 6.133vw; 
    }
}

/* ==============================
  02｜多彩なネットワーク
============================== */
#feature02 .list-wrap {
    background: #EEEEEE;
    padding: 2.19% 2.28% 2.63%; /* 25px 26px 30px */
    margin-top: 3.13%; /* 40px */
}

#feature02 .list-wrap .title {
    background: #000000;
    font-size: min(1.563vw, 2rem);
    font-weight: bold;
    line-height: 2;
    text-align: center;
    color: #FFFFFF;
}

#feature02 .list-wrap .column-wrap {
    display: flex;
    justify-content: center;
    margin-top: 1.23%; /* 14px */
}

#feature02 .list-wrap .column-wrap .column-item {
    display: flex;
}

#feature02 .list-wrap .column-wrap .column-item ul li {
    font-size: min(1.094vw, 1.4rem);
    line-height: 2;
}
#feature02 .list-wrap .column-wrap .column-item + .column-item {
    margin-left: 4.47%; /* 51px */
}
#feature02 .list-wrap .column-wrap .column-item:first-child ul + ul {
    margin-left: 3.047vw; /* 39px*/
}
#feature02 .list-wrap .column-wrap .column-item:last-child ul + ul {
    margin-left: 1.328vw; /* 17px */
}
@media screen and (min-width: 1280px) {
    #feature02 .list-wrap .column-wrap .column-item:first-child ul + ul {
        margin-left: 39px;
    }
    #feature02 .list-wrap .column-wrap .column-item:last-child ul + ul {
        margin-left: 17px;
    }
}
@media print, screen and (max-width: 768px) {
    #feature02 .list-wrap {
        padding:8.833vw 4.667vw;
        margin-top: 6.667vw;
    }

    #feature02 .list-wrap .title {
        font-size: 4vw;
        padding: 1.333vw 0;
        line-height: .75;
    }

    #feature02 .list-wrap .column-wrap {
        display: flex;
        justify-content: flex-start;
        margin-top: 2.933vw;
    }

    #feature02 .list-wrap .column-wrap .column-item {
        display: flex;
        flex-direction: column;
    }
    #feature02 .list-wrap .column-wrap .column-item ul li {
        font-size: 3.2vw;
        line-height: 1.375;
    }
    #feature02 .list-wrap .column-wrap .column-item ul + ul,
    #feature02 .list-wrap .column-wrap .column-item ul li + li {
        margin-top: 2.133vw;
    }
    #feature02 .list-wrap .column-wrap .column-item + .column-item {
        margin-left: 7.243vw;
    }
    #feature02 .list-wrap .column-wrap .column-item:first-child ul + ul {
        margin-left: 0;
    }
    #feature02 .list-wrap .column-wrap .column-item:last-child ul + ul {
        margin-left: 0;
    }
}
/* ==============================
  03｜メンバーの一貫対応
============================== */
#feature03 .img-wrap {
    margin-top: 3.13%; /* 40px */
}

@media print, screen and (max-width: 768px) {
    #feature03 .img-wrap {
        margin-top: 6.667vw;
    }
}

/* ==============================
  04｜UGC領域のトータル支援
============================== */
#feature04 .img-wrap {
    margin-top: 3.13%; /* 40px */
}

@media print, screen and (max-width: 768px) {
    #feature04 .img-wrap {
        margin-top: 6.667vw;
    }
}
/* ==============================
  05｜緻密な調査と戦略設計
============================== */
#feature05 .img-wrap {
    margin-top: 3.13%; /* 40px */
}

@media print, screen and (max-width: 768px) {
    #feature05 .img-wrap {
        margin-top: 6.667vw;
    }
}
/* ==============================
  06｜高精度で迅速なキャスティング
============================== */
#feature06 .column-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 5%;
    margin-left: 1.3%;
}
#feature06 .column-wrap .column-item:first-child {
    width: 48.16%; /* 549px*/
}
#feature06 .column-wrap .column-item:last-child {
    width: 48.51%; /* 553px */
}
#feature06 .column-wrap .column-item .text {
    font-size: min(1.406vw, 1.8rem);
    line-height: 1.88;
}

@media print, screen and (max-width: 768px) {
    #feature06 .column-wrap {
        display: flex;
        flex-direction: column-reverse;
        margin-top: 6.667vw;
        margin-left: 0;
    }
    #feature06 .column-wrap .column-item:first-child,
    #feature06 .column-wrap .column-item:last-child {
        width: auto;
    }
    #feature06 .column-wrap .column-item:first-child {
        margin-top: 6.667vw;
    }
    #feature06 .column-wrap .column-item .text {
        font-size: 3.467vw;
        line-height: 2;
    }
}

/* ==============================
  07｜メディア横断のUGC設計
============================== */
#feature07 .img-wrap {
    margin-top: 3.13%; /* 40px */
}

@media print, screen and (max-width: 768px) {
    #feature07 .img-wrap {
        margin-top: 6.667vw;
    }
}

/* ==============================
  メディア掲載
============================== */
#media.feature-item .sec-title span {
    font-size: min(1.563vw, 2rem);
}
#media.feature-item .sec-title .title {
    font-size: min(3.438vw, 4.4rem);
    margin-top: 0.97%; /* 11px */
}

#media .media-wrap {
    margin-top: 5.89%; /* 67px */
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 4.48%; /* 51px */
    grid-row-gap: 3.984vw; /* 51px */
}
#media .media-wrap .media-item a {
    text-decoration: none;
}
#media .media-wrap .media-item .img-wrap {
    /*width: 26.797vw;*/
    width: 100%;
    height: 18.438vw;
}
#media .media-wrap .media-item .img-wrap img {
    object-fit: cover;
    height: 100%;
}
#media .media-wrap .media-item .detail-wrap {
    margin-top: 8.75%; /* 30px */
}

#media .media-wrap .media-item .detail-wrap .text {
    font-size: min(1.406vw, 1.8rem);
    font-weight: 500;
    line-height: 1.5;
    color: #000;
}

#media .media-wrap .media-item .detail-wrap .media {
    font-size: min(1.25vw, 1.6rem);
    font-weight: 500;
    line-height: 1.68;
    color: #6E6E6E;
}
@media screen and (min-width: 1280px) {
    #media .media-wrap .media-item .img-wrap {
        /*width: 343px;*/
        height: 236px;
    }
}
@media print, screen and (max-width: 768px) {
    #media.feature-item .sec-title span {
        font-size: 5.333vw;
    }
    #media.feature-item .sec-title .title {
        font-size: 7.467vw;
        line-height: 1.55;
        margin-top: 4vw;
    }

    #media .media-wrap {
        margin-top: 6.667vw;
        display: block;
    }
    #media .media-wrap .media-item {
        padding: 0;
    }
    #media .media-wrap .media-item .img-wrap {
        height: 66.733vw;
    }
    #media .media-wrap .media-item + .media-item {
        margin-top: 6.667vw;
    } 
    #media .media-wrap .media-item .detail-wrap {
        margin-top: 3.667vw;
    }
    #media .media-wrap .media-item .detail-wrap .text {
        font-size: 4.6vw;
        line-height: 1.6;
        font-weight: bold;
    }

    #media .media-wrap .media-item .detail-wrap .media {
        font-size: 3.2vw;
        font-weight: 400;
        line-height: 1.44;
        margin-top: 2.052vw;
    }

    /* slick Customize */

    /* 各ドットのボタンのスタイル */
    .slick-dots {
        margin-top: 6.667vw;
        display: flex;
        justify-content: center;
    }
    .slick-dots li button {
        font-size: 0; /* 数字を非表示にする */
        line-height: 0;
        display: block;
        width: 1.333vw; /* ドットの幅 */
        height: 1.333vw; /* ドットの高さ */
        padding: 0;
        border: 0; /* 枠線 */
        background: #D9D9D9; /* 非アクティブ時の背景色 (赤) */
        border-radius: 50%; /* 円形にする */
        cursor: pointer;
        opacity: 0.7;
        transition: all 0.3s;
        margin: 0 1.2vw;
    }

    /* アクティブなドットのスタイル */
    .slick-dots li.slick-active button {
        background: #6E6E6E; /* アクティブ時の背景色 (青) */
        opacity: 1;
        width: 1.333vw;
        height: 1.333vw;
    }
}