@charset "utf-8";
/* =============================================================
 * 新着情報
 * ============================================================= */
/* アーカイブ */
body {
	background: #313131;
  color: #FFF;
}
#construction {
	color: #FFF;
}
.construction-content img {
	width: auto;
}
.title-wrap {
	width: 100%;
	box-sizing: border-box;
	padding: 1% 3%;
	background: #646464;
	margin: 0 0 3%;
}
.construction-wrap {
	margin: 0 0 3%;
	padding: 0 0 3%;
	border-bottom: 1px dotted #FFF;
}
.construction-title {
	float: left;
	font-size: 1.8vw;
	font-weight: bold;
}
.construction-title a {
	color: #FFF;
}
.construction-day {
	float: right;
	padding: 1.5% 0 0;
  font-weight: bold;
}
.image {
	width: 35%;
	height: 12rem;
	float: left;
}
.image img {
	height: 100%;
	width: 100%;
}
#construction .content	{
	width: 80%;
	margin: 0 auto;
	padding: 5% 0;
}
#construction .in-box	{
	margin: 0 -2% 0 0;
}
#construction .wrap	{
	width: 31%;
	float: left;
	padding: 1.5%;
	background: #FFF;
	box-sizing: border-box;
	margin: 0 2% 4% 0;
}
.txt {
	width: 60%;
	float: right;
}
.prev-btn {
	clear: both;
	padding: 1% 2%;
	background: #00003A;
	border: 1px solid #FFF;
	width: 10%;
	text-align: center;
	float: right;
}
.prev-btn a {
	color: #FFF;
}
.title-wrap a {
  color: #FFF;
}
.wrap .photo {
	height: 15rem;
	margin: 0 auto 3%;
}
.wrap .photo img {
	height: 100%;
	width: 100%;
}
.wrap .cat {
	padding: 1% 4%;
	box-sizing: border-box;
	background: #00003A;
	color: #FFF;
	font-weight: bold;
	margin: 0 0 3%;
}
.wrap .place {
	text-align: center;
	margin: 0 0 3%;
	font-size: 1.2vw;
}
.more	{
	padding: 1% 2%;
	background: #00003A;
	box-sizing: border-box;
	color: #FFF;
	text-align: center;
  width: 25%;
  margin: 0 0 0 75%;
}
.single-content {
	width: 80%;
	margin: 5% auto 2%;
	padding: 1.5% 3%;
	background: #FFF;
	box-sizing: border-box;
}
.single-content .cat {
	padding: 1% 2%;
	background: #00003A;
	font-weight: bold;
	text-align: center;
	margin: 0 0 2%;
	font-size: 1.4vw;
}
.single-content .main-wrap {
	width: 100%;
	display: table;
	margin: 0 0 1%;
}
.main-wrap .photo {
	width: 60%;
	padding: 0 2% 0 0;
	height: 25rem;
	display: table-cell;
}
.main-wrap .photo img {
	width: 100%;
	height: 100%;
}
.main-wrap .txt-box {
	width: 35%;
	display: table-cell;
	vertical-align: bottom;
	color: #000;
}
.txt-box .place {
	font-size: 1.4vw;
	margin: 0 0 3%
}
.txt-box .free-txt {
	font-size: 1.1vw;
}
.photo-area	{
	margin: 0 -1% 2% 0;
}
.photo-area .photo {
	width: 19%;
	margin: 0 1% 1% 0;
	height: 10rem;
	float: left;
}
.photo-area .photo img {
	width: 100%;
	height: 100%;
}
.prev-area .after-kiji {
	width: 10%;
	float: right;
}
.prev-area .after-kiji a {
	background: #00003A;
	color: #FFF;
	text-align: center;
	padding: 5% 3%;
	display: block;
}
.prev-area .before-kiji {
	width: 10%;
	float: left;
}
.prev-area .before-kiji a {
	background: #00003A;
	color: #FFF;
	text-align: center;
	padding: 5% 3%;
	display: block;
}
.back-btn {
	width: 10%;
	margin: 0 auto 5%;
	border: 1px solid #FFF;
	box-sizing: border-box;
}
.back-btn a {
	background: #00003A;
	color: #FFF;
	text-align: center;
	padding: 5% 3%;
	display: block;
}


/********************************************************************
一覧ページ
********************************************************************/
.all-exboxarea{
width:100%;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content:space-between;
}

.exbox{
width:48%;
margin-bottom: 5%;
}
.exbox img{
width:100%;
}


.btn-allex{
width:30%;
margin: 5% auto;
}

.btn-allex a{
width:100%;
display: block;
background-color: #ffffff;
font-size: 1.2vw;
color: #000000;
text-align: center;
line-height: 250%;
border-radius: 1.4vw;
text-decoration: none;
}

.btn-allex a:hover{
opacity: 0.6;
}








/* 
=============================
　　　　スマホ
=============================
*/
@media screen and (max-width: 699px) {
#construction .content {
  width: 90%;
}
#construction .wrap {
  width: 48%;
}
.wrap .cat {
  font-size: 14px;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wrap .place {
  font-size: 13px;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wrap .photo {
  height: 7rem;
  margin: 0 auto 3%;
}
.more {
  width: 50%;
  margin: 0 auto;
}
.single-content {
  width: 90%;
  margin: 10% auto 5%;
  padding: 3%;
  background: #FFF;
  box-sizing: border-box;
}
.single-content .cat {
  text-align: center;
  margin: 0 0 2%;
  font-size: 14px;
}
.single-content .main-wrap {
  display: block;
}
.main-wrap .photo {
  width: 100%;
  padding: 0;
	margin: 0 0 3%;
  height: 15rem;
  display: block;
}
.txt-box .place {
  font-size: 14px;
}
.txt-box .free-txt {
  font-size: 14px;
}
.photo-area .photo {
  width: 46%;
  margin: 0 4% 5% 0;
}
.photo-area {
  margin: 0 -3% 2% 0;
}
.prev-area .before-kiji {
  width: 30%;
  float: left;
}
.prev-area .after-kiji {
  width: 30%;
  float: right;
}
.back-btn {
  width: 30%;
}

.btn-allex {
    width: 60%;
    margin: 5% auto;
}

.btn-allex a {
    width: 100%;
    display: block;
    background-color: #ffffff;
    font-size: 16px;
    color: #000000;
    text-align: center;
    line-height: 250%;
    border-radius: 20px;
    text-decoration: none;
}
}