@charset "utf-8";

/*mov-topimg
---------------------------------------------------------------------------*/
.topimg {
  background:#EAEAEA;
  width: 100%;
  height: auto;
  margin:0 auto;
}

.mov-topimg {
  position: relative;
  width: 100%;
  max-width:1200px;
  height: 550px;
  margin:0 auto;
  z-index:1;
  overflow:hidden;
}

.mov-topimg .block {
  padding:0;
  width:100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  z-index:1;
  position: relative;
}

@media screen and (max-width: 800px) {
.mov-topimg {
	height:450px;
	min-height: initial;
}
}

@media screen and (max-width: 568px) {
.mov-topimg {
  height:300px;
}
}
.mov-topimg img {
	width:100%;
	height:auto;
}


#vdo {
  width: 100%;
  height: auto;
  margin:auto;
}

@media screen and (max-width: 800px) {
#vdo {
	width: auto;
	height:450px;
}
}

@media screen and (max-width: 568px) {
#vdo {
  width: auto;
  height:300px;
}
}

/*sub-topimg
---------------------------------------------------------------------------*/
.sub-topimg {
  position: relative;
  width: 100%;
  height: 550px;
  z-index:1;
}

@media screen and (max-width: 800px) {
.sub-topimg {
  height: 80vh;
  min-height: 400px;
}
}

#bg {
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: cover;
  background-color: #EAEAEA;
  background-image: url(../images/mv-pc.jpg);
  padding:0;
  width:100%;
  height: 100%;
  
}
.sub-topimg .block {
  padding:0;
  width:100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  z-index:1;
  position: relative;
}

#top_row {
	width: 100%;
	height:auto;
	position:absolute;
	top:50%;
	margin-top:-80px;
}

/* top_info
================================================== */
#top_info  {
  color: #fff;
  position: relative;
  text-align: center;
  z-index: 2;
  width:96%;
  margin:0 2%;
  text-shadow:1px 1px 1px #000;
  font-family: 'Roboto', sans-serif;
  text-transform: uppercase;
}

#top_info h2 {
  font-size:3em;
  font-family: 'Noto Sans Japanese', sans-serif;
  font-weight:700;
  color: #FFF;
}

@media screen and (max-width: 800px) {
#top_info h2  {
  font-size: 2em;
}
}

@media screen and (max-width: 568px) {
#top_info h2  {
  font-size: 1.5em;
}
}

#top_info .top_text {
	line-height:1.6;
	font-weight:500;
	color: #FFF;
	margin:10px auto 0;
	letter-spacing:.1em;
}

@media screen and (max-width: 800px) {
#top_info .top_text {
  font-size: 1.2em;
}
}

@media screen and (max-width: 568px) {
#top_info .top_text {
  font-size: 14px;
  font-weight: 500;
}
}

/* other_top
--------------------------------------------------*/
.other_top{
  width:100%;
  padding: 2% 0 3%;
  text-align:center;
}

@media screen and (max-width: 800px) {
.other_top{
  padding: 5% 0 3%;
}
}

.other_top h3{
	font-size:2em;
	font-weight:normal;
	color:#B52237;
	margin-bottom:1%;
}

.other_top p{
	line-height:1.8;
}


@media screen and (max-width: 800px) {
.other_top h3{
	font-size:1.6em;
}

.other_top p{
  font-size:1em;
  line-height:1.6;
}
}

@media screen and (max-width: 568px) {
.other_top h3{
	font-size:1.4em;
	line-height:1.5;
}

.other_top p{
  font-size:15px;
  padding:0 2%;
}
}

.other_top .sh_logo {
  margin-bottom:15px;
}

.other_top .sh_logo img{
  width:auto;
  height:80px;
}

@media screen and (max-width: 568px) {
.other_top .sh_logo img{
	height:60px;
}
}

/* granping
--------------------------------------------------*/
.granping{
	width: 100%;
	padding:1% 2% 3%;
	float:left;
	box-sizing: border-box;
	margin-bottom:2%;
}

.granping .gp_ph{
	width: 55%;
	float:left;
	box-sizing: border-box;
}

@media screen and (max-width: 800px) {
.granping .gp_ph{
	width: 98%;
	margin:0 1%;
}
}

.granping .gp_ph img{
	width: 100%;
	height:auto;
}

