@charset "utf-8";
/* CSS Document */
.albam{
	width: 90%;
   max-width: 1000px;	
	margin:0 auto 11%;
	}
.albam img{
  width: calc(90%/4);    /*100%/4を100%/3に変更*/
  max-width: 1000px;	
  margin: 0.5% 0.5%;	
}		
.albam_title{
  width: 50%;	
  padding: 5%;}
.albam h3{font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  text-align: center;
  background: #aaa;/*背景色*/
  color: #fff; 
  padding: 0.5em 1em;/*文字まわり（上下左右）の余白*/
  width: fit-content;	
}
.albam h4{font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	text-align: center;
}
.tab_container {
  padding-bottom: 1em;
  background-color: #fff;
  margin: 0 auto;}
.tab_item {
  width: calc(100%/3);    /*100%/4を100%/3に変更*/
  padding:15px 0;
  border-bottom: 3px solid orange ;
  background-color: #fff;
  text-align: center;
  color: #333 ;
  display: block;
  float: left;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}
input[name="tab_item"] {
  display: none;
}
.tab_content {
  display: none;
  padding: 1em 1em 0;
  clear: both;
  overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content,
#tab5:checked ~ #tab5_content,
#tab6:checked ~ #tab6_content,
#tab7:checked ~ #tab7_content,
#tab8:checked ~ #tab8_content {  /*, #tab4:checked ~ #tab4_contentを削除*/
  display: block;
}
.tab_container input:checked + .tab_item {
  background-color: orange ;
  color: #fff;
}
/* ▼表示領域が800px未満の場合 */
@media (max-width: 799px) {
.albam{
	width: 90%;	
	margin: 60px auto 10% auto
	}
	.albam img{
    width: calc(90%/2);    /*100%/4を100%/3に変更*/
	margin: 1% 1%;	
	}
	.albam_title{
	width: 100%;	
	padding:0 0 5%;}
	.albam h3{font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	text-align: center;
	background: #aaa;/*背景色*/
	color: #fff; 
  padding: 0.5em;/*文字まわり（上下左右）の余白*/
  width: 80%;
  margin: 5% auto;
	font-size: 1.3em;	
}
.albam h4{font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
	text-align: center;
}
.albam_contenier{
    margin: auto;
}
.tab_container {
  padding-bottom: 1em;
  background-color: #fff;
  margin: 0 auto;}
.tab_item {
  width: calc(100%/3);    /*100%/4を100%/3に変更*/
  padding:15px 0;
  border-bottom: 3px solid orange ;
  background-color: #fff;
  text-align: center;
  color: #333 ;
  display: block;
  float: left;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}
input[name="tab_item"] {
  display: none;
}
.tab_content {
  display: none;
  padding: 1em 1em 0;
  clear: both;
  overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content,
#tab5:checked ~ #tab5_content,
#tab6:checked ~ #tab6_content,
#tab7:checked ~ #tab7_content,
#tab8:checked ~ #tab8_content {  /*, #tab4:checked ~ #tab4_contentを削除*/
  display: block;
}
.tab_container input:checked + .tab_item {
  background-color: orange ;
  color: #fff;
}
.tab_content_description{
margin: auto;}
}