@charset "utf-8";


@media screen and (max-width: 1024px) {
    /* ---------------------------------------------------------------------------------------------------*/
    #sec_minvisual{
        padding: 8vw 0 28vw;
        background: url(../images/top/top_mv_left.svg) -10% 100% no-repeat, url(../images/top/top_mv_right.svg) 110% 100% no-repeat;
        background-size: 44% auto, 44% auto;
    }
    #sec_minvisual h2{
        font-size: 4.5vw;
    }
    #sec_minvisual .scribble_marketing::after{
        font-size: 4.5vw;
        bottom: -1em;
        right: 0;
    }
    #sec_minvisual .scribble_technology::after{
        font-size: 4.5vw;
        bottom: -1em;
        right: 0;
    }

    /* ---------------------------------------------------------------------------------------------------*/
    #sec_mission{
        margin-top: 0;
        padding: 16px 0 0;
        background: #f0f0f0;
    }
    #sec_mission .mission_image{
        height: 40vw;
        width: 100%;
        position: relative;
    }
    #sec_mission .mission_image::before{
        height: 16px;
        width: 90%;
        bottom: -16px;
        right: 5%;
        z-index: 1;
    }
    #sec_mission .mission_message{
        padding: 40px 5%;
        position: relative;
    }
    #sec_mission .mission_message > div{
        padding: 0;
    }
    #sec_mission .mission_message::after{
        content: none;
    }
    #sec_mission .mission_message h2{
        font-size: 36px;
    }
    #sec_mission .mission_message h2 span{
        padding-bottom: 24px;
        font-size: 24px;
    }

    /* --------------------------------------------------------------------------------------------------- */
    #sec_egc{
        margin-top: 80px;
    }
    #sec_egc .inner{
        background-size: 100%;
    }
    #sec_egc .wrap_egc{
        margin-bottom: 40px;
        padding: 32px 6%;
        width: 80%;
    }
    #sec_egc h2{
        font-size: 24px;
    }
    #sec_egc .frame_pg_value{
        margin-top: 16px;
        height: 64px;
    }
    #sec_egc #pg_month_value{
        font-size: 32px;
        line-height: 60px;
    }
    #sec_egc .pg_unit{
        font-size: 16px;
    }

    /* ---------------------------------------------------------------------------------------------------*/
    #sec_news{
        margin-top: 80px;
        background: #FFF;
    }
    #sec_news .inner{
        flex-direction: column;
    }
    #sec_news h2{
        padding-bottom: 64px;
        font-size: 26px;
        width: auto;
        line-height: 1.4em;
        text-align: center;
    }
    #sec_news h2 span{
        padding-bottom: 24px;
        font-size: 18px;
    }
    #sec_news .list_news{
        width: 100%;
    }
    #sec_news h2 span::after{
        left: calc(50% - 40px);
    }
    #sec_news .linkbtn_more{
        margin: 24px auto 0;
        width: 50%;
        display: flex;
        justify-content: center;
        border: 1px solid #CCC;
        line-height: 54px;
        height: 56px;
        border-radius: 28px;
    }
    #sec_news .linkbtn_more:hover,
    #sec_news .linkbtn_more.hover{
        border-color: #8bd140;
    }

    /* ---------------------------------------------------------------------------------------------------*/
    #sec_service{
        margin-top: 80px;
    }
    #sec_service h2{
        font-size: 26px;
        line-height: 1.4em;
    }
    #sec_service h2 span{
        padding-bottom: 24px;
        font-size: 18px;
    }
    #sec_service h2 + p{
        font-size: 16px;
    }
    #sec_service ul.list_service{
        margin-top: 40px;
        width: 100%;
    }
    #sec_service ul.list_service a{
        flex-direction: column;
    }
    #sec_service h3{
        font-size: 18px;
    }
    #sec_service .service_image{
        height: 32vw;
        width: 100%;
    }
    .service_prop{
        padding: 40px;
    }
    .service_prop::before{
        width: calc(100% - 64px);
        height: 16px;
        left: 32px;
        top: 0;
    }

    /* ---------------------------------------------------------------------------------------------------*/
    #sec_wanted{
        margin-top: 80px;
    }
    #sec_wanted h2{
        font-size: 26px;
        line-height: 1.4em;
    }
    #sec_wanted h2 span{
        padding-bottom: 24px;
        font-size: 18px;
    }
    #sec_wanted h2 + p{
        font-size: 16px;
    }
    #sec_wanted .bg_gray{
        padding-bottom: 80px;
    }
    #sec_wanted ul li{
        width: calc(50% - 32px);
    }
    #sec_wanted .thumb{
        height: 25vw;
    }
    #sec_wanted a.linkbtn_inquiry{
        font-size: 18px;
        width: 64%;
    }
}

