@charset "utf-8";

/* ==========================================================

title : 口コミから施設検索
scope : 動画から施設検索 一覧ページ
　　　　　　　※写真から施設検索のCSSを読み込み、口コミ用のクラスをこちらに追加

last modify : 2018/04/18 247_morita 写真から施設検索：地域・カテゴリ選択枠改修 #13541
2017/09/11 247_morita 口コミ/写真/動画から検索：ブランク画像修正 #12687
2017/02/24 247_morita 口コミ・写真・動画から施設検索改修 #11733
2016/12/21 248_morita 新規 #11348

========================================================== */
/*--- トップページ 絞込み枠 ---*/
.search_change.narrow_box .detail_change {
  background: #F9E8F0;
  border-color: #ec97b6;
}

/*----- 表示切替 -----*/
.search_change {
  background: #F9E8F0;
  border-color: #ec97b6;
}

.search_change:before {
  border-color: #ec97b6 transparent transparent transparent;
}

.search_change:after {
  border-color: #F9E8F0 transparent transparent transparent;
}

.search_change hr {
  border-bottom: 1px solid #ec97b6;
}

.search_change dt:after{
	border-color: transparent transparent transparent #FA4989;
 }

/* 検索内容を変更 */
.search_change .detail_change dt:before {
	background: url("../image/icon_change_megaen.png") no-repeat 0 0;
}

.search_change .detail_change dd a {
  background: rgb(255,103,158);
  background: -moz-linear-gradient(top, rgba(255,103,158,1) 0%, rgba(248,64,131,1) 100%);
  background: -webkit-linear-gradient(top, rgba(255,103,158,1) 0%,rgba(248,64,131,1) 100%);
  background: linear-gradient(to bottom, rgba(255,103,158,1) 0%,rgba(248,64,131,1) 100%);
  border: 1px solid #ff4488;
  border-radius: 2px;
  box-shadow: 0px 2px 1px  0px #87446f,0px 0px 2px 1px rgba(251,249,249,0.35) inset;
}

/* 並べ替え */
.search_change .display_change dt:before {
	background: url("../image/icon_change_sort.png") no-repeat 0 0;
}

/*----- 口コミ一覧 -----*/
.review_list_ttl {
  width: 900px;
  margin: 0 auto 10px;
  padding: 0 5px 10px 50px;
	position: relative;
  background: url("/pub_photo/image/bg_ttl_list.png") repeat-x left bottom;
  text-align: left;
  font-size: 21px;
	box-sizing: border-box;
}

.review_list_ttl span {
	color: #e24a79;
}

.review_list_ttl:before {
	background: url("/pub_review/image/icon_ttl_reviewlist.png") no-repeat 0 0;
  content: "";
	height: 25px;
	left: 1px;
  position: absolute;
  top: 5px;
	width: 42px;
}
#list_box ul {
    margin: 0 auto;
		overflow: hidden;
    text-align: left;
    width: 960px;
}

#list_box ul:first-child{
	margin-top:20px;
}

#list_box ul li {
	background: url("/pub_review/image/bg_review.png");
	border: 1px solid #ff4488;
	border-radius: 5px;
	-moz-box-shadow:0px 0px 6px 3px #d7d7d7;
	-webkit-box-shadow:0px 0px 6px 3px #d7d7d7;
	box-shadow:0px 0px 6px 3px #d7d7d7;
	box-sizing: border-box;
	float: left;
	margin: 10px 7px;
}

/*#list_box[class^="review_list_"] ul li:last-child {
	margin-right: 7px;
}*/

#list_box ul li a {
	display: block;
	cursor: pointer;
}

#list_box ul li a:hover {
	opacity: 0.8;
}

#list_box ul li a:hover .detail {
	color: #444;
}

#list_box ul li .dtl_link_icon {
	border-radius: 0 0 4px 0;
	position: absolute;
}

#list_box ul dl dt,
.review_dtl dl dt {
	background: #ff4488;
	border-radius: 4px 4px 0 0;
	color: #fff;
	font-size: 18px;
	line-height: 33px;
	overflow: hidden;
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#list_box ul dl dt {
	font-size: 16px;
	font-weight: bold;
	line-height: 1.4em;
	padding: 5px 10px;
}

#list_box ul dl dt span {
	display: block;
	font-size: 14px;
  font-weight: normal;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#list_box ul dl dd,
.review_dtl dl dd {
	font-size: 15px;
	padding: 20px 14px 8px;
	position: relative;
}