.granping .gp_tx{
	width: 50%;
	margin:2% 0 0 -10%;
	float:right;
	box-sizing: border-box;
	padding:2% 2.5%;
	background: rgba(208, 37, 32, 0.8);
	background: rgba(161, 11, 11, 0.8);
	color:#FFF;
}

@media screen and (max-width: 1280px) {
.granping .gp_tx{
  width: 55%;
  margin:2% 0 0 -15%;
}
}

@media screen and (max-width: 800px) {
.granping .gp_tx{
	width: 98%;
	margin:0 1%;
	padding:3% 4%;
}
}

.granping .gp_tx .sub_ttl {
  text-transform: uppercase;
  letter-spacing:0;
  font-family: "Roboto", "Yu Gothic", YuGothic, sans-serif;
  font-size: 1.1em;
  margin-bottom:5px;
}

.granping .gp_tx h4 {
  font-size: 1.8em;
  margin-bottom:10px;
}

@media screen and (max-width: 1280px) {
.granping .gp_tx h4 {
  font-size: 1.6em;
  margin-bottom:10px;
}
}

@media screen and (max-width: 568px) {
.granping .gp_tx h4 {
	font-size: 1.2em;
}
}

.gp_tx .sub_txt {
  line-height:1.8;
  font-family: 'Noto Sans Japanese', sans-serif;
  font-weight:400;
}

@media screen and (max-width: 1280px) {
.gp_tx .sub_txt {
  line-height:1.6;
  font-size: 0.9em;
}
}

.granping .gp_ph2{
	width: 100%;
	float:left;
	box-sizing: border-box;
	margin:4% 0 2%;
}

@media screen and (max-width: 800px) {
.granping .gp_ph2{
	width: 98%;
	margin:4% 1%;
}
}

.granping .gp_ph2 img{
	width: 100%;
	height:auto;
}


.c-buttons{
	margin-top:20px;
	text-shadow:0 0 0 #FFF;
}

@media screen and (max-width: 800px) {
.c-buttons{
	text-align:center;
}
}

@media screen and (max-width: 568px) {
.c-buttons{
	margin-top:15px;
	margin-bottom:5px;
}
}

