body, div, p, option, input, textarea, h1, h2, h3, h4 {
    font-family: "M PLUS 1p";
}

*:focus {
    outline: none !important;
}

.lesson-logo-container {
    margin-top: 100px;
    text-align: center;
}
.lesson-logo-container-pc {
    margin-top: 400px;
    text-align: center;
}

.mt--5 {
    margin-top: -3.0em !important;
}

li a.sidemenus{
    border-bottom: 1px solid #FFF;
}
div.sns-container{
    display: flex;
    justify-content: space-between;
    text-align: center;
    width: 100%;
    padding: 0px 15px;
}
div.sns-center {
    justify-content: space-around;
}
    div.forpc {
        width: auto;
        justify-content: space-around;
    }
div.sns{
    border: 1px solid #FFF;
    border-radius: 50%;
    height: 58px;
    width: 58px;
    display: flex;
    justify-content: center;
    align-items: center;
}
div.sns-red {
    border: 1px solid #DC000C;
}
    div.sns-pad {
        margin: 0px 10px;
    }
div.sns-red a {
    color: #DC000C !important;
}

div.sns .div.sns-child{

}
p.copyright {
    margin-top: 25px;
    font-size: 0.8rem !important;
}

.feature-block-cover {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
}

.mb-5 {
    margin-bottom: 2.0em !important;
}

.btn-custom {
    border: 1px solid #dc000c;
    border-radius: 30px;
    padding: 5px 15px;
    color: #FFF;
}
.btn-custom:hover {
    color: #dc000c;
}

a:visited,
a {
    color: white;
}
a:hover{
    color: #dc000c;
}

.map {
    width: 100%;
    height: 400px;
    background-color: #333;
}

.bg-custom {
    background-color: #dc000c !important;
}

h3.mb-5 {
    color: #AAA;
    border-bottom: 1px solid #AAA;
    padding-bottom: 25px;
    padding-top: 5px;
    margin-bottom: 15px !important;
}
h3.no-mb-5 {
    color: #AAA;
    border-bottom: none;
}
.nav-menu {
    position: fixed;
    top: 30px;
    right: 20px;
    z-index: 100;
    cursor: pointer;
}

.nav-contact {
    position: fixed;
    bottom: 0;
    background-color: #dc000c;
    color: #FFF;
    text-align: center;
    padding: 15px;
    z-index: 99;
    cursor: pointer;
}

.modal-contact {
    position: fixed;
    overflow: auto;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 100;
}
.modal-contact .contact-header {
    box-sizing: border-box;
    margin-top: 25px;
    text-align: right;
}
.contact-body {
    padding: 5px 20px;
}
    .modal-contact .contact-body > ul {
        padding: 0;
        margin: 0;
        list-style: none;
    }
    .modal-contact .contact-body > ul > li {
        color: #6E6F6F;
        margin: 15px 0px;
        width: 100%;
    }
    .modal-contact .contact-body > ul > li > textarea {
        width: 100%;
        background-color: transparent;
        border: 1px solid #FFF;
        color: #FFF;
        border-radius: 0px;
        resize: none;
    }
    .modal-contact .contact-body > ul > li > div {
        position: absolute;
        color: #6E6F6F;
        z-index: -10000;
    }
    .modal-contact .contact-body > ul > li > input {
        width: 100%;
        background-color: transparent;
        border: none;
        border-bottom: 1px solid #FFF;
        color: #FFF;
        text-align: right;
        border-radius: 0px;
        padding: 5px 0px;
    }
    .modal-contact .contact-body .contact-form-class,
    .modal-contact .contact-body .contact-form-calendar {
        cursor: pointer;
    }
    .modal-contact .contact-body .contact-form-class-group,
    .modal-contact .contact-body .contact-form-calendar-group {
        height: 150px;
        overflow: auto;
        background-color: #FFF;
        color: #333;
        z-index: 88;
        display: none;
    }
    .modal-contact .contact-body .contact-form-class-group > ul,
    .modal-contact .contact-body .contact-form-calendar-group > ul {
        padding: 0;
        margin: 0;
        list-style: none;
    }
    .modal-contact .contact-body .contact-form-class-group > ul > li,
    .modal-contact .contact-body .contact-form-calendar-group > ul > li {
        color: #333;
        padding: 10px 5px;
        width: 100%;
        cursor: pointer;
    }
    
.modal-contact .contact-footer {
    box-sizing: border-box;
    margin-top: 25px;
    text-align: center;
}
.modal-contact .contact-footer > button {

}
    .contact-footer .btn-contact {
        border: none;
        border: 1px solid #FFF;
        background-color: transparent;
        color: white;
        padding: 5px 30px;
        border-radius: 28px;
        border-color: #dc000c !important;
    }
        .contact-footer .btn-contact .wide {
            width: 80%;
        }
        .contact-footer .btn-contact .narrow {
            width: 20%;
        }
        

.bg-red{
    /* padding: 10px 0px !important;
    padding-top: 25px !important; */
    background-color: #DC000C;
}
.fg-red{
    color: #DC000C;
}
.bg-brown {
    /* padding: 10px 0px !important;
    padding-top: 50px !important; */
    background-color: #4E0004;
}

.border-bottom {
    border-bottom: 1px solid #333;
}
.section-header {
    font-family: "Georgia" !important;
    letter-spacing: 1px !important;
    text-transform: none !important;
}
h3.lesson-name {

}
h3.lesson-header,
h4.lesson-header {
    color: #707070;
    border-bottom: 2px dotted #707070;
    width: 80%;
    display: inline-block;
    padding-bottom: 10px;
    letter-spacing: 10px;
}
h3.white {
    color: #FFF;
    border-bottom: 2px dotted #FFF;
}
div.lesson-item {
    border-bottom: 1px solid #FFF;
    width: 80%;
    display: inline-block;
    padding: 5px 0px;
    margin-bottom: 5px;
}
p.lesson-body {
    color: #FFF;
    width: 80%;
    display: inline-block;
    line-height: 250%;
}
p.lesson-body > span {
    color: #707070;
}

div.contact-confirm span {
    text-align: right;
    color: #FFF;
}