/*======================
	over write
=======================*/

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

    #contents {
        padding: 15px 0;
    }
}



#ensemble figure.mob {
    display: none;
}


/*==================
	// id #title
====================*/

#title {
    background: url(../img/common/bg_title_all_2.jpg) repeat-x center top;
}

#title .inside {
    width: 100%;
    max-width: 1400px;
    margin: auto;
    padding-bottom: 45px;
    position: relative;
    background: url(../img/top/bg_title_1400.png) no-repeat 0 130px;
}

#title .txtbox {
    text-align: center;
}

#title h1 {
    font-size: 30px;
    padding-top: 80px;
}

#title .headcopy {
    margin-bottom: 45px;
}

#title .headcopy .lead {
    color: #666;
    font-size: 1.5rem;
    margin-bottom: 1.5em;
}

#title .headcopy .catch {
    width: 50%;
    margin: auto;
    background: #fffac3;
    position: relative;
}


#title .headcopy {
    width: 62.3%;
    /*60*/
    text-align: center;
    color: #444;
    font-size: 1.6rem;
    /* 罫線 */
    background-color: #fff;
    background-image: linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%);
    background-size: 8px 100%, 100% 2.1em;
    line-height: 2.1em;
    padding: 0 1em 0 1em;
    margin: 15px auto 45px;
}


.pc1280,
.tab1024,
.mob640,
.mobpc {
    display: none;
}


.pctab {
    display: block;
}


#title h1 img {
    width: 820px;
}

#title #totoptop_pc a {
    font-size: 1.2rem;
    width: 12em;
    text-align: center;
    color: #fff;
    background: #008b3e;
    padding: 0.5em 1em 0.3em 1em;
    display: block;
}

#title #totoptop_pc a:hover {
    text-decoration: none;
}

#title #totoptop_pc {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 500;
}

#title .banner {
    width: 95%;
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
}

#title .main_photo {
    margin: auto;
    text-align: center;
}



@media screen and (max-width: 1410px) {
    #title {
        background: url(../img/common/bg_title_all_2.jpg) repeat-x center top;
        background-size: contain;
    }

    #title .inside {
        width: 98%;
        margin: auto;
        background: url(../img/top/bg_title_1400.png) no-repeat 0 100px;
        background-size: contain;
    }

    .mobpc {
        display: block;
    }
}


@media screen and (max-width: 1280px) {
    #title h1 img {
        width: 68%;
        /*62*/
    }

    #title .headcopy {
        width: 55%;
    }

    .pc1280 {
        display: block;
    }
}


@media screen and (max-width: 1180px) {
    #title .headcopy {
        width: 60%;
        font-size: 1.4rem;
        /* margin: 5px auto 1em; */
        margin: 20px auto 1em;
    }

    /* #title h1 {
        font-size: 30px;
        padding-top: 60px;
    } */

    .tab1024 {
        display: block;
    }


}

/* @media screen and (max-width: 960px) {
    #title .headcopy .break3 {
        display: none;
    }

} */


@media print,
screen and (max-width: 768px) {
    #title {
        width: 100%;
        background: none;
    }

    #title #totoptop_pc {
        display: none;
    }

    #title h1 {
        width: 100%;
        margin-bottom: 0;
        padding-top: 0;
    }

    #title h1 img {
        width: 100%;
    }

    #title .inside {
        width: 100%;
        background: none;
    }

    #title .headcopy {
        width: 91%;/*85*/
        margin: auto auto 0;
        padding: 15px 5%;
        font-size: 1.5rem;
        background-color: #fff;
        background-image: linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%);
        background-size: 8px 100%, 100% 2em;
        line-height: 2em;
        padding: 0 .25em;
        margin: auto auto 30px;
    }


    .title_inside #totoptop_pc {
        display: none;
    }

    #title .txtbox {
        width: 100%;
        padding-top: 0;
    }

    #title #totoptop_pc a {
        font-size: 1.2rem;
        width: 100%;
        text-align: center;
        color: #fff;
        background: #d6007f;
        padding: 0.5em 2.5% 0.3em;
        display: block;
    }

    #title .banner {
        width: 90%;
        margin-bottom: 30px;
    }

}


@media print,
screen and (max-width:640px) {
    .mob640 {
        display: block;
    }

    .pc1280 {
        display: none;
    }

    .pctab {
        display: none;
    }

    #title .main_photo {
        padding: 0 5px;
    }

}





/*=========================
 // id #contents_outer 
===========================*/

#contents_outer {
    background: #C9D7F2 url(../img/top/design.png) repeat 0 0;
}

