/*====================================================
	overwrite
====================================================*/

article {
    padding-bottom: 3em;
    background-color: #f0daca;
}



.c-pankuzu {
    width: 98%;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    font-size: 14px;
    padding: 10px 0;
}

/*====================================================
	common
====================================================*/


.hidetxt {
    text-indent: 110%;
    white-space: nowrap;
    overflow: hidden;
    line-height: 1;
    font-size: 1.0rem;
    display: block;
}

.img_pc {
    display: block;
}

.img_mob {
    display: none;
}


@media print,
screen and (max-width: 768px) {
    .img_pc {
        display: none;
    }

    .img_mob {
        display: block;
    }

}


/*====================================================
	wrapper
====================================================*/

#wrapper {
    font-size: 1.4rem;
    width: 100%;
    padding: 0 0 3em;
    overflow: hidden;
    background: #f0daca;
}


@media print,
screen and (min-width: 1024px) {
    #wrapper {
        padding: 0 0 3em;
    }
}

@media screen and (max-width: 1023px) {
    #wrapper {
        padding: 0 0 0;
    }
}




/*====================================================
	// ID contents 
=====================================================*/


#contents a {
    color: #a33946;
    text-decoration: underline;
    transition: .2s linear;
}



#contents a:hover {
    opacity: 0.6;
}


@media screen and (min-width: 1024px) {
    #contents {
        width: 90%;
        max-width: 1280px;
        margin: auto auto 2em;
        background: #fff url(../../img/common/bg-contents.jpg) 0 0 no-repeat;
    }
}


@media screen and (max-width: 1023px) {
    #contents {
        background: #fff url(../../img/common/bg-contents-mob.jpg) 0 0 repeat-y;
        background-size: contain;
    }
}

/*====================================================
	// NOTE common
=====================================================*/

.wf-sawarabimincho {
    font-family: "Sawarabi Mincho";
}



/*====================================================
	//  #lesson_link
=====================================================*/

#lesson_link {
    float: right;
    margin-top: 1em;
    margin-bottom: 1em;
    font-size: 13px;
    font-size: 1.3rem;
    font-weight: bold;
}

#lesson_link a {
    padding: 0.3em 1em;
    color: #fff;
    background: #ffa438;

    border-radius: 1em;
}

#lesson_link a:hover {
    background: #ff7404;
    text-decoration: none;
}


/*====================================================
	anchor
=====================================================*/

a.red {
    color: #af455e;
}

a.red:hover {
    color: #c7667d;
}

a.line {
    text-decoration: underline;
}


.tel_link a {
    color: #000;
}

/*====================================================
	title
=====================================================*/
#title {
    width: 100%;
    max-width: 1080px;
    margin: auto;
}

#title h1 {
    position: relative;
    margin-bottom: -1em;
}

.h1_img_pc {
    display: block;
}

.h1_img_mob {
    display: none;
}

#title h1 img {
    width: 100%;
    max-width: 1080px;
}

#title h1 img#school50 {
    width: 15%;
    max-width: 161px;
    position: absolute;
    top: 3%;
    left: 3%;
    z-index: 1;
}


@media screen and (max-width: 1023px) {
    #title {
        width: 100%;
        margin: auto auto 1em;
    }
}


@media print,
screen and (max-width: 768px) {
    .h1_img_pc {
        display: none;
    }

    .h1_img_mob {
        display: block;
    }
}




/*====================================================
	// class .cancel 
=====================================================*/
.cancel {
    width: 90%;
    margin: auto;
}

.cancel h5 {
    font-size: 1.6rem;
    text-align: center;
    margin-bottom: 1.5em;
    line-height: 1.5;
}

.cancel .span_1 {
    font-size: 2.2rem;
    color: #c00;
    font-weight: bold;
}


.cancel .span_2 {
    font-size: 1.8rem;
    color: #c00;
    font-weight: bold;
    display: block;
}

.cancel .span_3,
.cancel .span_4 {
    margin-left: .5em;
}

.cancel .end {
    text-align: right;
}


@media print,
screen and (max-width: 768px) {

    .cancel .span_1 {
        font-size: 2.0rem;
    }

    .cancel .span_2 {
        font-size: 1.6rem;
    }

    .cancel .span_3 {
        display: block;
        margin-left: 0;
    }

    .cancel .span_4 {
        display: block;
        margin-left: 0;
    }
}







