@charset "utf-8";

/*------------------------------------------------
   街並探訪
------------------------------------------------*/

/* archive */

#town {
  width: 100%;
}

.townBlock {
  width: 100%;
  margin-bottom: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}


.townBox {
	width: calc((100% - 10px) / 2);
  background: #fff;
  border-radius: 8px;
  border: 1px solid #eee;
  position: relative;
  overflow: hidden;
  margin-bottom: 40px;
}

.townBox a {
  display: block;
  text-decoration: none;
}

.townBox .image {
	width: 100%;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
}

.townBox a:hover .image {
  background-color: #fff;
  opacity: 0.8;
}

.townBox .image img {
	width: 100%;
  transform: scale(1);
	transition: all 0.3s ease-in-out;
}

.townBox a:hover .image img {
  transform: scale(1.05);
}

.townBox::after {
	position: absolute;
	top: 0;
	right: 0;
	font-family: FontAwesome;
  font-size : 1.8rem;
  color: #ef762f;
  padding: .4em;
}

.townBox.eat::after {
	content: '\f0f5';
}

.townBox.buy::after {
	content: '\f290';
}

.townBox.look::after {
	content: '\f03e';
}

.townBox.walk::after {
	content: '\f1b0';
}

.townBox .textBlock {
  position: relative;
  padding: 0.6em;
}

.townBox .title {
	font-size: 1.3rem;
  font-weight: 500;
  text-align: center;
}

@media print, screen and (min-width: 601px) {

  .townBlock {
    width: 940px;
    margin: 0 auto 80px;
  }

  .townBlock::after {
    display: block;
    content:"";
    width: 300px;
  }

  .townBox {
    width: 300px;
  }

  .townBox::after {
    font-size : 2.4rem;
  }

  .townBox .title {
    font-size: 1.4rem;
  }

}


/*------------------------------------------------
   個別ページ
------------------------------------------------*/

.townSingleBlock {
  width: 100%;
}


.townSingleBox {
    margin-bottom: 40px;
}

.townSingleBox .title{
  position: relative;
	font-size: 1.6rem;
  font-weight: 500;
	margin-bottom: 1em;
}

.townSingleBox .title::before {
	font-family: FontAwesome;
  font-size : 4.0rem;
  color: #ef762f;
  margin-right: 0.4em;
}

.townSingleBox.eat .title::before {
	content: '\f0f5';
}

.townSingleBox.buy .title::before {
	content: '\f290';
}

.townSingleBox.look .title::before {
	content: '\f03e';
}

.townSingleBox.walk .title::before {
	content: '\f1b0';
}

.townSingleBox .imageBlock {
	width: 100%;
	margin-bottom: 40px;
}

.townSingleBox .imageBlock .image {
	width: 100%;
}

.townSingleBox .imageBlock .image img {
	width: 100%;
	height: auto;
}

.townSingleBox .content p {
	font-size: 1.4rem;
  line-height: 1.8;
  text-align: justify;
  margin-bottom: 1em;
}

@media print, screen and (min-width: 601px) {

  .townSingleBlock {
    width: 700px;
    margin: 0 auto;
  }


  .townSingleBox {
    margin-bottom: 80px;
  }

  .townSingleBox .ctgry {
    font-size: 1.4rem;
  }

  .townSingleBox .date {
    font-size: 1.8rem;
  }

  .townSingleBox .title{
    font-size: 1.8rem;
  }

  .townSingleBox .content p {
    font-size: 1.5rem;
  }

}