@charset "utf-8";
html {font-size: 62.5%;}
h1, h2, h3 {margin: 0; padding: 0;}
section , p , dl, dt, dd, ul, ol, li, a, figcapttion {
    color: #484848;
    line-height: 1.6;
    margin: 0;
    padding: 0;
}

.campaign_contents_wrap {
    overflow: hidden;
}
.campaign_contents_wrap img {
    vertical-align: bottom;
    max-width: 100%;
}

.campaign_contents_wrap a {
    color: #484848;
    text-decotration: none;
}

/* ----------------------------------------
 smartphone 
------------------------------------------- */
/* header_banner非表示
------------------------------ */
.header_bnr_link {display: none;}

.sp_none {
    display: none;
}
.tb_on {
    display: none;
}

.inner {
    padding: 20px 5%;
}

.campaign {
    font-size: 1.5rem;
}

.campaign h2 {
    background: #002F6F;
    color: #fff;
    font-size: 1.8rem;
    line-height: 1.2;
}

.campaign h2 .inner {
    display: block;
    padding: 16px 5%;
}
 
/*main
------------------------*/
.campaign_contents_wrap h1 img {
    width: 100%;
}

.lead {
    font-size: 1.5rem;
}

.lead:nth-child(3n) {
    margin-top: -20px;
}

.lead .point {
    display: inline-block;
    padding: 5px 20px;
    background: #002F6F;
    font-size: 1.3rem;
    font-weight: bold;
    box-sizing: border-box;
    border-radius: 40px;
    color: #fff;
    margin-bottom: 5px;
}

.discount_box {
    background: #F2033A;
    margin: 20px 5% 5px;
    text-align: center;
    border-radius: 96px;
    padding: 10px 10px 10px;
}

.discount_box.margin {
    margin: 20px 5% 0;
}
.discount_box p {
    margin: 0 auto;
    text-align: center;
    font-size: 1.6rem;
    color: #fff;
    font-weight: bold;
    line-height: 1;
    padding: 3px 10px;
}

.discount_box p .small {
    font-size: 1.3rem;
}

.discount_box p .large {
    font-size: 3rem;
    display: inline-block;
    margin-top: 3px;
}

.discount_box_sub {
    margin: 5px 5% 20px;
    text-align: center;
    color: #002f6e;
    font-weight: bold;
    font-size: 1.5rem;
}

.discount_box.margin + .discount_box_sub{
    margin: 5px 5% 0;
}

.box_outline {
    margin-bottom: 10px;
}
.tab_title {
    display: inline-block;
    background: #002F6F;
    color: #fff;
    padding: 10px 80px 10px 16px;
    font-size: 1.5rem;
    font-weight: bold;
    position: relative;
    z-index: -1;
}

.tab_title::after {
    content: '';
    position: absolute;
    top: -10px;
    bottom: 0;
    left: initial;
    right: -10px;
    height: 60px;
    border-right: 1.5em solid white;
    transform: rotate(-30deg);
}

.image_box {
    border: 1px solid #002f6e;
    padding: 20px;
}

.image_box p {
    font-size: 2rem;
    line-height: 1.45;
    color: #002f6e;
    font-weight: bold;
    margin: 0 0 20px;
}

.image_box p span {
    font-size: 1.4rem;
    display: inline-block;
    border: 1px solid #002f6e;
    padding: 5px 20px;
    line-height: 1;
    margin-bottom: 3px;
}

.arrow {
    font-size: 5rem;
    color: #002f6e;
    margin: 0px auto 10px;
    line-height: 1;
    text-align: center;
    transform: rotate(90deg);
}

.arrow i:last-child {
    display: inline-block;
    margin-left: -10px;
}

.arrow.or {
    transform: none;
}

.schedule + .info {
    color: #002f6e;
}

.checklist li {
    position: relative;
    padding-left: 28px;
    margin-bottom: 10px;
}

.checklist li::before {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 2rem;
    line-height: 1;
    color: #ff0086;
    position: absolute;
    top: 0.2em;
    bottom: 0;
    left: 0;
    display: block;
}

.lesson_txt {
    margin-bottom: 10px;
}

.campaign th,
.campaign td {
    border: 1px solid #ccc;
    text-align: left;
    padding: 10px;
}

.campaign th {
    background: #efefef;
    width: 27%;
}

