@charset "utf-8";
* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    vertical-align: baseline;
    box-sizing: border-box;
}

body {
    font-family: "Noto Sans JP", sans-serif;
    max-width: 2200px;
    color: #000;
    font-size: 15px;
    line-height: 1.7;
}

img {
    border: 0px;
    width: auto;
    max-width: 100% !important;
    vertical-align: bottom;
}

table {
    border-style: none;
    border-spacing: 0;
}


/* for modern brouser */

.cf:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}


/* IE7,MacIE5 */

.cf {
    display: inline-block;
}


/* WinIE6 below, Exclude MacIE5 \*/

* html .cf {
    height: 1%;
}

.cf {
    display: block;
}


/**/


/*margin*/

.mgt5 {
    margin-top: 5px!important;
}

.mgt10 {
    margin-top: 10px!important;
}

.mgt20 {
    margin-top: 20px!important;
}

.mgt25 {
    margin-top: 25px!important;
}

.mgt30 {
    margin-top: 30px!important;
}

.mgt35 {
    margin-top: 35px!important;
}

.mgt40 {
    margin-top: 40px!important;
}

.mgt45 {
    margin-top: 45px!important;
}

.mgt50 {
    margin-top: 50px!important;
}

.mgt55 {
    margin-top: 55px!important;
}

.mgt60 {
    margin-top: 60px!important;
}

.mgt65 {
    margin-top: 65px!important;
}

.mgb0 {
    margin-bottom: 0px!important;
}

.mgb10 {
    margin-bottom: 10px!important;
}

.mgb20 {
    margin-bottom: 20px!important;
}

.mgb30 {
    margin-bottom: 30px!important;
}

.mgb40 {
    margin-bottom: 40px!important;
}

.mgb50 {
    margin-bottom: 50px!important;
}

.mgb60 {
    margin-bottom: 50px!important;
}

.mgb70 {
    margin-bottom: 50px!important;
}

.mgl0 {
    margin-left: 0px!important;
}

.mgl10 {
    margin-left: 10px!important;
}

.mgl15 {
    margin-left: 15px!important;
}

.mgl20 {
    margin-left: 20px!important;
}

.mgl30 {
    margin-left: 30px!important;
}

.mgl40 {
    margin-left: 40px!important;
}

.mgl50 {
    margin-left: 50px!important;
}

.mgr0 {
    margin-right: 0px!important;
}

.mgr10 {
    margin-right: 10px!important;
}

.mgr15 {
    margin-right: 15px!important;
}

.mgr20 {
    margin-right: 20px!important;
}

.mgr30 {
    margin-right: 30px!important;
}

.mgr40 {
    margin-right: 40px!important;
}

.mgr50 {
    margin-right: 50px!important;
}


/* For padding */

.pdt0 {
    padding-top: 0px !important;
}

.pdt5 {
    padding-top: 5px !important;
}

.pdt10 {
    padding-top: 10px !important;
}

.pdt15 {
    padding-top: 15px !important;
}

.pdt20 {
    padding-top: 20px !important;
}

.pdt25 {
    padding-top: 25px !important;
}

.pdt30 {
    padding-top: 30px !important;
}

.pdt35 {
    padding-top: 35px !important;
}

.pdb5 {
    padding-bottom: 5px !important;
}

.pdb10 {
    padding-bottom: 10px !important;
}

.pdb15 {
    padding-bottom: 15px !important;
}

.pdb20 {
    padding-bottom: 20px !important;
}

.pdb25 {
    padding-bottom: 25px !important;
}

.pdb30 {
    padding-bottom: 30px !important;
}

.pdl5 {
    padding-left: 5px !important;
}

.pdl10 {
    padding-left: 10px !important;
}

.arrow {
    position: relative;
    display: inline-block;
    padding: 0 0 0 16px;
    color: #000;
    vertical-align: middle;
    text-decoration: none;
    font-size: 15px;
}

.arrow::before,
.arrow::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

@media (max-width: 768px) {
    body {
        font-size: 0.9rem;
    }
}


/* ---------------------------------------------------------
 共通
----------------------------------------------------------*/

.inner {
    max-width: 1100px;
    margin: auto;
    padding: 60px 30px;
}

.inner p:last-child {
    margin-bottom: 0;
}

.point_txt {
    font-weight: bold;
    color: #8a0124;
}

figure {
    text-align: center;
    width: 100%;
}

a {
    text-decoration: none;
    outline: none;
    cursor: pointer;
    display: block;
}

a:hover {
    filter: alpha(opacity=80);
    opacity: 0.7;
}

a img:hover {
    filter: alpha(opacity=80);
    opacity: 0.8;
}

h2,
h3,
.btn,
.app_btn,
.min_txt {
    font-family: "Noto Sans JP", sans-serif;
}

h2 {
    position: relative;
    margin-bottom: 40px;
    font-size: 2.5rem;
    font-weight: 900;
    padding-bottom: 20px;
}

.inner h2::after {
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: 2;
    content: '';
    width: 50px;
    height: 5px;
    background-color: #2b365a;
}

h2 span {
    font-size: 1rem;
    padding-left: 20px;
    font-weight: 600;
}

h3 {
    /* border-left: solid 5px #00358d; */
    color: #000;
    font-size: 1.4rem;
    margin-bottom: 10px;
    font-weight: bold;
}

h4 {
    border-left: 3px solid #2b365a;
    margin: 30px 0 15px;
    padding-left: 0.5rem;
    font-size: 1.1rem;
}

h5 {
    font-size: 1.1rem;
    margin-bottom: 20px;
}

ul.btn {
    clear: both;
    display: flex;
    margin-bottom: 30px;
}

ul.btn li {
    width: 49%;
    margin-right: 2%;
}

ul.btn li:last-child {
    margin-right: 0;
}

ul.btn li:first-child p {
    background-color: #8a0124;
}

ul.btn li:last-child p {
    margin-right: 0;
    background-color: #60021a;
}

ul.btn li p {
    font-weight: bold;
    display: block;
    margin: auto;
    text-align: center;
    padding: 10px;
    line-height: 150%;
    color: #fff;
    border-radius: 5px;
    background: url(./images/arrow_w.png)no-repeat right 10px bottom 50%;
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    background-size: 10px, 100%;
    box-shadow: 3px 3px 10px 0px #e8e8e8;
}

