@charset "UTF-8";
.mv_wrap {
    height: 618px;
    position: relative;
    background: url(../img/copilot_mv_bg.png) center bottom / cover no-repeat;
}
.mv_in {
    padding: 0 60px;
}
.mv_ttl {
    padding-top: 123px;
}
.mv_ttl .read {
    font-weight: bold;
    font-size: 22px;
    line-height: 1.72;
    color: #347ec0;
    position: relative;
    margin-bottom: 32px;
}
.mv_ttl .ttl {
    margin-bottom: 60px;
}
.mv_ttl .txt {
    font-weight: bold;
    font-size: 20px;
    line-height: 36px;
    text-align: left;
    margin-bottom: 48px;
}
.mv_ttl .img {
    overflow: hidden;
    width: 575px;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -212px;
    z-index: 1;
}
.mv_cv {
    display: flex;
    z-index: 2;
    display: flex;
}
.mv_cv .c-btn {
    width: 300px;
    max-width: 300px;
    height: 70px;
    margin-right: 20px;
}
.mv_cv .c-btn a {
    border-radius: 0;
    background: #6bc1e6;
    color: #fff;
    font-size: 18px;
    position: relative;
}
.mv_cv .c-btn a:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(18deg, rgba(107,193,230,1) 0%, rgba(51,123,190,1) 100%);
    z-index: 1;
    transition: .2s ease-out;
}
.mv_cv .c-btn a span {
    position: relative;
    z-index: 2;
}
.mv_cv .c-btn.is-ver2 a {
    border: 2px solid #347EC0;
    background: #fff;
    color: #347EC0;
}
.mv_cv .c-btn.is-ver2 a:before {
    content: none;
}
#page5.page_wrap {
    position: relative;
}
.read_box {
    padding: 70px 0 102px;
    position: relative;
    background: rgb(106,192,229);
    background: linear-gradient(210deg, rgba(106,192,229,1) 0%, rgba(28,71,110,1) 100%);
}
.read_box:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(../svg/ment_read_bg2.svg) no-repeat center / cover;
    z-index: 1;
}
.read_lst {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 60px 84px;
    position: relative;
    z-index: 2;
    margin-top: 84px;
}
.read_lst li {
    width: 540px;
    box-sizing: border-box;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0px 0px 20px rgba(52, 126, 192, 0.1);
    padding: 34px 38px;
    padding-left: 200px;
    position: relative;
}
.read_lst li .nmb {
    position: absolute;
    left: 18px;
    top: -28px;
}
.read_lst li .ttl {
    font-weight: bold;
    font-size: 22px;
    line-height: 1.4;
    color: #347ec0;
    margin-bottom: 10px;
}
.read_lst li .txt {
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
}
.read_lst li .img {
    position: absolute;
    left: 24px;
    top: 50%;
    transform: translateY(-50%);
}
.page_ttl {
    text-align: center;
}
.page_ttl .ttl {
    margin-top: -26px;
    font-weight: bold;
    font-size: 40px;
    line-height: 1;
    color: #000;
    position: relative;
    padding-bottom: 28px;
}
.page_ttl.is-ver2 .ttl {
    color: #fff;
}
.page_ttl .ttl:before {
    content: '';
    display: block;
    width: 100px;
    height: 1px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background: #6ac0e5;
    z-index: 1;
}
#page1.page_wrap {
    background: #fff;
    margin-top: 100px;
}
#page1 .page_in {
    max-width: 1340px;
    background: #EDF7FE;
    border-radius: 30px;
    padding: 98px 0 112px;
}
.solu_read {
    margin-top: 72px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 42px;
}
.solu_read .ttl {
    font-weight: bold;
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 8px;
}
.solu_read .txt {
    font-weight: 500;
    font-size: 16px;
    line-height: 28px;
}
.solu_lst {
    margin-top: 86px;
    padding: 0 92px;
}
.solu_box {
    position: relative;
    margin-bottom: 62px;
}
.solu_box:last-child {
    margin-bottom: 0;
}
.solu_box .box {
    width: 550px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgb(52,126,192);
    box-sizing: border-box;
    padding: 38px 40px 32px;
}
.solu_box .nmb {
    position: absolute;
    top: -32px;
}
.solu_box .ttl {
    font-weight: bold;
    font-size: 34px;
    line-height: 1.35;
    color: #fff;
    margin-bottom: 24px;
}
.solu_box .ttl span {
    color: #FFE623;
}
.solu_box .txt {
    font-weight: 500;
    font-size: 16px;
    line-height: 2;
    color: #fff;
}
.func_wrap {
    margin-top: 110px;
}
.func_ttl {
    font-weight: bold;
    font-size: 36px;
    line-height: 1;
    text-align: center;
    color: #347ec0;
}
.func_lst {
    display: flex;
    justify-content: center;
    gap: 0 38px;
    margin-top: 82px;
}
.func_box {
    width: 360px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0px 0px 20px rgba(52, 126, 192, 0.1);
    position: relative;
    box-sizing: border-box;
    padding: 30px 30px;
}
.func_box .nmb {
    position: absolute;
    left: -16px;
    top: -28px;
}
.func_box .ttl {
    font-weight: bold;
    font-size: 22px;
    line-height: 1.27;
    color: #347ec0;
    margin-bottom: 16px;
}
.func_box .txt {
    font-weight: 500;
    font-size: 16px;
    line-height: 1.75;
}
#page2.page_wrap {
    background: #fff;
    padding: 128px 0 156px;
}
.exam_lst {
    margin-top: 64px;
}
.exam_box {
    position: relative;
    box-sizing: border-box;
    padding: 62px 76px 56px;
    background: #F7F7FA;
    margin-bottom: 82px;
}
.exam_box:last-child {
    margin-bottom: 0;
}
.exam_box .read {
    position: absolute;
    left: 76px;
    top:-15px;
    background: #347EC0;
    font-weight: bold;
    font-size: 18px;
    line-height: 1;
    color: #fff;
    padding: 13px 20px;
}
.exam_box .read:before {
    content: '';
    display: block;
    position: absolute;
    left: -8px;
    top: 0;
    z-index: 2;
    background: #6AC0E5;
    height: calc(30px / 2);
    width: 8px;
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
.exam_box .ttl {
    font-weight: 500;
    font-size: 24px;
    line-height: 1.3;
    margin-bottom: 40px;
}
.exam_box .box {
    display: flex;
    gap: 0 52px;
}
.exam_box .txt {
    font-weight: 500;
    font-size: 16px;
    line-height: 2;
}
#page3.page_wrap {
    background: #F7F7FA;
    padding: 120px 0 122px;
}
.voice_lst {
    display: flex;
    justify-content: center;
    gap: 0 36px;
    margin-top: 64px;
}
.voice_box {
    width: 360px;
    box-sizing: border-box;
    padding: 20px 20px;
    background: #fff;
}
.voice_box .img {
    text-align: center;
    margin-bottom: 20px;
}
.voice_box .ttl {
    font-weight: bold;
    font-size: 24px;
    line-height: 1.16;
    color: #347ec0;
    margin-bottom: 10px;
}
.voice_box .person {
    font-weight: bold;
    font-size: 16px;
    line-height: 2.25;
    color: #333;
    margin-bottom: 14px;
}
.voice_box .txt {
    font-weight: 500;
    font-size: 14px;
    line-height: 1.71;
}
#page4.page_wrap {
    background: #fff;
    padding: 106px 0 165px;
}
.faq_lst {
    margin-top: 85px;
    border-top: 1px solid #deded3;
}
.faq_box {
    border-bottom: 1px solid #deded3;;
}
.faq_box .ttl {
    font-weight: 500;
    font-size: 18px;
    line-height: 1.55;
}
.faq_box .ttl a {
    display: block;
    color: #347ec0;
    text-decoration: none;
    padding: 36px 28px;
    position: relative;
}
.faq_box .ttl a:before {
    content: '';
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    right: 28px;
    top: 50%;
    transform: translateY(-50%);
    background: url(../svg/icn_down.svg) no-repeat center / 100% auto;
    z-index: 1;
    transition: .2s ease-out;
}
.faq_box .ttl span {
    position: relative;
    padding-left: 2.5em;
}
.faq_box .ttl span:before,
.faq_box .txt:before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    left: 0;
    top: 2px;
    z-index: 1;
}
.faq_box .ttl span:before {
    background: url(../svg/faq_q.svg) no-repeat center / 100% auto;
}
.faq_box .txt:before {
    background: url(../svg/faq_a.svg) no-repeat center / 100% auto;
}
.faq_box .box {
    padding: 20px 28px 30px;
}
.faq_box .txt {
    font-size: 16px;
    line-height: 1.75;
    position: relative;
    padding-left: 2.5em;
}
.faq_box .box {
    display: none;
}
.faq_box.is-open .box {
    display: block;
}
.faq_box.is-open .ttl a:before {
    background: url(../svg/icn_up.svg) no-repeat center / 100% auto;
}
.read_in {
    margin-bottom: 80px;
}
.read_in:last-child {
    margin-bottom: 0;
}
.read_in.is-ver2 .page_ttl .ttl {
    margin-top: 0;
    padding-bottom: 106px;
}
.read_in.is-ver2 .page_ttl .ttl:before {
    width: 66px;
    height: 66px;
    background: url(../svg/icn_plus.svg) no-repeat center / 100% auto;
}
.read_in.is-ver2 .read_lst {
    margin-top: 53px;
}
@media only screen and (min-width:1164px) {
    .read_in.is-ver2 .read_lst li {
        width: 100%;
        max-width: 1164px;
        padding: 48px 38px 48px 206px;
    }
    .read_in.is-ver2 .read_lst li .img {
        left: 47px;
    }
}
@media only screen and (min-width:1020px) {
    .solu_box:nth-of-type(odd) .box {
        right: 0;
        background: linear-gradient(162deg, rgba(52,126,192,1) 0%, rgba(106,192,229,1) 100%);
        border-radius: 0 0 30px 0;
    }
    .solu_box:nth-of-type(odd) .nmb {
        right: 30px;
    }
    .solu_box:nth-child(1) .nmb {
        right: 34px;
    }
    .solu_box:nth-of-type(even) .box {
        left: 0;
        background: linear-gradient(212deg, rgba(52,126,192,1) 0%, rgba(106,192,229,1) 100%);
        border-radius: 0 0 0 30px;
    }
    .solu_box:nth-of-type(even) .nmb {
        left: 44px;
    }
    .solu_box:nth-of-type(even) .img {
        text-align: right;
    }
}
@media only screen and (min-width:767px) {
    .mv_cv .c-btn a:hover:before {
        opacity: 0;
    }
    .mv_cv .c-btn.is-ver2 a:hover {
        background: #347EC0;
        color: #fff;
    }
    .faq_box .ttl a:hover {
        opacity: .8;
    }
}
@media screen and (min-width:1240px) and (max-width:1360px) {
    .solu_lst {
        padding: 0 40px;
    }
    .mv_in {
        padding: 0;
    }
}
@media screen and (min-width:767px) and (max-width:1240px) {
    .mv_wrap {
        height: 49.839vw;
    }
    .mv_in {
        padding: 0 4.839vw 0 3.839vw;
    }
    .mv_ttl {
        padding-top: 9.919vw;
    }
    .mv_ttl .read {
        font-size: 1.774vw;
    }
    .mv_ttl .ttl {
        margin-bottom: 4.839vw;
    }
    .mv_ttl .ttl source,
    .mv_ttl .ttl img {
        width: 48.548vw;
        height: auto;
    }
    .mv_ttl .txt {
        font-size: 1.613vw;
        line-height: 2.903vw;
        margin-bottom: 3.871vw;
    }
    .mv_ttl .img {
        width: 42.371vw;
        height: 34.274vw;
        margin-top: -17.097vw;
    }
    .mv_ttl .img source,
    .mv_ttl .img img {
        width: auto;
        height: 100%;
    }
    .mv_cv .c-btn {
        width: 24.194vw;
        max-width: 24.194vw;
        height: 5.645vw;
        margin-right: 1.613vw;
    }
    .mv_cv .c-btn a {
        font-size: 1.452vw;
    }
    .solu_box .img source,
    .solu_box .img img {
        width: 52.823vw;
        height: auto;
    }
    .solu_box .box {
        width: 44.355vw;
        padding: 3.065vw 3.226vw 2.581vw;
    }
    .solu_lst {
        padding: 0 20px;
    }
    .func_lst {
        padding: 0 20px;
        gap: 0 2%;
    }
    .func_box {
        width: 31%;
    }
    #page2.page_wrap {
        padding-left: 20px;
        padding-right: 20px;
    }
    .exam_box {
        padding: 62px 40px 56px;
    }
    #page3.page_wrap {
        padding-left: 20px;
        padding-right: 20px;
    }
    .voice_lst {
        gap: 0 1.613vw;
    }
    .voice_box .img source,
    .voice_box .img img {
        width: 100%;
        height: auto;
    }
    .voice_box {
        width: 30vw;
    }
    #page4.page_wrap {
        padding-left: 20px;
        padding-right: 20px;
    }
}
@media screen and (min-width:767px) and (max-width:1163px) {

}
@media screen and (min-width:767px) and (max-width:1020px) {
    .solu_read {
        display: block;
    }
    .solu_read .img {
        text-align: center;
        margin-bottom: 32px;
    }
    .solu_read .box {
        text-align: center;
    }
    .solu_lst {
        margin-top: 34px;
        padding: 0;
    }
    .solu_box {
        position: relative;
        margin-bottom: 38px;
    }
    .solu_box .img {
        text-align: center;
    }
    .solu_box .img source,
    .solu_box .img img {
        width: 100%;
        max-width: 600px;
        height: auto;
    }
    .solu_box .box {
        width: 600px;
        box-sizing: border-box;
        position: relative;
        top: auto;
        transform: none;
        padding: 30px 20px;
        background: linear-gradient(162deg, rgba(52,126,192,1) 0%, rgba(106,192,229,1) 100%);
        border-radius: 0 0 30px 0;
        margin: 0 auto;
        margin-top: -30px;
    }
    .solu_box .nmb {
        position: absolute;
        right: 16px;
        top: -18px;
    }
    .solu_box .ttl {
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 12px;
    }
    .solu_box .txt {
        font-size: 14px;
        line-height: 24px;
    }
    .exam_box {
        padding: 42px 20px 50px;
        margin-bottom: 50px;
    }
    .exam_box .read {
        left: 20px;
        top:-15px;
        font-size: 16px;
        padding: 12px 13px;
    }
    .exam_box .img {
        text-align: center;
        margin-bottom: 18px;
    }
    .exam_box .img source,
    .exam_box .img img {
        width: 100%;
        max-width: 600px;
        height: auto;
    }
    .exam_box .box {
        display: block;
    }
    .func_lst {
        display: block;
        padding: 0 60px;
    }
    .func_box {
        width: 100%;
        margin-bottom: 68px;
    }
    .func_box:last-child {
        margin-bottom: 0;
    }
    .func_box .nmb {
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        top: -28px;
        text-align: center;
    }
    .voice_lst {
        display: block;
        margin-top: 40px;
    }
    .voice_box {
        width: 100%;
        margin-bottom: 40px;
        padding: 20px 20px 40px;
    }
    .voice_box:last-child {
        margin-bottom: 0;
    }
    .voice_box .img source,
    .voice_box .img img {
        width: 100%;
        max-width: 600px;
        height: auto;
    }
}
/*sp*/
@media only screen and (max-width:767px) {
    .mv_wrap {
        height: auto;
        padding-bottom: 58px;
        background: url(../img/sp/copilot_mv_bg.png) center bottom / cover no-repeat;
    }
    .mv_in {
        padding: 0 16px;
    }
    .mv_ttl {
        padding-top: 35px;
    }
    .mv_ttl .read {
        font-size: 16px;
        text-align: center;
        line-height: 1.625;
        margin-bottom: 34px;
    }
    .mv_ttl .ttl {
        text-align: center;
        margin-bottom: 25px;
    }
    .mv_ttl .txt {
        font-size: 16px;
        line-height: 26px;
        margin-bottom: 30px
    }
    .mv_ttl .img {
        text-align: center;
        overflow: hidden;
        width: auto;
        position: static;
        margin: 0;
    }
    .mv_cv {
        display: flex;
        justify-content: center;
        margin-bottom: 52px;
    }
    .mv_cv .c-btn {
        width: 48%;
        max-width: 170px;
        height: 46px;
        margin-right: 18px;
    }
    .mv_cv .c-btn:last-child {
        margin-right: 0;
    }
    .mv_cv .c-btn a {
        font-size: 14px;
    }
    .read_box {
        background: transparent linear-gradient(192deg, #6AC0E5 0%, #1C476E 100%) 0% 0% no-repeat padding-box;
        padding: 50px 0 106px;
    }
    .read_box:before {
        background: url(../svg/sp/ment_read_bg2.svg) no-repeat center / cover;
    }
    .read_lst {
        padding: 0 15px;
        display: block;
        margin-top: 58px;
    }
    .read_lst li {
        width: 100%;
        padding: 48px 25px 25px;
        margin-bottom: 68px;
    }
    .read_lst li:last-child {
        margin-bottom: 0;
    }
    .read_lst li .nmb {
        left: 0;
        right: 0;
        margin: auto;
        top: -28px;
        text-align: center;
    }
    .read_lst li .ttl {
        font-size: 22px;
        text-align: center;
        margin-bottom: 20px;
    }
    .read_lst li .txt {
        font-weight: 500;
        font-size: 16px;
        line-height: 28px;
    }
    .read_lst li .img {
        position: static;
        transform: none;
        text-align: center;
        margin-bottom: 20px;
    }
    .page_ttl {
        text-align: center;
    }
    .page_ttl .ttl {
        margin-top: -13px;
        font-size: 28px;
        line-height: 1.2;
        padding-bottom: 20px;
    }
    .page_ttl .ttl:before {
        width: 72px;
    }
    #page1.page_wrap {
        background: #fff;
        margin-top: 0;
    }
    #page1 .page_in {
        max-width: auto;
        border-radius: 0;
        padding: 48px 15px 80px;
    }
    .solu_read {
        margin-top: 42px;
        display: block;
        align-items: center;
    }
    .solu_read .img {
        text-align: center;
        margin-bottom: 32px;
    }
    .solu_read .ttl {
        font-size: 20px;
        line-height: 28px;
        margin-bottom: 10px;
    }
    .solu_read .txt {
        font-size: 14px;
        line-height: 24px;
    }
    .solu_lst {
        margin-top: 34px;
        padding: 0;
    }
    .solu_box {
        position: relative;
        margin-bottom: 38px;
    }
    .solu_box .img {
        text-align: center;
    }
    .solu_box .img source,
    .solu_box .img img {
        width: 100%;
        max-width: 360px;
        height: auto;
    }
    .solu_box .box {
        width: -webkit-calc(100% - 30px);
        width: calc(100% - 30px);
        box-sizing: border-box;
        position: relative;
        top: auto;
        transform: none;
        padding: 30px 20px;
        background: linear-gradient(162deg, rgba(52,126,192,1) 0%, rgba(106,192,229,1) 100%);
        border-radius: 0 0 30px 0;
        margin: 0 auto;
        margin-top: -30px;
    }
    .solu_box .nmb {
        position: absolute;
        right: 16px;
        top: -18px;
    }
    .solu_box .ttl {
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 12px;
    }
    .solu_box .txt {
        font-size: 14px;
        line-height: 24px;
    }
    .func_wrap {
        margin-top: 62px;
    }
    .func_ttl {
        font-size: 24px;
        line-height: 1.4;
    }
    .func_lst {
        display: block;
        padding: 0 15px;
        margin-top: 58px;
    }
    .func_box {
        width: 100%;
        padding: 32px 25px 30px;
        margin-bottom: 68px;
    }
    .func_box:last-child {
        margin-bottom: 0;
    }
    .func_box .nmb {
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
        top: -28px;
        text-align: center;
    }
    #page2.page_wrap {
        padding: 68px 15px 46px;
    }
    .exam_lst {
        margin-top: 64px;
    }
    .exam_box {
        padding: 42px 20px 50px;
        margin-bottom: 50px;
    }
    .exam_box .read {
        left: 20px;
        top:-15px;
        font-size: 16px;
        padding: 12px 13px;
    }
    .exam_box .ttl {
        font-size: 18px;
        line-height: 1.4;
        margin-bottom: 20px;
    }
    .exam_box .img {
        text-align: center;
        margin-bottom: 18px;
    }
    .exam_box .img source,
    .exam_box .img img {
        width: 100%;
        max-width: 320px;
        height: auto;
    }
    .exam_box .box {
        display: block;
    }
    .exam_box .txt {
        font-size: 14px;
        line-height: 24px;
    }
    #page3.page_wrap {
        padding: 48px 15px 42px;
    }
    .voice_lst {
        display: block;
        margin-top: 40px;
    }
    .voice_box {
        width: 100%;
        padding: 20px 20px 40px;
        margin-bottom: 20px;
    }
    .voice_box:last-child {
        margin-bottom: 0;
    }
    .voice_box .img {
        margin-bottom: 20px;
    }
    .voice_box .img source,
    .voice_box .img img {
        width: 100%;
        max-width: 320px;
        height: auto;
    }
    .voice_box .ttl {
        font-size: 24px;
        margin-bottom: 10px;
    }
    .voice_box .person {
        font-size: 16px;
        line-height: 36px;
        margin-bottom: 14px;
    }
    .voice_box .txt {
        font-size: 14px;
        line-height: 24px;
    }
    #page4.page_wrap {
        padding: 46px 15px 90px;
    }
    .faq_lst {
        margin-top: 35px;
    }
    .faq_box .ttl {
        font-size: 18px;
        line-height: 28px;
    }
    .faq_box .ttl a {
        padding: 17px 0;
        padding-right: 50px;
    }
    .faq_box .ttl a:before {
        width: 30px;
        height: 30px;
        right: 0;
        top: 18px;
        transform: none;
    }
    .faq_box .ttl span {
        display: inline-block;
        padding-left: 2em;
    }
    .faq_box .ttl span:before,
    .faq_box .txt:before {
        width: 23px;
        height: 23px;
        top: 3px;
    }
    .faq_box .box {
        padding: 6px 0 25px;
        padding-right: 50px;
    }
    .faq_box .txt {
        font-size: 16px;
        line-height: 28px;
        padding-left: 2em;
    }
    .faq_box .box {
        display: none;
    }
    .faq_box.is-open .box {
        display: block;
    }
    .faq_box.is-open .ttl a:before {
        background: url(../svg/icn_up.svg) no-repeat center / 100% auto;
    }
    .read_in.is-ver2 .page_ttl .ttl {
        padding-bottom: 70px;
    }
    .read_in.is-ver2 .page_ttl .ttl:before {
        width: 46px;
        height: 46px;
    }
}
@media only screen and (max-width: 340px) {
}