/*プログラム別費用*/

.program_box {
    margin-bottom: 20px;
}

.program_box table {
    table-layout: fixed;
    width: 100%;
    margin-bottom: 10px;
}

.program_box th {
    font-size: 1.2rem;
    line-height: 1.4;
    vertical-align: middle;
}

.program_box td {
    line-height: 1.4;
    text-align: center;
}

.program_box h3 {
    font-size: 1.8rem;
    color: #002F6F;
    background: #E7EBF1;
    border-left: 6px solid #002F6F;
    padding: 20px 10px;
    margin-bottom: 10px;
}

.regular_price {
    border: 1px solid #ccc;
    text-align: center;
    margin-bottom: 10px;
    padding: 10px;
}

p.regular_price {}

.regular_price span {
    font-size: 1.1rem;
}

.sub_txt {
    margin-bottom: 10px;
}

td.campaign_price {
    color: #f2033a;
    font-weight: bold;
}

/*含まれるもの*/
.inc_program {
    margin: 20px 0;
}

.inc_program dt {
    font-size: 1.8rem;
    font-weight: bold;
    color: #fff;    
    line-height: 1;
    position: relative;
}

.inc_program dt span {
    background: #0065EF;
    padding: 10px 10px 10px 20px;
    border-radius: 20px 2px 20px 2px;
    display: inline-block;
    width: 120px;
}

.inc_program dt.pink span {
    background: #FF0086;
}

.inc_program dt::after {
    content: "";
    position: absolute;
    display: block;
    box-sizing: border-box;
    top: 0;
    right: 0;
}
.inc_program dt.blue::after {
    width: 111px;
    height: 72px;
    background: url(/campaign/2020_support/img/inc_pr01.png) no-repeat;
    background-size: cover;
    top: -20px;
}
.inc_program dt.pink::after {
    width: 112px;
    height: 122px;
    background: url(/campaign/2020_support/img/inc_pr02.png) no-repeat;
    background-size: cover;
}

.inc_program dd {
    border-left: 2px solid #0065f0;
    font-size: 1.5rem;
    margin-left: 10px;
    padding: 10px 10px 10px 16px;
    position: relative;
}

.inc_program dd::before {
    content:"";
    position: absolute;
    top: 14px;
    left: -8px;
    width: 16px;
    height: 16px;
    border-radius: 20px;
    background: #0065f0;
}

.inc_program dt.blue + dd,
.inc_program dt.pink + dd {
    padding-top: 40px;
}

.inc_program dd.pink {border-left: 2px solid #FF0086;}
.inc_program dd.pink::before {background: #FF0086;}

.inc_program dt.blue + dd::before,
.inc_program dt.pink + dd::before {top: 44px;}

/*スタッフコメント*/
.comment_box {
    border: 1px solid #002F6F;
    color: #002F6F;
    font-size: 1.4rem;
    padding: 60px 30px 30px;
    width: 90%;
    box-sizing: border-box;
    margin-top: -40px;
    position: relative;
    z-index: -1;
}

.counselar01 {
    width: 90%;
    max-width: 331px;
    margin-left: 10%;
}
.counselar02 {
    width: 90%;
    max-width: 331px;
    margin-top: 30px;
    margin-right: 10%;    
}

.counselar02 + .comment_box {
    margin-left: 10%;
}

/*CVエリア
------------------------*/
.cv_area {
    padding: 20px 5%;
}

.cv_area_b {
    padding: 40px 5%;
    background: #002a63;
}

.col_cv_btn {
    text-align: center;
}
.col_cv_btn a {
    display: block;
    padding: 15px 30px;
    font-size: 18px;
    font-size: 2.2rem;
    font-weight: bold;
    line-height: 1.3;
    text-align: center;
    line-height: 1.3;
    color: #FFF !important;
    text-decoration: none !important;
    border-radius: 4px;
	background: #fd8700;
    background: -moz-linear-gradient(top, #fd8700 0%, #fb5c00 100%);
    background: -webkit-linear-gradient(top, #fd8700 0%,#fb5c00 100%);
    background: linear-gradient(to bottom, #fd8700 0%,#fb5c00 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd8700', endColorstr='#fb5c00',GradientType=0 );
    border: 1px solid #fb5c00;
    box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.5) inset;
    -moz-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.5) inset;
    -webkit-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.5) inset;
}

.col_cv_btn a:hover {
    background: #ed4d02;
    box-shadow: none;
}

.cv_btn_read,
.cv_btn_read2 {
    color: #fff;
    font-size: 1.5rem;
    line-height: 1.4;
    text-align: center;
    margin: 0 auto 7px;
    display: inline-block;
    font-weight: bold;
    position: relative;
}

.cv_area .cv_btn_read2 {
    color: #484848;
}

.color_yellow {
    color: #fdee73;
}

.cv_btn_read2 {display: block;}

.cv_btn_read::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -30px;
    width: 2px;
    height: 41px;
    background: #fff;
    transform: rotate(-30deg);
}

.cv_btn_read::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: -30px;
    width: 2px;
    height: 41px;
    background: #fff;
    transform: rotate(30deg);
}