ul.btn li p a {
    color: #fff;
    text-decoration: none;
    display: block;
}

ul.btn li p span {
    font-size: 1rem;
}

ul.btn li p.soldout {
    background-color: #646464 !important;
    margin-bottom: 0 !important;
}

ul.btn li p.min_txt {
    background: none;
    color: #8a0124;
    box-shadow: none;
}

.bg-red {
    background: #EFDEDE;
}

.bg-blue {
    background: #dedfef;
}

.flex-box {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
}

.bold_text {
    font-weight: bold;
}

.border-none {
    border-bottom: none!important;
}

.highlighted {
    background-color: #000;
    color: #fff;
    padding: 10px 0 10px 21px;
    font-size: 1.2rem;
}

.flex-2 {
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
}

br.br-sp {
    display: none;
}

a.app-btn.disable {
    pointer-events: none;
    background-color: #646464;
    background-image: none;
}

@media (max-width: 480px) {
    br.br-sp {
        display: block;
    }
}


/* ---------------------------------------------------------
 sns_area
----------------------------------------------------------*/

.sns_area {
    text-align: right;
    max-width: 1200px;
    margin: auto;
    padding: 20px 30px 0;
    margin: auto;
    line-height: 1;
}

.sns_area .fb_iframe_widget {
    float: right;
    margin-left: 5px;
    display: block;
}

.sns_area .twitter_btn {
    display: inline-block;
}

@media (max-width: 768px) {
    .inner {
        padding: 20px 20px 60px;
    }
    .c_wrap_wide {
        padding: 50px 10px;
    }
    h2 {
        font-size: 1.5rem;
        margin-bottom: 30px;
        margin-top: 30px;
        padding-bottom: 20px;
    }
    h3 {
        font-size: 1.2rem;
    }
    .sns_area {
        padding: 20px 10px 0;
    }
}

@media (max-width: 768px) {
    ul.btn li p span {
        font-size: .8rem;
    }
}

@media (max-width: 480px) {
    h2 {
        font-size: 2rem;
        margin-bottom: 30px;
    }
    h3 {
        /*  border-left: solid 3px #00358d; */
        font-size: 1.1rem;
        margin-bottom: 10px;
    }
    ul.btn {
        display: inherit;
    }
    ul.btn li {
        margin-right: 0;
        width: 100%;
        margin-bottom: 10px;
    }
    ul.btn li:last-child {
        clear: both;
    }
    ul.btn li p.min_txt {
        margin-bottom: 10px !important;
    }
}


/* ---------------------------------------------------------
 header
----------------------------------------------------------*/

header {
    position: relative;
}

#headerArea {
    background: #000;
    position: relative;
    margin: 0 auto;
}

.header_inner {
    max-width: 1400px;
    margin: auto;
    top: 0;
    z-index: 100;
}

#headerArea #nav {
    width: 100%;
    position: inherit;
    background-color: #000;
    z-index: 500;
}

#headerArea .slicknav_menu {
    display: none;
}

#headerArea #navmenu {
    width: 100%;
    max-width: 1400px;
    margin: auto;
    box-sizing: border-box;
    text-align: center;
}

#headerArea #navmenu li {
    display: inline-block;
    line-height: 1;
    font-size: 1rem;
    letter-spacing: 0.07em;
    border-right: solid 1px #545454;
    padding: 0 20px;
}

#headerArea #navmenu li:nth-child(5) {
    border-right: 0;
}

#headerArea #navmenu li:last-child {
    border-right: 0;
    padding: 0;
}

#headerArea #navmenu li a {
    display: block;
    text-decoration: none;
    color: #ffffff;
    line-height: 30px;
}

#headerArea #navmenu li a:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
    /* ie lt 8 */
    -ms-filter: "alpha(opacity=70)";
    /* ie 8 */
    -moz-opacity: 0.7;
    /* FF lt 1.5, Netscape */
    -khtml-opacity: 0.7;
    /* Safari 1.x */
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

#headerArea .header_inner .app_btn {
    display: flex;
    right: 0px;
    top: 100%;
}

#headerArea .app_btn li {
    margin-right: 1em;
    border-radius: 0 0 5px 5px;
}

#headerArea .app_btn li {
    background-color: #2b365a;
    margin: 0;
}

#headerArea .app_btn li a {
    color: #ffffff;
    text-decoration: none;
    font-size: 1rem;
    display: block;
    padding: 0 1.5em;
}

#headerArea .app_btn.sp {
    display: none;
}

#headerArea .app_btn.pc {
    background-color: #2b365a;
    padding: 10px 15px;
}

@media screen and (max-width: 1200px) {
    #headerArea .header_inner .app_btn {
        right: 30px;
    }
}

@media screen and (max-width: 1100px) {
    #headerArea .header_inner .app_btn {
        right: 0;
    }
    #headerArea #navmenu li {
        border-right: solid 1px #545454;
        padding: 0 20px;
        font-size: 0.8rem;
    }
    #headerArea #navmenu li:nth-child(4),
    #headerArea #navmenu li:nth-child(5),
    #headerArea #navmenu li:nth-child(6) {
        border-bottom: none;
    }
}

@media screen and (max-width: 900px) {
    #headerArea {
        display: flex;
    }
    #headerArea .app_btn.sp {
        display: block;
    }
    #headerArea .app_btn.pc {
        display: none;
    }
    #headerArea .header_inner .app_btn.sp {
        right: 0;
    }
    #headerArea .app_btn.sp {
        top: 10px;
    }
    #headerArea .app_btn.sp li {
        border-radius: 5px;
        padding: 0 .5em;
    }
    #headerArea .app_btn.sp li:last-child {
        margin: 10px;
    }
    #headerArea .app_btn.sp li a {
        font-size: 0.9rem;
    }
    .header_inner {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        background-color: #000;
    }
    #headerArea #nav {
        margin-left: 0%;
        width: 100%;
        height: 50px;
        position: absolute;
        top: 0;
        left: 0;
        background-color: #000;
    }
    #headerArea #navmenu li {
        margin-left: 3px;
        margin-top: 5px;
    }
    #headerArea #navmenu li a {
        font-size: 15px;
        font-size: 1.5rem;
    }
    #headerArea #navmenu li {
        font-size: 15px;
        font-size: 1.5rem;
    }
    #headerArea #nav {
        display: none;
    }
    #headerArea .slicknav_menu {
        display: block;
    }
    #headerArea #navmenu {
        display: none;
    }
    .js #headerArea .slicknav_menu {
        display: block;
    }
}

