/*アコーディオン全体*/
.menu {
  width: 100%;
  padding: 10px 10px 20px;
}
.menu input {
  display: none; /*チェックボックスを隠す*/
}
/*バー部分*/
.menu label {
  cursor :pointer;
  display: block;
  text-decoration: none;
  color: #000;
  line-height: 1;
  position: relative;
  margin: 0 0 4px;
  padding: 2px;
  background-color: #fff;
  text-align:top;


  
}
/*開いたときに表示される部分*/
.menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 1px;
  
}
.menu li {
  height: 0;
  overflow-y: hidden;
  transition: padding-bottom 0.5s, padding-top 0.5s; /*閉じるときのアニメーション*/
  -webkit-transition: padding-bottom 0.5s, padding-top 0.5s;
  -moz-transition: padding-bottom 0.5s, padding-top 0.5s;
  -ms-transition: padding-bottom 0.5s, padding-top 0.5s;
  -o-transition: padding-bottom 0.5s, padding-top 0.5s;
 
}


#menu_bar1:checked ~ #links1 li,
#menu_bar2:checked ~ #links2 li,
#menu_bar3:checked ~ #links3 li,
#menu_bar4:checked ~ #links4 li,
#menu_bar5:checked ~ #links5 li,
#menu_bar6:checked ~ #links6 li,
#menu_bar7:checked ~ #links7 li,
#menu_bar8:checked ~ #links8 li,
#menu_bar9:checked ~ #links9 li,
#menu_bar10:checked ~ #links10 li,
#menu_bar11:checked ~ #links11 li,
#menu_bar12:checked ~ #links12 li,
#menu_bar13:checked ~ #links13 li,
#menu_bar14:checked ~ #links14 li,
#menu_bar15:checked ~ #links15 li,
#menu_bar16:checked ~ #links16 li,
#menu_bar17:checked ~ #links17 li,
#menu_bar18:checked ~ #links18 li,
#menu_bar19:checked ~ #links19 li,
#menu_bar20:checked ~ #links20 li,
#menu_bar21:checked ~ #links21 li,
#menu_bar22:checked ~ #links22 li,
#menu_bar23:checked ~ #links23 li,
#menu_bar24:checked ~ #links24 li,
#menu_bar25:checked ~ #links25 li,
#menu_bar26:checked ~ #links26 li,
#menu_bar27:checked ~ #links27 li,
#menu_bar28:checked ~ #links28 li,
#menu_bar29:checked ~ #links29 li,
#menu_bar30:checked ~ #links30 li {
  height: auto; /*開いたときに表示されるliの高さ*/
  opacity: 1;
  background: #ffffff;   /*#f1f1f1*/
  padding: 2px;
  
}
 /**/

 /*開いたときの下の余白*/

#menu_bar1:checked ~ #links1 li:last-child,
#menu_bar2:checked ~ #links2 li:last-child,
#menu_bar3:checked ~ #links3 li:last-child,
#menu_bar4:checked ~ #links4 li:last-child,
#menu_bar5:checked ~ #links5 li:last-child,
#menu_bar6:checked ~ #links6 li:last-child,
#menu_bar7:checked ~ #links7 li:last-child,
#menu_bar8:checked ~ #links8 li:last-child,
#menu_bar9:checked ~ #links9 li:last-child,
#menu_bar10:checked ~ #links10 li:last-child,
#menu_bar11:checked ~ #links11 li:last-child,
#menu_bar12:checked ~ #links12 li:last-child,
#menu_bar13:checked ~ #links13 li:last-child,
#menu_bar14:checked ~ #links14 li:last-child,
#menu_bar15:checked ~ #links15 li:last-child,
#menu_bar16:checked ~ #links16 li:last-child,
#menu_bar17:checked ~ #links17 li:last-child,
#menu_bar18:checked ~ #links18 li:last-child,
#menu_bar19:checked ~ #links19 li:last-child,
#menu_bar20:checked ~ #links20 li:last-child,
#menu_bar21:checked ~ #links21 li:last-child,
#menu_bar22:checked ~ #links22 li:last-child,
#menu_bar23:checked ~ #links23 li:last-child,
#menu_bar24:checked ~ #links24 li:last-child,
#menu_bar25:checked ~ #links25 li:last-child,
#menu_bar26:checked ~ #links26 li:last-child,
#menu_bar27:checked ~ #links27 li:last-child,
#menu_bar28:checked ~ #links28 li:last-child,
#menu_bar29:checked ~ #links29 li:last-child,
#menu_bar30:checked ~ #links30 li:last-child {
  margin-bottom: 2px;
}


/*閉じた状態の矢印描画*/
.menu label:after{

  content: url(../css4/sime7.png);;
  display:block;
  width:8px;
  height:8px;
  border-top: #fff 0px solid;
  border-right: #fff 2px solid;
 /* -webkit-transform: rotate(135deg);*/
 /* -ms-transform: rotate(135deg);*/
 /*  transform: rotate(135deg);*/
  position:absolute;
  left: 0px;
  top: 0;
  bottom: 80%;
  margin: auto;

}
/*開いた状態の矢印描画*/
.menu input[type=checkbox]:checked + label:after{
  content: url(../css4/sime8.png);;
  display:block;
  width:8px;
  height:8px;
  border-top: #fff 2px solid;
  border-right: #fff 2px solid;
 /* -webkit-transform: rotate(-45deg);*/
 /* -ms-transform: rotate(-45deg);*/
  /*  transform: rotate(-45deg);*/
  position:absolute;
   left: 5px;
  top: 0;
  bottom: 80%;
  margin: auto;

}


/*#      ...               */


.textbox {
  position: relative;
  height: 200px;
  overflow: hidden;
  line-height: 20px;
}

.textbox:before, .textbox:after {
  position: absolute;
  background: #fff;
}

.textbox:before {
  content: "･･･";
  bottom: 0;
  right: 0;
}

.textbox:after {
  content: "";
  width: 100%;
  height: 100%;
}

.font20 {
  line-height:28px;
  font-size:16px;
}

.text2 {
  display: -webkit-box; /* 必須 */
  -webkit-box-orient: vertical; /* 必須 */
  -webkit-line-clamp: 10; /* 行数を制限 */
  overflow: hidden; /* はみ出た部分を非表示 */
}
.text3 {
  display: -webkit-box; /* 必須 */
  -webkit-box-orient: vertical; /* 必須 */
  -webkit-line-clamp: 2; /* 行数を制限 */
  overflow: hidden; /* はみ出た部分を非表示 */
}