@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&family=Zen+Old+Mincho&display=swap');
body{color: #000;}
.pc_only{display:block;}
.sp_only{display:none;}
span.textbr_none{display: inline-block;}
@media screen and (max-width: 767px) {
.pc_only{display: none;}
.sp_only{display: inline-block;}
}
/*-------------------------------------------
全体
-------------------------------------------*/
.kokushi_summarize h3{border-bottom: none;font-size: 4rem;font-weight: 600;text-align: center;margin-bottom: 2rem;}
p{line-height: 180%;font-size: 1.8rem;}
.kokushi_summarize img{width: 100%;}
.t_md{font-size: 2rem;}
.t_sm{font-size: 1.8rem;}
.t_right{text-align: right;}
.t_center{text-align: center;}
.c_orange{color: #e46a09;font-weight: 600;}
.c_gray{color: #999999!important;}
.indent{text-indent: -1em;display: block;padding-left: 1em;}
/*-------------------------------------------
FV
-------------------------------------------*/
.fvcon {margin: 0 auto;width: 100%;}
.fvimg {display: block;margin: 0 auto;width: 100%;}
/*-------------------------------------------
bg
-------------------------------------------*/
.wrap1100{max-width: 960px;margin: 0 auto;padding: 0 4%;}
.bg_pattern{background-image: url(../_img/bg.png);background-repeat: repeat;background-size: auto;position: relative;height: auto;padding: 80px 0;margin-bottom: 80px;}
.wrapper_about .wrap1100,.wrapper_about .wrap_price{background-color: #fff;border-radius: 20px;}
.bg_white{background-color: #fff;border-radius: 20px;margin-top: 100px;padding-top: 100px;padding-bottom: 100px;}
/*-------------------------------------------
about
-------------------------------------------*/
.wrapper_about{background-color: #e46a09;padding: 100px 0;}
.wrapper_about h3{text-align: left;}
.container{display: flex;}
.about_img{width: 35%;align-self: flex-end;}
.about_text{padding-left: 50px;padding-bottom: 50px;}
.wrapper_about .wrap1100{padding-top: 50px;}
/*-------------------------------------------
voice
-------------------------------------------*/
.wrap_voice{border: 4px solid #fedcc6;padding-top: 100px;padding-bottom: 100px;border-radius: 20px;background-color: #fff;}
.container_voice{flex-wrap: wrap;display: flex;}
.item_voice{width: 48%;margin-bottom: 15px;}
.bg_orange{background-color: #fff9e9;padding: 17px 20px;margin: 20px 20px 5px;}
.img_voice{width: 20%;margin: 0 auto;}
.item_voice .t_md{text-align: center;font-weight: 500;border-bottom: 1px solid #e46a09;padding-bottom: 8px;}
/*-------------------------------------------
target
-------------------------------------------*/
.wrapper_target{background-color: #fff9e9;}
.wrapper_target .container{padding: 120px 0;}
/*-------------------------------------------
price
-------------------------------------------*/
.wrap_price{padding-top: 100px;}
.wrap_price .width20{width: 20%;}
.wrap_price .width45{width: 45%;}
.wrap_price .width35{width: 35%;}
.wrap_price table{width: 100%;margin: 0px auto;border: 1px solid #ccc;border-collapse:collapse;font-size: 1.8rem;}
.wrap_price table tr{background-color: #fff;}
.wrap_price table tr th{background-color: #e6e6e6;border: 1px solid #ccc;padding: 10px 0;text-align: center;}
.wrap_price table tr td{border: 1px solid #e6e6e6;text-align: center;padding: 13px;}
.wrap_price table tr td.products{background-color: #666666;color: #fff;text-align: right;padding: 3rem 8rem;}
.wrap_price table tr td.products span,.wrap_price table tr td.products2 span{display: inline-block;background-color: #fff;color: #666666;font-weight: 600;width: fit-content;padding: 3px 16px;border-radius: 20px;margin: 5px 0;}
.wrap_price .contents ,.wrap_price .date {background-color:#f2f2f2;}
.wrap_price .date {text-align: right;}
.wrap_price .products2{background-color: #e46a09;color: #fff;text-align: right;padding: 1rem 8rem;}
.wrap_price table tr td.products2 span{color: #e46a09;}
.wrap_price .contents2{background-color: #fcf0e6;text-align: left;padding: 13px 50px;}
/*-------------------------------------------
sample
-------------------------------------------*/
/* .wrap_sample .item{width: 47%;} */
.youtube {width: 85%;aspect-ratio: 16 / 9;margin: 0 auto;text-align: center;}
.youtube iframe {width: 90%;height: 90%;background-size: cover;}
/*-------------------------------------------
購入するボタン
-------------------------------------------*/
div.buy-SNS_area{max-width:960px;margin:0 auto 100px auto;padding:0 4%;text-align:center;}
div.buy-SNS_area .notes{text-align: center;margin-top: 80px;}
/*----------------------------------------------------------------------------------------------------------------------------------------------------------------------------
レスポンシブ
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:768px) {
.wrapper_about{padding: 70px 0;}
h3{font-size: 3.6rem !important;line-height: 1.3;}
/* .container{padding: 0px;} */
.t_md{font-size: 1.8rem;}
p{line-height: 2.8rem;}
/* ------------------------------
FV
------------------------------ */
.fvcon {max-width: 100%;margin: 0 auto;}
.fvimg {display: block;max-width: 100%;margin: 0 auto;}
/* -----------------------------
about
------------------------------ */
.wrap1100{max-width: 100%;margin: 0 5%;padding: 0 5%;}
.wrapper_about .container {flex-direction: column-reverse;}
.wrapper_about .about_text{padding: 0px;}
.about_img{width: 57%;align-self: flex-end;transform: scale(-1, 1);}
/* ------------------------------
target
------------------------------ */
.wrapper_target .pc_only{display: none;}
.wrapper_target .sp_only{margin-bottom: 60px;margin-top: 60px;}
.wrapper_target .wrap1100{margin: 0px;padding: 0 5%}
.bg_pattern{padding: 70px 0;margin-bottom: 70px;}
.bg_white{margin-top: 70px !important;padding-top: 70px;padding-bottom: 7%;}
/* ------------------------------
voice
------------------------------ */
.container_voice{display: block;}
.item_voice{width: 100%;}
.wrap_voice{padding: 60px 0;}
/* ------------------------------
sample
------------------------------ */
.wrap_sample .container{display: block;}
.wrap_sample .container .item{width: 100%;}
.youtube{width: 100%!important;margin-bottom: 30px;text-align: center;}
/* ------------------------------
price
------------------------------ */
.wrap_price{padding-top: 60px;}
.wrap_price table,.wrap_price .contents2{font-size: 1.5rem;}
.wrap_price .sp_only{margin-bottom: 70px;}
.wrap_price table tr td.products,.wrap_price .products2{font-size: 1.5rem;padding: 20px 10px;text-align: center;}
.wrap_price table tr td{padding: 8px 8px;}
.wrap_price table tr th{font-size: 1.4rem;}
.wrap_price .contents2{padding: 8px 8px;font-size: 1.5rem;}
.wrap_price .width45{width: 40%;}
.wrap_price .width35{width: 30%;}
.wrap_price .width20{width: 30%;}
.wrap_price table tr td.products span, .wrap_price table tr td.products2 span{font-size: 1.5rem;padding: 3px 7px;}
}

/* ============================================================
  国試サマライズ 改修版 追加CSS
  既存の /products/kokushi_summarize/_css/style.css の「後」に読み込む
  （または style.css の末尾に追記）
  ・色／角丸／余白は既存に合わせる：オレンジ #e46a09、淡オレンジ #fcf0e6・#fedcc6、角丸20px
  ・ルートの文字サイズは10px（1rem = 10px）前提
============================================================ */

/* ---------- 共通ボタン ---------- */
.ks_btn{box-sizing:border-box;display:inline-block;background:#e46a09;color:#fff!important;font-weight:600;font-size:1.8rem;text-decoration:none;border-radius:40px;padding:1.4rem 3.2rem;text-align:center;box-shadow:0 4px 0 #b55306;transition:opacity .2s}
.ks_btn:hover{opacity:.85}
.ks_btn_sub{background:#fff;color:#e46a09!important;border:2px solid #e46a09;box-shadow:none}

/* ---------- FV直下 要約ボックス ---------- */
.ks_summary{background:#fcf0e6;padding:50px 0 60px}
.ks_summary .wrap1100{text-align:center}
.ks_eyebrow{display:inline-block;background:#fff;color:#e46a09;font-weight:600;font-size:1.5rem;border-radius:20px;padding:2px 18px;margin-bottom:1.2rem}
.ks_catch{font-size:3.2rem;font-weight:600;line-height:1.5;margin-bottom:2.4rem}
.ks_spec{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;list-style:none;margin:0 0 2.8rem;padding:0}
.ks_spec li{background:#fff;border-radius:10px;padding:8px 18px;font-size:1.6rem;font-weight:600}
.ks_spec li span{display:block;font-size:1.2rem;color:#999;font-weight:400;line-height:1.4}
.ks_pricebox{background:#fff;border:4px solid #fedcc6;border-radius:20px;padding:24px 30px;max-width:720px;margin:0 auto}
.ks_pricebox_lbl{font-size:1.6rem;font-weight:600;color:#e46a09}
.ks_pricebox_price{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:6px 16px}
.ks_strike{text-decoration:line-through;color:#999;font-size:1.6rem}
.ks_big{font-size:4.4rem;font-weight:700;line-height:1.2}
.ks_big small{font-size:1.6rem;font-weight:400}
.ks_save{background:#e46a09;color:#fff;font-weight:600;font-size:1.5rem;border-radius:6px;padding:2px 10px}
.ks_btns{display:flex;gap:14px;justify-content:center;margin-top:2rem}
.ks_btns .ks_btn{flex:1;max-width:300px}

/* ---------- 悩み→解決 ---------- */
.ks_pain{padding:90px 0}
.ks_pain_list{display:flex;gap:20px;list-style:none;padding:0;margin:3rem 0 0}
.ks_pain_list li{flex:1;border:4px solid #fedcc6;border-radius:20px;padding:24px;background:#fff}
.ks_pain_list li .t_md{font-weight:600;line-height:1.5;margin-bottom:1rem}
.ks_pain_list li .t_md::before{content:"";display:block;width:30px;height:4px;background:#e46a09;border-radius:2px;margin-bottom:1.2rem}
.ks_pain_list li p:not(.t_md){font-size:1.6rem;color:#666}
.ks_answer{margin:4rem auto 0;background:#e46a09;color:#fff;font-weight:600;font-size:2.2rem;text-align:center;border-radius:20px;padding:20px 24px;max-width:860px;line-height:1.6}

/* ---------- about内 ロードマップ ---------- */
.ks_flow{display:flex;gap:6px;list-style:none;padding:0;margin:2.4rem 0 0}
.ks_flow li{flex:1;background:#f2f2f2;color:#666;font-size:1.4rem;font-weight:600;text-align:center;border-radius:10px;padding:10px 4px;line-height:1.4;position:relative}
.ks_flow li span{display:block;font-size:1.2rem;font-weight:400}
.ks_flow li.is_me{background:#e46a09;color:#fff}
.ks_flow li+li::before{content:"›";position:absolute;left:-7px;top:50%;transform:translateY(-50%);color:#999;font-size:1.6rem}

/* ---------- 選ばれる3つの理由 ---------- */
.ks_point{padding:100px 0}
.ks_point_list{display:flex;gap:24px;margin-top:3rem}
.ks_point_item{flex:1;border-top:4px solid #e46a09;padding-top:1.6rem}
.ks_point_no{font-size:1.4rem;font-weight:700;color:#e46a09;letter-spacing:.15em}
.ks_point_item .t_md{font-weight:600;line-height:1.5;margin:.4rem 0 1rem}
.ks_point_item p:not(.t_md):not(.ks_point_no){font-size:1.6rem;color:#666}

/* ---------- 講座ラインナップ ---------- */
.ks_lineup{padding:0 0 100px}
.ks_lineup_list{display:flex;gap:16px;margin-top:3rem}
.ks_card{flex:1;border:4px solid #fedcc6;border-radius:20px;padding:22px 20px;display:flex;flex-direction:column;background:#fff}
.ks_card_role{display:inline-block;align-self:flex-start;background:#fcf0e6;color:#e46a09;font-size:1.3rem;font-weight:600;border-radius:20px;padding:0 12px}
.ks_card_name{font-size:2rem;font-weight:600;line-height:1.4;margin:1rem 0}
.ks_card dl{display:grid;grid-template-columns:4.5em 1fr;font-size:1.5rem;margin:0 0 1rem}
.ks_card dt{color:#999;padding:4px 0;border-bottom:1px dashed #e6e6e6}
.ks_card dd{margin:0;padding:4px 0;border-bottom:1px dashed #e6e6e6}
.ks_card_who{font-size:1.5rem;background:#f2f2f2;border-radius:10px;padding:8px 12px;flex:1;line-height:1.6}
.ks_card_price{font-size:2.4rem;font-weight:700;text-align:right;margin-top:1rem}
.ks_card_price small{font-size:1.3rem;font-weight:400}

/* ---------- 価格表の追加装飾 ---------- */
.wrap_price .ks_set_row td.products2{font-size:2rem}
.ks_rec{display:inline-block!important;background:#fff!important;color:#e46a09!important;font-size:1.3rem;border-radius:4px!important;padding:0 10px!important;margin:0 0 4px!important}
.ks_free{display:inline-block;background:#e46a09;color:#fff;font-size:1.1rem;font-weight:600;border-radius:4px;padding:0 6px;margin-left:4px;vertical-align:middle}
.wrap_price .contents small{font-size:1.2rem}
.ks_note{font-size:1.4rem;color:#666;margin-top:1rem}

/* ---------- 進め方モデル ---------- */
.ks_use{padding-top:100px}
.ks_use_list{display:flex;gap:16px;list-style:none;padding:0;margin:3rem 0 0}
.ks_use_list li{flex:1;background:#fcf0e6;border-radius:20px;padding:22px 20px}
.ks_use_when{font-size:1.4rem;font-weight:700;color:#e46a09}
.ks_use_list .t_md{font-weight:600;line-height:1.5;margin:.4rem 0 .8rem}
.ks_use_list li p:last-child{font-size:1.5rem;color:#666}

/* ---------- FAQ ---------- */
.ks_faq{padding-top:100px}
.ks_faq dl{max-width:800px;margin:3rem auto 0}
.ks_faq dt{font-size:1.8rem;font-weight:600;padding:1.6rem 0 .4rem 3.2rem;position:relative;border-top:1px solid #e6e6e6}
.ks_faq dt::before{content:"Q";position:absolute;left:0;color:#e46a09;font-weight:700}
.ks_faq dd{font-size:1.6rem;color:#666;margin:0;padding:0 0 1.6rem 3.2rem;line-height:1.8}

/* ---------- スマホ追従バー（PCでは非表示） ---------- */
.ks_sticky{display:none}

/* ============================================================
  スマホ（既存CSSのブレイクポイントに合わせる）
============================================================ */
@media screen and (max-width:768px){
  .ks_summary{padding:36px 0 44px}
  .ks_catch{font-size:2.4rem}
  .ks_spec{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .ks_spec li{font-size:1.4rem;padding:8px 10px}
  .ks_pricebox{padding:18px 14px}
  .ks_big{font-size:3.6rem}
  .ks_btns{flex-direction:column;align-items:stretch}
  .ks_btns .ks_btn{max-width:none}
  .ks_btn{font-size:1.6rem;padding:1.2rem 2rem}

  .ks_pain,.ks_point{padding:60px 0}
  .ks_pain_list,.ks_point_list,.ks_lineup_list,.ks_use_list{flex-direction:column;gap:14px}
  .ks_answer{font-size:1.8rem}

  .ks_flow{flex-wrap:wrap}
  .ks_flow li{flex:1 1 45%}
  .ks_flow li+li::before{display:none}

  .ks_lineup{padding-bottom:60px}
  .ks_use,.ks_faq{padding-top:60px}
  .ks_faq dt{font-size:1.6rem}
  .ks_faq dd{font-size:1.5rem}

  .ks_sticky{display:flex;align-items:center;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;border-top:1px solid #e6e6e6;padding:8px 12px;box-shadow:0 -2px 8px rgba(0,0,0,.06)}
  .ks_sticky_price{font-size:1.2rem;line-height:1.3;margin:0}
  .ks_sticky_price strong{display:block;font-size:2rem}
  .ks_sticky .ks_btn{flex:1;padding:1rem;box-shadow:none}
  body{padding-bottom:64px}
}

/* ---------- 【追加】購入の流れ（ストアで迷わせない） ---------- */
.ks_howto{padding:0 0 80px}
.ks_steps{display:flex;gap:24px;list-style:none;padding:0;margin:3rem 0 2rem;align-items:stretch}
.ks_steps li{flex:1;border:4px solid #fedcc6;border-radius:20px;padding:22px 20px;background:#fff;position:relative}
.ks_steps li.is_key{flex:1.4;border-color:#e46a09}
.ks_steps li+li::before{content:"";position:absolute;left:-19px;top:50%;transform:translateY(-50%);border-style:solid;border-width:9px 0 9px 12px;border-color:transparent transparent transparent #e46a09}
.ks_step_no{font-size:1.4rem;font-weight:700;color:#e46a09;letter-spacing:.1em}
.ks_steps .t_md{font-weight:600;line-height:1.5;margin:.4rem 0 1rem}
.ks_steps li p:not(.t_md):not(.ks_step_no){font-size:1.5rem;color:#666;line-height:1.7}
.ks_steps li p strong{color:#000}
.ks_thumb{border:1px solid #e6e6e6;border-radius:10px;overflow:hidden;margin:0 0 1rem}
.ks_thumb img{display:block;width:100%}
.wrap_price .contents2 small{font-size:1.3rem;color:#666}
@media screen and (max-width:768px){
  .ks_howto{padding-bottom:50px}
  .ks_steps{flex-direction:column;gap:28px}
  .ks_steps li+li::before{left:50%;top:-22px;transform:translateX(-50%);border-width:12px 9px 0 9px;border-color:#e46a09 transparent transparent transparent}
}

/* ---------- 【追加】セットの見せ方 ---------- */
.ks_pricebox_note{font-size:1.5rem;color:#666;margin-top:.6rem}
.ks_pricebox_note strong{color:#e46a09}
.ks_dup{font-size:1.3rem;color:#999;margin-top:1.2rem}
.ks_card_price{font-size:1.8rem!important;color:#666}
.ks_setbar{display:flex;gap:16px;margin-top:2.4rem;align-items:stretch}
.ks_setbar_main{flex:1.4;background:#e46a09;color:#fff;border-radius:20px;padding:26px 28px;text-align:center}
.ks_setbar_lbl{font-size:1.5rem;font-weight:600;opacity:.9}
.ks_setbar_name{font-size:2.6rem;font-weight:700;line-height:1.4}
.ks_setbar_price{display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:4px 14px;margin:.4rem 0}
.ks_setbar_price .ks_strike{color:#fde3cf}
.ks_setbar_price .ks_big{color:#fff}
.ks_setbar_note{display:inline-block;background:#fff;color:#e46a09;font-weight:600;font-size:1.5rem;border-radius:20px;padding:2px 14px;margin-bottom:1.6rem}
.ks_setbar_main .ks_btn{background:#fff;color:#e46a09!important;box-shadow:0 4px 0 #b55306}
.ks_setbar_single{flex:1;background:#f2f2f2;border-radius:20px;padding:22px 22px}
.ks_setbar_single_ttl{font-size:1.6rem;font-weight:600;margin-bottom:.6rem}
.ks_setbar_single ul{list-style:none;padding:0;margin:0 0 .8rem}
.ks_setbar_single li{font-size:1.5rem;padding:6px 0;border-bottom:1px dashed #ddd}
.ks_setbar_single p{font-size:1.4rem;color:#666}
@media screen and (max-width:768px){
  .ks_setbar{flex-direction:column}
  .ks_setbar_name{font-size:2.2rem}
}

/* ---------- 【追加】キャッチコピーはPCのみ中央揃え（スマホは現状のまま） ---------- */
@media screen and (min-width:769px){
  .ks_summary .ks_catch{text-align:center}
}

/* ---------- 【追加】最終の購入ボタン（ボタン文言を「サマライズを購入する」に統一） ---------- */
.ks_buyfinal{text-align:center;margin:0 auto 4rem}
.ks_btn_lg{font-size:2.2rem;min-width:420px;padding:1.8rem 4rem}
.ks_buyfinal_note{font-size:1.4rem;color:#666;margin-top:1.4rem;line-height:1.8}
.ks_buyfinal_note a{color:#e46a09;text-decoration:underline}

/* ---------- 【追加】スマホ調整 ---------- */
@media screen and (max-width:768px){
  /* 見出し内の改行はスマホでは外す */
  .ks_pcbr{display:none}
  /* 価格は縦並び */
  .ks_pricebox_price,.ks_setbar_price{flex-direction:column;align-items:center;gap:2px}
  /* 価格表：講座名と価格を縦に */
  .wrap_price table tr td.products span,.wrap_price table tr td.products2 span{display:block;width:fit-content;margin:6px auto 0}
  .wrap_price table tr td.products2 span.ks_rec{display:block!important;margin:0 auto 6px!important}
  /* 追従バーはボタンのみ */
  .ks_sticky .ks_btn{flex:1;width:100%;font-size:1.7rem;padding:1.2rem}
  /* 最終ボタン */
  .ks_btn_lg{min-width:0;width:100%;font-size:1.8rem;padding:1.6rem 2rem}
}