@media screen and (max-width: 550px) {
    #headerArea .app_btn.sp li a span {
        display: none;
    }
    #headerArea .app_btn li a {
        padding: 0 2px;
    }
}


/* ---------------------------------------------------------
 mainv
----------------------------------------------------------*/

h1.mainv figure img {
    width: 100%;
}


/* ---------------------------------------------------------
 c_introduction
----------------------------------------------------------*/

#c_introduction .inner {
    padding: 30px 30px 60px;
}

#c_introduction .inner h2 {
    font-size: 1.7rem;
    width: 100%;
    font-weight: 700;
    padding-left: 0.1rem;
}


/*#c_introduction .inner .flex-box{
	flex-wrap: nowrap;
}*/

#c_introduction .inner figure {
    max-width: 150px;
    margin-right: 40px;
}

#c_introduction .inner dl {
    width: 70%;
    width: -webkit-calc(100% - 240px);
    width: calc(100% - 240px);
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

#c_introduction .inner dl dt {
    font-weight: bold;
    width: 100%;
    margin-bottom: 15px;
    font-size: 1.1rem;
}

#c_introduction .inner dl dd {
    background: #E7E7E7;
    width: 47.5%;
    padding: 10px;
    margin-bottom: 10px;
    margin-right: 10px;
    font-size: 0.95rem;
    line-height: normal;
}

#c_introduction .inner h5 {
    font-weight: bold;
    width: 100%;
    margin-bottom: 15px;
    font-size: 1.1rem;
    display: block;
}

#c_introduction .inner .flex-box {
    flex-wrap: nowrap;
}

#c_introduction .inner ul {
    flex-wrap: wrap!important;
}

#c_introduction .inner ul li {
    background: #E7E7E7;
    width: 47.5%;
    padding: 10px;
    margin-bottom: 10px;
    margin-right: 10px;
    font-size: 0.95rem;
    line-height: normal;
}

#c_introduction .inner ul li:nth-child(even) {
    margin-right: 0;
}

@media screen and (max-width: 1100px) {
    #c_introduction .inner ul li br {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    #c_introduction .inner h2 {
        font-size: 1.2rem;
    }
    #c_introduction .inner figure {
        max-width: 35px;
        margin-right: 10px;
        float: left;
        clear: both;
    }
    #c_introduction .inner h5 {
        margin-top: 0.5rem;
        margin-bottom: 0;
    }
    #c_introduction .inner .flex-box {
        display: inline-block;
        margin-top: 10px;
    }
    #c_introduction .inner ul li {
        width: 100%;
    }
    /*	#c_introduction .inner dl{
    width: -webkit-calc(100% - 110px) ;
    width: calc(100% - 110px) ;
	}
	#c_introduction .inner dl dd{
	width: 100%;
	margin-right:0;
	}*/
    #c_introduction .inner {
        padding: 20px 20px 60px;
    }
}

@media screen and (max-width: 480px) {
    #c_introduction .inner figure {
        max-width: 35px;
    }
    #c_introduction .inner dl {
        width: -webkit-calc(100% - 80px);
        width: calc(100% - 80px);
    }
}


/* ---------------------------------------------------------
 c_merit
----------------------------------------------------------*/

#c_merit .inner ul {
    flex-wrap: wrap;
    align-items: normal;
}

#c_merit .inner ul li {
    width: 30%;
    background: #2b365ac2;
    margin-right: 1.1rem;
    margin-bottom: 1.1rem;
    padding: 40px 15px;
    color: #FFF;
    font-size: 0.9rem;
    line-height: 1.4;
}

#c_merit .inner ul li figure {
    max-width: 220px;
    margin: 0 auto 15px;
}

@media screen and (max-width: 768px) {
    #c_merit .inner ul li {
        width: 46%;
        margin-right: 10px;
    }
}

@media screen and (max-width: 480px) {
    #c_merit .inner ul li {
        width: 100%;
        margin-right: 0;
        padding: 15px;
        display: flex;
    }
    #c_merit .inner ul li figure {
        width: 120px;
        margin: 0 10px 0 0;
    }
    #c_merit .inner ul li p {
        width: -webkit-calc(100% - 120px);
        width: calc(100% - 120px);
        font-size: 0.8rem;
        margin: auto;
    }
}


/* ---------------------------------------------------------
 c_merit
----------------------------------------------------------*/

.contact {
    background: #F5F5F5!important;
    padding: 50px 0;
    clear: both;
    text-align: center;
}

a.contact-btn {
    border: 2px solid #2b365a;
    color: #2b365a;
    max-width: 400px;
    margin: 0 auto;
    padding: 10px 0;
    background: url(./images/contact_arrow.png)no-repeat right 10px bottom 50%;
    background-size: 10px;
    text-align: center;
    font-weight: 700;
}

@media screen and (max-width: 768px) {
    .contact {
        padding: 20px 0;
    }
}

@media screen and (max-width: 480px) {
    a.contact-btn {
        max-width: 300px;
        font-size: 0.8rem;
    }
}


/* ---------------------------------------------------------
 c_voice
----------------------------------------------------------*/

#c_voice,
#c_program {
    background: url(./images/bg_1.png), url(./images/bg_2.png);
    background-position: top, bottom;
    background-size: 100%;
    background-repeat: no-repeat;
}

#c_program {
    background-color: #dedfef94;
}

#c_voice .voicelist {
    align-items: normal;
}

#c_voice .voicelist li {
    width: 100%;
    padding: 20px;
    display: flex;
    align-items: flex-start;
    border-bottom: solid 1.5px #d2d2d2;
}