/* ---------------------------------------------------------
 smartphonep - 360px
---------------------------------------------------------- */
 
@media print, screen and (max-width:360px) {
}

/* ---------------------------------------------------------
 smartphone / tablet  480px - 767px
---------------------------------------------------------- */
@media print, screen and (min-width:480px) {
}
 
/* ---------------------------------------------------------
 tablet 768px - 1023px
---------------------------------------------------------- */
@media print, screen and (min-width: 768px) {
    .tb_on {
        display: block;
    }
    
    /*main
    ------------------------*/
    .pc_main {
        position: relative;
        width: 100%;
    }

    .pc_main > img {
        min-width: 130%;
        position: relative;
        left:-15%;
        margin: auto;
        display: block;

    }

    .campaign_contents_wrap h1 {
        position: absolute;
        top: 4vh;
    }
    .campaign_contents_wrap h1 img {
    width: 100%;
    max-width: 90%;
    display: block;
    margin: 0 auto;
    box-sizing: border-box;
    }
    
    
    .campaign th, .campaign td {
        padding: 20px;
    }
    
    .campaign th {
        width: 30%;
    }
    
    .box_outline {
        max-width: 480px;
        margin: 0 auto;
    }
    
    .arrow {
        margin: 0 auto;
    }
    
    .schedule + .info {
        width: 480px;
        margin: 20px auto 0;
    }
    
    .program_box th {
        text-align: center;
        font-size: 1.4rem;
    }
    
    .program_box td {
        font-size: 1.8rem;
    }
    
    .discount_box_sub,
    .discount_box.margin + .discount_box_sub {
        font-size:2.4rem;
    }
    
    .regular_price {
        display: inline-block;
        padding: 10px 20px;
        margin-right: 10px;
    }

    .sub_txt {
        display: inline-block;
    }

    .inc_program dt {
        font-size: 2.4rem;
    }
    
    .inc_program dt span {
        padding: 12px 10px 12px 30px;
        border-radius: 30px 2px 30px 2px;
        width: 263px;
    }
    
    .inc_program dt.blue::after {
        width: 176px;
        height: 114px;
    }
    
    .inc_program dd {
        font-size: 1.8rem;
    }
    
    .inc_program dd::before {
        left: -11px;
        width: 20px;
        height: 20px;
    }
    
    /*スタッフコメント*/
    .counselar01 {
        width: 48%;
        margin-left: 52%;
    }
}

/* ---------------------------------------------------------
 desktop 1024x - 
---------------------------------------------------------- */
 
