@charset "utf-8";


.title_container {
    position: relative;
}

#main {
  background: rgba(0, 0, 0, 0) url("/img/bg_type2.jpg") no-repeat fixed center top;
  padding-bottom:5%;
}

#search_box {
    /*background-color: #C60103;
    padding: 30px 0;*/
		display: inline-block;
		position:absolute;
		right:0;
		bottom:40px;
}
#search_box .gal_s{
  display: inline-block;
  font-size: 1rem;
  line-height:30px;
}

#search_box select {
    border: 1px solid #fff;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    padding: 3px 2px;
    width: 150px;
		font-size:1rem;
		height:30px;
		vertical-align : middle;
		margin-left:5px;
}
.btn_search {
		display: inline-block;
}
.btn_search input{ vertical-align : middle;height:30px;}

.count {
    font-size: 1rem;
    letter-spacing: 0.1em;
    position: absolute;
    right: 0;
    text-align: right;
    top: 27px;
		line-height: 1;
}
.count span {
    font-size: 3rem;
    letter-spacing: normal;
    margin: 0 5px;
}

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



#main .sortbox{
  background: rgba(1,1,1,0.1);
  padding:10px 2%;
  width:96%;
  margin:10px auto;
  overflow:hidden;
  font-size: 1.3rem;
}


#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;
}



/*Pager*/

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

#main ul.pager li {
	display: inline;
	margin: 0 2px;
	padding: 0;
  width:auto;
}

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: #000;
  background: #fff;
}
ul.pager li.current span{
	color: #000;
  background: #fff;
  padding: 5px 13px;
}


/*LIST*/

#main ul.revlist {
  margin: 3% 0;
}

#main ul.revlist li:nth-child(2n) {
    margin:0 0 15px 30%;
}

#main ul.revlist li{
  margin:0 0 15px 0;
  box-sizing: border-box;
  padding:1%;
  width:70%;
  position:relative;
}

#main ul.revlist li a {
  display: block;
  position: relative;
}

#main ul.revlist li .ph{
width:35%;
float:left;
position: relative;
}
#main ul.revlist li .commentbox{
  background: rgba(1, 1, 1, 0.7) none repeat scroll 0 0 / 100% auto;
      font-size: 0.9rem;
      padding: 30px 2% 2%;
      /*position: absolute;
      right: 0;top: 5%;*/
      text-align: left;
      vertical-align: top;
      z-index: 10;
  width:60%;
  line-height: 1.6;
  float:left;
  margin:30px 0 0 -30px;
  position:relative;
}

.sche_info{
  position: absolute;
  right:2%;
  top:30px;
  width: 50%;
  text-align: right;
}

#main ul.revlist li article h3 {
    font-size: 1.5rem;
}
#main ul.revlist li article .body {
    font-size:0.8rem;
    letter-spacing: 0.05em;
}

#main ul.revlist li .revbox{
  border:1px solid #fff;
  padding:0 2% 2% 2%;
  position:relative;
  margin:30px 0 0 5px;
  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:1rem;
 background: #fff;
 color:#000;
 position: relative;
 font-weight:bold;
 padding:5px 10px;
 margin:-30px 0 10px -20px;
 display: inline-block;
  }
.reviewer span{
   font-size:0.8rem;
    }

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


#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,input.text,textarea.text{
    background-color: #FFF;
    border: 1px solid #666;
    font-size:1rem;
    padding: 0.5%;
}
textarea#comment{
    height: 100px;
    width: 98%;
}




#form-footer{
  text-align: center;
  margin:2% auto;
  width:50%;
  max-width:300px;
  overflow: hidden;
}


#back-btn{float:left;}
#send-btn{float:right;}



/*
====================================================
■ dl設定
====================================================
*/
.formbox{
  width:98%;
  max-width:1300px;
  margin:auto;
  background: rgba(1,1,1,0.7);
  padding:1% 1% 3%;
}


.formbox dl {
    border-bottom:1px solid #555;
    font-size: 1.1rem;
    overflow: hidden;
    padding: 1.5%;
    text-align: left;
}

.formbox dt {
    float: left;
    width: 30%;
}

.formbox dd {
    float: left;
    width: 68%;
}

.caution {font-size:2rem;}
dt span,dd span{font-size:0.8rem;}
dt span,dd span,.caution span{
  margin-left:5px;
  color:#ff4c4c;
  font-weight: bold;
  }

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;}

}