#c_voice .voicelist li:nth-child(5),
#c_voice .voicelist li:nth-child(4) {
    border-bottom: none;
}

#c_voice .voicelist li img {
    width: 90px;
    margin-right: 20px;
}

#c_voice .voicelist li p {
    font-size: 0.85rem;
}

#c_voice .voicelist li p span {
    font-size: 0.7rem;
    padding-top: 5px;
    float: right;
}

#c_voice .voicelist li dl dt {
    color: #8a0124;
    float: right;
    margin-top: 10px;
    width: 75%;
    text-align: right;
    line-height: 1.4;
}

#c_voice .voicelist li dl dt br {
    display: inline;
}

.course_ul {
    /* background-color: #fff; */
    padding: 0;
    margin-top: 100px;
}

.course_ul:first-of-type {
    margin-top: 0;
}

.course_ul.inner dl {
    border-bottom: solid 2px #f3f3f3;
    margin: 0 20px;
    padding: 12px;
}

#c_program .flex-box {
    justify-content: left;
}

@media screen and (max-width: 768px) {
    #c_voice .voicelist li {
        width: 100%;
        padding: 0;
        position: relative;
    }
    #c_voice .voicelist li p {
        padding-top: 10px;
        padding-bottom: 20px;
        padding-left: 63px;
    }
    #c_voice .voicelist li img {
        display: block;
        margin: 10px auto;
        width: 60px;
        position: absolute;
        top: 0;
    }
    #c_voice .voicelist li dl dd figure {
        width: 60px;
    }
    #c_voice .voicelist li p span {
        font-size: 0.85rem;
        padding-top: 5px;
    }
    #c_voice .voicelist li:nth-child(5) {
        border-bottom: solid 1.5px #d2d2d2;
    }
}

@media screen and (max-width: 480px) {
    #c_voice .voicelist li dl dd figure {
        width: 50px;
    }
}

#c_voice .pgm_box h3 {
    background: url(./images/60.png) no-repeat;
    padding-left: 1.8em;
    background-size: contain;
}

#c_voice .pgm_box {
    padding: 20px;
    margin-bottom: 30px;
}

#c_voice .pgm_box:last-child {
    margin-bottom: 0;
}

#c_voice .online {
    background: rgba(249, 236, 240, 0.7);
}

#c_voice .offline {
    background: rgba(241, 239, 219, 0.7);
}

@media screen and (max-width: 480px) {
    #c_voice .pgm_box {
        padding: 10px;
    }
}


/* ---------------------------------------------------------
 c_about
----------------------------------------------------------*/

#c_about .inner figure {
    max-width: 300px;
    float: right;
    clear: both;
    padding-left: 30px;
    padding-bottom: 30px;
}

#c_about .inner p {
    margin-bottom: 20px;
}

#c_about .inner ul li {
    list-style: square!important;
    margin-left: 1rem;
    margin-bottom: 10px;
}

#c_about .inner ul li a {
    text-decoration: underline;
    color: #000;
}

#c_about .image_box {
    background: url(/images/about.jpg) right 0px no-repeat;
    width: 100%;
    background-size: cover;
    background-position: 0 40%;
    height: 280px;
}

@media screen and (max-width: 768px) {
    #c_about {
        background-attachment: scroll;
    }
    #c_about .inner {
        padding: 20px;
    }
    #c_about .image_box {
        height: 200px;
    }
}

@media screen and (max-width: 560px) {
    #c_about .inner figure {
        /*		width: 100%;
		float: none;*/
        padding-left: 15px;
        padding-bottom: 15px;
        max-width: 150px;
    }
    #c_about .image_box {
        height: 100px;
    }
}


/* ---------------------------------------------------------
 c_program
----------------------------------------------------------*/

#c_program h4 {
    margin: 20px;
    font-weight: bold;
    font-size: 1.4rem;
}

.course_dl {
    background-color: #fff;
}


/* .course_ul h4 {
    margin-left: 20px;
} */

dl.course_dl dt {
    background-color: #fff;
    padding: 0;
    margin: 25px 0;
}

dl.course_dl.inner {
    display: flex;
    flex-wrap: wrap;
    padding: 1rem;
    margin: 0 20px;
}

dl.course_dl.inner dt,
dl.course_dl.inner dd {
    border-bottom: solid 2px #f3f3f3;
    margin: 0;
    padding: 12px 0;
    display: flex;
}

dl.course_dl.inner img {
    width: 49%;
    padding: 20px 0;
}

dl.course_dl.inner dt:last-of-type,
dl.course_dl.inner dd:last-of-type {
    border-bottom: none;
}

.course_area {
    display: flex;
    justify-content: space-between;
}

.course_area p {
    width: 40%;
    font-size: 0.9em;
}

.course_area p a {
    color: #138dd6;
    border-bottom: solid 1px #138dd6;
}

.dt_course {
    /* width: 32%; */
    width: 42%;
    color: #2b365a;
    font-weight: 600;
    font-size: 17px;
}

.dd_course {
    /* width: 68%; */
    width: 58%;
    padding: 0 20px;
}

dd.dd_course li {
    font-size: 14px;
    padding-left: 1.25em;
    text-indent: -1.25em;
}

.Practice dd.dd_course {
    padding-left: 15px!important;
}

dd.dd_course .dd_course_under {
    width: 100%;
}

.dd_course li::before {
    content: "";
    /* 空の要素作成 */
    width: 10px;
    /* 幅指定 */
    height: 10px;
    /* 高さ指定 */
    display: inline-block;
    /* インラインブロックにする */
    background-color: #2b365a;
    /* 背景色指定 */
    /* background-color: #bd5003;  背景色指定 */
    border-radius: 50%;
    margin-right: 8px;
}

.sentence {
    margin: 20px 20px 40px 20px;
}


/* .sentence p {
    margin-bottom: 10px;
} */

#c_program table {
    width: 100%;
    /* border: 1px solid #55628c; */
    border-bottom: none;
    padding: 0 20px;
}

#c_program table tr th {
    background: #55628c;
    color: #FFF;
    border-bottom: 1px solid #fff;
    width: 30%;
    padding: 15px 0;
}

