@charset "UTF-8";
.lower_arrow_link {
    text-align: right
}
.lower_arrow_link span {
    font-size: 1.4rem;
    position: relative;
    display: inline-block;
    padding: 0 .5em 0 .75em;
    height: 20px;
    font-size: 1.4rem;
    color: #fff;
    font-weight: 400;
    line-height: 1.5em;
    margin: 2rem 1rem 0 0
}
@-moz-document url-prefix() {
    .lower_arrow_link span {
        line-height: 1.4em
    }
}
.lower_arrow_link span:hover {
    opacity: .8
}
.lower_arrow_link span:after {
    content: "";
    position: absolute;
    right: -10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 10px
}
.pink .lower_arrow_link span {
    background-color: #ee86a8
}
.pink .lower_arrow_link span:after {
    border-color: transparent transparent transparent #ee86a8
}
.green .lower_arrow_link span {
    background-color: #3ab483
}
.green .lower_arrow_link span:after {
    border-color: transparent transparent transparent #3ab483
}
.orange .lower_arrow_link span {
    background-color: #f08300
}
.orange .lower_arrow_link span:after {
    border-color: transparent transparent transparent #f08300
}
.lightBlue .lower_arrow_link span {
    background-color: #8a599a
}
.lightBlue .lower_arrow_link span:after {
    border-color: transparent transparent transparent #8a599a
}
.img_caption {
    font-size: 1.3rem;
    text-align: right;
    font-weight: 700;
    margin-top: .3rem
}
@media only screen and (max-width:768px) {
    .lower_arrow_link {
        text-align: initial
    }
    .lower_arrow_link span {
        position: relative;
        margin: 4vw 0 0 0;
        right: 0;
        bottom: 0;
        height: 8vw;
        font-size: 3.73vw;
        line-height: 8vw;
        left: 50%;
        transform: translateX(-50%)
    }
    .lower_arrow_link span:after {
        right: -2.51vw;
        width: 0;
        height: 0;
        border-width: 4vw 0 4vw 2.66vw
    }
    .img_caption {
        font-size: 3.2vw
    }
    .middleTit_caption {
        font-size: 3.733vw;
        margin: 4.6vw 0 -3vw;
        padding: 0 3%
    }
}
@media only screen and (max-width:768px) {
    #intro_sansu #intro_sansu_const.contents .middleTit {
        margin: 0 auto 4.2vw auto
    }
}
@media only screen and (min-width:769px) {
    #intro_sansu_const dl.intro_acList.first dd:nth-child(1) {
        margin-left: 51px
    }
    #intro_sansu_const dl.intro_acList.first dd:nth-child(2) {
        margin-left: 50px;
        padding: 0 .25em
    }
    #intro_sansu_const dl.intro_acList.first dd:nth-child(3) {
        margin-left: 8px;
        padding: 0 .25em
    }
    #intro_sansu_const dl.intro_acList.first dd:nth-child(4) {
        margin-left: 60px
    }
    #intro_sansu_const .intro_acBox {
        margin-top: 20px
    }
    #intro_sansu_const .intro_acImg_box {
        background-color: #fff;
        position: relative
    }
    #intro_sansu_const .intro_imgToggle {
        margin-bottom: 0
    }
    #intro_sansu_const .intro_acImg_box .c_arrow {
        position: absolute;
        top: -21px
    }
    #intro_sansu_const .intro_acImg_box:nth-of-type(1) .c_arrow {
        left: 120px
    }
    #intro_sansu_const .intro_acImg_box:nth-of-type(2) .c_arrow {
        left: 349px
    }
    #intro_sansu_const .intro_acImg_box:nth-of-type(3) .c_arrow {
        left: 540px
    }
    #intro_sansu_const .intro_acImg_box:nth-of-type(4) .c_arrow {
        right: 135px
    }
    .construction_box {
        padding: 30px 23px;
        position: relative
    }
    .construction_box_inner {
        position: relative
    }
    .construction_box_inner:not(:nth-last-of-type(1)) {
        margin-bottom: 30px
    }
    .construction_box_innerL {
        float: left;
        width: 430px
    }
    .construction_box_innerR {
        float: right;
        width: 440px
    }
    .construction_box_inner_tit {
        font-size: 2.2rem
    }
    .construction_box #construction_howto {
        position: absolute;
        top: 151px;
        left: calc(430px+ 44px)
    }
}
@media only screen and (max-width:768px) {
    .construction_menu {
        position: relative;
        font-size: 4.26vw
    }
    .construction_menuL {
        float: left;
        width: 28.5vw;
        margin-right: 2.66vw
    }
    #intro_sansu_const dl.intro_acList#honpen, #intro_sansu_const dl.intro_acList#kantou {
        position: absolute;
        left: calc(28.5vw+ 2.66vw);
        margin: 0
    }
    #honpen, #kanmatsu, #kantou {
        top: calc(3em * 1.75)
    }
    #intro_sansu_const dl.intro_acList#honpen dd {
        margin-bottom: .25em
    }
    .construction_box_inner:not(:nth-last-of-type(1)) {
        padding-bottom: 10.6vw
    }
    .construction_box_inner_tit {
        font-size: 5.33vw;
        margin-top: .25em
    }
    #intro_sansu_const dl.intro_acList > dd {
        margin-bottom: 0
    }
    #intro_sansu_const .intro_acBox {
        margin-bottom: 5.33vw;
        margin-left: -3%;
        padding-top: 5.33vw;
        padding-bottom: 10.6vw;
        width: 106%;
        background-color: #fff
    }
    #intro_sansu_const .intro_acImg_box {
        width: 94%;
        margin: auto
    }
    #intro_sansu_const #construction_howto + .intro_acBox {
        padding-top: 0
    }
    #honpen + .intro_acBox .intro_imgToggle:nth-of-type(1) {
        margin-bottom: 0
    }
    #honpen + .intro_acBox .intro_imgToggle:not(:nth-last-of-type(1)) .intro_btnToggle {
        margin-top: -18.93vw
    }
}
@media only screen and (min-width:769px) {
    .view_intro_imgToggle {
        margin-bottom: 0
    }
}
@media only screen and (max-width:768px) {
    .view_intro_imgToggle:not(: last-child) .intro_btnToggle {
        margin-top: -18.6vw
    }
    .view_intro_imgToggle:nth-child(3) {
        margin-bottom: 5vw
    }
    .view_intro_imgToggle:nth-child(3) .intro_btnToggle {
        margin-top: -15vw
    }
}
@media only screen and (min-width:769px) {
    .textbox_check.textbox_w650 .textbox_checkL {
        width: 650px
    }
    .textbox_check.textbox_w650 .textbox_checkR {
        width: calc(100% - 650px - 9px)
    }
}
.mainTit_spacing {
    letter-spacing: -1.5rem
}
.tutorial_confirm_linkBtn {
    position: absolute;
    top: 16.2rem;
    left: 1rem
}
.tutorial_tool_linkBtn {
    margin-top: 4.6rem
}
@media only screen and (max-width:768px) {
    .tutorial_confirm_linkBtn {
        position: static;
        text-align: center;
        margin-top: 4vw
    }
    .tutorial_tool_linkBtn {
        margin-top: auto;
        margin-bottom: 4vw
    }
}
#intro_sansu #manabiNavi + .textbox_check.bgColor_pink::before {
    border-color: #ffebee
}
.icon_ability_height img {
    height: 11.5rem
}
@media only screen and (max-width:768px) {
    .icon_ability_height img {
        height: 18vw
    }
}
.home_mb {
    margin-bottom: 1.5rem
}
@media only screen and (max-width:768px) {
    .home_mb, .home_mb + a img {
        margin-bottom: 0;
        height: 13vw!important;
        float: left
    }
    .home_mb {
        margin-right: 2vw
    }
}
.icon_interview_height img {
    height: 6rem
}
@media only screen and (max-width:768px) {
    .icon_interview_height img {
        height: 10vw
    }
}
.icon_tamatebako_height img {
    height: 10rem
}
@media only screen and (max-width:768px) {
    .icon_tamatebako_height img {
        height: 18vw
    }
}
.digital_contents_inner_p {
    float: left;
    margin: 1.65rem 0 4rem
}
.digital_contents_ar_link {
    position: relative
}
.digital_contents_ar_link span {
    position: absolute;
    top: -5.4rem;
    right: 16rem
}
.digital_contents_ar_box {
    background-color: #eaf6fd;
    padding: 1rem 2rem;
    margin: 4rem 0 0;
    border-radius: 10px;
    overflow: hidden
}
.digital_contents_ar_tit {
    font-size: 2rem
}
.digital_contents_ar_compatible {
    font-size: 1.4rem
}
.digital_contents_ar_innerbox {
    display: inline-block;
    vertical-align: top;
    margin-top: 1.5rem
}
.digital_contents_ar_innerbox img {
    margin-top: 1rem
}
.icon_app {
    width: 24.5rem;
    margin: 0 2rem
}
@media only screen and (max-width:768px) {
    .digital_contents_inner_p {
        margin: 2vw 0 0
    }
    .digital_contents_ar_link span {
        position: relative;
        top: 0
    }
    .digital_contents_ar_tit {
        font-size: 4.7vw
    }
    .digital_contents_ar_innerbox img {
        margin-top: 0;
        margin-bottom: 2rem
    }
    .icon_app {
        width: 39%;
        margin: 0 5%
    }
    .digital_contents_web_link {
        right: 0;
        height: 8vw;
        font-size: 3.73vw;
        line-height: 8vw
    }
    .digital_contents_web_link:after {
        right: -2.66vw;
        width: 0;
        height: 0;
        border-width: 4vw 0 4vw 2.66vw
    }
}
@media only screen and (max-width:568px) {
    .icon_app {
        margin: 0 4.9%
    }
}
@media only screen and (min-width:769px) {
    .textbox_check.textbox_w510 .textbox_checkL {
        width: 510px
    }
    .textbox_check.textbox_w510 .textbox_checkR {
        width: calc(100% - 510px - 9px)
    }
}
.textbox_current .textbox_checkR img {
    width: 100%;
    height: auto
}
.current_img_caption {
    margin-right: 19.5rem
}
@media only screen and (max-width:768px) {
    .current_img_caption {
        margin-right: 33vw
    }
}
.plan_grade_lists_wrap {
    overflow: hidden
}
.plan_grade_lists {
    letter-spacing: -.4em
}
.plan_grade_lists_wrap:not(:first-child) .plan_grade_lists {
    margin-top: 8rem
}
.plan_grade_list {
    font-size: 1.3rem;
    width: 15.5rem;
    text-align: center;
    vertical-align: middle;
    padding: 1.2rem 0 .8rem;
    margin-right: .5rem;
    letter-spacing: normal;
    background-color: #fff;
    display: inline-block
}
.plan_grade_lists a:last-child .plan_grade_list {
    margin-right: 0
}
.plan_grade_list.active {
    color: #fff
}
.plan_red_color {
    color: #ea5541;
    border: solid .1rem #ea5541;
    border-bottom: solid .4rem #ea5541
}
.plan_grade_list.plan_red_color.active {
    background-color: #ea5541
}
.plan_pink_color {
    color: #f19ec2;
    border: solid .1rem #f19ec2;
    border-bottom: solid .4rem #f19ec2
}
.plan_grade_list.plan_pink_color.active {
    background-color: #f19ec2
}
.plan_orange_color {
    color: #f3994f;
    border: solid .1rem #f3994f;
    border-bottom: solid .4rem #f3994f
}
.plan_grade_list.plan_orange_color.active {
    background-color: #f3994f
}
.plan_blue_color {
    color: #5185c5;
    border: solid .1rem #5185c5;
    border-bottom: solid .4rem #5185c5
}
.plan_grade_list.plan_blue_color.active {
    background-color: #5185c5
}
.plan_lightBlue_color {
    color: #54c3f1;
    border: solid .1rem #54c3f1;
    border-bottom: solid .4rem #54c3f1
}
.plan_grade_list.plan_lightBlue_color.active {
    background-color: #6cbeeb
}
.plan_green_color {
    color: #69bd83;
    border: solid .1rem #69bd83;
    border-bottom: solid .4rem #69bd83
}
.plan_grade_list.plan_green_color.active {
    background-color: #69bd83
}
@media only screen and (min-width:769px) {
    .plan_grade_list:hover {
        color: #fff
    }
    .plan_grade_list.plan_red_color:hover {
        background-color: #ea5541
    }
    .plan_grade_list.plan_pink_color:hover {
        background-color: #f19ec2
    }
    .plan_grade_list.plan_orange_color:hover {
        background-color: #f3994f
    }
    .plan_grade_list.plan_blue_color:hover {
        background-color: #5185c5
    }
    .plan_grade_list.plan_lightBlue_color:hover {
        background-color: #6cbeeb
    }
    .plan_grade_list.plan_green_color:hover {
        background-color: #69bd83
    }
}
.plan_grade_list:before {
    content: "▼";
    display: inline-block;
    margin-right: 1rem
}
.plan_grade_box_l, .plan_grade_box_r {
    width: 48%;
    float: left;
    padding-top: 4.7rem;
    margin-top: -4.7rem
}
.plan_grade_box_l {
    margin-right: 2%
}
.plan_grade_box_r {
    margin-left: 2%
}
.plan_grade_table {
    width: 100%;
    margin-top: 4rem
}
@media only screen and (max-width:768px) {
    .plan_grade_lists:not(: nth-child(2)) {
        margin-top: 6rem!important
    }
    .plan_grade_list {
        font-size: 4vw;
        width: 32.4%;
        margin-right: 1.3%;
        padding: .4rem 0 0
    }
    .plan_grade_lists a:nth-child(-n+3) .plan_grade_list {
        margin-bottom: 1.3%
    }
    .plan_grade_lists a:nth-child(3n) .plan_grade_list {
        margin-right: 0
    }
    .plan_grade_box_l, .plan_grade_box_r {
        width: 100%;
        margin: 0;
        float: none;
        padding-top: 19.5vw;
        margin-top: -19.5vw
    }
}
#intro_sansu_programming .ex_comment_box {
    padding: 24px 18px 24px 24px
}
@media only screen and (min-width:769px) {
    .textbox_programming {
        position: relative
    }
    .textbox_programming .textbox_checkR {
        top: 120px;
        position: absolute;
        right: 0
    }
}
.ex_web_point_box {
    background-color: #fffeee;
    padding: 1rem 2rem;
    font-weight: 700;
    overflow: hidden
}
.ex_web_point_tit {
    font-size: 1.8rem;
    color: #e60012;
    margin-bottom: .5rem
}
.ex_web_points {
    font-size: 1.6rem;
    float: left
}
.ex_web_points + div {
    display: block
}
.ex_web_points dt {
    float: left;
    color: #e60012;
    font-weight: 400
}
.ex_web_points dd {
    margin-left: 2.5rem
}
.ex_web_link {
    height: 8rem
}
#intro_sansu .textbox_ex_web_last::before {
    content: none
}
@media only screen and (min-width:769px) {
    .ex_web_contents_watch_mgn {
        margin-left: 11rem
    }
    .ex_web_support_link {
        margin-top: 3rem
    }
}
@media only screen and (max-width:768px) {
    .ex_web_point_tit {
        font-size: 4.8vw
    }
    .ex_web_points {
        font-size: 4.26vw
    }
    .ex_web_link {
        width: 100%;
        height: auto;
        margin-top: 1rem
    }
    #intro_sansu .textbox_ex_web_last {
        padding-left: 0
    }
}