#list_box ul dl dd .review_ttl,
.review_dtl dl dd .review_ttl {
	color: #143d9c;
	font-size: 18px;
	font-weight: bold;
	overflow: hidden;
	padding-bottom: 15px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/*-- 星表示 --*/
#list_box ul dl dd .review_ttl:after,
.review_dtl dl dd .review_ttl:after {
  background: url("/pub_review/image/img_review_star.png") no-repeat center;
  background-size: 140px auto;
  content: "";
  display: block;
  height: 30px;
	margin-top: 15px;
  position: relative;
	vertical-align: middle;
  width: 140px;
}

#list_box ul dl dd .review_ttl.star_1:after,
.review_dtl dl dd .review_ttl.star_1:after {
	background-position: 0 -128px;
}

#list_box ul dl dd .review_ttl.star_2:after,
.review_dtl dl dd .review_ttl.star_2:after {
	background-position: 0 -96px;
}

#list_box ul dl dd .review_ttl.star_3:after,
.review_dtl dl dd .review_ttl.star_3:after {
	background-position: 0 -64px;
}

#list_box ul dl dd .review_ttl.star_4:after,
.review_dtl dl dd .review_ttl.star_4:after {
	background-position: 0 -32px;
}

#list_box ul dl dd .review_ttl.star_5:after,
.review_dtl dl dd .review_ttl.star_5:after {
	background-position: 0 0;
}

/*-- 1列　--*/
#list_box ul.photo_afew{
	width: 481px;
}

/*-- 2列 --*/
#list_box.review_list_02 ul li {
	height:231px;
	margin-right: 33px;	
	width: 453px;
}

#list_box.review_list_02 ul li:nth-child(2n) {
	margin-right: 7px;
}

#list_box.review_list_02 ul dl dd .detail {
	max-height: 109px;
	overflow: hidden;
}

#list_box.review_list_02 ul li dl dd .review_ttl {
	width: 255px;
}

#list_box.review_list_02 ul li dl dd .review_ttl:after {
	position: absolute;
	right: 17px;
	top: 0;
}

#list_box.review_list_02 ul li .dtl_link_icon {
	right: 0;
	top: 142px;
}

/*-- 3列 --*/
#list_box.review_list_03 ul li {
	height:300px;
	margin-right: 23px;	
  margin-bottom: 20px;
	width: 295px;
}

#list_box.review_list_03 ul li:nth-child(3n) {
	margin-right: 7px;
}

#list_box.review_list_03 ul dl dd {
	padding-top: 13px;
}

#list_box.review_list_03 ul dl dd .detail {
	max-height: 154px;
	overflow: hidden;
}

#list_box.review_list_03 ul li .dtl_link_icon {
	right: 0;
	top: 211px;
}

#list_box.review_list_03 ul li dl .review_ttl{
	text-align:center;
}

#list_box.review_list_03 ul li dl dd .review_ttl:after{
	margin:5px auto 0;
}


/*-- 4列 --*/
#list_box.review_list_04 ul li {
	height:320px;
	margin-right: 15px;
	width: 220px;
}

#list_box.review_list_04 ul li:nth-child(4n) {
	margin-right: 7px;
}

#list_box.review_list_04 ul dl dd {
	padding-top: 13px;
}

#list_box.review_list_04 ul dl dd .detail {
	max-height: 190px;
	overflow: hidden;
}

#list_box.review_list_04 ul li .dtl_link_icon {
	right: 0;
	top: 231px;
}

#list_box.review_list_04 ul li dl .review_ttl{
	text-align:center;
}

#list_box.review_list_04 ul li dl dd .review_ttl:after{
	margin:5px auto 0;
}


/*----- modal -----*/
.review_dtl {
	border: 3px solid #e0628f;
	border-radius: 8px;
	box-sizing: border-box;
	overflow: visible;
	padding: 25px;
	width: 620px;
}

.review_dtl dl {
	background: url("/pub_review/image/bg_review.png");
	border: 1px solid #ff4488;
	border-radius: 5px;
	-moz-box-shadow:0px 0px 6px 3px #d7d7d7;
	-webkit-box-shadow:0px 0px 6px 3px #d7d7d7;
	box-shadow:0px 0px 6px 3px #d7d7d7;
	box-sizing: border-box;
}

.review_dtl dl dd .review_ttl {
	text-align: left;
	white-space: normal;
	width: 330px;
}

.review_dtl dl dd .review_ttl:after {
	position: absolute;
	right: 20px;
	top: 0;
}

.review_dtl dl dd {
	padding: 20px;
	text-align: left;
}

.review_dtl .facility_link {
	display: block;
	height: 35px;
	margin: 20px auto 0;
	width: 202px;
}

.review_dtl .clsbtn {
	right: -55px;
	top: -85px;
}

/*----- 投稿がない場合 -----*/

.none_review{
	position: relative;
}

#list_box ul .none_review dl dd{
	margin: 0 auto;
	padding: 0;
}

#list_box.review_list_02 .none_review dd{
	height: 176px;
}

#list_box.review_list_03 .none_review dd{
	height: 244px;
}

#list_box.review_list_04 .none_review dd{
	height: 264px;
}

.none_review dd img{
	position: absolute;
	right: 0;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}