#c_program table tr td {
    background: #ffffffcf;
    padding: 10px 15px;
    border-bottom: 1px solid #55628c;
}

#c_program table tr td dl dt {
    /* width: 15%; */
    min-width: 4rem;
}

#c_program table tr td dl dd {
    /* width: calc(100% - 4.5rem); */
    width: calc(100% - 8.5rem);
    /* width: 90%; */
}

#c_program table.Practice tr td dl dt {
    width: 10%;
}

#c_program table.Practice tr td dl dd {
    width: 90%;
}

#c_program table tr td ul li {
    padding-left: 1rem;
    text-indent: -1rem;
    display: block;
}

#c_program table tr td ul li h6 {
    font-size: 1rem;
    text-indent: 0;
    margin-left: -1rem;
}

@media screen and (max-width: 800px) {
    #c_program {
        background-attachment: scroll;
    }
    .dt_course {
        width: 100%;
    }
    .dd_course {
        width: 100%;
        padding: 0px;
    }
    dl.course_dl.inner img {
        width: 100%;
        padding: 10px 0;
    }
    .flex-2 {
        flex-wrap: wrap;
    }
    dl.course_dl.inner dt,
    dl.course_dl.inner dd {
        padding: 12px 0px;
    }
    dl.course_dl.inner dd.dd_course {
        padding-top: 0;
    }
    dl.course_dl.inner dt.dt_course {
        border-bottom: none;
        padding-bottom: 0;
    }
    .highlighted {
        padding: 10px 20px;
    }
    dl.course_dl {
        margin: 20px 0;
    }
    #c_program table tr td dl dt {
        width: 100%;
        /* margin-bottom: 15px; */
    }
    #c_program table tr td dl dd {
        width: 100%;
        margin-bottom: 15px;
    }
}

@media screen and (max-width: 600px) {
    .course_area {
        display: block;
    }
    .course_area p {
        width: 100%;
        padding-bottom: 20px;
    }
    .course_ul h4 {
        margin-left: 0!important;
    }
    dl.course_dl.inner {
        margin: 0;
    }
    .sentence {
        margin-right: 0;
        margin-left: 0;
    }
    .flex-2 {
        padding: 0;
    }
    .image_one {
        background-color: #fff;
    }
    #c_program h4 {
        margin-left: 0;
    }
    #c_program table {
        padding: 0;
    }
}

@media screen and (max-width: 480px) {
    .dt_course {
        line-height: 21px;
    }
    /* .dd_course {
        padding: 5px 0;
    } */
    dl.course_dl.inner dd.dd_course {
        padding-top: 5px;
    }
}


/* ---------------------------------------------------------
 c_overview
----------------------------------------------------------*/

#c_overview table {
    width: 100%;
}

#c_overview table tr th {
    background: #9604047a;
    color: #FFF;
    border-bottom: 1px solid #fff;
    width: 30%;
    padding: 15px 0;
}

#c_overview table tr td {
    background: #ffffffcf;
    padding: 10px 15px;
    border-bottom: 1px solid #9604047a;
}

#c_overview table tr td dl dt {
    width: 10%;
    min-width: 4rem;
}

#c_overview table tr td dl dd {
    width: calc(100% - 4.5rem);
}

#c_overview table tr td ul li {
    padding-left: 1rem;
    text-indent: -1rem;
    display: block;
}

#c_overview table tr td ul li h6 {
    font-size: 1rem;
    text-indent: 0;
    margin-left: -1rem;
}

#c_overview a.contact-btn {
    max-width: 330px;
    font-size: 0.9rem;
}

@media screen and (max-width: 768px) {
    #c_overview table tr td dl dt {
        width: 100%;
    }
    #c_overview table tr td dl dd {
        width: 100%;
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 480px) {
    #c_overview a.contact-btn {
        max-width: 255px;
        font-size: 0.7rem;
    }
    #c_overview table tr td ul li h6 {
        font-size: 0.9rem;
    }
}

a.app-btn {
    color: #FFF;
    max-width: 400px;
    margin: 40px auto 20px;
    padding: 20px 0;
    background: #2b365a url(./images/contact_arrow-wh.png)no-repeat right 10px bottom 50%;
    background-size: 10px;
    text-align: center;
    font-size: 1.2rem;
    font-weight: 500;
}


/* ---------------------------------------------------------
 c_profile
----------------------------------------------------------*/

#c_profile .inner figure {
    min-width: 150px;
    max-width: 280px;
    width: 28%;
}

#c_profile .inner .profile_text {
    padding-left: 30px;
    width: 70%;
}

#c_profile .inner .profile_text h3 span {
    font-size: 1.2rem;
    padding-left: 5px;
}

#c_profile .inner .profile_text p {
    padding-bottom: 10px;
}

#c_profile .inner .profile_text p span {
    font-weight: bold;
}

#c_profile .inner .message-cont {
    border: 1.5px solid #2b365a;
    padding: 20px;
    margin-top: 50px;
}

#c_profile .inner .message-cont p {
    margin-bottom: 15px;
}

@media screen and (max-width: 768px) {
    #c_profile .inner .profile_text {
        padding-left: 15px;
    }
    #c_profile .inner .message-cont {
        margin-top: 20px;
        margin-bottom: 50px;
    }
}

@media screen and (max-width: 560px) {
    #c_profile .profile.flex {
        flex-direction: column-reverse;
    }
    #c_profile .inner .profile_text {
        margin-left: 0px;
        width: 100%;
    }
    #c_profile .inner figure {
        width: 100%;
        margin-bottom: 20px;
    }
    #c_profile .inner .profile_area {
        display: block;
    }
    #c_profile .inner .profile_text h3 span {
        font-size: 0.9rem;
        padding-left: 5px;
    }
}


/* ---------------------------------------------------------
footer
----------------------------------------------------------*/

footer {
    background: #000;
    text-align: center;
    padding-top: 50px;
}

footer h4 {
    padding-bottom: 20px;
    font-size: 2rem;
    padding-bottom: 40px
}

footer a {
    color: #fff;
    text-decoration: none;
}

footer nav {
    margin-bottom: 30px;
}

footer nav ul {
    display: flex;
    /*    margin-bottom: 50px;*/
}