/*====================================================
	outline
=====================================================*/

#outline {

    background: rgba(255, 255, 255, 0.6);
}

#outline .lead-txt {
    margin-bottom: 3em;
}

#outline .lead-txt p {
    line-height: 1.8;
    text-align: center;
    /*    font-family: "Sawarabi Mincho";*/
}

#outline h4.outline {
    color: #fff;
    background: #fe8178;
    text-align: center;
}

#outline .row {
    margin-bottom: 2em;
}

#outline .txtbox p,
#outline .txtbox ul {
    margin-bottom: 1em;
}

#outline .mobHidetxt {
    display: none;
    padding-top: 1em;
}

@media screen and (min-width: 1024px) {

    /* ////////// pc ////////// */
    #outline {
        width: 95%;
        max-width: 1080px;
        margin: auto;
        padding: 3em 0;
    }

    #outline .inside {
        width: 90%;
        margin: auto;
    }

    #outline .lead-txt p {
        font-size: 2.0rem;
    }

    /* pc end */
}


@media screen and (max-width: 1023px) {

    /* ////////// mob ////////// */
    #outline {
        width: 95%;
        margin: auto;
        padding: 2em 0;
    }

    #outline .lead-txt {
        width: 90%;
        margin: auto;
    }

    #outline .lead-txt p {
        font-size: 1.4rem;
        margin-bottom: 1em;
    }
}



/*=================================
	//class date-detal
===================================*/

.date-detail {
    margin-bottom: 30px;
}

.date-detail-item {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
}

.date-detail h4 {
    width: 16%;
}

.date-detail h4 span {
    color: #fff;
    font-size: 1.6rem;
    font-weight: bold;
    text-align: center;
    background: #fe8178;
    width: 8em;
    margin-bottom: 0.5em;
    padding: 0.2em 1em 0.2em;
    border-radius: 2em;
    display: inline-block;
}

.date-detail-item .detail-txt {
    width: 83%;
    text-align: left;
}

.date-detail .endtxt {
    font-size: 1.4rem;
    margin-bottom: 0;
}

.date-detail-item {
    margin-bottom: 2em;
}

.date-detail-item .detail-txt {
    font-weight: bold;
}

.date-detail-item .detail-txt {
    font-size: 2.0rem;
    font-weight: bold;
}


.date-detail-item .reserve {
    font-size: 1.5rem;
}




@media screen and (max-width:1023px) {

    /* /////// tab mob /////// */
    #detail {
        font-size: 1.6rem;
    }

    #detail ul {
        margin-left: .5em;
    }

    .date-detail {
        width: 95%;
        margin: auto auto 3em;
    }

    .date-detail-item {
        margin-bottom: 1em;
    }

    .date-detail-item .detail-txt {
        width: 80%;
        text-align: left;
    }
}


@media screen and (max-width: 768px) {
    .date-detail {
        width: 90%;
        margin: auto;
    }

    .date-detail-item {
        display: block;
    }


    .date-detail h4 span {
        font-size: 1.4rem;
        width: 8em;
        margin-bottom: 0;
        padding: 0 1em 0;
        border-radius: 2em;
        display: inline-block;
    }


    .date-detail-item .detail-txt {
        width: 100%;
        font-size: 16px;
    }
}

a.map-link {
    font-size: 1.4rem;
    color: #fff !important;
    font-weight: normal;
    background: #a33946;
    padding: .25em .5em;
    border-radius: .2em;
    vertical-align: middle;
    text-decoration: none !important;
}

a.map-link:hover {
    background: #ffa1b7;
}


/*====================================================
	// class info-box
=====================================================*/


.info-box h3 {
    font-size: 2.0rem;
    margin-bottom: .5em;
    border-bottom: #af455e thin solid;
}



@media screen and (max-width: 1023px) {
    .info-box {
        width: 95%;
        margin: auto;
    }
}




/*============================
	// ID #apply
==============================*/


#apply {
    width: 90%;
    margin: auto auto 60px;
    padding: 20px 15px 30px;
    border: #ffb0aa thin solid;
    color: #333;
}

#apply h4 {
    font-size: 1.6rem;
    margin-bottom: 15px;
    padding-bottom: 10px;
    text-align: center;
    border-bottom: #fe8178 thin dotted;
}

