@charset "UTF-8";
/* ==========================================================================
 * PAGES - try_plan
 *
 * WordPressのページをカスタマイズ
 * ========================================================================== */
/* ==========================================================================
 * ABSTRACTS - variables
 *
 * テーマ全体で使用する変数を定義
 * ========================================================================== */
/* ==========================================================
  ▼ ブランドカラー
============================================================ */
/* ==========================================================
  ▼ プランカラー
============================================================ */
/* ==========================================================
  ▼ UIカラー（補助的なカラーパレット）
============================================================ */
/* ==========================================================
  ▼ フォント関連
============================================================ */
/* ==========================================================================
 * ABSTRACTS - mixins
 *
 * テーマで再利用可能な変数を定義
 * ========================================================================== */
/* ==========================================================
  ▼ @mixin respon($device) - デバイスごとのレスポンシブ処理
============================================================ */
/* ==========================================================
  ▼ @mixin clearfix - フロート解除用
============================================================ */
/* ==========================================================
  ▼ @mixin nested-ol - olの入れ子階層に応じた番号スタイル
============================================================ */
/* ==========================================================
  ▼ try_plan
============================================================ */
#try_plan .alert-corona {
  border: 2px solid #ffa34d;
  background-color: #ffffff;
  padding: 16px;
  text-align: center;
  margin-bottom: 24px;
}
#try_plan .alert-corona p {
  font-weight: bold;
}
#try_plan .alert-corona p span {
  color: #eb4f56;
  font-size: 1.4em;
}
#try_plan .card {
  background-color: #f5f8f5;
  border-radius: 8px;
  margin-bottom: 40px;
  overflow: hidden;
}
#try_plan .card .card-header {
  background-color: #0fa775;
  padding: 16px;
}
#try_plan .card .card-header h2 {
  color: #ffffff;
  text-align: center;
  margin-bottom: 0;
  font-size: 1em;
}
#try_plan .card .card-header h2 span {
  font-weight: bold;
  margin: 0 6px;
  font-size: 1.4em;
}
#try_plan .card .card-body {
  padding: 24px;
}
#try_plan .card .card-body h3 {
  font-weight: bold;
  text-align: center;
}
#try_plan .card .card-body .plan_wrap {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
  gap: 24px;
  margin-bottom: 24px;
}
@media screen and (max-width: 768px) {
  #try_plan .card .card-body .plan_wrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
  }
}
#try_plan .card .card-body .plan_wrap .plan_item {
  width: calc((100% - 24px) / 2);
  background-color: #ffffff;
  border-radius: 8px;
  padding: 24px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  #try_plan .card .card-body .plan_wrap .plan_item {
    width: 100%;
    padding: 16px;
  }
}
#try_plan .card .card-body .plan_wrap .plan_item h4 {
  color: #0fa775;
  font-weight: bold;
  margin-bottom: 16px;
}
#try_plan .card .card-body .plan_wrap .plan_item .hiyou {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
#try_plan .card .card-body .plan_wrap .plan_item .hiyou .cancel {
  color: #000000;
  text-decoration: line-through;
}
#try_plan .card .card-body .plan_wrap .plan_item .hiyou .arrow {
  color: #0fa775;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
#try_plan .card .card-body .plan_wrap .plan_item .hiyou .price {
  color: #eb4f56;
  font-weight: bold;
  font-size: 2em;
}
#try_plan .card .card-body .plan_wrap .plan_item .plan_info {
  display: -webkit-box;
  display: flex;
  gap: 16px;
}
#try_plan .card .card-body .plan_wrap .plan_item .plan_info .info_box {
  width: calc((100% - 16px) / 2);
  background-color: #fff2e9;
  padding: 8px;
  border-radius: 6px;
  text-align: center;
}
#try_plan .card .card-body .plan_wrap .plan_item .plan_info .info_box p {
  font-weight: bold;
  line-height: 1;
}
#try_plan .card .card-body .plan_wrap .plan_item .plan_info .info_box p strong {
  color: #eb4f56;
  font-size: 3rem;
  padding: 0 2px;
}
#try_plan .card .card-body .foot_txt {
  text-align: center;
}
#try_plan .card .card-body .foot_txt span {
  color: #0fa775;
  font-size: 1.6em;
  font-weight: bold;
  padding: 0 6px;
}
#try_plan .card .card-body .foot_txt small {
  display: block;
  color: #666666;
  margin-top: 16px;
}