footer nav ul li {
    display: inline-block;
    padding: 0 20px;
    border-right: solid 1px #545454;
}

footer nav ul li:last-child {
    border-right: none;
}

footer nav p:first-of-type {
    background-color: #138dd6;
    border-radius: 25px;
    width: 250px;
    text-align: center;
    margin: auto;
}

footer nav a.app-btn {
    max-width: 300px;
    padding: 13px 0;
    margin: 20px auto;
}

footer p.contact_btn {
    background-color: none;
    border: solid 2px #fff;
    border-radius: 50px;
    color: #fff;
    width: 230px;
    text-align: center;
    margin: 15px auto 0;
}

footer p.contact_btn a {
    background: url(./images/arrow_w.png) no-repeat right 10px bottom 50%;
    background-size: 6px, 100%;
    display: block;
    color: #fff;
    font-size: 1rem;
    border-bottom: none;
    padding: 7px;
}

footer ul.btn li p {
    box-shadow: none;
}

footer ul.btn li p a br {
    display: none;
}

footer ul.btn li p.min_txt {
    color: #fff;
    text-align: left;
}

footer ul.btn li p span {
    display: block;
}

footer p.copy {
    color: #fff;
    font-size: .8rem;
    padding: 10px 0 10px;
}

#footer_contact_btn a {
    border-bottom: 1px solid #fff;
}

p#footer_contact_btn {
    margin-top: 5px;
    font-size: 12px;
}


/*@media screen and (max-width: 900px) {
    footer ul.btn li p.min_txt{
        font-size: .8rem;
    }
    footer ul.btn li p a br{
    display: inline;
    }
}*/

@media screen and (max-width: 870px) {
    footer ul.btn li p a br {
        display: none;
    }
    footer nav ul li {
        float: left;
        width: 50%;
        text-align: center;
        padding: 0;
    }
    ul.btn li:last-child p {
        margin-bottom: 50px;
    }
    footer nav ul li:last-child {
        border-right: solid 1px #545454;
    }
}

@media screen and (max-width: 480px) {
    footer ul.btn li p.min_txt {
        font-size: .8rem;
    }
    footer nav p {
        width: 90%;
    }
    footer nav ul {
        margin-bottom: 30px;
    }
    footer nav ul li {
        font-size: 0.8rem;
    }
    a.app-btn {
        margin: 20px auto;
        max-width: 280px!important;
    }
}

.browser {
    color: #c8c8c8;
    font-size: 0.7rem;
    margin: 0 20px 20px;
    border: 1px solid #c8c8c8;
    display: inline-block;
    padding: 10px;
    text-align: left;
}

.browser dl {
    margin: 10px auto;
}

.browser dl dt {
    font-weight: 500;
}


/* ---------------------------------------------------------
finish
----------------------------------------------------------*/

.finish {
    background-color: #9d9d9e!important;
}

.finish a {
    pointer-events: none;
    background: none!important;
    color: #d1d1d1!important;
}

#c_schedule .inner .schedule_list p.schedule_btn.finish a {
    color: #d1d1d1!important;
}


/* ---------------------------------------------------------
c_merit_under
----------------------------------------------------------*/

#c_about .inner {
    position: relative;
    flex-flow: row wrap;
}

#c_about #origin {
    margin-top: 80px;
}

#c_about #origin {
    border: 1px solid #8a0124;
    padding: 0 20px 10px;
    position: relative;
}

#c_about #origin h3 {
    color: #8a0124;
    padding: 0 10px 0 0;
    position: absolute;
    top: -1rem;
}

#c_about #origin p {
    font-size: 1rem;
    line-height: 1.8;
    padding: 1rem 0 0;
}

.about_area {
    display: flex;
    justify-content: space-between;
}

.about_area h2 {
    margin-bottom: 30px;
}

.about_area p {
    width: 40%;
    font-size: 0.9em;
}

.about_area p a {
    color: #138dd6;
    border-bottom: solid 1px #138dd6;
}

@media screen and (max-width: 768px) {
    #c_about {
        background-attachment: scroll;
    }
}

@media screen and (max-width: 600px) {
    .about_area {
        display: block;
    }
    .about_area p {
        width: 100%;
        padding-bottom: 20px;
    }
}

@media screen and (max-width: 480px) {
    #c_about #origin {
        margin-top: 50px;
    }
    #c_about #origin p {
        font-size: 0.8rem;
    }
}


/* ---------------------------------------------------------
c_merit_under
----------------------------------------------------------*/

section#c_merit_under p {
    margin-bottom: 26px;
}

#c_merit_under ul li {
    position: relative;
    margin-bottom: 35px;
}

.about_img_li {
    display: none;
}

#c_merit_under ul li dl {
    position: relative;
    background-color: #168694c9;
    /* background-color: rgba(51, 101, 172, 0.87); */
    color: #fff;
    padding: 44px;
}

#c_merit_under ul li dl span {
    font-size: 60px;
    margin-right: 20px;
    font-family: franklin-gothic-compressed, sans-serif;
}

#c_merit_under ul li.about1 {
    background-image: url(/images/program_1.jpg);
    background-repeat: no-repeat;
    background-position: right 50%;
    background-size: 48%;
}

#c_merit_under ul li.about2 {
    background-image: url(/images/program_1.jpg);
    background-repeat: no-repeat;
    background-position: left 50%;
    background-size: 49%;
}

#c_merit_under ul li.about3 {
    background-image: url(/images/program_1.jpg);
    background-repeat: no-repeat;
    background-position: right 50%;
    background-size: 49.3%;
    margin-bottom: 0;
    padding: 0;
}

#c_merit_under ul li.about1 dl,
#c_merit_under ul li.about3 dl {
    float: left;
    width: 61%;
}

#c_merit_under ul li.about2 dl {
    float: right;
    width: 60.3%;
}

#c_merit_under ul li dt {
    position: relative;
    font-weight: bold;
    width: 100%;
    margin-bottom: 30px;
    padding-bottom: 20px;
    display: flex;
    align-items: center;
    font-size: 1.2rem;
}

#c_merit_under ul li.program1 dt {
    padding-bottom: 10px;
}

