
.logoArea {
    display: flex;
    justify-content: space-between;
    align-items: center;
    float: none;
    width: 960px;
    margin: 0 auto 2rem;
}
.logoArea p {
    margin: 0;
}
#header .inner h1{
    float: none;
    margin-left: 0;
}
.logo_r2inovation {
    width: 146px;
}
.inner{
    width: 1024px;
}
.hacchu-contents{
    color: #362a00;
    font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN",
    HGS明朝E, メイリオ, Meiryo, serif;
    background-image: rgb(54,42,0);
    background-image: url(../img/content-bg.png), linear-gradient(180deg, rgba(54,42,0,1) 0%, rgba(54,42,0,1) 8%, rgba(157,139,108,0.4814000062915791) 53%, rgba(255,232,212,0) 100%), url(../img/content-bg-bottom.png), linear-gradient(0deg, rgba(88,74,36,0.8812812356387868) 0%, rgba(157,139,108,0.4814000062915791) 58%, rgba(255,232,212,0) 100%);
    background-repeat: no-repeat;
    background-size: 692px 277px, 100% 150px, 1287px 250px, 100% 900px;
    background-blend-mode: exclusion, normal, exclusion , normal;
    background-position: right top, center top, center bottom, center bottom;
}
.hacchu-header {
    padding-bottom: 84px;
    background: url(../img/mainArea-bg-bottom.png) no-repeat center bottom;
}
.hacchu-header .inner .main-img{
    background-image: url(../img/mainArea-bg-right.png), url(../img/mainArea-bg-left.png);
    background-position: right -40px, left bottom;
}
.hacchu-header .inner .main-img .logo{
    margin: 6px 117px;
}
.hacchu-header .inner .main-img .hachiyama{
    margin: -6px 260px;
}
.main-copy,
.content-inner{
    width: 820px;
    margin: 0 auto;
}
.main-copy h2.hacchu-title{
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 28px;
    text-indent: -18px;
}
.main-copy p{
    font-weight: bold;
    font-size: 16px;
    line-height: 2.0;
}
.main-copy p.line{
    text-indent: 42px;
    position: relative;
}
.main-copy p.line:after{
    content: "";
    display: block;
    background: #362a00;
    width: 36px;
    height: 1px;
    left: 0;
    top: 15px;
    position: absolute;
}
/* イベント情報 */
.hacchu-contents-2 .inner{
    background-image: url(../img/detail-bg.png), url(../img/detail-bg-middle.png);
    background-position: right 234px, -150px bottom;
    padding-bottom: 220px;
}
.youtube-info{
    border: 1px solid #362a00;
    font-size: 21px;
    padding: 5px 36px;
    display: inline-block;
    margin-top: 30px;
    font-weight: bold;
}
.youtube-info span{
    font-size: 18px;
    margin-left: 20px;
}
.youtube-info a{
    font-size: 18px;
    color: rgb(4, 83, 53);
}
.youtube-info a:hover{
    color: darkred;
}
.event-detail-table{
    margin-top: 20px;
    font-size: 17px;

}
.event-detail-table th{
    position: relative;
    width: 90px;
    padding: 6px 0 6px 27px;
    font-weight: bold;
}
.event-detail-table td{
    padding: 6px;
    font-weight: bold;
}
.event-detail-table th:before{
    content: "";
    background: url(../img/dots.png) no-repeat -5px center;
    position: absolute;
    left: -15px;
    top: -7px;
    display: block;
    width: 56px;
    height: 45px;
}
.event-detail-table .time-schedule{
    font-size: 14px;
    margin-left: 22px;
}
.event-detail-table .time-schedule p.section-title{
    border-bottom: 1px solid #362a00;
    font-weight: bold;
}
.event-detail-table .time-schedule p{
    margin: 0.3rem 0;
}
.event-detail-table .time-schedule ul li{
    margin: 0.3rem 0;
    font-weight: bold;
}
/* アーティスト写真 */
.hacchu-contents-3 .inner{
    background: url(../img/detail-bg-middle-bottom.png) no-repeat 356px bottom;
    padding-bottom: 130px;
}
.artists{
    display: flex;
    flex-wrap: wrap;
    width: 706px;
    margin: 0 0 0 203px;
}
.artists .artist-panel{
    width: 150px;
    margin: 0 75px 0 10px;
}
.artist-img{
    position: relative;
}
.artist-img:after{
    content: url(../img/artist-profile-bg.png);
    position: absolute;
    top: -21px;
    right: 9px;
    z-index: -1;
}
.artist-info .name{
    font-size: 30px;
    font-weight: bold;
    margin-top: 0.4rem;
}
.artist-info .name ruby rt{
    font-size: 30%;
}
.artist-info .alfa{
    font-size: 12px;
    font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
    margin-top: -10px;
}
.artist-info .status{
    font-size: 10px;
    line-height: 1.4;
}
/* 鉢山の写真たち */
.hacchu-contents-4 .inner{
    margin-top: -100px;
}
.hachiyama-image{
    width: 608px;
    margin: 0 auto;
}
.hachiyama-image img{
    width: 100%;
}
.external-link{
    width: 608px;
    margin: 50px auto;
}
.external-link ul li{
    margin-bottom: 25px;
}
.kotenseki{
    width: 608px;
    margin: 80px auto 0;
    display: flex;
    justify-content: center;
}
.kotenseki-bottom{
    margin-top: 1rem;
}
.kotenseki img{
    width: 150px;
    margin: 0 2rem;
}
.hosts{
    width: 874px;
        margin: 10px 0 10px 178px;
        background: url(../img/hacchu-info2-bg.png) no-repeat right center;
        padding: 80px 0;
}
.hosts ul li{
    position: relative;
    font-size: 13px;
    margin-bottom: 8px;
}
.hosts ul li:before{
    content: "";
    background: url(../img/dots.png) no-repeat -5px center;
    position: absolute;
    left: -35px;
    top: -18px;
    display: block;
    width: 56px;
    height: 45px;
}

/* リンク */
a{
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
a:hover{
    color: darkgreen;
}
/* リンクセクション */
.link_nav .inner{
    display: flex;
    justify-content: space-around;
}
.link_nav .inner a{
    display: inline-block;
    padding: 0.4rem 2rem;
    color: #FFF;
    background: #362a00;
    text-decoration: none;
    border-radius: 0.25rem;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
.link_nav .inner a:hover{
    background: #000;
}

/* youtubeのリスト */
.youtube-archive-area{
    margin-top: 3rem;
}
.youtube-list{
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    padding: 2rem 0;
}
.youtube-content{
    width: 380px;
    margin-bottom: 2rem;
}
.youtube-archive-area2{
    margin-top: 2rem;
}
#main .youtube-archive-area2 h4{
    font-size: 22px;
    margin-bottom: 0.4rem;
    background: url(../img/dots.png) no-repeat -17px center;
    padding-left: 3rem;
}
.thumbnails{
    display: flex;
    justify-content: flex-start;
}
.thumbnails a{
    margin: 0 0.4rem;
    width: 24%;
}
.thumnails a img{
    width: 100%;
}
/*========= モーダル表示のためのCSS ===============*/

/*動画表示のモーダルの余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper{
	padding:0;
}

/*モーダルのボタンの色を変更したい場合*/
.modaal-close:after, 
.modaal-close:before{
	background:#ccc;	
}

.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}

