.elementor-1176 .elementor-element.elementor-element-8e5ff63{--display:flex;}.elementor-1176 .elementor-element.elementor-element-8e5ff63.e-con{--flex-grow:0;--flex-shrink:0;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-1176 .elementor-element.elementor-element-8e5ff63{--width:84.735%;}}/* Start custom CSS */body.elementor-page-1176 .result-page {
  min-height: 100vh;
  padding: 48px 14px 70px;
  background: transparent !important;
  font-family: "Noto Serif JP", "Yu Mincho", serif;
  position: relative;
  color: #3a2b33;
}

body.elementor-page-1176 .result-box {
  max-width: 750px;
  margin: 0 auto;
  padding: 40px 32px 50px;
  background: transparent !important;
  border: 1px solid rgba(160, 110, 200, 0.3);
  border-radius: 15px;
  position: relative;
  z-index: 1;
  box-shadow:
  0 0 18px rgba(212, 175, 55, 0.18),
  0 0 42px rgba(212, 175, 55, 0.10);
}

/* =========================
   タイトル
========================= */

body.elementor-page-1176 .result-box h1 {
  text-align: center;
  font-size: 28px;
  letter-spacing: 0.12em;
  color: #1b2a52 !important;
  margin-bottom: 18px;
  text-shadow: 0 0 6px rgba(255,255,255,0.9);
}

/* =========================
   ユーザー情報
========================= */

body.elementor-page-1176 .user-info {
  text-align: center;
  font-size: 13px;
  color: #5a4650 !important;
  line-height: 1.8;
  margin-bottom: 26px;
  text-shadow: 0 0 6px rgba(255,255,255,0.9);
}

body.elementor-page-1176 .user-info p {
  margin: 2px 0;
}

/* =========================
   h2
========================= */

body.elementor-page-1176 .result-main h2 {
  text-align: center;
  font-size: 22px;
  color: #3a2b33 !important;
  margin-bottom: 28px;
  text-shadow: 0 0 6px rgba(255,255,255,0.95);
}

/* =========================
   ローディング
========================= */

body.elementor-page-1176 .loading-box {
  text-align: center;
  padding: 36px 16px;
}

