/* HP Ver2 「gallery」 のスタイルシート */

@charset "UTF-8";

html,

body {
}


#top_gallery_box {
  display: block;
  position: relative;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding-top: 10px;
  text-align: center;
}

#top_gallery_box a{
  font-size: 30px;
  font-weight: bold;
}

#ca_name {
  display: block;
  position: relative;
  width: 90%;
  max-width: 1296px;
  margin: 0 auto;
  margin-top: 0px;
  padding: 0;
  text-align: right;
}

#ca_name a{
  font-size: 20px;
  font-weight: normal;
  font-style: italic;
}

.ca_name_position {
  top: 0px;
}


.gp_layout {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  margin-top: 0px;
  padding: 0;
  text-align: center;
}

.gp_layout a img {
  padding: 0.05% 0.2%;
/*   box-sizing:border-box; */
}

.p_layout {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  margin-top: 0px;
  padding: 0;
  text-align: center;
}

.p_layout a img {
  padding: 0.2%;
/*   box-sizing:border-box; */
}

.y_layout a img {
   width: calc(92.8%/2);	
   /* max-width:100%; 画像のはみだしを防ぐ*/
    height: auto; /*画像の縦横比を維持 */
}


.t_layout a img {
   width: calc(92.4%/3);
   /* max-width:100%; 画像のはみだしを防ぐ*/
    height: auto; /*画像の縦横比を維持 */
}

.long_layout a img {
   width: calc(93.2%/1);
   /* max-width:100%; 画像のはみだしを防ぐ*/
    height: auto; /*画像の縦横比を維持 */
}
 


.photo_accordion_box {
  position: relative;
  display: block;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0;
  cursor: pointer;
  font-size: 30px;
  text-align: center;

/* background: #C0C0C0;
  border: 1px solid #0079c1;  */

  outline: 0;
}

.photo_accordion_box .photo_menu {
  display: block;
  position: relative;
  width: 60%;
  max-width: 864px;
  margin: 0 auto;
  padding: 10px;
  margin-top: 50px;
  cursor: pointer;
  font-size: 30px;
  text-align: center;
  position: relative;
}

.photo_accordion_box .photo_menu:hover,
.photo_accordion_box .photo_menu:active,
.photo_accordion_box .content-entry.open .photo_menu {

/* メニューのカラーを指定する時
  background-color: #00aaa7;
  color: white;
 */
}

.photo_accordion_box .photo_menu:hover i:before,
.photo_accordion_box .photo_menu:hover i:active,
.photo_accordion_box .content-entry.open i {

/* メニューをホバーにした時のカラーを指定する時
 color: white;
 */

}

.photo_menu{
  position: relative;
}

.photo_menu:after {
  content: "";
  position: absolute;
  right: 25px;
  top: 38%;
  transition: all 0.2s ease-in-out;
  display: block;
  width: 12px;
  height: 12px;
  border-top: solid 4px;
  border-right: solid 4px;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);

/* 矢印アイコンのカラーを指定する時
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
 */

}

.photo_menu.open:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 45%;
  border-top: solid 4px white;
  border-right: solid 4px white;
}

.photo_box {
  display: none;

/* border: solid;
border-color: red;  */
}

/*

.end_space {
  position: relative;
  display: block;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;

  height: 100px;
}


*/


/*   border: 1px solid yellow; */




@media only screen and (max-width: 940px) {

  .ca_name_position {
    top: 0px;
  }

}






/* （モバイル用） */

@media only screen and (max-width: 768px) {

  #top_gallery_box {
    margin-top: 40px;    
  }  

  #top_gallery_box a{
    font-size: 22px;
  }

  #ca_name a{
    font-size: 15px;
  }
  .ca_name_position {
    top: 0px;
  }

  .photo_accordion_box .photo_menu {
    width: 100%;
    max-width: 1440px;
  margin: 0 auto;
  padding: 3px;
  margin-top: 30px;
  font-size: 22px;
  }

  .photo_menu:after {
    top: 30%;
  }

}