@charset "utf-8";
/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

Work CSS

_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/

#wrapper .content.main_img {
	position:relative;
}
#wrapper .content.main_img img.sp {
	display:none;
}
#wrapper .content.main_img h1 {
  width: auto;
	position: absolute;
	left: 50%;
	top: 50%;
	bottom: auto;
	

	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/* contentList
-------------------------------------------- */
#wrapper h1 {
	margin: 0 auto;
	padding: 10px 40px;
	display: table;
	color: #FFF;
	background: #F08206;
	background-color: rgba(240,130,6,0.9);
}
#wrapper .content {
	max-width: none;
  padding: 0;
	margin-bottom: 50px;
}
#wrapper .content .lead_txt {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 2.3;
}
#wrapper .content_list {
  box-sizing: border-box;
  margin: 0 auto;
  position:relative;
  overflow: hidden;
}
#wrapper .content_list:after {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 150px;
  background-color: #f8f8f8;
  content: '';
  z-index:0;
}
#wrapper .content_list h1 {
  margin: 0 0 80px;
  padding: 0 20px;
  position:relative;
  z-index:1;
}
#wrapper .guide_tour_banner_box {
  position:relative;
  z-index:1;
}

/* alternateBox
-------------------------------------------- */
#wrapper .content_list .alternate_box {
  max-width: 1200px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  box-sizing: border-box;
  margin: 0 auto;
  position:relative;
  z-index:1;

}
#wrapper .content_list .alternate_box li {
  width: 30%;
  margin-right: 5%;
  margin-bottom: 40px;
  float:left;
  background-color: #FFF;
}
#wrapper .content_list .alternate_box li:nth-child(3n+3) {
  margin-right: 0;
}
#wrapper .content_list .alternate_box li a {
  display: block;
}
#wrapper .content_list .alternate_box li .photo_img,
#wrapper .content_list .alternate_box li .content_box {
  width: 100%;
}
#wrapper .content_list .alternate_box li .photo_img {
	position:relative;
}
#wrapper .content_list .alternate_box li .photo_img::before {
  content: "";
  display:block;
  position: absolute;
  background: #F08206;
  margin:auto;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  opacity: 0;
  transition: opacity .2s;
}
#wrapper .content_list .alternate_box li .photo_img.color_b::before {
	background: #29B5E1;
}
#wrapper .content_list .alternate_box li .photo_img.color_g::before {
	background: #00AB94;
}
#wrapper .content_list .alternate_box li .photo_img.color_p::before {
	background: #A20A5D;
}
#wrapper .content_list .alternate_box li .photo_img.color_m::before {
	background: #E51372;
}
#wrapper .content_list .alternate_box li .photo_img.color_c::before {
	background: #A58B7B;
}
#wrapper .content_list .alternate_box li .photo_img.color_rg::before {
	background: #adc566;
}




#wrapper .content_list .alternate_box li a:hover .photo_img::before {
  opacity: 1;
}

#wrapper .content_list .alternate_box li .photo_img em {
  display: inline-block;
  width: 128px;
  color: #FFF;
  text-align: center;
  font-weight: bold;
  font-size: 1.6rem;
  padding: 5px 10px;
  background: #F08206;
  position: absolute;
  top: 0;
  right: 0;
}
#wrapper .content_list .alternate_box li .photo_img.color_b em {
	background: #29B5E1;
}
#wrapper .content_list .alternate_box li .photo_img.color_g em {
	background: #00AB94;
}
#wrapper .content_list .alternate_box li .photo_img.color_p em {
	background: #A20A5D;
}
#wrapper .content_list .alternate_box li .photo_img.color_m em {
	background: #E51372;
}
#wrapper .content_list .alternate_box li .photo_img.color_c em {
	background: #A58B7B;
}
#wrapper .content_list .alternate_box li .photo_img.color_rg em {
	background: #adc566;
}

#wrapper .content_list .alternate_box li .photo_img .hovermessage {
  width: 90%;
  position: absolute;
  left: 5%;
  top: 50%;
  z-index: 1;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#wrapper .content_list .alternate_box li .photo_img .hovermessage h2 {
  font-size: 1.6rem;
  color: #FFF;
  margin:0;
  z-index:2;
  opacity:0;
  transition: opacity .2s cubic-bezier(.215,.61,.355,1);
  text-align: left;
}
#wrapper .content_list .alternate_box li a:hover .photo_img .hovermessage h2 {
	opacity:1;
  transition: opacity .5s;
}