#contents {
    width: 98%;
    max-width: 1200px;
    margin: auto;
    padding: 3em 0;
    /* background: url(../img/top/bg_subnav.png) repeat 0 0; */
}

#contents section {
    width: auto;
    max-width: 1200px;
    margin: auto auto 30px;
    padding: 30px 30px;
    background: #fff;
}


#contents #close {
    width: auto;
    max-width: 1200px;
    margin: auto auto 30px;
    padding: 30px 60px 35px;
    background: #fff;
}

#contents #sub_navigation {
    padding: 0;
    background: none !important;
}



@media print,
screen and (max-width: 900px) {
    #contents section {
        width: auto;
        max-width: 1200px;
        margin: auto auto 30px;
        padding:10px 15px;
        background: #fff;
    }

}

@media print,
screen and (max-width: 768px) {
    #contents section {
        width: 95%;/*85*/
        /* padding: 30px 5% 1px; */
        padding: 17px 4% 1px;
    }

    #contents #close {
        padding: 30px 15px;
        /* background: #fff; */
        width: 95%;
        /* padding: 30px 5% 1px; */
        /* padding: 17px 4% 1px;*/
    }

    #sub_navigation .box {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }



}








/*======================
	.report_contents
=======================*/
.report_contents {
    width: 90%;
    max-width: 1200px;
    margin: auto;

}

.report_row {
    /* padding: 60px 5% 3em; */
    padding: 1.5em 5% 2.5em;
    margin-bottom: 0em;
    /*3*/
    background: #fff;
    position: relative;
}

.report_contents .lv_01 {
    padding: 5%;
}

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

.report_row .flexbox .txtbox {
    width: 55%;
}

.report_row .flexbox figure {
    width: 42%;
    max-width: 370px;
}

.report_row .flexbox figure figcaption {
    text-align: right;
    font-size: 1.2rem;
    color: #666;
}

.report_row h2 {
    margin-bottom: 1em;
    padding: 10px 0 !important;
    font-size: 3.2rem;
    /*3.0*/
    text-align: center;
    border-bottom: #6a3906 thin solid;
    color: #ff9800;
    border-bottom: #ff9800 thin solid;
}

.report_row h3 {
    margin-bottom: 15px;
    font-size: 2.2rem;
    /*2.0*/
    color: #6a3906;
}

.report_row h3 .subtitle {
    font-size: 1.8rem;
    /*1.6*/
    display: block;
}

.report_row h3 span.date {
    font-size: 2.0rem;
    /*1.8*/
}

.report_row h3 span.sub {
    font-size: 2.0rem;
    /*1.8*/
    display: block;
    margin-bottom: 0;
    text-align: center;
}

.report_row h4 {
    margin-bottom: 5px;
    font-size: 1.8rem;
    color: #6a3906;
    margin-bottom: 10px;
}

.report_row h5 {
    font-size: 1.6rem;
    color: #6a3906;
    margin-bottom: 0;
}

.report_row h6 {
    font-size: 1.4rem;
    /*1.5*/
    color: #6a3906;
    margin-bottom: 0;
}

.report_row .audio-js-box {
    width: 100%;
    margin: 5px auto 10px;
    margin-left: 2.5%;
}

.report_row .sound_outer.single {
    margin-bottom: 30px;
}

.report_row figure img {
    width: 100%;
}

.report_row figcaption {
    padding: .5em 0 0;
}




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

    .report_row h2 {
        margin-bottom: 0.5em;
    }

    .report_row .inside.flexbox {
        display: block;
    }

    .report_row .flexbox .txtbox {
        width: 100%;
    }

    .report_row .flexbox figure {
        width: 100%;
        margin: 1.5em auto;
    }

    .report_row h3 span.sub {
        font-size: 1.8rem;/*1.6*/
    }

}


@media print,
screen and (max-width: 768px) {
    .report_row h2 {
        margin-bottom: 0;
        font-size: 2.8rem;
        /*1.8*/
    }

    .report_row {
        padding: 0 0 3em;
    }

    .report_row h4 {
        margin-bottom: .5em;
        font-size: 1.6rem;
        color: #6a3906;
    }


    .report_row h5 {
        font-size: 1.5rem;
        margin-bottom: 5px;
    }

}