#apply p {
    text-align: center;
}


#apply .notice {
    margin-bottom: 15px;
}

#apply .notice li {
    margin-left: 30px;
    list-style: disc;
    list-style-position: outside;
}

#apply .icon {
    width: 270px;
    max-width: 35%;
    margin: auto;
    padding: 15px 0;
}


#apply .link {
    text-align: center;
}

#apply .link a {
    width: 50%;
    padding: 5px 0 6px;
    color: #fff;
    font-size: 1.6rem;
    text-decoration: none;
    text-align: center;
    background: #a33946;
    display: inline-block;
    border-radius: 2em;
}



@media print,
screen and (max-width: 768px) {
    #apply .icon {
        width: 60%;
        max-width: 60%;
    }

    #apply .link a {
        width: auto;
        display: block;
    }

}




/*============================
	// ID #program
==============================*/

#program {
    font-size: 1.6rem;
    margin-bottom: 5em;
    padding: 5px;
    border: #a33946 medium solid;
}

#program .inner_1 {
    border: #a33946 thin solid;
    background: url(../img/program-bg-01.svg) no-repeat center top;
}

#program .inner_2 {
    padding: 2.5em 0 2em;
    background: url(../img/program-bg-02.svg) no-repeat center bottom;
}

#program h4 {
    margin: auto;
    text-align: center;
}

#program h4 img {
    width: 150px;
    height: auto;
}

#program dt {
    color: #af455e;
    font-weight: bold;
    margin-right: 2%em;
}

#program dl,
#program ul,
#program p {
    width: 60%;
    margin: auto;
}


#program li {
    margin-bottom: 10px;
}

#program ul .heading {
    width: 180px;
    color: #af455e;
    font-weight: bold;
    font-weight: bold;
    display: inline-block;
    /* border: #f00 thin solid; */
}

#program p {
    text-align: right;
}

#program dt,
#program dd {
    margin-bottom: .5em;
    display: inline-block;
}

#program dt {
    width: 25%;
    margin-right: 2%;
}

#program dd {
    width: 70%;
}



@media all and (-ms-high-contrast:none) {
    #program .inner_1 {
        border: #a33946 thin solid;
        background: url(../img/program-bg-01.png) no-repeat center top;
        background-size: contain;
    }

    #program .inner_2 {
        padding: 2.5em 0 2em;
        background: url(../img/program-bg-02.png) no-repeat center bottom;
        background-size: contain;
    }

    /* IE11 */
}



@media screen and (max-width: 1023px) {
    #program {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 3em;
    }

    #program .inner_1 {
        border: #a33946 thin solid;
        background: url(../img/program-bg-mob-01.svg) no-repeat 0 0;
    }

    #program .inner_2 {
        padding: 3.5em 0 2em;
        background: url(../img/program-bg-mob-02.svg) no-repeat 0 bottom;
    }

    #program h4 {
        width: 20%;
        margin: auto auto 1em;
    }

    #program dl,
    #program p {
        width: 70%;
        margin: auto;
    }

    #program dt {
        width: 35%;
        margin-right: 2%;
    }

    #program dd {
        width: 60%;
    }
}

@media screen and (max-width: 768px) {

    #program .inner_2 {
        padding: 1em 0 2em;
    }

    #program h4 {
        width: 40%;
    }

    #program dl,
    #program ul,
    #program p {
        width: 90%;
    }


    #program ul .heading {
        display: block;

    }





    #program dl {
        line-height: 1.4;
    }

    #program dt,
    #program dd {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    #program dt {
        margin-bottom: 0;
    }

    #program dd {
        margin-bottom: 1em;
        padding-left: 1em;
    }

}

/*====================================================
	#inq-event
=====================================================*/

#inq-event {
    font-size: 1.6rem;
}

@media print,
screen and (max-width: 768px) {

    #inq-event h3,
    #inq-event ul,
    #inq-event p {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
    }


}





/*====================================================
	// ID #lesson
=====================================================*/

#lesson {
    font-size: 1.4rem;
    background: #ffa29b;
    padding: 3em 0;
}

#lesson .inside {
    background: #fff;
    width: 95%;
    max-width: 1160px;
    margin: auto;
    padding: 3em 0;
}