#c_merit_under ul li dt::after {
    position: absolute;
    z-index: 2;
    content: '';
    width: 20%;
    height: 2px;
    background-color: #fff;
    left: 0;
    bottom: -6px;
}

ul.about_ul {
    margin-top: 37px;
}

#c_merit_under .btn p {
    margin-bottom: 0;
}

@media screen and (max-width: 800px) {
    .about_img_li {
        display: initial;
        margin-bottom: 0;
    }
    ul.about_ul {
        margin-top: 20px;
    }
    #c_merit_under ul li {
        margin-bottom: 20px;
    }
    #c_merit_under ul li.about1,
    #c_merit_under ul li.about3 {
        background-size: 0%;
    }
    #c_merit_under ul li.about2 {
        float: none;
        width: 100%;
        background-size: 0%;
    }
    #c_merit_under ul li dl {
        padding: 15px;
        float: none;
        width: 100%;
    }
    #c_merit_under ul li.about1 dl {
        float: none;
        width: 100%;
    }
    #c_merit_under ul li.about2 dl {
        float: none;
        width: 100%;
    }
    #c_merit_under ul li.about3 dl {
        float: none;
        width: 100%;
    }
    #c_merit_under ul li dt {
        padding-bottom: 8px;
        margin-bottom: 17px;
        font-size: 1rem;
    }
    #c_merit_under ul li dl span {
        font-size: 2rem;
        margin-right: 10px;
    }
    ul.about_ul dd {
        font-size: 13px;
        line-height: 1.8em;
    }
}


/* ---------------------------------------------------------
 c_schedule
----------------------------------------------------------*/


/* #c_schedule {
    background-color: #f0f0f0;
} */

#c_schedule .inner {
    padding: 40px 20px 10px;
}


/* #c_program #c_schedule h4{
    margin: 20px 0;
} */

#c_schedule section#c_schedule p {
    font-weight: 700;
    text-align: right;
    margin-top: 10px;
}


/* #c_program #c_schedule table{
    padding: 0;
} */

#c_schedule .schedule_table {
    /* white-space: nowrap; */
    overflow-x: scroll;
    overflow-y: hidden;
}

#c_schedule .schedule_table::-webkit-scrollbar {
    display: none;
}

#c_schedule table th,
#c_schedule table td {
    padding: 10px 24.5px;
    text-align: center;
    font-weight: 600;
}
#c_schedule table td{
    min-width: 220px;
}
#c_schedule table td.td_month{
    text-align: right;
}
#c_schedule table thead td.td_course_day {
    width: 20%;
    padding-left: 90px!important;
}
#c_schedule table td.td_course_period {
    width: 40%;
}

#c_schedule .point_text {
    font-weight: bold;
    font-size: 1.1rem;
    margin-bottom: 15px;
}

#c_schedule .inner .schedule_list dl dt {
    color: #138dd6;
    display: list-item;
    font-weight: bold;
    padding: 0 0 15px;
    text-align: center;
    font-size: 1.2rem;
}

#c_schedule .inner .schedule_list dl dd {
    font-weight: bold;
    display: flex;
}

#c_schedule .inner .schedule_list dl dd figure img {
    width: 100px;
    border: 2px solid #000;
    margin-bottom: 20px;
    padding: 3px;
    border-radius: 8px;
}

#c_schedule .inner .schedule_list dl dd figure img:last-child {
    margin-left: 5px;
}

#c_schedule .inner .schedule_list dl dd span.sup {
    font-weight: normal;
    font-size: 0.8rem;
    line-height: 150%;
    padding-left: 1em;
    text-indent: -1em;
    display: block;
    margin: 10px 0;
}

#c_schedule .inner .schedule_list a {
    color: #000!important;
    font-weight: bold;
    font-size: 0.8rem;
    border-bottom: 1px solid #000;
}

#c_schedule .inner .schedule_list p.schedule_btn {
    background-color: #138dd6;
    border-radius: 25px;
    width: 230px;
    text-align: center;
    margin: 15px auto 0;
}

#c_schedule .inner .schedule_list p.schedule_btn a {
    background: url(./images/arrow_w.png)no-repeat right 10px bottom 50%;
    background-size: 6px, 100%;
    display: block;
    color: #fff!important;
    font-size: 1rem;
    border-bottom: none;
    padding: 7px;
}

#c_schedule .inner .schedule_list p.contact_link {
    text-align: center;
    margin: 15px auto 0;
}

#c_schedule .inner .schedule_list p.terms_text {
    margin: 30px 0 50px;
}

#c_schedule .inner .schedule_list p.terms_text a {
    font-size: 1rem;
}

#c_schedule .schedule_list ul {
    display: flex;
    flex-wrap: wrap;
}

#c_schedule .schedule_list ul li {
    width: 48%;
    background-color: #f0f0f0;
    margin: 1%;
    padding: 20px 20px 20px;
    position: relative;
}

#c_schedule thead tr td {
    background-color: #000!important;
    color: #fff;
}

#c_schedule td.td_course_ttl_blue {
    background-color: #a4b0d7;
    min-width: 210px;
}

#c_schedule .td_span {
    font-size: .8rem;
    border: none;
    color: #fff;
    background-color: #2a365a;
    border-radius: 3px;
    padding: 2px 10px;
    margin-top: 15px;
    display: inline-block;
}

#c_schedule .small_txt {
    font-weight: 400;
    font-size: 0.7rem;
}

@media screen and (max-width: 765px) {
    #c_schedule .schedule_table::-webkit-scrollbar {
        display: block;
    }
}

@media screen and (max-width: 480px) {
    #c_schedule td.td_course_ttl_blue {
        min-width: 160px;
    }
}

#c_schedule dt.td_month {
    vertical-align: middle;
}

#c_schedule td.td_course_ttl {
    /* background-color: #9ddbe485; */
    background-color: #35a9bffa;
    /* padding: 10px 0!important; */
}

#c_schedule tr:nth-child(even) {
    background-color: #7685b3;
}

#c_schedule tr:nth-child(odd) {
    background-color: #fff;
}

#c_schedule td {
    vertical-align: middle;
}

#c_schedule td.td_month {
    min-width: 132px;
}