body.elementor-page-1176 .loading-orb {
  width: 54px;
  height: 54px;
  margin: 0 auto 18px;
  border-radius: 50%;
  background: radial-gradient(circle, #fff 15%, #f2a9c8 45%, #b75b86 100%);
  box-shadow: 0 0 28px rgba(183, 91, 134, 0.45);
  animation: pulseOrb 1.8s infinite ease-in-out;
}

@keyframes pulseOrb {
  0%,100% {
    transform: scale(1);
    opacity: .75;
  }

  50% {
    transform: scale(1.15);
    opacity: 1;
  }
}

body.elementor-page-1176 .loading-main {
  font-size: 16px;
  font-weight: 700;
  color: #b75b86;
}

body.elementor-page-1176 .loading-sub {
  font-size: 13px;
  color: #8c6d7b;
}

/* =========================
   タイプボックス
========================= */

body.elementor-page-1176 .type-box {
  position: relative;
  overflow: hidden;
  background: rgba(255,255,255,0.82);
  border: 1px solid rgba(160,110,200,.35);
  border-radius: 20px;
  padding: 24px 20px;
  margin-bottom: 28px;
}

body.elementor-page-1176 .type-box h2 {
  font-size: 18px;
  color: #b75b86;
  margin-bottom: 12px;
  text-align: center;
}

body.elementor-page-1176 .type-main {
  text-align: center;
  font-size: 19px;
  font-weight: 700;
  color: #3a2b33;
  margin-bottom: 12px;
}

body.elementor-page-1176 .type-desc {
  font-size: 14px;
  line-height: 2.2;
  color: #5c4851;
}

/* =========================
   結果カード
========================= */

body.elementor-page-1176 .result-body {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

body.elementor-page-1176 .fortune-section-result {
  position: relative;
  overflow: hidden;
  padding: 32px 26px;
  border: 1px solid rgba(160,110,200,.3);
  border-radius: 18px;
  background: rgba(255,255,255,.82);
}

body.elementor-page-1176 .fortune-section-result::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("http://tm-meguri.com/wp-content/uploads/2026/05/%E8%AA%AC%E6%98%8E%E8%83%8C%E6%99%AF-300x200.png");
  background-size: cover;
  background-position: center;
  opacity: .22;
  z-index: 0;
}

body.elementor-page-1176 .fortune-section-result > * {
  position: relative;
  z-index: 1;
}

body.elementor-page-1176 .gold-title {
  font-size: 17px;
  font-weight: 700;
  color: #c35a86 !important;
  border-left: 4px solid #6f4fb3;
  padding-left: 10px;
  margin-bottom: 12px;
}

body.elementor-page-1176 .section-text,
body.elementor-page-1176 .section-text * {
  font-size: 15px;
  line-height: 2.4 !important;
  letter-spacing: .1em;
  color: #44323a !important;
}

/* =========================
   ぼかし
========================= */

.section-locked {
  position: relative;
  overflow: hidden;
}

.locked-half {
  filter: blur(3.3px);
  opacity: 0.9;
  user-select: none;
}

.unlock-overlay {
  margin-top: 12px;
  text-align: center;
}

.unlock-message {
  margin-bottom: 10px;
  color: #b84f8f;
  font-weight: 700;
}

.unlock-btn {
  border: none;
  border-radius: 999px;
  padding: 12px 22px;
  background: linear-gradient(135deg, #e88ab6, #d76fa3);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

/* =========================
   戻るボタン
========================= */

body.elementor-page-1176 .back-btn-wrap {
  text-align: center;
  margin-top: 46px;
}

body.elementor-page-1176 .back-btn {
  min-width: 230px;
  padding: 15px 34px;
  border-radius: 999px;
  border: 1px solid rgba(199,154,66,.75);

  background: linear-gradient(
    135deg,
    #fff8fb 0%,
    #f7d7e7 45%,
    #e7b0cf 100%
  );

  color: #7b2f55;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .08em;
}

/* =========================
   ホロスコープ
========================= */

.horoscope-svg {
  width: 100%;
  max-width: 440px;
  display: block;
  margin: 0 auto;

  /*filter:*/
  /*  drop-shadow(0 0 14px rgba(120, 90, 255, 0.35))*/
  /*  drop-shadow(0 0 24px rgba(255, 190, 90, 0.18));*/

  animation: floatChart 6s ease-in-out infinite;
}

@keyframes floatChart {

  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-6px);
  }

  100% {
    transform: translateY(0px);
  }
}

#horoscopeChart {
  background: transparent;
}

.zodiac-bg {
  fill: rgba(18, 20, 46, 0.88);
  stroke: rgba(255, 205, 110, 0.8);
  stroke-width: 2;
}

.zodiac-inner {
  fill: rgba(10, 14, 35, 0.95);
  stroke: rgba(120, 170, 255, 0.65);
  stroke-width: 2;
}

.chart-bg {
  fill: rgba(8, 12, 30, 0.92);
  stroke: rgba(255, 205, 110, 0.75);
  stroke-width: 1.5;
}

.center-circle {
  fill: rgba(15, 20, 45, 0.95);
  stroke: rgba(255, 205, 110, 0.65);
  stroke-width: 1.5;
}

.zodiac-line,
.house-line {
  stroke: rgba(255, 205, 110, 0.38);
  stroke-width: 1;
}

.zodiac-sign {
  fill: #ffd36e;
  font-size: 25px;
  font-weight: bold;

  filter:
    drop-shadow(0 0 5px rgba(255, 211, 110, 0.7))
    drop-shadow(0 0 12px rgba(130, 90, 255, 0.45));
}

.house-number {
  fill: rgba(255, 220, 140, 0.9);
  font-size: 12px;
  font-weight: bold;
}

.angle-label {
  font-size: 16px;
  font-weight: 700;
}

.angle-label.asc {
  fill: #000000;
}

.angle-label.mc {
  fill: #000000;
}

.angle-label.des {
  fill: #000000;
}

.angle-label.ic {
  fill: #000000;
}

