/*  --------------------- */
/*  第2階層メインのタイトル  */
/*  --------------------- */
.sec-area {
	margin: auto 2rem;
}

/* タイトル */
.sec-area div.header{
	margin: 6rem auto 2rem;
	color: #000;
}
.sec-area div.header h2 {
	text-align: center;
}
.sec-area div.header p {
	margin-top: 2rem;
	margin-bottom: 4rem;
}
@media (max-width: 767px){
.sec-area div.header{
	margin: 4rem auto 0;
	}
.sec-area div.header h2 {
	padding-left: 1rem;
}
}


/*  --------------------- */
/*  リゾートTOPのアイコン    */
/*  --------------------- */
.sec-area div {
	margin-bottom: 40px;
	font-size: 0.9rem;
	line-height: 1.55;
	text-align: center;
}
.sec-area div a {	
	color: #555;
}
.sec-area div a:hover {	
	color: #000;
	text-decoration: none;
}
.sec-area p {
	padding: 0 0.95rem;
}
.sec-area p.text-item {
	text-align: left;
	padding: 0 1.4rem;
}


/* Sink */
.hvr-sink {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sink:hover, .hvr-sink:focus, .hvr-sink:active {
  -webkit-transform: translateY(9px);
  transform: translateY(9px);
}


/* -------------------- */
/* オープン時などのアイコン */
/* -------------------- */
.i-catch .item-title:before { /*ワイキキレイアグランドオープン*/
  content: '';
  display: block;
  width: 220px;
  height: 70px;
  margin-bottom: 20px;
  background-image: url(/fileadmin/res/_common/grandopen.png);
  background-size: contain;
  vertical-align: middle;
}

@media (max-width: 720px) {
.i-catch .item-title:before { 
  width: 160px;
  height: 51px;
}
}




/* ------------------ */
/* スタイルから探すナビ  */
/* ------------------ */

.sec-style-toplist{
  margin-bottom: 6rem;
}

.sec-style-toplist figure{
  margin-bottom: 1rem;
  position: relative;
}

.sec-style-toplist figcaption{
  background: rgba(0,0,0,0.5);
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
  margin:  0 auto ;
  padding: 0 auto 0;
  font-size: 0.750rem;
  color: #fff;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.sec-style-toplist figcaption:hover{
  background: rgba(0,0,0,0.3);
/*  font-size: 0;*/
}



/* ---------- */
/* スタイル相談 */
/* ---------- */

@media (min-width: 768px){
.sec-reserve{
  padding-top: 6rem;
  margin-bottom: 6rem;
}
}

.sec-reserve div{
  background-color: #f3eee8;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #958674;
}


.sec-reserve .border-tb{
  border-top: 1px solid #958674;
  border-bottom: 1px solid #958674;
}

@media (min-width: 768px){
.sec-reserve > div{
  width: 70%;
  margin:0 auto;
}

.mt-negative-3 {
  margin-top: -5rem;
}
}

.sec-reserve div a {
  color: #a29dbf;
}

.sec-reserve div a:hover {
  text-decoration: none;
}

.sec-reserve div span{
  border: 1px solid #a29dbf;
  display: block;
  padding: .5rem;
  text-align: center;
}

.sec-reserve div a:hover span{
  border: 1px solid #a29dbf;
  background-color: #a29dbf; 
  color: #fff;
}