@charset "UTF-8";
/* CSS Document */

/*sns表示*/

.c-sns { 
  justify-content: flex-end;
}

._column-1 {
  grid-column: 1 / span 2;
  margin: 0 auto;
}



/*アコーディオン*/
.accordion-area{
  list-style: none;
  margin: 0 auto;
}

.accordion-area li{
  margin: 10px 0;
}

.accordion-area section {
	border: 1px solid #ccc;
}

/*アコーディオンタイトル*/
.title {
  position: relative;/*+マークの位置基準とするためrelative指定*/
  cursor: pointer;
  font-size: 1em;
  font-weight: normal;
  padding: 3% 3% 3% 50px;
  transition: all .5s ease;
}

._title {
  position: relative;/*+マークの位置基準とするためrelative指定*/
  font-size: 1em;
  font-weight: normal;
  padding: 3% 3% 3% 50px;
}


/*アイコンの＋と×*/
.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: #f3f3f3;
	margin: 0 3% 3% 3%;
  padding: 3%;
}

.color-opening {color: #a7a70e;}
.color-international {color: #003399;}
.color-advisory {color: #006633;}
.color-dream-window {color: #1aa8c4;}
.color-special {color: #7a0472;}
.color-keyboard {color: #9933cc;}
.color-composium {color: #cc3300;}
.color-voice {color: #cc3333;}
.color-time {color: #663300;}
.color-asia {color: #336666;}
.color-window {color: #0066cc;}
.color-organ {color: #663399;}
.color-lingering {color: #996600;}
.color-ringaring {color: #996600;}
.color-ensemble {color: #cc3366;}
.color-nomad {color: #cc3366;}
.color-new-year {color: #ff2f20;}
.color-b-c {color: #663366;}

/*--organ--*/
h3.organ_ttl { 
    font-size:1.25rem; 
    font-weight: 600; 
    margin-top:40px;
    border-bottom: 1px solid #ccc;
    padding-bottom:6px;
    margin-bottom:1em;
}