@charset "UTF-8";

body {background-image: url(img/bg.jpg); background-repeat: repeat; font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}
.wrap {width: 75%; margin: 0 auto; background-color:#86bb1f; padding-bottom: 4px;}

.head {width: 100%; height:auto; background-color: #FFF;}
ul.head_area {display: flex; justify-content: space-between; background-color: #FFF;}
ul.head_area li {margin: 1em;}
ul.head_area li:first-child {width: 35%;}
ul.head_area li:nth-child(2) {width: 60%;}

ul.head_area li:first-child > img{width:100%;}

h1.head_title {font-size: 130%; font-weight: 700; margin-top: 3em;}
p.head_tex {font-size: 100%; margin: 1em 0; list-style: 2.5em;}
p.head_tex a{color: #480101;}

@media (max-width: 480px) {
    .wrap {width: 95%;}

    ul.head_area {justify-content: center; flex-wrap: wrap;}
    ul.head_area li {margin: 0.5em;}
    ul.head_area li:first-child {width: 100%;}
    ul.head_area li:nth-child(2) {width: 100%;}
    
    
    h1.head_title {margin-top: 1em;}
    p.head_tex {font-size: 100%; margin: 1em 0; list-style: 2.5em;}
}
p.theme {font-size: 100%; margin-bottom: 2em; line-height: 1.6em;}
p.onairlist {font-size: 150%; font-weight: 700; margin: 1em;}
@media (max-width: 480px) {
    p.onairlist {text-align: center;}
}
h3.selection {font-size: 180%; font-weight: 700; margin-bottom: 0.6em;}
h3.selection_guest {margin-bottom: 0em;}
h3.selecter {font-size: 160%; font-weight: 700; margin-bottom: 0.6em;}
p.name_g {font-size: 110%; font-weight: 700; margin: 0.2em 0; color: #86bb1f;}
p.name_c {font-size: 110%; font-weight: 700; margin: 0.2em 0; color: #8a7f04;}
*==================================================
アコーディオンのためのcss
===================================*/

/*アコーディオン全体*/
.accordion-area{
    list-style: none;
    width: 90%;
    max-width: 500px;
    margin:0 auto;
}

.accordion-area li.accordion-area_in{
    margin: 10px 0;
    background-color: #FFF;
}

.accordion-area section {
  border: 1px solid rgb(204, 204, 204);
}
/*アコーディオンタイトル*/
.title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:1.2rem;
    font-weight: normal;
    padding: 3% 3% 3% 50px;
    transition: all .5s ease;
}
.title > span {font-size: 130%;}
/*アイコンの＋と×*/
.title::before,
.title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #333;
    
}
.title::before{
    top:48%;
    left: 15px;
    transform: rotate(0deg);
    
}
.title::after{    
    top:48%;
    left: 15px;
    transform: rotate(90deg);

}
/*　closeというクラスがついたら形状変化　*/
.title.close::before{
  transform: rotate(45deg);
}

.title.close::after{
  transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.box {
    display: none;/*はじめは非表示*/
    background: #fdfede;
    margin:0 3% 3% 3%;
    padding: 3%;
    border-radius: 4px;
}

/*========= レイアウトのためのCSS ===============*/


h2{
    text-align: center;
    margin: 30px 0;
    font-size:1rem;
}

ul.songlist {margin-left: 1em; counter-reset: number 0;}
ul.songlist > li {line-height: 2rem;}
ul.songlist > li::before {counter-increment: number; content:"M."counter(number,decimal-leading-zero)""; margin-right:0.8em}
ul.songlist > li.songlist_inn {display: inline-flex; width: 100%;}

ul.songs {display: flex; justify-content: left; flex-wrap: wrap; width: 100%;}
ul.songs > li{}
ul.songs > li:first-child{width: 25em; font-size: 140%; font-weight: 700;}
/*ul.songs > li:nth-child(2){width: calc(100% - 25em); font-size: 120%; font-weight: 700;}*/
ul.songs > li:nth-child(2){width: 100%; font-size: 120%; font-weight: 700;}
ul.songs > li:nth-child(3){width: 100%; line-height: 1.6em; margin-bottom: 2em;}

.talk_c {font-weight: 700; color: #594a07;}
.talk_k {font-weight: 700; color: #01390e;}
@media (max-width: 480px) {
    ul.songlist {margin-left: 0;}
    ul.songlist > li {line-height: 1.4rem;}

    ul.songs {display: flex; justify-content: left; flex-wrap: wrap; width: 100%;}
    ul.songs > li{}
    ul.songs > li:first-child{width: 100%; font-size: 120%;}
    ul.songs > li:nth-child(2){width: 100%;; font-size: 110%; margin: 0.6em 0;}
    ul.songs > li:nth-child(3){width: 100%; line-height: 1.6em; margin-bottom: 2em;}
}