@charset "utf-8";



/*-------------------------------------------------
お宿くらべ
-------------------------------------------------*/

#kurabe #page-title_new {
    background: #f7f6e8 url("../img_new/tit_reco_kikaku_bg2.png") no-repeat scroll center top;
    padding: 25px 0 0;
}


#content-kurabe.w1000{
	margin-top: 30px;
}


#kurabe-top{
/* 	width:920px; */
/*	min-height:297px;*/
/*
    background: url("../img_new/kumiai_girl_kurabe.png") no-repeat scroll left top;
	padding:15px 0 15px 80px;
*/
	margin:0 auto;
}
#kurabe-top p{
	line-height:54px;
	font-size:1.6em;
	/*font-family:sans-serif;*/
}

.kurabe-filter{
	margin-bottom:50px;
}
.kurabe-filter form{
	text-align:left;
	position: relative;
}


fieldset {
    border: 0;
    padding: 0;
}

label{
  font-weight: 300;
}
 
button{
  display: inline-block;
  vertical-align: top;
  padding: .6em 1em;
  margin: 0;
  background: #808080;
  border: 0;
  color: #FFF;
  font-size: 16px;
  border-radius: 4px;
  cursor: pointer;
  
  position:absolute;
  bottom:0px;
  right:0px;
  z-index:4;
	transition: all 0.4s ease 0s;
}
button:hover{
  background: #8a0000;
}
button:focus{
  outline: 0 none;
}
 
.controls{
/*  background: #333;*/
/*  padding: 2%;*/
}
 
.filter-wrap{
	width:24%;
	display: inline-block;
	vertical-align: top;
	margin: 0 1% 0 0;
	box-shadow: 0px 0px 3px #bfbfbf;
	background: #FFF;
	padding:0;
}
#kodawari-filter.filter-wrap{
	width:84%;
	margin-top:10px;
}
.filter-wrap h4{
	font-size:1.1em;
	color:#FFF;
	/*font-family:sans-serif;*/
	text-align:center;
	line-height: 1.3;
	text-shadow: 1px 1px 0px rgba(0,0,0,0.25);
	background:#444;
	padding:6px 0;
}
.fieldset-wrap{
	padding: 10px 10px 0;
}

.filter-wrap#first-filter{
	position:relative;
}
.filter-wrap#first-filter img{
	position:absolute;
	top:0px;
	left:0px;
}




.checkbox{
  display: block;
  position: relative;
  cursor: pointer;
  margin-bottom: 5px;
}

.checkbox input[type="checkbox"]{
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  cursor: pointer;
  margin: 0;
  opacity: 0;
  z-index: 1;
}

.checkbox label{
  display: inline-block;
  vertical-align: top;
  text-align: left;
  padding-left: 1.5em;
}

.checkbox label:before,
.checkbox label:after{
  content: '';
  display: block;
  position: absolute;
}

.checkbox label:before{
  left: 0;
  top: 0;
  width: 18px;
  height: 18px;
  margin-right: 10px;
  background: #ddd;
  border-radius: 3px;
}

.checkbox label:after{
  content: '';
  position: absolute;
  top: 4px;
  left: 4px;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background: #8a0000;
  opacity: 0;
  pointer-events: none;
}

.checkbox input:checked ~ label:after{
  opacity: 1;
}

.checkbox input:focus ~ label:before{
  background: #eee;
}


#kodawari-filter fieldset{
	width:25%;
	float:left;
}









.container .mix > a{
	display:block;
	background:#FFF;
	padding:0px;
	border:1px solid #d9d9d9;
/*	box-shadow: 0px 0px 2px #bfbfbf;*/
	transition: all 0.4s ease 0s;
}
.container .mix > a:hover{
	background:#f7f6e8;
	border:1px solid #808080;
	box-shadow: 0px 0px 3px #bfbfbf;
}
.container .mix > a .yado-photo img{
/*	width:100%;*/
	width:238px;
}
.container .mix > a .yado-info{
	padding:8px 15px 12px;
}
.container .mix > a .yado-info dt{
	font-size:1.2em;
/*	color:#8a0000;*/
	color:#bf0000;
	text-align:center;
	font-weight:bold;
	/*font-family:sans-serif;*/
	border-bottom:1px dotted #808080;
	padding-bottom:6px;
	margin-bottom:8px;
}
.container .mix > a .yado-info dd{
	font-size:0.9em;
	line-height:1.4;
	color:#000;
}



.container{
    min-height: 450px;
}





/**
 * Fail message styles
 */

.container .fail-message{
  position: absolute;
  width: 860px;
/*
  top: 0;
  left: 100px;
  bottom: 0;
  right: 100px;
*/
  text-align: center;
  opacity: 0;
  pointer-events: none;
  
  -webkit-transition: 150ms;
  -moz-transition: 150ms;
  transition: 150ms;
}

.container .fail-message:before{
  content: '';
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

.container .fail-message span{
  display: inline-block;
  vertical-align: middle;
  font-size: 20px;
  font-weight: 700;
}

.container.fail .fail-message{
  opacity: 1;
  pointer-events: auto;
  z-index: -1;
}
#kumiai-girl-komatta-img{
	position:relative;
}
#kumiai-girl-komatta-arrow{
	width:100%;
	text-align:center;
	position:absolute;
	top:1100px;
}










/* ウィンドウ幅が1025px以上の場合に適用するCSS */
@media screen and ( min-width:1025px ){


	/**
	 * Container/Target Styles
	 */
	
	/*
	.container{
	  padding: 0;
	  min-height: 360px;
	/*  text-align: justify;
	  position: relative;
	}*/
	
	/*.container .mix,*/
	.container .gap{
		width: 23%;
	/*	width: 240px;*/
		display: inline-block;
		vertical-align:top;
		padding:1%;
		margin: 0 0 10px;
	}
	
	/*
	.container .mix{
		margin: 0;
		display: none;
	}
	*/
	
	/*-----▼▼バラバラの高さをきれいに並べる▼▼-----*/
	.container .mix{
	/*	width: 240px;*/
	  text-align: left;
	  margin: 0 0 5%;
	  display: none;
	  
	  -webkit-backface-visibility: hidden;
	  
	  -webkit-transform-origin: 50% 0;
	}
	
	.container{
	  -webkit-column-count:4;
	  -moz-column-count:4;
	  column-count:4;
	}
	.no-sidebar .container{
	  -webkit-column-count:6;
	  -moz-column-count:6;
	  column-count:6;
	}
	
	/*-----▲▲バラバラの高さをきれいに並べる▲▲-----*/

	#kumiai-girl-komatta-img{
		top:-400px;
	}

	#kumiai-girl-komatta-arrow{
		top:1100px;
	}

}



/* ウィンドウ幅が1024px以下の場合に適用するCSS */
@media screen and ( max-width:1024px ){

	.container{
		padding: 0;
		text-align: justify;
		position: relative;
	}
	
	.container .mix,
	.container .gap{
		width: 23%;
		display: inline-block;
		vertical-align:top;
		padding:1%;
		margin: 0 0 10px;
	}
	
	.container .mix{
		display: none;
	}

	#kumiai-girl-komatta-img{
		top:0px;
	}
	#kumiai-girl-komatta-arrow{
		top:300px;
	}


}