@media screen and (max-width: 768px) {
    /* ---------------------------------------------------------------------------------------------------*/
    #sec_minvisual{
        padding: 8vw 0 34vw;
        background: url(../images/top/top_mv_sp.svg) 0 100% no-repeat;
        background-size: contain;
    }
    #sec_minvisual h2{
        text-align: center;
        font-size: 6vw;
    }

    /* ---------------------------------------------------------------------------------------------------*/
    #sec_mission .mission_message{
        padding: 56px 5% 40px;
        position: relative;
    }
    #sec_mission .mission_message h2{
        font-size: 26px;
        text-align: center;
    }
    #sec_mission .mission_message h2 span{
        margin-top: 16px;
        font-size: 18px;
        line-height: 1.6em;
    }
    #sec_mission .mission_message h2 span::after{
        left: calc(50% - 40px);
    }

    /* --------------------------------------------------------------------------------------------------- */
    #sec_egc{
        margin-top: 40px;
    }
    #sec_egc .inner {
        background-size: 110% auto;
    }
    #sec_egc .wrap_egc{
        padding: 24px;
        width: 100%;
        display: block;
        position: relative;
    }
    #sec_egc h2{
        text-align: center;
        font-size: 22px;
    }
    #sec_egc .obj_light{
        font-size: 22px;
        position: absolute;
        width: 56px;
        top: -0.5em;
        left: calc(50% - 6.5em);
        transform: rotate(-20deg);
    }
    .wrap_value {
        width: 100%;
    }
    #sec_egc .frame_pg{
        width: 100%;
    }
    #sec_egc #pg_month_value.soon{
        padding: 0;
    }

    /* --------------------------------------------------------------------------------------------------- */
    #sec_news ul li{
        flex-wrap: wrap;
    }
    #sec_news ul li p{
        margin-top: 16px;
        width: 100%;
    }
    #sec_news ul li .label{
        margin: 1px 0 0;
    }
    #sec_news ul li .label span{
        font-size: 12px;
        height: 22px;
        line-height: 21px;
    }
    #sec_news .linkbtn_more{
        width: 80%;
    }

    /* --------------------------------------------------------------------------------------------------- */
    #sec_service h2 + p{
        text-align: justify;
    }
    #sec_service ul.list_service{
        margin-top: 0;
        width: 100%;
        flex-direction: column;
    }
    #sec_service ul.list_service li{
        margin-top: 40px;
        width: 100%;
    }
    #sec_service .service_image{
        height: 40vw;
    }

    /* --------------------------------------------------------------------------------------------------- */
    #sec_wanted h2 + p {
        text-align: justify;
    }
    #sec_wanted .bg_gray {
        margin-top: 56px;
    }
    #sec_wanted ul{
        margin: -24px 0 0;
        top: 0;
    }
    #sec_wanted ul li{
        margin-left: 0;
        width: 100%;
    }
    #sec_wanted .thumb{
        height: 32vw;
    }
    #sec_wanted a.linkbtn_inquiry{
        margin: 16px auto 0;
        width: 90%;
        line-height: 68px;
    }
}