.planet-symbol {
  fill: #00000;
  font-size: 22px;
  font-weight: 600;

  filter:
    drop-shadow(0 0 1px rgba(255,255,255,0.35));
}

.aspect-line {
  stroke-width: 1.3;
  opacity: 0.55;
  stroke-dasharray: 300;
  stroke-dashoffset: 300;
  animation: aspectDraw 1.2s ease-out forwards;
}

.aspect-line.conjunction {
  stroke: rgba(255, 215, 100, 0.85);
}

.aspect-line.sextile {
  stroke: rgba(80, 210, 255, 0.8);
}

.aspect-line.square {
  stroke: rgba(255, 70, 95, 0.8);
}

.aspect-line.trine {
  stroke: rgba(70, 230, 130, 0.78);
}

.aspect-line.opposition {
  stroke: rgba(185, 100, 255, 0.85);
}

@keyframes aspectDraw {
  to {
    stroke-dashoffset: 0;
  }
}

.planet-group {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;

  animation:
    planetPop 0.8s cubic-bezier(0.18, 1.4, 0.4, 1) forwards;
}

@keyframes planetPop {

  0% {
    opacity: 0;
    transform: scale(0);
  }

  70% {
    opacity: 1;
    transform: scale(1.25);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* =========================
   テーブル
========================= */

.astro-tables {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  margin: 28px auto 0;
  max-width: 760px;
}

.astro-table-box {
  background: rgba(255,255,255,0.82);
  border: 1px solid rgba(20,20,40,0.25);
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}

.astro-table-title {
  background: #111833;
  color: #ffffff;
  text-align: center;
  padding: 10px;
  font-weight: bold;
  letter-spacing: 0.18em;
}

.astro-table-box table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.astro-table-box td {
  border: 1px solid rgba(50,50,70,0.22);
  padding: 8px 10px;
  font-size: 14px;
  color: #1f2230;
}

.planet-cell {
  width: 34px;
  text-align: center;
  font-size: 22px;
}

.planet-name {
  width: 50px;
  white-space: nowrap;
  font-size: 14px;
}

.planet-sign {
  width: 64px;
  text-align: center;
}

.planet-degree {
  width: 58px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.house-name {
  width: 70px;
  white-space: nowrap;
}

.house-sign {
  width: 72px;
  text-align: center;
}

.house-degree {
  width: 62px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
/* ==============================
   ホロスコープ全体
============================== */

.horoscope-svg {
  width: 100%;
  max-width: 520px;
  display: block;
  margin: 0 auto;
  overflow: visible;
}

/* ==============================
   外円
============================== */

.zodiac-bg {
  fill: #f4f1ea;

  stroke: #2d2a26;
  stroke-width: 2.2;
}

/* ==============================
   星座帯内側
============================== */

.zodiac-inner {
  fill: none;

  stroke: #2d2a26;
  stroke-width: 1.2;
}

/* ==============================
   中央円
============================== */

.chart-bg {
  fill: none;

  stroke: #2d2a26;
  stroke-width: 1.3;
}

.center-circle {
  fill: #f4f1ea;

  stroke: #2d2a26;
  stroke-width: 1.4;
}

/* ==============================
   星座区切り線
============================== */

.zodiac-line {
  stroke: #2d2a26;
  stroke-width: 0.2;
}

/* ==============================
   ハウス線
============================== */

.house-line {
  stroke: #2d2a26;
  stroke-width: 0.7;
}

/* ==============================
   ハウス番号
============================== */

.house-number {
  fill: #2d2a26;

  font-size: 12px;
  font-weight: 600;
}

/* ==============================
   星座画像
============================== */

.zodiac-icon {
  opacity: 0.92;
}

/* ==============================
   天体画像
============================== */

.planet-icon {
  filter:
    drop-shadow(0 0 1px rgba(0,0,0,0.15));
}

/* ==============================
   ASC / MC
============================== */

.angle-label {
  fill: #2d2a26;

  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

/* ==============================
   アスペクト線
============================== */

.aspect-line {
  stroke-width: 1.1;
  opacity: 0.75;
}

.aspect-line.conjunction {
  stroke: #444444;
}

.aspect-line.trine {
  stroke: #7b8f6a;
}

.aspect-line.square {
  stroke: #9b6a6a;
}

.aspect-line.opposition {
  stroke: #6d6d8d;
}

.aspect-line.sextile {
  stroke: #7d8d9d;
}
.zodiac-triangle {
  fill: #8a867d;
  stroke: #2d2a26;
  stroke-width: 0.8;
}

/* ==============================
   アスペクト線
============================== */

.aspect-line {
  stroke-width: 1.4;
  fill: none;
  opacity: 0.9;
}

/* 赤 */
.aspect-line.square {
  stroke: #d84c4c;
}

/* 緑 */
.aspect-line.trine {
  stroke: #45a857;
}

/* 青 */
.aspect-line.sextile {
  stroke: #4a7de0;
}

/* 紫 */
.aspect-line.opposition {
  stroke: #9b59d0;
}

/* 合 */
.aspect-line.conjunction {
  stroke: #666666;
}
/* ==============================
   アスペクト階段表だけ
============================== */

.aspect-table-box {
  grid-column: 1 / -1;
  margin-top: 22px;
}

.aspect-table-box .astro-table-title {
  /*background: #111833;*/
  background: #74b9ff;
  color: #ffffff;
  text-align: center;
  padding: 10px;
  font-weight: bold;
  letter-spacing: 0.18em;
}

.aspect-stair-table {
  border-collapse: collapse;
  margin: 14px auto 0;
}

.aspect-stair-table th,
.aspect-stair-table td {
  width: 38px;
  height: 32px;
  border: 1px solid rgba(50,50,70,0.28);
  text-align: center;
  vertical-align: middle;
  font-size: 18px;
  line-height: 1;
  color: #1f2230;
  background: rgba(255,255,255,0.82);
}

.aspect-side-planet,
.aspect-diagonal {
  background: rgba(245,245,245,0.9);
  font-weight: 700;
}

.aspect-hidden {
  border: none !important;
  background: transparent !important;
}

.aspect-cell.none {
  color: transparent;
}

.aspect-cell.square {
  color: #d84c4c;
}

.aspect-cell.trine {
  color: #45a857;
}

.aspect-cell.sextile {
  color: #4a7de0;
}

.aspect-cell.opposition {
  color: #9b59d0;
}

.aspect-cell.conjunction {
  color: #333333;
}
.aspect-cell.inconjunct {
  color: #c27b2f;
}

.zodiac-bg {
  fill: #f4f1ea;

  stroke: #8b5e3c;
  stroke-width: 0.7 !important;
}
.planet-icon {
  filter:
    brightness(0)
    saturate(100%);
}

/* 一番外側 */
.zodiac-bg {
  fill: #dfefff;

  stroke: #8b5e3c;
  stroke-width: 0.7 !important;
}

/* 真ん中の大きい円 */
.chart-bg {
  fill: #ffffff;

  stroke: #8b5e3c;
  stroke-width: 1.3;
}

/* 中心円 */
.center-circle {
  fill: #ffffff;

  stroke: #8b5e3c;
  stroke-width: 1.4;
}

.zodiac-icon {
  opacity: 0.92;

  filter:
    grayscale(1)
    brightness(0.55)
    contrast(0.9);
}


/*body.elementor-page-1176 .result-box {*/
/*  max-width: 750px;*/
/*  margin: 0 auto;*/
/*  padding: 40px 32px 50px;*/
/*  background: transparent !important;*/

/*  border: 1px solid rgba(160, 220, 255, 0.45);*/

/*  border-radius: 15px;*/

/*  box-shadow:*/
/*    0 0 18px rgba(120, 210, 255, 0.18),*/
/*    0 0 42px rgba(170, 235, 255, 0.12);*/
/*}*/

/*body.elementor-page-1176 .result-box h1 {*/
/*  text-align: center;*/
/*  display: inline-block;*/
/*  font-size: 28px;*/
/*  letter-spacing: 0.18em;*/
/*  color: #111833 !important;*/
  /*background: #111833;*/
/*  display: table;*/
/*margin: 0 auto 22px;*/
/*  padding: 12px 80px;*/
/*  border-radius: 4px;*/
/*  margin-bottom: 22px;*/
/*  text-shadow: none;*/
/*  font-weight: bold;*/
/*}*/
/*body.elementor-page-1176 .user-info {*/
/*  text-align: center;*/

/*  font-size: 13px;*/

/*  color: #ffffff !important;*/

/*  line-height: 1.8;*/

/*  margin-bottom: 26px;*/

/*  padding: 14px 18px;*/

/*  border: 1px solid  #111833;*/

/*  border-radius: 10px;*/

/*  background: #111833;*/

/*  text-shadow: none;*/

/*  box-shadow:*/
/*    0 0 14px rgba(120, 170, 255, 0.16);*/
/*}*/


body.elementor-page-1176 .user-info {
  width: 320px;

  margin: 0 auto 26px;

  padding: 14px 18px;

  border-radius: 12px;

  color: #555555 !important;

  background: #ffffff;

  border: 2px solid #c2cdff;

  box-shadow:
    0 0 18px rgba(120, 190, 255, 0.12);
}

.astro-table-title {
  /*background: #a8c7fa;*/
  background: #74b9ff;

  color: #ffffff;

  /*text-align: center;*/

  /*padding: 10px;*/

  /*font-weight: bold;*/

  /*letter-spacing: 0.18em;*/

  /*text-shadow:*/
  /*  0 1px 2px rgba(0,0,0,0.15);*/
}

.house-title {
  background: #74b9ff;

  color: #ffffff;
}








.share-cta-box {
  margin-top: 48px;
  padding: 32px 24px;
  border-radius: 24px;
  background: linear-gradient(
    135deg,
    rgba(255,215,0,0.12),
    rgba(255,255,255,0.04)
  );
  border: 1px solid rgba(255,215,0,0.25);
  text-align: center;
}

.share-cta-sub {
  margin: 0 0 10px;
  font-size: 13px;
  letter-spacing: 0.08em;
  color: #f2cf78;
}

.share-cta-title {
  margin: 0 0 24px;
  font-size: 24px;
  line-height: 1.6;
  color: #fff;
}

.share-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 260px;
  padding: 16px 28px;
  border-radius: 999px;
  background: linear-gradient(
    135deg,
    #c8922f 0%,
    #f2cf78 45%,
    #fff1b0 100%
  );
  color: #2b1209;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
  box-shadow: 0 10px 30px rgba(242,207,120,0.25);
}

.share-cta-btn:hover {
  transform: translateY(-2px);
}











/* ==============================
   ペアホロスコープ
============================== */

.pair-horoscope-wrap {

  width: 100%;
  max-width: 520px;

  margin: 40px auto;

  display: flex;
  flex-direction: column;
  align-items: center;

}

.pair-horoscope-svg {

  width: 100%;
  height: auto;

  overflow: visible;

}

/* ==============================
   円
============================== */

.pair-chart-outer,
.pair-chart-inner {

  fill: none;
  stroke: rgba(212, 175, 55, 0.9);
  stroke-width: 1.5;

}

/* ==============================
   サイン区切り線
============================== */

.pair-zodiac-line {

  stroke: rgba(212, 175, 55, 0.35);
  stroke-width: 1;

}

/* ==============================
   天体
============================== */

.pair-planet {

  fill: #d4af37;

  font-size: 18px;
  font-weight: 600;

}

/* 内側 */

.pair-planet-inner {

  fill: #f5d97a;

}

/* 外側 */

.pair-planet-outer {

  fill: #8fd3ff;

}

/* ==============================
   凡例
============================== */

.pair-horoscope-legend {

  margin-top: 18px;

  display: flex;
  gap: 24px;

  font-size: 13px;
  color: #d4af37;

}

.pair-horoscope-legend span {

  display: flex;
  align-items: center;
  gap: 6px;

}

.pair-planet {
  font-size: 18px;
  font-weight: 600;
}
.pair-planet-inner {
  fill: #d4af37;
}

.pair-planet-outer {
  fill: #6ec5ff;
}
.pair-horoscope-svg {
  overflow: visible;
}

.pair-zodiac-sign {
  fill: rgba(212, 175, 55, 0.9);
  font-size: 18px;
  font-weight: 600;
}

.pair-aspect-line {
  stroke-width: 1.5;
  opacity: 0.5;
}

.pair-aspect-conjunction {
  stroke: rgba(212, 175, 55, 0.75);
}

.pair-aspect-sextile,
.pair-aspect-trine {
  stroke: rgba(100, 190, 255, 0.55);
}

.pair-aspect-square,
.pair-aspect-opposition {
  stroke: rgba(255, 90, 90, 0.5);
}

.pair-house-line {

  stroke: rgba(255,255,255,0.18);
  stroke-width: 1;

}

.pair-house-number {

  fill: rgba(255,255,255,0.75);

  font-size: 12px;
  font-weight: 600;

}
.pair-house-number {
  fill: #ffffff !important;

  font-size: 11px !important;
  font-weight: 600;

  paint-order: stroke;

  stroke: rgba(0, 0, 0, 0.75);
  stroke-width: 2px;
}

.pair-house-line {
  stroke: rgba(212, 175, 55, 0.55) !important;
  stroke-width: 1.2px !important;
  opacity: 1 !important;
}
/*.pair-angle-line {*/

/*  stroke: rgba(212, 175, 55, 0.9);*/
/*  stroke-width: 1.5px;*/

/*}*/

.pair-angle-line {
  display: none;
}

.pair-angle-text {

  fill: rgba(40, 40, 40, 0.95);

  font-size: 11px;
  font-weight: 600;

}
.pair-planet-inner {

  fill: #38b26b;

  font-size: 20px;
  font-weight: 700;

}

.pair-planet-outer {

  fill: #d64545;

  font-size: 20px;
  font-weight: 700;

}

/* ==============================
相性ホロスコープ アニメーション
============================== */

.pair-horoscope-svg {
  opacity: 0;
  transform: scale(0.96);
  animation:
    pairHoroscopeFade 1s ease forwards;
}

@keyframes pairHoroscopeFade {

  from {
    opacity: 0;
    transform: scale(0.96);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }

}
/* ==============================
相性ホロスコープ アニメーション
============================== */

/* 全体表示 */
.pair-horoscope-svg {
  opacity: 0;
  animation: pairChartFadeIn 0.4s ease forwards;
}

/* 円が描かれる */
.pair-chart-outer,
.pair-chart-inner {
  stroke-dasharray: 950;
  stroke-dashoffset: 950;
  animation: pairCircleDraw 1.2s ease forwards;
}

.pair-chart-inner {
  animation-delay: 0.15s;
}

/* 星座線・ハウス線・角度線が伸びる */
.pair-zodiac-line,
.pair-house-line,
.pair-angle-line {
  stroke-dasharray: 200;
  stroke-dashoffset: 200;
  animation: pairLineDraw 0.8s ease forwards;
}

.pair-zodiac-line {
  animation-delay: 0.35s;
}

.pair-house-line {
  animation-delay: 0.55s;
}

.pair-angle-line {
  animation-delay: 0.7s;
}

/* アスペクト線 */
.pair-aspect-line {
  stroke-dasharray: 300;
  stroke-dashoffset: 300;
  opacity: 0;
  animation: pairAspectDraw 0.9s ease forwards;
  animation-delay: 0.9s;
}

/* 星座・ハウス番号・ASC等 */
.pair-zodiac-sign,
.pair-house-number,
.pair-angle-text {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: pairTextFade 0.5s ease forwards;
  animation-delay: 1s;
}

/* 天体が順番に出る */
.pair-planet {
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  animation: pairPlanetPop 0.45s ease forwards;
}

.pair-planet-inner {
  animation-delay: 1.15s;
}

.pair-planet-outer {
  animation-delay: 1.35s;
}

/* 凡例 */
.pair-horoscope-legend {
  opacity: 0;
  animation: pairChartFadeIn 0.5s ease forwards;
  animation-delay: 1.6s;
}


/* ==============================
keyframes
============================== */

@keyframes pairChartFadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes pairCircleDraw {
  from {
    stroke-dashoffset: 950;
  }

  to {
    stroke-dashoffset: 0;
  }
}

@keyframes pairLineDraw {
  from {
    stroke-dashoffset: 200;
  }

  to {
    stroke-dashoffset: 0;
  }
}

@keyframes pairAspectDraw {
  from {
    opacity: 0;
    stroke-dashoffset: 300;
  }

  to {
    opacity: 1;
    stroke-dashoffset: 0;
  }
}

@keyframes pairTextFade {
  from {
    opacity: 0;
    transform: scale(0.85);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes pairPlanetPop {
  from {
    opacity: 0;
    transform: scale(0.3);
  }

  70% {
    opacity: 1;
    transform: scale(1.15);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

.horoscope-toggle-wrap {
  margin-top: 40px;
  text-align: center;
}

.show-horoscope-btn {
  position: relative;
  padding: 14px 28px;
  border-radius: 16px;

  border: 1px solid rgba(255,255,255,0.18);

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,0.16),
      rgba(255,255,255,0.04)
    );

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  box-shadow:
    0 8px 32px rgba(0,0,0,0.28),
    inset 0 1px 1px rgba(255,255,255,0.18);

  color: #f4e7c3;

  font-size: 14px;
  letter-spacing: 0.08em;

  cursor: pointer;

  transition:
    transform 0.25s ease,
    background 0.25s ease,
    box-shadow 0.25s ease;
}

.show-horoscope-btn:hover {

  transform: translateY(-2px);

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,0.22),
      rgba(255,255,255,0.08)
    );

  box-shadow:
    0 12px 36px rgba(0,0,0,0.34),
    inset 0 1px 1px rgba(255,255,255,0.22);

}

.show-horoscope-btn:active {

  transform: scale(0.98);

}

.horoscope-detail-area {
  margin-top: 28px;
}
/* ==============================
   スマホ
============================== */

@media screen and (max-width: 768px) {

  .pair-horoscope-wrap {

    max-width: 92vw;

  }

  .pair-planet {

    font-size: 16px;

  }

}

/* =========================
   レスポンシブ
========================= */

@media (max-width:700px) {

  .astro-tables {
    grid-template-columns: 1fr;
  }

}

@media (max-width:640px){

body.elementor-page-1176 .result-page {
  padding: 28px 10px 48px;
}

body.elementor-page-1176 .result-box {
  padding: 26px 14px 34px;
}

body.elementor-page-1176 .result-box h1 {
  font-size: 22px;
}

body.elementor-page-1176 .result-main h2 {
  font-size: 18px;
}

body.elementor-page-1176 .fortune-section-result {
  padding: 18px 14px;
}

body.elementor-page-1176 .section-text,
body.elementor-page-1176 .section-text * {
  font-size: 14px;
  line-height: 2 !important;
}


.aspect-cell {
  font-size: 13px;
  line-height: 1.1;
}

.aspect-symbol {
  display: block;
  font-size: 18px;
  font-weight: 700;
}

.aspect-orb {
  display: block;
  font-size: 10px;
  opacity: 0.8;
}

.aspect-note {
  margin-top: 8px;
  text-align: center;
  font-size: 11px;
  color: #666;
}

.aspect-cell.square {
  color: #d84c4c;
}

.aspect-cell.trine {
  color: #45a857;
}

.aspect-cell.sextile {
  color: #4a7de0;
}

.aspect-cell.opposition {
  color: #9b59d0;
}

.aspect-cell.inconjunct {
  color: #c27b2f;
}

.aspect-cell.conjunction {
  color: #333333;
}

.aspect-cell.semi_sextile {
  color: #7d8d9d;
}

.aspect-cell.semi_square {
  color: #c75b5b;
}

.aspect-cell.quintile {
  color: #b38b2e;
}

.aspect-cell.sesquiquadrate {
  color: #c75b5b;
}

.aspect-cell.biquintile {
  color: #b38b2e;
}


/* ==============================
   スマホ縦向き
============================== */

@media (max-width: 768px) {

  .aspect-stair-table th,
  .aspect-stair-table td {
    width: 28px;
    height: 24px;

    font-size: 14px;
  }

  .aspect-side-planet,
  .aspect-diagonal {
    font-size: 16px;
  }

}

}/* End custom CSS *//* End custom CSS */