@charset "utf-8";

/* common */
.l-content .fs-19 { font-size: 19px; }
.l-content .fs-21 { font-size: 21px; }

.l-content .mr55{margin-right: 55px;}

.l-content .color_red { color: #d00; }

.l-content .cvBtn>a {
    width: 350px;
    padding: 14px 0 11px;
    font-size: 17px;
}


/* ancArea */
.l-content .ancArea .ancList {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 15px;
    column-gap: 10px;
}

.l-content .ancArea .ancList>li {
    width: 180px;
}

.l-content .ancArea .ancList>li>a {
    width: 180px;
    font-size: 15px;
    font-weight: bold;
}

/* feature */
.l-content .feature .lead {
    color: #00398c;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
}

.l-content .feature .picArea {
    display: flex;
    justify-content: center;
    position: relative;
}

.l-content .feature .picArea .speechBubble {
    position: absolute;
    padding: 20px 30px;
    border-radius: 10px;
    background: #f1f1f1;
    font-size: 17px;
    font-weight: bold;
}

.l-content .feature .picArea .speechBubble.speechBubble_01 {
    top: 47px;
    left: 163px;
}

.l-content .feature .picArea .speechBubble.speechBubble_01::after {
    position: absolute;
    top: 42px;
    left: 206px;
    width: 28px;
    height: 23px;
    background: url("/maker/misumi/mech/special/actuator_portal/ra/beginner/intro/img/arrow_speechBubble01.png");
    content: "";
}

.l-content .feature .picArea .speechBubble.speechBubble_02 {
    top: 176px;
    left: 108px;
}

.l-content .feature .picArea .speechBubble.speechBubble_02::after {
    position: absolute;
    top: 39px;
    left: 174px;
    width: 28px;
    height: 23px;
    background: url("/maker/misumi/mech/special/actuator_portal/ra/beginner/intro/img/arrow_speechBubble02.png");
    content: "";
}

.l-content .feature .picArea .speechBubble.speechBubble_03 {
    top: 72px;
    left: 648px;
}

.l-content .feature .picArea .speechBubble.speechBubble_03::after {
    position: absolute;
    top: 73px;
    left: -24px;
    width: 26px;
    height: 20px;
    background: url("/maker/misumi/mech/special/actuator_portal/ra/beginner/intro/img/arrow_speechBubble03.png");
    content: "";
}

.l-content .feature .picArea .speechBubble.speechBubble_04 {
    top: 236px;
    left: 578px;
}

.l-content .feature .picArea .speechBubble.speechBubble_04::after {
    position: absolute;
    top: 33px;
    left: -25px;
    width: 32px;
    height: 23px;
    background: url("/maker/misumi/mech/special/actuator_portal/ra/beginner/intro/img/arrow_speechBubble04.png");
    content: "";
}

.l-content .feature .picArea .speechBubble .num {
    font-size: 19px;
}

.l-content .feature .pointArea {
    padding: 30px 20px 30px 30px;
    background: #eee;
}

.l-content .feature .pointArea .point {
    display: flex;
    justify-content: space-between;
}

.l-content .feature .pointArea .point .counter {
    width: 120px;
    padding: 8px 0 3px;
    background: #00398c;
    color: #fff;
    font-size: 19px;
    font-weight: bold;
    text-align: center;
}

.l-content .feature .pointArea .point .counter .num {
    font-size: 23px;
}

.l-content .feature .pointArea .point .title {
    color: #00398c;
    font-size: 19px;
    font-weight: bold;
}


.l-content .feature .pointArea .point .pic {
    width: 400px;
}

.l-content .feature .pointArea .point.point_02 .pic .caption {
    color: #00398c;
    font-size: 15px;
    font-weight: bold;
}

.l-content .feature .pointArea .point.point_02 .pic .caption .price {
    font-size: 19px;
}

.l-content .feature .pointArea .point.point_02 .pic .note {
    font-size: 12px;
}

/* movie */
.l-content .movie .lead {
    color: #00398c;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
}

/* driver */
.l-content .driver .summaryArea {
    display: flex;
    justify-content: space-between;
    padding: 0 30px;
}

.l-content .driver .detailArea {
    display: flex;
    justify-content: space-between;
    padding: 0 10px;
}

.l-content .driver .detailArea .box {
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    width: 450px;
    padding: 15px 0 25px;
    border: 1px solid #ccc;
}

.l-content .driver .detailArea .box .head {
    margin-bottom: 10px;
    font-size: 21px;
    font-weight: bold;
    text-align: center;
}

.l-content .driver .detailArea .box .caption {
    width: 380px;
    padding: 12px 0 9px;
    text-align: center;
}

.l-content .driver .detailArea .box.before .caption {
    background: #ffeade;
}

.l-content .driver .detailArea .box.before .pic {
    position: relative;
}

.l-content .driver .detailArea .box.before .pic::after {
    position: absolute;
    top: 50%;
    right: -77px;
    border-top: 53px solid transparent;
    border-bottom: 53px solid transparent;
    border-left: 50px solid #00398c;
    transform: translateY(-50%);
    content: "";
}

.l-content .driver .detailArea .box.after .caption {
    background: #e5ebf3;
}

/* service */
.l-content .service .box {
    box-sizing: border-box;
    width: 930px;
    padding: 20px 25px;
    border: 3px solid #00398c;
    margin: 0 auto;
}

.l-content .service .box .head {
    color: #00398c;
    font-size: 25px;
    font-weight: bold;
}

.l-content .service .box.box_02 .toolList {
    display: flex;
    justify-content: center;
    gap: 70px;
}

.l-content .service .box.box_02 .toolList .tool .name {
    font-size: 15px;
    font-weight: bold;
}

.l-content .service .box.box_02 .toolList .tool .name::before {
    color: #a4a8d4;
    content: "●";
}

.l-content .service .box.box_02 .toolList .tool .pic {
    height: 105px;
}

.l-content .service .box.box_02 .toolList .tool .txt {
    height: 39px
}

.l-content .service .box.box_03 .icon {
    display: inline-block;
    box-sizing: border-box;
    width: 66px;
    padding: 2px 0 0;
    border: 2px solid #00398c;
    color: #00398c;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}

.l-content .service .box.box_03 .supportList {
    display: flex;
    justify-content: center;
    gap: 50px;
}

.l-content .service .box.box_03 .supportList .support {
    position: relative;
    width: 150px;
    height: 140px;
}

.l-content .service .box.box_03 .supportList .support .caption {
    position: absolute;
    bottom: 1px;
    left: 50%;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    word-break: keep-all;
    transform: translateX(-50%);
}

.l-content .service .m-asideSubBox .m-asideSubBox__ttl {
    padding: 12px 0 10px;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
}

.l-content .service .m-asideSubBox .m-asideSubBox__main {
    padding: 15px 0;
}

.l-content .service .m-asideSubBox .m-asideSubBox__main .contact {
    display: flex;
    align-items: center;
    justify-content: center;
}

.l-content .service .m-asideSubBox .m-asideSubBox__main .contact .tel {
    font-size: 16px;
    font-weight: bold;
}

.l-content .service .m-asideSubBox .m-asideSubBox__main .contact .tel .num {
    font-size: 24px;
}

/* lineup */
.l-content .lineup .wrapper {
    position: relative;
    box-sizing: border-box;
    width: 930px;
    height: 630px;
    border: 1px solid #c9c9c9;
    margin: 0 auto;
}

.l-content .lineup .wrapper .pic {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    transform: translate(-50%, -50%);
}

.l-content .lineup .wrapper .captionArea {
    display: flex;
    gap: 60px;
    position: absolute;
    top: 15px;
    left: 10px;
}

.l-content .lineup .wrapper .captionArea .caption {
    display: flex;
    align-items: center;
}

.l-content .lineup .wrapper .captionArea .caption .txt {
    font-size: 12px;
}

.l-content .lineup .wrapper .captionArea .caption .icon {
    display: flex;
    align-items: center;
    height: 40px;
    padding: 2px 12px 0;
    color: #fff;
    font-weight: bold;
    text-align: center;
}

.l-content .lineup .wrapper .captionArea .caption .icon.icon_blue {
    background: #3e5ca9;
}

.l-content .lineup .wrapper .captionArea .caption .icon.icon_green {
    background: #00577d;
}

/* case */
.l-content .case .wrapper {
    display: flex;
    justify-content: center;
    gap: 50px;
}

/* faq */
.l-content .faq .lead {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    font-size: 25px;
    font-weight: bold;
    line-height: 1;
}

/* campaign_box */
.l-content .campaign_box {width: 840px;box-sizing: border-box;border: 10px solid #3e5ca9;margin: 20px auto 50px;padding: 10px;}
.l-content .campaign_box .cam_box_title {background: #3e5ca9;color: #fff;text-align: center;padding: 15px 0 5px;font-size: 25px;font-weight: bold;line-height: 34px;margin: 0 0 11px;}
.l-content .campaign_box .cam_box_title span {
    font-size: 33px;
    color: #fff600;
}
.l-content .col2_wrap{
    display: flex;
    justify-content: center;
    align-items: center;
}
.l-content .col_inner{}