@media print,
screen and (max-width: 640px) {
    .report_row h2 {
        margin-bottom: 0;
        font-size: 2.6rem;
    }

    .report_row {
        /* padding: 0 0 3em; */
        padding: 0 0 1em;
    }

    .report_row h4 {
        margin-bottom: .5em;
        font-size: 1.6rem;
        color: #6a3906;
    }


    .report_row h5 {
        font-size: 1.5rem;
        margin-bottom: 5px;
    }

    .report_row .inside.flexbox {
        display: block;
        padding: 1em 4%;
    }

    .report_row .flexbox figure {
        width: 90%;
        margin: 1.5em auto;
    }

    .report_row .audio-js-box {
        /* width: 100%;
        margin: 5px auto 10px; */
        margin-left: 0%;
    }

}



/*====================================================
	 #soundbox
====================================================*/



#soundbox {
    padding-top: 40px;
    /*30*/
}


/* #soundbox .player-title{
    font-size:1.6rem;
} */

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

    #soundbox {
        padding-top: 15px;
    }
}







/*====================================================
	.report_row .line
====================================================*/


.report_row .line.naname-1 {
    width: 65px;
    height: 65px;
    background: linear-gradient(-45deg, transparent 49%, #8ed0a9 49%, #8ed0a9 51%, transparent 51%, transparent);
    position: absolute;
    top: -15px;
    left: -10px;
    z-index: 5;
}

.report_row .line.naname-2 {
    width: 65px;
    height: 65px;
    background: linear-gradient(45deg, transparent, transparent 49%, #8ed0a9 49%, #8ed0a9 51%, transparent 51%, transparent);
    position: absolute;
    top: -15px;
    right: -10px;
    z-index: 5;
}

.report_row .line.naname-3 {
    width: 65px;
    height: 65px;
    background: linear-gradient(45deg, transparent, transparent 49%, #8ed0a9 49%, #8ed0a9 51%, transparent 51%, transparent);
    position: absolute;
    bottom: -10px;
    left: -10px;
    z-index: 5;
}

.report_row .line.naname-4 {
    width: 65px;
    height: 65px;
    background: linear-gradient(-45deg, transparent 49%, #8ed0a9 49%, #8ed0a9 51%, transparent 51%, transparent);
    position: absolute;
    bottom: -10px;
    right: -10px;
    z-index: 5;
}

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

    .report_row .line.naname-1,
    .report_row .line.naname-2,
    .report_row .line.naname-3,
    .report_row .line.naname-4 {
        width: 40px;
        height: 40px;
    }
}




/*======================
	// class .eventbox
=======================*/

#event_lineup {
    width: 95%;
    margin: auto;
    padding-top: 2em;
}

.eventbox {
    margin-bottom: 3em;
    padding: 2em 2.5%;
    border: #e0d8d1 thin solid;
}





@media print,
screen and (max-width: 900px) {
    #event_lineup {
        width: 100%;
        padding-top: 1em;
    }

    .eventbox {
        margin-bottom: 1em;
        padding: 1em 5%;
    }

    .report_row h3 {
        font-size: 1.8rem;/*1.6*/
    }

    .report_row h3 span.date {
        font-size: 1.6rem;/*1.4*/
    }

    .eventbox figure {
        /* width: 80% !important; */
        width: 80% ;
        margin: auto;
    }

}


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

    .report_row h3 {
        font-size: 1.8rem;
    }

}



@media print,
screen and (max-width: 640px) {
    .eventbox figure {
        /* width: 85% !important; */
        width: 90%;
        margin: auto;
    }
}


/*======================
	// id #closing
=======================*/

#closing p {
    text-align: center;
    /* 罫線 */
    background-color: #fff;
    background-image:
        linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%);
    background-size: 8px 100%, 100% 2em;
    line-height: 2em;
    padding: 0 1em 0 1em;
    /* margin: auto auto 45px; */
}

@media print,
screen and (max-width: 640px) {
    #closing p {
        /* text-align: center;
        background-color: #fff;
        background-image:
            linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 97.5%, #646464 100%);
        background-size: 8px 100%, 100% 2em;
        line-height: 2em; */
        padding: 0 0.5em;
    }
}



/*======================
	// id #closing
=======================*/
.footer-cta h3{
    font-size: 16.38px;
}


/*======================
	// id recorder_top
=======================*/

#recorder_top .link{
    margin-bottom: 0;
}


#recorder_top .link a{
    background: #c8373c;
    width: 70%;
    margin: auto;
    padding: 1em 0.5em;
    color: #fff;
    font-weight: bold;
    text-align: center;
    display: block;
    border-radius: 2em;
    font-size: 15px;
}


@media print,
screen and (max-width: 768px) {
    #contents #recorder_top {
        width: 95%;
        padding: 17px 4% 17px;
    }

    #recorder_top .link a{
        width: 95%;
    }

}