/* =========================================
   TOP 妙光院 永代供養塔 豪華バナー
========================================= */

.top-eitai-banner{
  width:100%;
  padding:28px 20px;
  box-sizing:border-box;
  background:#f5f0e4;
}

.top-eitai-link{
  position:relative;
  display:block;
  overflow:hidden;
  max-width:1100px;
  min-height:440px;
  margin:0 auto;

  color:#fff !important;
  text-decoration:none !important;

  background:
    radial-gradient(
      circle at 80% 30%,
      rgba(75,120,82,.40),
      transparent 32%
    ),
    linear-gradient(
      120deg,
      #071a12 0%,
      #102e20 55%,
      #214b35 100%
    );

  border:1px solid #b7974a;
  box-shadow:
    0 20px 50px rgba(20,35,26,.20),
    inset 0 0 60px rgba(0,0,0,.12);
}

/* 金色の内枠 */
.top-eitai-link:before{
  content:"";
  position:absolute;
  z-index:4;
  inset:13px;
  pointer-events:none;
  border:1px solid rgba(220,190,112,.50);
}

/* 花・和柄風装飾 */
.top-eitai-link:after{
  content:"❀  ❧";
  position:absolute;
  z-index:1;
  right:-20px;
  bottom:-40px;

  color:rgba(222,194,119,.13);

  font-family:serif;
  font-size:150px;
  line-height:1;

  transform:rotate(-12deg);
}

.top-eitai-bg{
  position:absolute;
  inset:0;
  z-index:1;

  background:
    radial-gradient(
      circle at 10% 90%,
      rgba(205,170,84,.12),
      transparent 28%
    );
}

.top-eitai-content{
  position:relative;
  z-index:3;

  display:grid;
  grid-template-columns:56% 44%;
  align-items:center;

  min-height:440px;
}


/* ==========================
   左側
========================== */

.top-eitai-copy{
  padding:50px 20px 50px 65px;
}

.top-eitai-area{
  margin:0 0 7px;

  color:#d8c188;

  font-family:
    "Yu Mincho",
    "Hiragino Mincho ProN",
    serif;

  font-size:14px;
  letter-spacing:.12em;
}

.top-eitai-open{
  display:inline-block;

  margin:0 0 18px;
  padding:5px 13px;

  color:#f0d990;

  border-top:1px solid #b79546;
  border-bottom:1px solid #b79546;

  font-size:13px;
  letter-spacing:.08em;
}

.top-eitai-copy h2{
  margin:0 0 20px;

  color:#fff;

  font-family:
    "Yu Mincho",
    "Hiragino Mincho ProN",
    serif;

  font-size:31px;
  font-weight:500;
  line-height:1.65;
  letter-spacing:.06em;
}

.top-eitai-copy h2 span{
  color:#e5c66f;
}


/* PRICE */

.top-eitai-price{
  display:flex;
  align-items:baseline;
  gap:13px;

  margin:12px 0 20px;
}

.top-eitai-price small{
  color:#eee5ce;
  font-size:14px;
}

.top-eitai-price strong{
  color:#e7c568;

  font-family:Georgia,serif;
  font-size:44px;
  font-weight:400;
  line-height:1;
}

.top-eitai-price strong span{
  margin-left:4px;

  font-family:"Yu Mincho",serif;
  font-size:18px;
}


/* POINT */

.top-eitai-points{
  display:flex;
  flex-wrap:wrap;
  gap:6px;

  margin-bottom:22px;
}

.top-eitai-points span{
  padding:5px 10px;

  color:#ead9a7;

  border:1px solid rgba(202,169,83,.55);
  background:rgba(0,0,0,.12);

  font-size:11px;
}


/* BUTTON風 */

.top-eitai-more{
  display:flex;
  align-items:center;
  justify-content:space-between;

  max-width:430px;

  padding:14px 18px;

  color:#24382b;

  background:#f8f3e6;
  border-left:4px solid #c3a04e;

  font-size:14px;
  font-weight:bold;

  transition:.25s;
}

.top-eitai-more b{
  color:#a27b28;
  font-size:22px;
}

.top-eitai-link:hover .top-eitai-more{
  transform:translateX(5px);
  background:#fff;
}


/* ==========================
   永代供養塔
========================== */

.top-eitai-photo{
  position:relative;

  display:flex;
  align-items:flex-end;
  justify-content:center;

  height:440px;
  padding:30px 30px 0;
}

.top-eitai-photo:before{
  content:"";
  position:absolute;

  width:330px;
  height:330px;

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(201,177,105,.14),
      transparent 68%
    );
}

.top-eitai-photo img{
  position:relative;
  z-index:2;

  display:block;

  width:auto;
  max-width:100%;
  max-height:410px;

  object-fit:contain;

  filter:
    drop-shadow(0 20px 18px rgba(0,0,0,.40));
}


/* ==========================
   スマホ
========================== */

@media(max-width:767px){

  .top-eitai-banner{
    padding:15px 10px;
  }

  .top-eitai-link{
    min-height:620px;
  }

  .top-eitai-link:before{
    inset:7px;
  }

  .top-eitai-content{
    display:flex;
    flex-direction:column-reverse;

    min-height:620px;
  }

  .top-eitai-photo{
    width:100%;
    height:270px;

    padding:20px 20px 0;
    box-sizing:border-box;
  }

  .top-eitai-photo img{
    max-height:260px;
  }

  .top-eitai-copy{
    width:100%;

    padding:20px 20px 35px;

    box-sizing:border-box;
    text-align:center;
  }

  .top-eitai-area{
    font-size:12px;
  }

  .top-eitai-open{
    font-size:11px;
  }

  .top-eitai-copy h2{
    font-size:23px;
    line-height:1.65;
  }

  .top-eitai-price{
    justify-content:center;
    display:block;
  }

  .top-eitai-price small{
    display:block;
    margin-bottom:5px;
  }

  .top-eitai-price strong{
    font-size:38px;
  }

  .top-eitai-points{
    justify-content:center;
  }

  .top-eitai-more{
    margin:18px auto 0;
    text-align:left;
  }

}