
#top-img{
	background: url(/images/attraction/top-img.jpg) no-repeat;
	background-size: cover;
	background-position: center;
}

.second-h1 {
  font-size: 2.6rem;
  font-weight: 400;
  letter-spacing: 0.2rem;
  color: white;
  text-align: center;
  padding-top: 120px;
	font-family: serif;
}
.second-h1 small {
	font-size: 0.6rem;
	color: white;
}
.second-h1 img{
	width: 153px;
}

#attraction{
	margin-top: 80px;
	margin-bottom: 20px;
}

.PB-set {
	padding-bottom: 0px;
}
.catch-box {
	padding-bottom: 140px;
}
.catch-box .catch{
	text-align: center;
	font-size: 1.8rem;
	line-height: 2.8rem;
	letter-spacing: 0.8rem;
	font-weight: 100;
	/* font-family: serif; */
}
.attraction-box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
}
.attraction-box .text {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  /* align-items: center; */
  width: 50%;
  position: relative;
  z-index: 1;
}
.attraction-box .inner {
  max-width: 580px;
  padding: 20px 15px 20px 7%;
}
.attraction-box .inner h2 {
	font-size: 2.2rem;
	font-weight: bold;
	color: #000c40;
	position: relative;
	padding: 25px 20px 25px 27px;
	background: #fbffff;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.25, #e0e8f8), color-stop(.25, transparent),color-stop(.5, transparent), color-stop(.5, #e0e8f8),color-stop(.75, #e0e8f8), color-stop(.75, transparent),to(transparent));
	-webkit-background-size: 7px 7px;
	margin-bottom: 30px;
}
.attraction-box .inner p {
	margin-left: 15px;
	margin-right: 15px;
  margin-bottom: 15px;
}
.attraction-box figure {
  position: relative;
  width: 50%;
  padding-top: 33.33%;
  z-index: 2;
}
.attraction-box figure img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.attraction-box._01 .text,
.attraction-box._03 .text,
.attraction-box._05 .text,
.attraction-box._07 .text {
  -webkit-box-ordinal-group:2;
  -ms-flex-order:1;
  order:1;
}
.attraction-box._01 .text::before {
  top: -309px;
  left: -27px;
}
.attraction-box._02 .text::before {
  top: -194px;
  right: 38px;
}
.attraction-box._03 .text::before {
  top: -134px;
  right: 80px;
}
.attraction-box._01 .inner,
.attraction-box._03 .inner,
.attraction-box._05 .inner,
.attraction-box._07 .inner {
  margin-left: auto;
  padding-left: 15px;
  padding-right: 7%;
}
.attraction-box._01 figure,
.attraction-box._03 figure,
.attraction-box._05 figure,
.attraction-box._07 figure {
  -webkit-box-ordinal-group:3;
  -ms-flex-order:2;
  order:2;
}



/*========== 768px〜991pxまで(lg) ==========*/



/*--------------------------- PC STYLES ---------------------------*/


/*========== 992px〜1190pxまで(lg) ==========*/

@media ( min-width : 992px ) {


}

/*========== 1200px以上(xl) ==========*/

@media ( min-width : 1200px ) {



}


/*--------------------------- SMARTPHONE STYLES ---------------------------*/


/*========== 768px以下(sm) ==========*/

@media ( max-width : 767px ) {
	.catch-box {
		padding: 0 5%;
		padding-bottom: 80px;
	}
	.catch-box .catch{
		text-align: center;
		font-size: 1.6rem;
		line-height: 2.6rem;
		letter-spacing: 0.6rem;
		font-weight: 100;
		/* font-family: serif; */
	}
	.attraction-box {
		display: block;
	}
	.attraction-box figure {
    width: 100%;
		padding-top: 0;
	}
	.attraction-box figure img {
		position: relative;
		top:0;
		left: 0;
		-webkit-transform: none;
		transform: none;
	}
	.attraction-box .inner {
		padding: 25px!important;
	}
	.attraction-box .inner h2 {
		padding: 25px 12px 25px 12px;
		line-height: 2.6rem;
	}
	.attraction-box .text {
		/* width: 90%; */
		width: 100%;
	}
	/* .attraction-box .inner p {
		font-size: 1.4rem;
	} */

}


/*========== 650px以下(xs) ==========*/

@media ( max-width : 650px ) {



}