#c_schedule td.td_title {
    /*width: 210px;*/
    width: 20%;
    white-space: nowrap;
}

#c_schedule td.td_circle {
    font-size: 22px;
    color: #0d707d;
}

#c_schedule td.td_short {
    /* padding: 10px 27.3px !important; */
    padding: 10px 30.8px !important;
    white-space: nowrap;
}

#c_schedule td.td_course_day {
    width: 40%;
    min-width: 210px;
    padding: 10px 20px 10px 15px!important;
    white-space: nowrap;
}

#c_schedule .btn_box {
    /* position: absolute;
    bottom: 5%; */
    text-align: center;
    left: 0;
    right: 0;
    margin: auto;
}

#c_schedule .inner .image_box {
    background: url(/images/schedule.png) right 0px no-repeat;
    width: 100%;
    background-size: cover;
    background-position: center;
    height: 280px
}

#c_schedule figure.schedule_ito_jyuku {
    max-width: 100%;
}

#c_schedule .contact {
    background-color: #f0f0f0;
    padding: 30px 10px;
}

#c_schedule .contact h4 {
    font-size: 1.1rem;
    padding-top: 40px;
    text-align: center;
}

#c_schedule .contact ul.contact_list {
    max-width: 700px;
    display: flex;
    flex-wrap: wrap;
    text-align: center;
    margin: auto;
}

#c_schedule .contact ul.contact_list li {
    width: 49%;
    margin: 30px auto;
    font-weight: bold;
    line-height: 120%;
    border-radius: 50px;
    background: url(./images/contact_1.png)no-repeat right 10px bottom 50%;
    background-size: 7px, 100%;
    color: #203864;
    border: solid 2px #203864;
}

#c_schedule .contact ul.contact_list li:last-child {
    background: url(./images/contact_2.png)no-repeat right 10px bottom 50%;
    color: #1f4e79;
    border: solid 2px #1f4e79;
}

#c_schedule .contact ul.contact_list li a {
    display: block;
    padding: 10px 5px;
}

#c_schedule .contact ul.contact_list li a:last-child {
    color: #1f4e79;
}

#c_schedule .terms_text a {
    color: #000;
    border-bottom: solid 1px #000;
}

#c_schedule .contact ul.cautions {
    margin: 20px auto;
    max-width: 1100px;
}

#c_schedule .contact ul.cautions li {
    list-style: square!important;
    text-align: left;
    margin-left: 30px;
    font-size: 0.9rem;
    line-height: 150%;
    padding-bottom: 15px;
}

#c_schedule li.coming-soon {
    text-align: center;
    line-height: 352.8px;
}

#c_schedule li.coming-soon p {
    font-weight: 700;
    color: #cfcece;
}

#c_schedule .online {
    padding-bottom: 30px!important;
    border-bottom: solid 1px #b7c4d0;
    margin: 20px auto!important;
    align-items: flex-start;
}

#c_schedule .online ul {
    text-align: left;
    margin-top: 10px;
}

#c_schedule .online ul li {
    font-weight: bold;
    list-style: disc;
    margin-left: 20px;
}

#c_schedule .online h3 {
    border-left: solid 5px #138dd6;
    padding-left: 20px;
    text-align: left;
    margin-bottom: 30px;
}

#c_schedule .online .online_text {
    width: 50%;
    padding: 0 50px;
}

#c_schedule .online figure {
    width: 50%;
}

#c_schedule .online a {
    background: url(./images/arrow_w.png) no-repeat right 0px bottom 50%;
    background-size: 6px, 100%;
    color: #fff;
    display: block;
}

#c_schedule .online p {
    background-color: #138dd6;
    border-radius: 25px;
    width: 230px;
    padding: 10px;
    text-align: center;
    margin-bottom: 30px;
    margin-top: 15px;
}

#c_schedule .green_light {
    /* background-color: #e1f5f8; */
    background-color: #c1d5d88f;
    white-space: nowrap;
    vertical-align: middle;
}

#c_schedule .green_dark {
    /* background-color: #6ecbda; */
    background-color: #9ddbe4;
    white-space: nowrap;
    vertical-align: middle;
}

#c_schedule a.app-btn {
    margin-top: 10px;
}

@media screen and (max-width: 768px) {
    #c_schedule .contact ul.contact_list li {
        width: 270px;
        margin: 10px auto;
    }
    #c_schedule .inner {
        font-size: 15px;
        padding: 20px 20px 0px;
    }
    #c_schedule .inner .schedule_list {
        width: 100%;
        padding: 0;
    }
    #c_schedule .inner .image_box {
        height: 200px;
        background-size: cover;
    }
    #c_schedule .contact h4 {
        margin-bottom: 20px;
    }
    #c_schedule .inner .schedule_list dl dt {
        font-size: 1.1rem;
        padding-bottom: 5px;
    }
    #c_schedule .contact ul.cautions li {
        font-size: 0.8rem;
    }
    #c_schedule .online .online_text {
        width: 100%;
        padding: 0 10px;
    }
    #c_schedule .online figure {
        width: 100%;
        padding: 15px 20px;
    }
    #c_schedule table th,
    #c_schedule table td {
        padding: 0px 27px;
        text-align: center;
    }
}

@media screen and (max-width: 610px) {
    #c_schedule .schedule_list ul li {
        width: 100%;
        display: block;
        margin: 15px 0;
        padding: 20px 20px;
    }
    #c_schedule .schedule_list ul li:last-of-type {
        display: none !important;
    }
    #c_schedule .inner .schedule_list p.schedule_btn {
        width: 200px;
    }
    #c_schedule .btn_box {
        position: static;
        margin-top: 20px;
    }
}

@media screen and (max-width: 480px) {
    #c_schedule .inner .schedule_list dl dd p {
        width: 100%;
    }
    #c_schedule .contact ul.contact_list li {
        width: 100%;
    }
    #c_schedule .point_text {
        font-size: 1rem;
    }
    #c_schedule .contact ul.cautions li {
        margin-left: 20px;
    }
    #c_schedule .online p {
        width: 100%;
    }
    #c_schedule li.coming-soon {
        text-align: center;
        line-height: 352.8px;
    }
}