@charset "utf-8";

body{
  background: #000 url("/img/bg_type2.jpg") no-repeat left top / 150% auto;
}
.box{width:96%;margin:auto;}


.msg{text-align: center;}
.msg p{font-size:0.7rem;margin-bottom:30px;text-align: left;}


.sortbox{
  background: url("/img/bg_dot2.jpg") repeat;
  overflow: hidden;
  padding: 4% 0;
  text-align: center;
}

.gal_s{
  width: 320px;
  margin: 0 auto ;
  text-align: center;
}
#main .sortbox .order_s{
  float:left;
  width:40%;
  text-align:right;
  margin-top:8px;
}
/*
#main .sortbox .more_btn{
    display: inline-block;
    margin:0;
    padding:0;
    width: 50px;
    line-height: 34px;
}
#main .sortbox .more_btn:after{
  display:none;
}*/

.btn_search {
    display: inline-block;
}
.btn_search input{ vertical-align : middle;height:30px;}




/*Pager*/

ul.pager {
	margin: 2% 0 2%;
	padding: 3% 10px 3%;
	text-align: center;
}

ul.pager li {
	display: inline;
	margin: 0 2px;
	padding: 0;
}

ul.pager li span,
ul.pager li a {
	display: inline-block;
	margin-bottom: 5px;
	padding: 5px 13px;
	/*background: #222;*/
	text-decoration: none;
	vertical-align: middle;
  border:1px solid #ccc;
}

ul.pager li a:hover {
	color: #fff;
}



/*LIST*/

#main ul.revlist {
  margin-top: 15px;
}
#main ul.revlist li{
  margin:0 0 15px 0;
  overflow:hidden;
  box-sizing: border-box;
  padding:1%;
}
#main ul.revlist li a {
  display: block;
  position: relative;
}
#main ul.revlist li .thum{
width:28%;
float:left;
}
#main ul.revlist li .ph{
position: relative;
}

#main ul.revlist li .today,#main ul.revlist li .tomorrow
{padding: 0.5% 1%;}

#main ul.revlist li .ph article {
bottom:0;
left:0;
text-align: left;
position: absolute;
width:100%;
padding:15px 0 5px 5px;
background: rgba(0, 0, 0, 0) url("/img/bg_box.png") no-repeat scroll 0 0 / cover ;
}
#main ul.revlist li .ph article h3 {
    font-size: 0.85rem;
    font-weight: bold;
}
#main ul.revlist li .ph article .body {
    font-size: 0.5rem;
}
#main ul.revlist li .commentbox{
  float:left;
  width:66%;
  border: 1px solid #999;
  background: rgba(1,1,1,0.5);
  margin: 30px 0 0 5px;
  padding:0 2% 2% 2%;
  position: relative;
  text-align: left;
}
#main ul.revlist li .commentbox .day{
  font-size:1rem;
  text-align:right;
}
#main ul.revlist li .commentbox .reviewttl{
  font-size:1.5rem;
}
/*
#main ul.revlist li .commentbox .star{
  font-size: 1.4rem;
}
#main ul.revlist li .commentbox .reviewer{
  font-size: 1.3rem;
}
#main ul.revlist li .commentbox .star{
  font-weight: bold;
}

#main ul.revlist li .commentbox .day:before {
    content: "投稿日：";
}
#main ul.revlist li .commentbox .star:before {
    content: "満足度：";
}*/
.reviewer:before {
    content: "投稿者：";

}

.reviewer{
 font-size:0.95rem;
 background: #fff;
 color:#000;
 position: relative;
 font-weight:bold;
 padding:2px 8px;
 margin:-15px 0 10px -20px;
 display: inline-block;
 /*width:80%;*/
  }
.reviewer span{
   font-size:0.8rem;
    }

.reviewer:after{
      content: "";
      position: absolute;
      right: 0;
      bottom: -5px;
      left: 15%;
      width: 0px;
      height: 0px;
      /*margin: auto;*/
      border-style: solid;
      border-color: #fff transparent transparent transparent;
      border-width: 5px 5px 0 5px;
    }





#main ul.revlist li .commentbox .comment{
      font-size: 0.9rem;
}


/*
@media screen and (max-width: 768px) {
#main .sortbox{
  font-size: 1.1rem;
}
#main ul.revlist li .ph{
width:28%;
}
#main ul.revlist li .commentbox{
  width:70%;
}
}

@media screen and (max-width: 600px) {
  #main .sortbox{
    width:90%;
  }
  #main .sortbox .gal_s,#main .sortbox .order_s{
    width:100%;
    float:none;
  }
#main .sortbox .order_s{
  text-align:center;
}

  #main ul.revlist li .ph{
  width:38%;
  }
  #main ul.revlist li .commentbox{
    width:60%;
  }
  #main ul.revlist li .ph article .body,#main ul.revlist li .commentbox .day {
      font-size: 0.8rem;
  }
  #main ul.revlist li .commentbox .reviewttl {
    font-size: 1.3rem;
}
#main ul.revlist li .commentbox .star, #main ul.revlist li .commentbox .reviewer {
    font-size: 1.1rem;
}
#main ul.revlist li .commentbox .comment{
  font-size: 1rem;
}
}


*/


/*
====================================================
■ form設定
====================================================
*/



select {
  border: 1px solid #ccc;
  font-size: 1rem;
  margin: 0 1% 2%;
  padding: 1.5% 4% 1.5% 2%;
  background: #fff
}


input.text,textarea.text{
  border: 1px solid #ccc;
  font-size: 1rem;
  margin: 0 1% 2%;
  padding: 1.5% 4% 1.5% 2%;
}
textarea#comment{
  border: 1px solid #ccc;
  height: 120px;
  padding: 2%;
  width: 96%;
}
/*.more_btn, .back_btn{
	width:150px;
}*/


/*
====================================================
■ dl設定
====================================================
*/


.box dl {
  font-size:0.9rem;
  overflow: hidden;
  text-align: left;
  margin:1%;
  border-bottom:1px solid #555;
}

.box dt {
  color:#ccc;
  font-size:0.8rem;
  padding:0.5%;
}

.box dd {
  font-size:0.8rem;
padding:0.5%;
}

dt span,dd span,.caution span{color: #ff0000;
    font-size: 0.6rem;
    font-weight: bold;
    margin: 0 0 0 5px;}

dt p,dd p{font-size: 1.1rem;}

dd p{margin-top:5px;}




@media screen and (max-width: 768px) {
dl {
    padding: 2%;
     font-size: 1.2rem;
}
dt {
    float: none;
    width: 100%;
}

dd {
    float: none;
    width: 100%;
}

dt p{display:inline;}

dt p,dd p{font-size: 0.9rem;}

}