#lesson h2 {
    text-align: center;
    margin-bottom: 1em;
    font-size: 3.0rem;
    color: #a33946;
    font-family: "Sawarabi Mincho";
}

#lesson .row {
    width: 90%;
    margin: auto auto 1em;
    border-bottom: #ccc thin solid;
}

#lesson_lead {
    width: 90%;
    margin: auto auto 3em;
}

#lesson_lead .inside {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
}

#lesson_lead .txtbox {
    width: 62%;
}

#lesson_lead dt {
    color: #a33946;
    font-weight: bold;
}

#lesson_lead dd {
    margin-left: 1em;
}

#lesson_lead .photo {
    width: 35%;
    max-width: 363px;
}

#lesson_lead .photo img {
    width: 100%;
}

#lesson h3 {
    padding: 10px 0;
    margin: 0 auto 1em;
    font-family: "Sawarabi Mincho";
    font-size: 2.4rem;
    color: #a33946;
    text-align: center;
}

#lesson h3 .heading {
    margin: 10px 0
}

#lesson h3 .heading {
    color: #a33946;
    text-align: center;
    overflow: hidden;
}

#lesson h3 .heading span {
    display: inline-block;
    position: relative;
}

#lesson h3 .heading span:before,
#lesson h3 .heading span:after {
    content: "";
    border-bottom: thin solid #a33946;
    width: 100px;
    margin: 0 15px;
    position: absolute;
    bottom: 16px;
}

#lesson h3 .heading span:before {
    right: 100%;
}

#lesson h3 .heading span:after {
    left: 100%;
}


#lesson .row h4 {
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 1em;
    padding: 0.5em 1em;
    color: #fff;
    background: #a33946;
    border-radius: 2em;
    display: inline-block;
}

#lesson .txtbox p,
#lesson .txtbox ul {
    margin-bottom: 1em;
}

#lesson .txtbox a {
    color: #a33946;
    text-decoration: underline;
}

#lesson .txtbox a:hover {
    color: #c7667d;
}

/* // note #lesson .outline　*/
#lesson .outline {
    width: 95%;
    margin: auto;
    padding-bottom: 1em;
    /**/
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
}


#lesson .outline .txtbox {
    width: 70%;
}

#lesson .outline .photo {
    width: 20%;
    max-width: 200px;
}

#lesson .outline .photo img {
    width: 100%;
}

#lesson .first_size {
    font-size: 2.0rem;
}

/**/
.taiken-link {
    font-size: 1.8rem;
}





@media screen and (max-width: 1023px) {
    #lesson {
        padding: 1em 0;
        font-size: 1.5rem;
    }

    #lesson_lead .txtbox {
        width: 100%;
    }



    #lesson .inside {
        width: 95%;
        margin: auto;
        padding: 2em 0;
        display: block;
    }

    #lesson h2 {
        font-size: 2.4rem;
        margin-bottom: .5em;
    }

    #lesson .inside .text-right {
        width: 90%;
        margin: auto;
    }

    #lesson .inside .photo {
        width: 60%;
        margin: auto auto 1em;
    }

    #lesson_lead .text-right {
        width: 62%;
    }

    #lesson_lead .photo {
        width: 35%;
        max-width: 363px;
    }

    #lesson .inside .photo img {
        width: 100%;
    }

    #lesson_lead {
        margin-bottom: 3em;
    }

    #lesson .first_size {
        font-size: 1.8rem;
    }

    #lesson .txtbox {
        font-size: 1.3rem;
        margin-top: 0.5em;
    }

    #lesson .row h4 {
        font-size: 1.6rem;
        padding: .15em 1em;
        margin-bottom: 0;
    }



    #lesson .outline .txtbox {
        width: 70%;
    }

    #lesson .outline .photo {
        width: 20%;
        max-width: 200px;
    }

    #lesson .row p {
        font-size: 1.4rem;
    }

    .taiken-link {
        font-size: 1.7rem;
    }

    .center-link {
        font-size: 1.5rem;
    }

    /* mobile end */
}




@media screen and (max-width: 900px) {
    #lesson .outline .txtbox {
        width: 100%;
    }

    #lesson .outline .photo {
        width: 20%;
        max-width: 200px;
    }
}


@media screen and (max-width: 899px) {
    #lesson .outline .photo {
        display: none;
    }
}