.c-button{font-size: 13px;font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Helvetica,Arial,sans-serif;border:none;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.c-button.c-button--ghost{display:inline-table;padding:10px 20px;border:1px solid #fff;color:#fff;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;-moz-transition-duration:0.2s;-o-transition-duration:0.2s;-webkit-transition-duration:0.2s;transition-duration:0.2s}
.c-buttons a{text-decoration:none;}
.c-buttons a:hover{text-decoration:none;display:inline-table;background-color:#fff;color:#222;text-shadow:0 0 0 #FFF;}

/* section_head
--------------------------------------------------*/
.section_head{
  width:100%;
  padding: 2% 1%;
  text-align:center;
  box-sizing: border-box;
  float:left;
}

.section_head .sh_logo {
  margin-bottom:15px;
}

.section_head .sh_logo img{
  width:auto;
  height:80px;
}

@media screen and (max-width: 568px) {
.section_head .sh_logo img{
	height:60px;
}
}

.section_head .enttl {
  text-transform: uppercase;
  font-family: "Roboto", "Yu Gothic", YuGothic, sans-serif;
  font-size: 2.4em;
  line-height:1;
  margin-bottom:10px;
}

@media screen and (max-width: 800px) {
.section_head .enttl {
	font-size: 2em;
}
}
.section_head .green{
  color:#286974;
}

.section_head .chai{
  color:#381407;
}

.section_head .gld{
  color:#D1944B;
}

/* concept_box
--------------------------------------------------*/
.concept_box {
    width: 100%;
	padding:1% 1% 3%;
	float:left;
	box-sizing: border-box;
}

.conceptL {
    width: 50%;
	float:left;
	position: relative;
}

.conceptR {
    width: 50%;
	float:right;
	position: relative;
}

.concept_ph {
    width: 100%;
	height:auto;
	position: relative;
}

.concept_ph img{
  width:100%;
  height:auto;
}

.concept_syousai {
	width: 90%;
	height:auto;
	position:absolute;
	top:4%;
	left:5%;
}

.concept_syousai .cpt01{
  position: relative;
  margin-bottom: 30px;
  padding: 2px;
  -webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;
  background: rgba(255, 255, 255, 0.8);
  text-align: center;
}

.cpt01:after {
  position: absolute;
  display: block;
  content: "";
}

.cpt01:after {
  top: 100%;
  left: 50%;
  margin-left: -16px;
  border: 16px solid transparent;
  border-top-color: rgba(255, 255, 255, 0.8);
}

.concept_syousai .cpt01 .cpt01_01{
	background: #80AB0C;
	color:#FFF;
	font-size:1.6em;
	font-weight:bold;
	padding:5px 0 0;
	-webkit-border-top-left-radius:8px;-moz-border-top-left-radius:8px;border-top-left-radius:8px;-webkit-border-top-right-radius:8px;-moz-border-top-right-radius:8px;border-top-right-radius:8px;
}

.concept_syousai .cpt01 .cpt01_011{
	background: #D9A86C;
	color:#FFF;
	font-size:1.6em;
	font-weight:bold;
	padding:5px 0 0;
	-webkit-border-top-left-radius:8px;-moz-border-top-left-radius:8px;border-top-left-radius:8px;-webkit-border-top-right-radius:8px;-moz-border-top-right-radius:8px;border-top-right-radius:8px;
}

.concept_syousai .cpt01 .cpt01_02{
	padding:2% 3%;
	color:#000;
	font-size:1.2em;
	font-weight:bold;
}

.concept_syousai .cpt02{
	padding:0 3% 5%;
	color:#000;
	font-size:0.9em;
}

.box_skin01 {
  position: relative;
  box-sizing: border-box;
  padding: 20px;
  background: rgba(21, 92, 38, 0.47);
  color: #fff;
  -webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
}

.box_skin01:before {
  position: absolute;
  display: block;
  content: "";
}
.box_skin01:before {
  top: 0;
  left: 50%;
  width: 220px;
  height: 5px;
  margin-left: -110px;
  background: #22626e;
}
.box_skin01 .en {
  position: absolute;
  left: 50%;
  top: -.5em;
  display: block;
  font-family: "Dancing Script", cursive;
  font-size: 30px;
  line-height: 1;
  transform: translate(-50%, 0);
}
.box_skin01 p:last-child {
  padding-bottom: 0;
}

.bx_ttl{
    font-size:1.2em;
	font-weight:bold;
	text-align: center;
	margin-top:15px;
	margin-bottom:10px;
}

.box_skin02 {
  position: relative;
  box-sizing: border-box;
  padding: 20px;
  background: rgba(116, 69, 26, 0.47);
  color: #fff;
  -webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;
}

.box_skin02:before {
  position: absolute;
  display: block;
  content: "";
}
.box_skin02:before {
  top: 0;
  left: 50%;
  width: 220px;
  height: 5px;
  margin-left: -110px;
  background: #D6A261;
}
.box_skin02 .en {
  position: absolute;
  left: 50%;
  top: -.5em;
  display: block;
  font-family: "Dancing Script", cursive;
  font-size: 30px;
  line-height: 1;
  transform: translate(-50%, 0);
}
.box_skin02 p:last-child {
  padding-bottom: 0;
}

/* facility_box
--------------------------------------------------*/
.facility_box {
    width: 100%;
	padding:1%;
	float:left;
	box-sizing: border-box;
}

.fc_ttl{
  font-size:2em;
  text-align:center;
  margin:0 0 10px;
  color:#B52237;
}

@media screen and (max-width: 800px) {
.fc_ttl{
  font-size:1.6em;
}
}

.fc_txt{
  text-align:center;
  line-height:2;
  margin-bottom:10px;
}

@media screen and (max-width: 568px) {
.fc_txt{
  text-align:left;
  line-height:1.6;
  padding:0 2.5%;
  font-size:14px;
}
}

.facility_box li{
	width:50%;
	box-sizing: border-box;
	padding:2% 1.5%;
	float:left;
	text-align: center;
}


@media screen and (max-width: 568px) {
.facility_box li{
  width:98%;
  margin: 0 1%;
}
}

.facility_box li img{
	width:100%;
	height:auto;
	margin-bottom:15px;
}

.facility_box li a:hover img { opacity: 0.7;}

@media screen and (max-width: 800px) {
.facility_box li img{
  margin-bottom:10px;
}
}

.facility_box h5{
	letter-spacing:.05em;
	font-size:1.2em;
	font-family: 'Noto Sans Japanese', sans-serif;
	font-weight: 600;
	margin-bottom:14px;
	line-height:1.2;
}

@media screen and (max-width: 800px) {
.facility_box h5{
  margin-bottom:8px;
}
}

.faci_text{
	padding:0 10px;
	text-align: left;
	line-height:1.8;
}

@media screen and (max-width: 800px) {
.faci_text{
	padding:0 5px;
	font-size:14px;
	line-height:1.6;
}
}

.faci_bt{
	font-size:0.9em;
	font-family: Roboto,Meiryo,sans-serif;
	letter-spacing:.05em;
	font-weight:500;
	text-transform: uppercase;
	margin-top:15px;
	line-height:1;
}

@media screen and (max-width: 568px) {
.faci_bt{
  font-size:0.9em;
  font-weight:400;
  text-align: center;
  margin-top:5px;
  margin-bottom:10px;
}
}

.faci_bt a{display:inline-block;color:#FFF;text-decoration:none;background-color:#989898;padding:8px 20px;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;}
.faci_bt a:hover{color:#FFF;text-decoration:none;background-color:#5E5E5E;}

/* bbq_course
--------------------------------------------------*/
.bbq_course {
    width: 100%;
	padding:0% 1% 2%;
	float:left;
	box-sizing: border-box;
}

.bbc_ttl{
  font-size:2em;
  text-align:center;
  margin:0 0 10px;
  color:#B52237;
}

@media screen and (max-width: 800px) {
.bbc_ttl{
  font-size:1.6em;
}
}

.bbc_txt{
  text-align:center;
  line-height:2;
  margin-bottom:10px;
}

.course_syousai{
	width: 100%;
	padding:1% 0;
	float:left;
	box-sizing: border-box;
	margin-bottom:1%;
}

.course_syousai .crs_ph{
	width: 55%;
	float:right;
	box-sizing: border-box;
}

@media screen and (max-width: 800px) {
.course_syousai .crs_ph{
	width: 98%;
	margin:0 1%;
}
}

.course_syousai .crs_ph img{
	width: 100%;
	height:auto;
}

.course_syousai .crs_tx{
	width: 50%;
	margin:2.5% -10% 0 0;
	float:left;
	box-sizing: border-box;
	padding:2% 2.5%;
	background: rgba(208, 37, 32, 0.8);
	color:#FFF;
}

@media screen and (max-width: 1280px) {
.course_syousai .crs_tx{
  width: 55%;
  margin:2% 0 0 -15%;
}
}

@media screen and (max-width: 800px) {
.course_syousai .crs_tx{
	width: 98%;
	margin:0 1%;
	padding:3% 4%;
}
}

.course_syousai .crs_tx .sub_ttl {
  text-transform: uppercase;
  letter-spacing:0em;
  font-family: "Roboto", "Yu Gothic", YuGothic, sans-serif;
  font-size: 1.1em;
  margin-bottom:5px;
}

.course_syousai .crs_tx h4 {
  font-size: 1.8em;
  margin-bottom:10px;
}

@media screen and (max-width: 1280px) {
.course_syousai .crs_tx h4 {
  font-size: 1.6em;
  margin-bottom:10px;
}
}

@media screen and (max-width: 568px) {
.course_syousai .crs_tx h4 {
	font-size: 1.2em;
}
}

.crs_tx .sub_txt {
  line-height:1.8;
  font-family: 'Noto Sans Japanese', sans-serif;
  font-weight:400;
}

@media screen and (max-width: 1280px) {
.crs_tx .sub_txt {
  line-height:1.6;
  font-size: 0.9em;
}
}

/* osusume_plan
--------------------------------------------------*/
.osusume_plan {
    width: 100%;
	padding:1% 2% 3%;
	float:left;
	box-sizing: border-box;
}

@media screen and (max-width: 800px) {
.osusume_plan {
	padding:3% 2% 3%;
}
}

.osusume_plan h3{
	margin-bottom:1.5%;
	text-align: center;
	font-size:2em;
	font-weight:normal;
	color:#F87B7B;
}

.camp_slider{margin:0 0 2%;width:100%;float:left;}
.camp_slider:after,.buttons::after{clear:both;content:"";display:table;}

.camp_slider .sl {
    width: 33.3333%;
	padding:10px 15px;
	float:left;
	box-sizing: border-box;
}

.camp_slider .item {
    width: 100%;
	padding:0
	box-sizing: border-box;
	border:1px solid #CCC;
}

.slide-arrows{
  position: absolute;
  top: 50%;
  margin-top: -25px;
  cursor: pointer;
}
.prev-arrows{
  left: 0;
	display: block;
	width: 36px;
	height: 50px;

}
.next-arrows{
  right: 0;
	display: block;
	width: 36px;
	height: 50px;
}

@media screen and (max-width: 568px) {
.slide-arrows{
  margin-top: -18px;
}
.prev-arrows{
	width: 26px;
	height: 36px;

}
.next-arrows{
	width: 26px;
	height: 36px;
}
}

.slide-arrows img{
  width:100%;
  height:auto;
}

.os_photo {
    width:100%;
	height:220px;
	position: relative;
	overflow: hidden;
	display:block;
}

@media screen and (max-width: 800px) {
.os_photo {
	height:260px;
}
}

@media screen and (max-width: 568px) {
.os_photo {
	height:170px;
}
}

.os_photo img{
    width:100%;
	height:auto;
}

.os_photo .r_erea{
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 !important;
	color: #FFF;
	font-size: 12px;
	background: rgba(0, 0, 0, 0.4);
	padding: 5px 5px 5px;
	font-weight:400;
	display:inline-block;
	line-height:1;
	letter-spacing	: 0.05em;
}

.os_text {
    width:100%;
	height:auto;
	padding:10px 15px;
	box-sizing: border-box;
}

.sis_name {
    font-size:1.1em;
	font-weight:bold;
	line-height:1.4;
	color:#F87B7B;
	padding:5px;
}

.marker{
	padding:5px;
	color:#000;
	border:1px solid #000;
	display:inline-block;
	font-size:14px;
	line-height:1;
	margin:5px 5px 10px;
}

.marker .fa-map-marker{
	margin-right:5px;
}

.marker .fa-bed{
	font-size:14px;
}

.sis_text {
    font-size:14px;
	line-height:1.6;
	letter-spacing:0;
	color:#000;
	padding:3px 5px;
}

.setubi {
    border-top:1px dotted #CCC;
	color:#000;
	padding:5px 0 0;
	margin-top:5px;
	line-height:1.4;
	box-sizing: border-box;
}

.setubi li {
    display:inline-block;
	padding:0 5px;
	font-size:12px;
	
}

.ns_bt {
    font-size:12px;
	text-align: center;
	margin-top:10px;
	margin-bottom:10px;
}

.ns_bt a{color:#FFF;display:inline-block;padding:3px 10px 3px;background-color:#FA8D8D;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;text-decoration:none;}
.ns_bt a:hover{color:#FFF;text-decoration:none;background-color:#FE5656;}

/* エリアで選ぶ
--------------------------------------------------*/
.top_map{
	width:40%;
	float:left;
	margin-bottom:2%;
}

.map_syousai{
	width:100%;
	position: relative;
	padding:0;
}

.map_syousai img{
	width:100%;
	height:auto;
}

.map_syousai .hokubu {
	position: absolute;
	top: 35%;
	left: 30%;
	font-size: 14px;
	
}

.map_syousai .tyubu {
	position: absolute;
	top: 60%;
	left: 10%;
	font-size: 14px;
	
}
.map_syousai .nanbu {
	position: absolute;
	top:85%;
	left: 10%;
	font-size: 14px;
}

.map_syousai .miyako {
	position: absolute;
	top: 43%;
	left: 63%;
	font-size: 14px;
}

.map_syousai .ishigaki {
	position: absolute;
	top: 68%;
	left: 65%;
	font-size: 14px;
}

.map_syousai .other {
	position: absolute;
	top: 150px;
	left: 5px;
	font-size: 14px;
}

@media only screen and  (max-width: 1200px) {
.map_syousai .other {
	top: 110px;
	left: 5px;
	font-size: 12px;
}
}

@media only screen and  (max-width: 800px) {
.map_syousai .other {
	position: absolute;
	top: 160px;
	left: 10px;
	font-size: 14px;
}
}

@media only screen and  (max-width: 568px) {
.map_syousai .other {
	position: absolute;
	top: 115px;
	left: 5px;
	font-size: 12px;
}
}

.map_syousai a{
	color: #FFF;
	background-color: #000;
	padding: 3px 10px 3px;
	display:inline-block;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	letter-spacing	: 0.1em;
	-moz-box-shadow: 2px 2px 2px #B3B3B3;
	-webkit-box-shadow: 2px 2px 2px #B3B3B3;
	box-shadow: 2px 2px 2px #B3B3B3;
	text-decoration: none;
}

@media only screen and  (max-width: 568px) {
.map_syousai a{
	padding: 2px 10px 2px;
}
}

.map_syousai a:hover {
	background-color: #FF7878;
	color: #FFF;
}

.top_map .erea {
	padding:10px 15px;
	font-size: 14px;
}

@media only screen and  (max-width: 1200px) {
.top_map .erea {
	font-size: 13px;
}
}

@media only screen and  (max-width: 568px) {
.top_map .erea {
	padding:0 5px 5px 5px;
	letter-spacing	: 0em;
	line-height:1.6;
}
}

.top_map .erea a {
	text-decoration: underline;
	color: #F47A7A;
}
.top_map .erea a:hover {
	text-decoration: none;
	color: #000;
}


/* タイプで選ぶ
--------------------------------------------------*/
.type_box{
	width:55%;
	float:right;
	margin:0 0 2%;
}

.type_box .type{
	width:46%;
	box-sizing: border-box;
	position: relative;
	float:left;
	margin: 0 2% 3%;
}

.type_box .item{
	width: 100%;
}

.type_box .item .ty_photo{
	width: 100%;
	height:auto;
	margin:0;
	position: relative;
	overflow: hidden;
}

.type_box .item .ty_photo img{
	width: 100%;
	height:auto;
}

.type_box figure img {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  -webkit-transition: -webkit-transform 400ms;
  transition: transform 400ms;
}
.type_box figure:hover img {
  -webkit-transform: scale3d(1.2, 1.2, 1);
  transform: scale3d(1.2, 1.2, 1);
}

.type_box figure:hover .overlay {
  opacity: 1;
}
.type_box figure:hover .overlay .buttons a {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}
.type_box figure .overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px;
  text-align: center;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  -webkit-transition: opacity 400ms;
  transition: opacity 400ms;
}
.type_box figure .overlay a {
  display: inline-block;
  color: #fff;
  padding: 10px 23px;
  line-height: 1;
  border: 1px solid #fff;
  border-radius: 0px;
  margin: 4px;
  -webkit-transform: scale3d(0, 0, 0);
  transform: scale3d(0, 0, 0);
  -webkit-transition: all 400ms;
  transition: all 400ms;
  font-size:0.9em;
  text-decoration: none;
}
.type_box figure .overlay a:hover {
  text-decoration: none;
  background:#FFF;
  color:#000;
}
.type_box figure .overlay:hover a {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}
.type_box figure .buttons {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size:0.9em;
  margin-top:-18px;
  margin-left:-65px;
}

.type_box h4{
	padding:8px 5px 5px;
	color:#F87B7B;
	font-size:1.2em;
	line-height:1.4;
	font-weight:600;
	font-family: 'Noto Sans Japanese', sans-serif;
}

.ty_tx{
	font-size:12px;
	line-height:1.6;
	padding:0 5px;
}





/* .menu_list
--------------------------------------------------*/
.menu_list {
margin:0 auto;
padding:0 2% 4%;
width:100%;
box-sizing: border-box;
position:relative;
}

@media (max-width: 630px) {
.menu_list{padding:0 3px;}
}

.menu {
margin:0 auto;
width:100%;
}

.card {
width: 20%;
overflow: hidden;
opacity: 0;
transform-property: opacity, transform;
transform-origin: 50%;
box-sizing: border-box;
margin:0;
padding:8px;
min-width:286px;
}

@media (max-width: 1280px) {
.card {width:25%;}
}

@media (max-width: 800px) {
.card {width:33.3333%;}
}

/* change card size for small screens */
@media (max-width: 630px) {
.card {min-width:initial;width:49.9999%;padding:3px;}
}

@media (max-width: 568px) {
.card {width:100%;padding:10px 5px 5px;}
}

.card-wrapper {
border-radius:4px;
background: #fff;
-webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.3);
box-shadow: 0 1px 2px 0 rgba(0,0,0,0.3);
border-radius: 4px;
overflow:hidden;
}

.card-image {
width: 100%;
}

.card-image img {
width: 100%;
border-radius: 4px 4px 0 0;
}

.card a { text-decoration:none; }
.card a:hover { opacity: 0.8; }

.card-info {
padding: 10px 15px 15px;
}


.card-info h2{
  font-size:1.2em;
  text-transform: uppercase;
  letter-spacing:.05em;
  font-weight:600;
  line-height:1.4;
  padding:2px 5px 3px;
  color:#000;
}

.card-info .nw_tx{
font-size:14px;
line-height:1.4;
color:#787777;
font-weight:300;
}

a .nw_tx{ color:#787777;text-decoration:none; }