#wrapper .content_list .alternate_box li .content_box {
  padding: 25px 30px;
  box-sizing: border-box;
}
#wrapper .content_list .alternate_box li .content_box h2 {
  margin: 25px 0 15px;
  font-size: 2rem;
  text-align: left;
}
#wrapper .content_list .alternate_box li .content_box p {
  line-height: 1.6;
}
#wrapper .content_list .alternate_box li .content_box .year {
  font-size: 1.3rem;
  font-weight: 700;
  color: #9e9e9e;
  margin: 0 0 10px;
  letter-spacing: .02em;
}
#wrapper .content_list .alternate_box li .content_box .name {
  margin: 0 0 15px;
}
#wrapper .content_list .alternate_box li .content_box .name .ja {
  display: inline-block;
  font-size: 2rem;
  margin: 0 15px 0 0;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.7;
}
#wrapper .content_list .alternate_box li .content_box .name .en {
  display: inline-block;
  font-size: 1.2rem;
  margin: 0;
  color: #F08206;
  letter-spacing: .1em;
  font-weight: 700;
}
#wrapper .content_list .alternate_box li .content_box .role {
  font-size: 1.3rem;
  letter-spacing: .02em;
  line-height: 1.5;
}

@media screen and (max-width: 1000px) {
	#wrapper .content_list .alternate_box {
		padding: 0 20px;
	}
	#wrapper .content_list .alternate_box li {
	  width: 48%;
	  margin-right: 4%;
	  margin-bottom: 40px;
   	}
	#wrapper .content_list .alternate_box li:nth-child(3n+3) {
	  margin-right: 4%;
	}
	#wrapper .content_list .alternate_box li:nth-child(even) {
	  margin-right: 0;
	}

	#wrapper .content_list .alternate_box li a:hover .photo_img::before {
	  opacity: 0;
	}
	#wrapper .content_list .alternate_box li .photo_img .hovermessage {
	  width: 100%;
	  top: initial;
	  bottom: 0;
	  left:0;
	  box-sizing:border-box;
	  padding: 20px 5% 20px;
	  -webkit-transform: initial;
	  transform: initial;
	  background: -moz-linear-gradient(top,rgba(24,24,24,0),rgba(24,24,24,0.9)); /* Firefox�p */
	  background: -o-linear-gradient(rgba(24,24,24,0),rgba(24,24,24,0.9)); /* Opera */
	  background: -webkit-gradient(linear,left top,left bottom,from(rgba(24,24,24,0)),to(rgba(24,24,24,0.9))); /* Safari,Google Chrome�p */
	  background: linear-gradient(top,rgba(24,24,24,0.3),rgba(24,24,24,0.9));
	  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#55505050', endColorstr='#55505050', GradientType=0)"; /* IE8�p */
	}
	#wrapper .content_list .alternate_box li .photo_img .hovermessage h2 {
	  opacity:1;
	  font-size: 2rem;
	}

	#wrapper .content_list .alternate_box li .content_box {
	  padding: 20px 25px;
	}
	#wrapper .content_list .alternate_box li .content_box .name {
	  margin: 0 0 15px;
	}
}


/*
------------------------------------------------------------------------------------------------------------------ Tablet Wide */

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

  /* alternateBox
  -------------------------------------------- */
  #wrapper .content_list h1 {
  margin: 0 0 60px;
  }

  #wrapper .content_list .alternate_box li .photo_img,
  #wrapper .content_list .alternate_box li .content_box {
  width: 100% !important;
  float: none !important;
  }

  #wrapper .content_list .alternate_box li .content_box em {
  padding: 5px 10px;
  }
  #wrapper .content_list .alternate_box li .content_box h2 {
  font-size: 2rem;
  text-align: left !important;
  }

}


/*
------------------------------------------------------------------------------------------------------------------ SmartPhone */

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

	#wrapper h1 {
		font-size: 6vw;
		margin: 0 auto;
		padding: 10px 40px;
		display: table;
		color: #FFF;
		background: #F08206;
		background-color: rgba(240,130,6,0.9);
	}
  #wrapper .content.main_img img.pc {
  display:none;
  }
  #wrapper .content.main_img img.sp {
  display:block;
  }

  /* contentList
  -------------------------------------------- */
  #wrapper .content_list h1 {
  margin: 0 0 20px;
  }

  #wrapper .content_list .alternate_box li {
  width: 100%;
  margin: 0 0 40px;
  }
  #wrapper .content_list .alternate_box li:nth-child(3n+3) {
  margin-right: 0;
  }
  #wrapper .content_list .alternate_box li .content_box h2 {
  font-size: 2rem;
  }

  #wrapper .content_list .alternate_box li .content_box .action_box .entry_btn,
  #wrapper .content_list .alternate_box li:nth-child(2n) .content_box .action_box .entry_btn {
  display: block;
  width: 100%;
  margin: 0 0 20px;
  }
  #wrapper .content_list .alternate_box li .content_box .action_box p,
  #wrapper .content_list .alternate_box li:nth-child(2n) .content_box .action_box p {
  margin: 0;
  }
  #wrapper .content_list .alternate_box li .content_box .action_box p a {
  font-size: 3rem;
  vertical-align: -5px;
  }

}