@media screen and (max-width: 768px) {
    #lesson .inside {
        padding: 1em 0;
    }

    #lesson h3 {
        font-size: 2.0rem;
        margin: 0 auto;
        padding: 10px 0;
    }

    #lesson h3 .heading {
        margin: 10px 0
    }

    #lesson h3 .heading {
        color: #a33946;
        text-align: center;
        overflow: hidden;
    }

    #lesson h3 .heading span {
        display: inline-block;
        position: relative;
    }

    #lesson h3 .heading span:before,
    #lesson h3 .heading span:after {
        content: "";
        border-bottom: thin solid #a33946;
        width: 25px;
        margin: 0 15px;
        position: absolute;
        bottom: 30px;
    }

    #lesson h3 .heading span:before {
        right: 100%;
    }

    #lesson h3 .heading span:after {
        left: 100%;
    }

    /**/
}



/*====================================================
	//ID #access
=====================================================*/
#access {
    margin: auto auto 1em auto;
}


#access.info-box {
    padding-top: 120px;
}

#access .inside {
    width: 95%;
    margin: auto auto 1em;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
}

#access h4 {
    font-size: 1.6rem;
    font-weight: bold;
    margin-bottom: 1em;
}

#access .txtbox {
    width: 50%;
    margin: 0 1.5% 0 0;
}

#access #mapbox {
    width: 43%;
    margin: 0 0 0 1.5%;
}

#access #mapbox a {
    color: #a33946;
}

#access #mapbox a:hover {
    color: #c7667d;
}

#access dd {
    font-size: 1.4rem;
    margin-bottom: 1em;
}

#access dt {
    font-weight: bold;
}

#access ul {
    font-size: 1.4rem;
    margin-bottom: 2em;
}

#mapbox iframe {
    width: 100%;
    height: 250px;
}

@media screen and (max-width: 1023px) {
    #access {
        margin: auto auto 2em auto;
        font-size: 1.4rem;
    }

    #access h3 {
        margin-bottom: 1em;
    }

    #access h4 {
        font-size: 2.0rem;
    }

    #access dt {
        font-size: 1.6rem;
    }

    #mapbox {
        width: 90%;
        margin: auto;
        padding: 2em 0;
    }

    #mapbox iframe {
        width: 100%;
        height: 250px;

    }

    #mapbox ul {
        font-size: 13px;
    }

    /* mobile end */
}

@media print,
screen and (max-width: 768px) {
    #access .inside {
        display: block;
    }

    #access h3 {
        margin-bottom: .25em;
    }

    #access h4 {
        width: 95%;
        margin: auto auto 1em
    }

    #access .txtbox {
        width: 95%;
        margin: auto;
    }

    #access #mapbox {
        width: 95%;
        margin: auto;
    }

}








/*====================================================
#sns_sharebox
=====================================================*/

#sns_sharebox_outer {
    background: rgba(255, 255, 255, 0.7);
    /*    border-radius: .25em;*/
}

#sns_sharebox {
    font-size: 1.3rem;
    text-align: right;
    /**/
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content：space-between;
}

#sns_sharebox li {
    width: 32%;
    margin: 0 0.5%;
    padding: 0.5em 0;
    text-align: center;
    display: inline;
}

#sns_sharebox a {
    color: #fff;
    padding: 0 1em 0 1em;
    border-radius: 0.2em;
    display: block;
}

#sns_sharebox a:hover {
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
    opacity: 0.6;
    text-decoration: none;
}

#sns_sharebox #fb_share {
    background: #3b5998;
}

#sns_sharebox #tweet {
    background: #55acee;
}

#sns_sharebox #line {
    background: #1dcd00;
}

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

    /* ///////// pc ////////// */
    #sns_sharebox_outer {
        max-width: 1280px;
        margin: auto;
        padding: 1em 0;
    }

    #sns_sharebox {
        margin: auto 5%;
    }

    /* pc end */
}

@media screen and (max-width: 1023px) {

    /* //////// 1023 ///////// */
    #sns_sharebox_outer {
        margin: auto;
        padding: 1em 2.5%;
    }
}




/*====================================================
	link
====================================================*/

.link {
    margin: 60px 0 30px;
    padding: 15px;
    font-size: 1.6rem;
    text-align: center;
    border: #999 thin dotted;
}