@media print, screen and (min-width:1024px) {
    .sp_none {
        display: block;
    }
     
    .pc_none {
        display: none;
    }
    
    .campaign p {
        font-size: 1.8rem;
    }
    .inner {
        padding: 50px 0;
        max-width: 1004px;
        margin: 0 auto;
    }
    .campaign h2 {
        font-size: 2.4rem;
    }
    .campaign h2 .inner {
        padding: 16px 5%;
    }
    
    /*main
    ------------------------*/

    .campaign_contents_wrap h1 {
    position: absolute;
    display: block;
    width: 90%;
    top: 5vh;
    left: 50%;
    margin-left: -45%;
    }
    .campaign_contents_wrap h1 img {
    width: 100%;
    max-width: 100%;
    display: block;
    margin: 0 auto;
    box-sizing: border-box;
    }

    .lead {
        font-size: 2.4rem;
    }

    .lead:nth-child(3n) {
        margin-top: -50px;
    }

    .lead .point {
        font-size: 2rem;
    }
    
    .discount_box {
        margin: 0 auto 20px;
        padding: 10px 10px 20px;
        max-width: 630px;
    }
    
    .discount_box.margin {
        margin: 50px auto 20px;
        max-width: 630px;
    }
    
    .discount_box p {
        font-size: 3.2rem;
        padding: 5px 10px;
    }

    .discount_box p .small {
        font-size: 2rem;
    }

    .discount_box p .large {
        font-size: 5.2rem;
        margin-top: 3px;
    }
    
    .discount_box_sub {
        margin-bottom: 50px;
    }
    
    .schedule {
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    
    .box_outline {
        width: 80%;
    }
    
    .arrow {
        width: 130px;
        font-size: 3rem;
        transform: none;
    }
    
    .tab_title::after {
        top: -12px;
        right: -12px;
    }
    
    .schedule + .info {
        width: 100%;
    }
    
    .checklist li {
        padding-left: 32px;
        font-size: 1.8rem;
    }

    .checklist li::before {
        font-size: 2.2rem;
    }
    
    /*プログラム別費用*/
    .program_box {
        margin-bottom: 50px;
    }

    .program_box th {
        font-size: 1.6rem;
        text-align: center;
    }

    .program_box td {
        font-size: 2rem;
        text-align: center;
    }

    .program_box h3 {
        font-size: 2.4rem;
        padding: 20px;
        margin-bottom: 20px;
    }

    .regular_price span {
        font-size: 1.1rem;
    }

    td.campaign_price {
        color: #f2033a;
        font-weight: bold;
    }
    
    /*含まれるもの*/
    .inc_program {
        width: 620px;
        padding-left: 300px;
    }
    
    .inc_program dt.blue::after {
        top: 0;
        left: -200px;
    }
    
    .inc_program dt.pink::after {
        top: 0;
        left: -136px;
    }
    
    /*スタッフコメント*/
    .comment_box {
        padding: 60px 40px 40px;
        font-size: 1.6rem !important;
    }
    .counselar01 {
        width: 480px;
        max-width: 480px;
        margin-left: 524px;
    }
    
    .counselar02 {
        width: 480px;
        max-width: 480px;
        margin-top: 50px;
    }
    /*CVエリア
    ------------------------*/
    .cv_area {
        padding: 50px 5% 20px;
    }
    .cv_area_b {
        padding: 60px 40px;
    }

    .col_cv_btn {
        margin: 0 auto;
    }

    .cv_btn_read {
        margin: 0;
        font-size: 1.8rem;
    }
    
    .cv_area_b .link_btn {
        margin: 10px 0 0;
        /* width: auto; */
    }
    
    .cv_area .link_btn a,
    .cv_area_b .link_btn a {
        width: 540px;
        height: 84px;
        box-sizing: border-box;
        border-radius: 12px;
        font-size: 32px;
        padding: 20px;
        margin: 0 auto;
    }
    
    .cv_area .cv_btn_read2 {
        font-size: 2.4rem;
    }
    
    .cv_area_b .cv_btn_read2 {
        font-size: 2.4rem;
        margin: 10px;
    }
    
    .cv_btn_read::before,
    .cv_btn_read::after {
        height: 51px;
    }
    
}

@media print, screen and (min-width:1336px) {

    /*main
    ------------------------*/
    .pc_main > img {
        min-width: 120%;
        left: -10%;
    }

    .campaign_contents_wrap h1 {
        width: 90%;
        max-width: 1115px;
        top: 4vh;
        left: 50%;
        margin-left: -557px;
    }
}

@media print, screen and (min-width:1440px) {
    /*main
    ------------------------*/
    .pc_main > img {
        min-width: 110%;
        left: -5%;
    }
}

@media print, screen and (min-width:1536px) {
    /*main
    ------------------------*/
    .campaign_contents_wrap h1 {
        top: 8vh;
    }
}

@media print, screen and (min-width:1920px) {
    /*main
    ------------------------*/
    .pc_main {
        /* max-height: 756px; */
    }
    .pc_main > img {
        min-width: 100%;
        left: 0;
        max-height: 100%;
    }

    .campaign_contents_wrap h1 {
        max-width: 1400px;
        margin-left: -700px;
    }

}