@charset "UTF-8";


@import url('https://fonts.googleapis.com/css2?family=LINE+Seed+JP:wght@400;700&display=swap');

.line-seed-jp-regular {
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.line-seed-jp-bold {
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  font-style: normal;
}


/* =========================
   PCのみ表示
========================= */
.pc-only {
  display: block;
}

@media (max-width: 768px) {
  .pc-only {
    display: none !important;
  }
}


/* =========================
   スマホのみ表示
========================= */
.sp-only {
  display: none;
}

@media (max-width: 768px) {
  .sp-only {
    display: block !important;
  }
}


/* =========================
   PCだけ border表示
========================= */

@media (max-width: 768px) {
  .border-pc-start {
    border-left: none !important;
  }

  .border-pc-end {
    border-right: none !important;
  }

  .border-pc-top {
    border-top: none !important;
  }

  .border-pc-bottom {
    border-bottom: none !important;
  }
}


/* =========================
   スマホだけ border表示
========================= */

@media (min-width: 769px) {
  .border-sp-start {
    border-left: none !important;
  }

  .border-sp-end {
    border-right: none !important;
  }

  .border-sp-top {
    border-top: none !important;
  }

  .border-sp-bottom {
    border-bottom: none !important;
  }
}









/* 薄い黄色の背景エリア */
.oc-campus-wrap {
  background: #fdf9e8;
  border-radius: 10px;

  padding: 20px 20px;

  box-shadow:
    0 8px 24px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.7);

  position: relative;
  overflow: hidden;
	margin-top: -20px;
	margin-bottom: 20px;
}

@media (max-width: 768px) {
.oc-campus-wrap {
	margin-top: 0px;
	padding: 10px 10px;
}
}

/* うっすら模様感 */
.oc-campus-wrap::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
      radial-gradient(
        circle at top right,
        rgba(255,255,255,.2),
        transparent 35%
      );

  pointer-events: none;
}



.oc-session-title{
	font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  font-size:25px;
  line-height:1.4;
  margin-bottom:40px;
  color:#333;
}

.oc-date-grid,
.oc-info-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
  margin-bottom:10px;
}





@media (max-width: 768px) {
.oc-session-title{
  font-size:17px;
}

.oc-date-grid,
.oc-info-grid{
  display:grid;
  grid-template-columns:repeat(1,1fr);
  gap:10px;
  margin-bottom:10px;
}


}

.oc-date-card,
.oc-info-card{
  background:#fff;
  border-radius:24px;
  padding:1em;
	margin-bottom: 1em;
}

.oc-date-card h3,
.oc-info-card h3{
	font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color:#4ea5f5;
  font-size:20px;
	margin-top: 10px;
  margin-bottom:16px;
}

.oc-date-card p,
.oc-info-card p{
  line-height:2;
  color:#4E4E4E;
}

.oc-note{
  margin-top:24px;
  text-align:center;
  font-weight:700;
  font-size:18px;
  color:#666;
}



/* 蛍光マーカー風
---------------------------------------------------- */

.marker.yellow2 {
	padding: 0.2em;
	color: inherit;
	background: linear-gradient(transparent 0%, #fbd583 0%);
}

.marker.yellow2.thin {
background-image:
    linear-gradient(
      transparent 58%,
      rgba(251,213,131,.85) 58%
    );

  background-repeat:no-repeat;
  background-size:100% 100%;

  padding:0 .08em;
}


/* =========================
   PC購入メリット
========================= */

.feature-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;

  margin-top:20px;
}

/* カード */

.feature-card{
  display:flex;
  align-items:flex-start;
  gap:20px;

  padding:24px;

  background:#fff;

  border-radius:20px;

  box-shadow:0 4px 12px rgba(0,0,0,0.06);

  transition:.25s ease;
}



/* アイコン */

.feature-icon{
  flex-shrink:0;

  width:72px;
  height:72px;

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

  border-radius:50%;

  background:#eef7ff;
}

.feature-icon i{
  font-size:32px;
  color:#5aa9f8;
}

/* テキスト */

.feature-title{
	font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin:0 0 10px;

  font-size:24px;
  line-height:1.4;

  color:#333;
}

.feature-text{
  margin:0;

  font-size:16px;
  line-height:1.9;

  color:#666;
}

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

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

  .feature-grid{
    grid-template-columns:1fr;
    gap:16px;
  }

  .feature-card{
    padding:18px;
    gap:14px;
  }

  .feature-icon{
    width:56px;
    height:56px;
  }

  .feature-icon i{
    font-size:24px;
  }

  .feature-title{
    font-size:22px;
  }

  .feature-text{
    font-size:14px;
    line-height:1.7;
  }

}


.accordion-toggle a.collapsed:after {
	top: 40%;
	right: 30px;
}

.accordion-toggle a:after {
	top: 40%;
	right: 30px;
}

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

.section-title{
  position: relative;

  display: inline-block;

  margin-bottom: 36px;

  font-size: clamp(22px, 2.4vw, 42px);
  line-height: 1.5;

  color:#333;
}



/* =========================
   全体
========================= */

.guide-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;

  max-width:1200px;
  margin:40px auto;
}

/* =========================
   ボタン
========================= */

#content a.guide-btn {
		position: relative;
		display: flex;
		align-items: center;
		gap: 24px;
		padding: 24px 28px;
		background: #fff;
		border: 4px solid #ddd;
		text-decoration: none;
		color: #222;
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
		transition: .25s ease;
}

.guide-btn:hover{
  transform:translateY(-4px);
  box-shadow:0 8px 18px rgba(0,0,0,0.14);
}

/* =========================
   アイコン
========================= */

.guide-btn .icon{
  flex-shrink:0;
  width:90px;
  height:90px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#fafafa;
}

.guide-btn .icon i{
  font-size:48px;
}

/* =========================
   テキスト
========================= */

.guide-btn .title{
  margin:0;

  font-size:25px;
  font-weight:700;
  line-height:1.4;
}

.guide-btn .sub{
  margin:8px 0 0;

  font-size:15px;
  line-height:1.5;

  color:#444;
}

/* =========================
   カラー
========================= */

.green{
  border-color:#43b649;
}

.green .icon i{
  color:#43b649;
}

.red{
  border-color:#ff7d6e;
}

.red .icon i{
  color:#ff7d6e;
}

.yellow{
  border-color:#f4b400;
}

.yellow .icon i{
  color:#f4b400;
}

.blue{
  border-color:#82d8ff;
}

.blue .icon i{
  color:#82d8ff;
}

.orange{
  border-color:#FB954E;
}

.orange .icon i{
  color:#FB954E;
}

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

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

  .guide-grid{
    grid-template-columns:1fr;
    gap:16px;

    margin:20px auto;
  }

 #content a.guide-btn{
    gap:16px;
    padding:18px;
		text-decoration: none;
  }

  .guide-btn .icon{
    width:64px;
    height:64px;
  }

  .guide-btn .icon i{
    font-size:30px;
  }

  .guide-btn .title{
    font-size:22px;
  }

  .guide-btn .sub{
    font-size:15px;
  }

}

/* =========================
   準備中
========================= */

.coming-soon{
  position:relative;

  border-color:#cfcfcf;
  border-style:dashed;

  background:#fafafa;

  opacity:.82;

  pointer-events:none;
}

/* ラベル */

.soon-badge{
  position:absolute;

  top:8px;
  left:45px;

  padding:5px 12px;

  background:#999;
  color:#fff;

  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;

  border-radius:999px;

  box-shadow:0 2px 6px rgba(0,0,0,0.15);

  z-index:3;
}

@media screen and (max-width:768px){
.soon-badge{
  position:absolute;

  top:8px;
  left:20px;

  padding:5px 12px;

  background:#999;
  color:#fff;

  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;

  border-radius:999px;

  box-shadow:0 2px 6px rgba(0,0,0,0.15);

  z-index:3;
}
}

/* アイコン */

.coming-soon .icon{
  background:#f0f0f0;
}

.coming-soon .icon i{
  color:#999;
}

/* テキスト */

.coming-soon .title{
  color:#777;
}

.coming-soon .sub{
  color:#999;
}





/* ==========================
   大学生のお昼ご飯、大学生の免許
========================== */

.lunch-box,.menkyo-box{
  background:#fffdf7;
  border:1px solid #ece6d5;

  border-radius:20px;

  padding:32px;

  box-shadow:0 4px 12px rgba(0,0,0,.05);
	margin-bottom: 10px;
}

/* 見出し上 */

.lunch-heading,.menkyo-heading{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
	margin-top: 0px;
}

.lunch-icon{
  width:38px;
  height:38px;
  border-radius:50%;
  background:#4d8fdd;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:16px;
}

.menkyo-icon {
		width: 38px;
		height: 38px;
		min-width: 38px;
		min-height: 38px;
		flex-shrink: 0;
		border-radius: 50%;
		background: #4d8fdd;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		font-size: 16px;
		font-weight: 700;
}

.lunch-sub,.menkyo-sub{
  color:#4d8fdd;
  font-size:24px;
  font-weight:400;
}

/* タイトル */

.lunch-title{
  margin:0 0 24px;

  color:#4d8fdd;

  font-size:32px;
  line-height:1.2;
  font-weight:700;
}



/* ポイント */

.lunch-points{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:20px;
}

.lunch-point{
  background:#fff7dc;

  border-radius:16px;

  padding:20px;

  text-align:center;
}

.point-icon{
  font-size:38px;
  color:#f0b437;

  margin-bottom:12px;
}

.lunch-point p{
  margin:0;

  font-size:18px;
  line-height:1.7;

  color:#555;
  font-weight:700;
}

/* ==========================
   SP
========================== */

@media(max-width:768px){

  .lunch-box,.menkyo-box{
    padding:20px;
  }

  .lunch-sub,.menkyo-sub{
    font-size:16px;
  }

  .lunch-title{
    font-size:34px;
  }

  .lunch-text p{
    font-size:15px;
    line-height:1.9;
  }

  .lunch-points{
    grid-template-columns:1fr;
    gap:12px;
  }

  .lunch-point{
    padding:16px;
  }

  .point-icon{
    font-size:28px;
  }
	.menkyo-icon {
		width: 30px;
		height: 30px;
		min-width: 30px;
		min-height: 30px;
		font-size: 16px;
		font-weight: 700;
}

  .lunch-point p{
    font-size:15px;
  }

}


/* --------------------
タイトル
-------------------- */

.schedule-title{
  font-size:32px;
  font-weight:700;
  color:#4ea5f5;

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

  margin-bottom:30px;
}

.schedule-title i{
  font-size:28px;
}

/* --------------------
2カラム
-------------------- */

.schedule-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
}

/* --------------------
見出し
-------------------- */

.schedule-head{
  color:#fff;
  text-align:center;

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

  border-radius:6px;

  padding:12px;
  margin-bottom:25px;
}

.home .schedule-head{
  background:#4ea5f5;
}

.alone .schedule-head{
  background:#63c06a;
}

/* --------------------
タイムライン
-------------------- */

.timeline{
  list-style:none;
  padding:0;
  margin:0;

  position:relative;
}

.timeline::before{
  content:"";

  position:absolute;
  left:8px;
  top:0;
  bottom:0;

  width:3px;
  background:#d8eefe;
}

/* 自宅外生 */

.alone .timeline::before{
  background:#d7f1da;
}

.timeline li{
  display:flex;
  gap:30px;

  position:relative;

  padding-left:30px;
  margin-bottom:20px;
}

.timeline li::before{
  content:"";

  width:16px;
  height:16px;

  border-radius:50%;

  position:absolute;
  left:-19px;
  top:8px;

  background:#4ea5f5;
}

.alone .timeline li::before{
  background:#63c06a;
}

/* --------------------
時間
-------------------- */

.time{
  min-width:70px;

  color:#4ea5f5;
  font-size:20px;
  font-weight:400;
  line-height:1.5;
}

.alone .time{
  color:#63c06a;
}



/* --------------------
スマホ
-------------------- */

@media(max-width:768px){

  .schedule-grid{
    grid-template-columns:1fr;
    gap:30px;
  }

  .schedule-title{
    font-size:24px;
  }

  .schedule-head{
    font-size:16px;
  }

  .time{
    min-width:60px;
    font-size:22px;
  }

  .text{
    font-size:15px;
  }

  .timeline li{
    gap:15px;
  }

}


.student-comment{

  margin-top:25px;

  padding:20px;

  background:#fdf9e8;

  border-radius:16px;
}

.student-comment h4{

  color:#4ea5f5;

  margin-bottom:10px;
}

.alone .student-comment h4{
  color:#63c06a;
	margin-bottom:10px;
}



/* ===================
   食事写真
=================== */
.meal-photo {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 16px;
		margin: 30px 0;
}
.meal-item {
		position: relative;
}
.meal-item img {
		width: 100%;
		aspect-ratio: 4 / 3;
		object-fit: cover;
		border-radius: 14px;
		box-shadow: 0 4px 10px rgba(0, 0, 0, .08);
}
.meal-label {
		position: absolute;
		top: -16px; /* 画像に少しかぶせる */
		left: 50%;
		transform: translateX(-50%);
		display: inline-block;
		min-width: 92px;
		text-align: center;
		padding: 5px 10px;
		color: #fff;
		font-size: 12px;
		font-weight: 700;
		border-radius: 999px;
		z-index: 10;
		box-shadow: 0 3px 8px rgba(0, 0, 0, .12);
}
.breakfast {
		background: #f6b94b;
}
.lunch {
		background: #4ea5f5;
}
.dinner {
		background: #63c06a;
}
@media(max-width:768px) {
		.meal-photo {
				grid-template-columns: repeat(3, 1fr);
		}
}



/*=================================
表示切替
=================================*/
.pc-only {
		display: block;
}
.sp-only {
		display: none;
}
@media(max-width:768px) {
		.pc-only {
				display: none;
		}
		.sp-only {
				display: block;
		}
}
/*=================================
PC比較表
=================================*/
.license-table {
		margin: 40px 0;
}
.license-table table {
		width: 100%;
		border-collapse: separate;
		border-spacing: 0;
		overflow: hidden;
		border-radius: 20px;
		box-shadow: 0 8px 20px rgba(0, 0, 0, .08);
}
#content .license-table table th, #content .license-table table td {
		padding: 15px;
		vertical-align: top;
}
.license-table thead th {
		color: #fff;
		font-size: 28px;
		text-align: center;
}
.license-table thead th:first-child {
		background: #efe9da;
		width: 220px;
}
.commute-head {
		background: #5aa9f8;
}
.camp-head {
		background: #67c26f;
}
.license-table tbody th {
		background: #eef6ff;
		font-size: 15px;
		color: #333;
		width: 220px;
}
.license-table tbody td {
		background: #fff;
		line-height: 1.9;
		border-left: 1px solid #eee;
		border-top: 1px solid #eee;
		font-size: 0.9em;
}
.license-table small {
		display: block;
		color: #777;
		margin-top: 5px;
}
/*=================================
スマホカード
=================================*/
.license-card {
		background: #fff;
		border-radius: 20px;
		overflow: hidden;
		margin-bottom: 30px;
		box-shadow: 0 8px 20px rgba(0, 0, 0, .08);
}
.license-card h3 {
		margin: 0;
		padding: 20px;
		color: #fff;
		text-align: center;
		font-size: 28px;
}
.license-card.commute h3 {
		background: #5aa9f8;
}
.license-card.camp h3 {
		background: #67c26f;
}
.license-card .item {
		padding: 18px 22px;
		border-bottom: 1px solid #eee;
}
.license-card .item:last-child {
		border: none;
}
.license-card span {
		display: block;
		font-weight: bold;
		color: #555;
		margin-bottom: 8px;
		font-size: 17px;
}
.license-card p {
		margin: 0;
		line-height: 1.8;
}
/*=================================
レスポンシブ
=================================*/
@media(max-width:768px) {
		.license-card h3 {
				font-size: 24px;
		}
		.license-card {
				margin-bottom: 20px;
		}
}

/*====================================
運転免許大学生協申込み
====================================*/
.coop-driver {
		background: #fff;
		border-radius: 24px;
		padding: 50px;
		margin: 70px 0;
		box-shadow: 0 8px 20px rgba(0, 0, 0, .08);
		text-align: center;
}
.coop-driver-title {
		font-size: 32px;
		font-weight: bold;
		color: #4d8fdd;
		margin-bottom: 20px;
}
.coop-driver-title i {
		margin-right: 10px;
		color: #67c26f;
}
.coop-driver-lead {
		font-size: 18px;
		line-height: 2;
		color: #555;
		margin-bottom: 45px;
}
/*======================
メリット
======================*/
.coop-merit {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 25px;
		margin-bottom: 45px;
}
.merit-item {
		background: #f8fbff;
		border-radius: 18px;
		padding: 30px 20px;
}
.merit-item i {
		font-size: 42px;
		color: #4d8fdd;
		margin-bottom: 18px;
}
.merit-item h4 {
		font-size: 18px;
		margin-bottom: 15px;
		color: #333;
}
.merit-item p {
		line-height: 1.8;
		color: #666;
}

/*======================
スマホ
======================*/
@media(max-width:768px) {
		.coop-driver {
				padding: 30px 20px;
		}
		.coop-driver-title {
				font-size: 25px;
				line-height: 1.5;
		}
		.coop-driver-lead {
				font-size: 16px;
		}
		.coop-merit {
				grid-template-columns: 1fr;
				gap: 18px;
		}
		.merit-item {
				padding: 25px 20px;
		}
		.merit-item h4 {
				font-size: 18px;
		}

}



/*=========================================
比較セクション
=========================================*/

.compare-section{

    max-width:1760px;
    margin:auto;
    padding:80px 20px;

}

.compare-title{

    text-align:center;
    font-size:42px;
    font-weight:700;
    color:#4d8fdd;
    margin-bottom:15px;

}

.compare-title i{

    margin-right:10px;
    color:#f3b63f;

}

.compare-subtitle{

    text-align:center;
    color:#666;
    font-size:18px;
    margin-bottom:50px;

}

/*=========================================
PC比較
=========================================*/

.compare-layout{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:40px;

}

.compare-panel{

    background:#fff;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.compare-panel-head{

    padding:18px;
    text-align:center;
    color:#fff;
    font-size:30px;
    font-weight:700;

}

.compare-table{

    width:100%;
    border-collapse:collapse;

}

/* PCでは何もしない */
compare-table th.sp-w80{
    width:auto;
    min-width:auto;
}

/* スマホだけ適用 */
@media (max-width:768px){

.compare-table th.sp-w80{

    width:80px;

}
}

.compare-table th{

    padding:18px;
    font-size:18px;
    border:1px solid #ddd;

}

.compare-table th{

    padding:18px;
    font-size:18px;
    border:1px solid #ddd;

}

.compare-table td{

    padding:25px 15px;
    text-align:center;
    font-size:15px;
    border:1px solid #ddd;

}

.compare-table strong{

    display:block;
    font-size:34px;

}

/*=========================================
テーマカラー
=========================================*/

.theme-blue .compare-panel-head{

    background:#4d8fdd;

}

.theme-blue .compare-table th{

    background:#eef5ff;

}

.theme-blue .compare-table strong,
.theme-blue .compare-value{

    color:#4d8fdd;

}

.theme-blue .compare-card-item{

    background:#f8fbff;

}



.theme-green .compare-panel-head{

    background:#67c26f;

}

.theme-green .compare-table th{

    background:#eef9ef;

}

.theme-green .compare-table strong,
.theme-green .compare-value{

    color:#67c26f;

}

.theme-green .compare-card-item{

    background:#f4fbf4;

}

/*=========================================
スマホカード
=========================================*/

.pc-view{

    display:block;

}

.sp-view{

    display:none;

}

.compare-card{

    background:#fff;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 6px 18px rgba(0,0,0,.08);
    margin-bottom:35px;

}

.compare-card-grid{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
    padding:20px;

}

.compare-card-item{

    padding:20px;
    border-radius:15px;
    text-align:center;

}

.compare-label{

    display:block;
    margin-bottom:8px;
    font-size:14px;
    color:#666;

}

.compare-value{

    display:block;
    font-size:28px;
    font-weight:700;

}

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

@media(max-width:768px){

    .pc-view{

        display:none;

    }

    .sp-view{

        display:block;

    }

    .compare-title{

        font-size:28px;

    }

    .compare-card-grid{

        grid-template-columns:1fr;

    }

}


/*==================================================
比較テーブル 共通
==================================================*/

.compare-section{
    max-width:1760px;
    margin:80px auto;
    padding:0 20px;
}

.compare-title{
    font-size:42px;
    font-weight:700;
    color:#4d8fdd;
    text-align:center;
    margin-bottom:15px;
    line-height:1.4;
}

.compare-title i{
    color:#f3b63f;
    margin-right:12px;
}

.compare-subtitle{
    text-align:center;
    color:#666;
    font-size:18px;
    line-height:1.8;
    margin-bottom:50px;
}

/*==================================================
レイアウト
==================================================*/

.compare-layout{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    column-gap:40px; /* 横だけ */
    row-gap:0;       /* 縦はなし */

}

.compare-panel{

    background:#fff;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
		margin-bottom: 20px;

}

.compare-panel-head{

    padding:18px;
    color:#fff;
    text-align:center;
    font-size:30px;
    font-weight:700;

}

/*==================================================
テーマカラー
==================================================*/

.theme-blue .compare-panel-head{
    background:#4d8fdd;
}

.theme-green .compare-panel-head{
    background:#67c26f;
}

/*==================================================
スクロール
==================================================*/

.compare-scroll{

    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;

}

/*==================================================
スクロールバー
==================================================*/

.compare-scroll::-webkit-scrollbar{

    height:10px;

}

.compare-scroll::-webkit-scrollbar-track{

    background:#ececec;

}

.compare-scroll::-webkit-scrollbar-thumb{

    background:#4d8fdd;
    border-radius:30px;

}

.theme-green .compare-scroll::-webkit-scrollbar-thumb{

    background:#67c26f;

}

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

#content table.compare-table{

    width:100%;
    border-collapse:collapse;
    table-layout:fixed;
		margin-bottom: 0px;

}

.compare-table th,
.compare-table td{

    border:1px solid #ddd;
    padding:18px 16px;
    text-align:center;
    vertical-align:middle;

}

/*==================================================
ヘッダー
==================================================*/

.compare-table thead th{

    background:#eef5ff;
    font-size:17px;
    font-weight:700;

}

.theme-green .compare-table thead th{

    background:#eef9ef;

}

@media(max-width:768px){
.compare-table thead th{

    font-size:13px;

}
}

/*==================================================
項目列
==================================================*/

.compare-table tbody th{

    width:320px;
    min-width:320px;

    background:#fafafa;

    text-align:left;
    font-size:14px;
    font-weight:600;
    line-height:1.8;

}

@media(max-width:768px){
.compare-table tbody th{
    font-size:13px;

}
}

/*==================================================
データ
==================================================*/

#content table.compare-table td{

    min-width:115px;
    font-size:15px;
		vertical-align: middle;

}

/*==================================================
大学入学後の生活費だけ
==================================================*/

.living-cost .compare-table td:last-child{
    text-align:right;
    font-variant-numeric: tabular-nums;
}

.col-narrow {
 width: 80px;
 flex-shrink: 0;
}

.col-grow {
  flex: 1; /* 残りの幅を均等に割り振る */
}

@media(max-width:768px){
#content table.compare-table td{

    font-size:13px;

}
}

/*==================================================
合計
==================================================*/

.compare-total th{

    background:#fff4d9 !important;
    font-size:18px;

}

.compare-total td{

    background:#fffdf8;

}

.compare-total strong{

    display:block;
    font-size:38px;
    line-height:1;
    margin-bottom:5px;

}

.compare-total span{

    font-size:15px;
    color:#666;

}

.theme-blue .compare-total strong{

    color:#4d8fdd;

}

.theme-green .compare-total strong{

    color:#67c26f;

}

/*==================================================
後期納付
==================================================*/

.compare-note th{

    background:#fff9e8 !important;
    color:#856404;

}

.compare-note td{

    background:#fffef6;

}



/*==================================================
スマホ案内
==================================================*/

.compare-scroll::after{

    content:"";
    display:none;

}

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

@media(max-width:992px){

    .compare-layout{

        grid-template-columns:1fr;
        gap: 0 35px;

    }

}

@media(max-width:768px){

    .compare-section{

        margin:50px auto;

    }

    .compare-title{

        font-size:30px;

    }

    .compare-subtitle{

        font-size:15px;
        margin-bottom:30px;

    }

    .compare-panel-head{

        font-size:24px;

    }



    .compare-table th,
    .compare-table td{

        padding:14px 12px;
        font-size:13px;

    }

    .compare-table tbody th{

        width:260px;
        min-width:260px;
        font-size:14px;

    }



}

.compare-title {
		text-align: center;
		color: #4d8fdd
}
.compare-title i {
		color: #f3b63f
}
.compare-subtitle {
		text-align: center;
		color: #666
}
.compare-layout {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0 35px;
}
.compare-panel {
		background: #fff;
		border-radius: 24px;
		overflow: hidden;
		box-shadow: 0 8px 24px rgba(0, 0, 0, .08)
}
.compare-panel-head {
		padding: 18px;
		text-align: center;
		color: #fff;
		font-size: 28px;
		font-weight: 700
}
.theme-blue .compare-panel-head {
		background: #4d8fdd
}
.theme-green .compare-panel-head {
		background: #67c26f
}
.compare-scroll {
		overflow-x: auto
}
.compare-table {
		width: 100%;
		border-collapse: collapse
}
.compare-table th, .compare-table td {
		border: 1px solid #ddd;
		padding: 13px
}
.compare-table thead th {
		background: #eef5ff
}
.theme-green .compare-table thead th {
		background: #eef9ef
}
.compare-table tbody th {
		text-align: left;
		background: #fafafa
}
.compare-total th {
		background: #fff4d9
}
.compare-total strong {
		display: block;
		font-size: 28px;
		color: #4d8fdd
}
.theme-green .compare-total strong {
		color: #67c26f
}
.point-box {
		margin-top: 40px;
		background: #fff8e8;
		padding: 24px;
		border-left: 6px solid #f3b63f;
		border-radius: 16px
}
@media(max-width:768px) {
		.compare-layout {
				grid-template-columns: 1fr
		}
		.compare-panel-head {
				font-size: 22px
		}
		.compare-total strong {
		display: block;
		font-size: 18px;
		color: #4d8fdd
}
}



/*==================================================
お部屋探しのポイント
==================================================*/
/*.guide-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 30px;
		margin-top: 20px;
}*/
.guide-head {
		display: flex;
		align-items: center;
		gap: 18px;
		margin-bottom: 10px;
}
/*====================*/
.guide-card {
		background: #fff;
		border-radius: 25px;
		padding: 15px;
		border: 2px solid #eef2f6;
		transition: .3s;
}

.guide-wide{
    grid-column:1 / -1;
}

/*====================*/
.guide-icon {
		font-size: 35px;
		margin-bottom: 5px;
}
.guide-card h3 {
		font-size: 28px;
		margin-bottom: 15px;
		font-weight: 700;
}
.guide-card h4 {
		font-size: 20px;
		margin-bottom: 20px;
		font-weight: 700;
}
.guide-card p {
		line-height: 2;
		margin-bottom: 18px;
}
.guide-card ul {
		margin: 0;
		padding-left: 22px;
}
.guide-card li {
		margin-bottom: 18px;
		line-height: 1.8;
}
.guide-point {
		background: #f8fafc;
		border-left: 5px solid;
		padding: 15px;
		border-radius: 10px;
		font-weight: 700;
}
.guide-link {
		display: inline-block;
		margin-top: 20px;
		font-weight: 700;
		text-decoration: none;
}
.guide-link i {
		margin-right: 8px;
}
/*====================
色
====================*/
.point-blue {
		border-color: #dbeafe;
}
.point-blue h3, .point-blue h4, .point-blue .guide-icon,.point-blue i.icon_p {
color: #4d8fdd;
}

.point-blue .guide-link {
		background-color: #4d8fdd;
		color: #fff;
}
.point-blue .guide-point {
		border-color: #4d8fdd;
}
/*====================*/
.point-green {
		border-color: #dff4df;
}
.point-green h3, .point-green h4, .point-green .guide-icon ,.point-green i.icon_p {
		color: #67c26f;
}
.point-green .guide-link {
		background-color: #67c26f;
		color: #fff;
}
.point-green .guide-point {
		border-color: #67c26f;
}
/*====================*/
.point-yellow {
		border-color: #ffe7b4;
}
.point-yellow h3, .point-yellow h4, .point-yellow .guide-icon,.point-yellow i.icon_p {
		color: #f3b63f;
}
.point-yellow .guide-link {
		background-color: #f3b63f;
		color: #fff;
}
.point-yellow .guide-point {
		border-color: #f3b63f;
}
/*====================*/
.point-pink {
		border-color: #ffe0e7;
}
.point-pink h3, .point-pink h4, .point-pink .guide-icon ,.point-pink i.icon_p {
		color: #df7c8c;
}
.point-pink .guide-link {
		background-color: #df7c8c;
		color: #fff;
}
.point-pink .guide-point {
		border-color: #df7c8c;
}
/*==================================================
スマホ
==================================================*/
@media(max-width:1200px) {
/*		.guide-grid {
				grid-template-columns: repeat(2, 1fr);
		}*/
		
		.guide-grid .w100 {
		width: 100%;
		}
}
@media(max-width:768px) {
/*		.guide-grid {
				grid-template-columns: 1fr;
				gap: 20px;
		}*/
		.guide-card {
				padding: 25px;
		}
		.guide-icon {
				font-size: 38px;
		}
		.guide-card h3 {
				font-size: 23px;
		}
		.guide-card h4 {
				font-size: 19px;
		}
}


/*==================================================
優先順位（Priority）
==================================================*/ 

/*==================================================
カード
==================================================*/
.priority-card {
		display: grid;
		grid-template-columns: 430px 1fr;
		gap: 40px;
		margin-top: 50px;
		background: #fff;
		border-radius: 30px;
		overflow: hidden;
		box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
}
/*==================================================
左
==================================================*/
.priority-left {
		background: linear-gradient(180deg, #4d8fdd, #6aa8ef);
		color: #fff;
		padding: 45px;
		display: flex;
		flex-direction: column;
		justify-content: center;
}
.priority-number {
		margin-bottom: 30px;
}
.priority-number span {
		display: block;
		font-size: 15px;
		letter-spacing: 2px;
		opacity: .9;
}
.priority-number strong {
		display: block;
		font-size: 80px;
		line-height: 1;
		font-weight: 700;
}
.priority-left h3 {
		font-size: 34px;
		line-height: 1.5;
		margin-bottom: 25px;
}
.priority-text {
		font-size: 17px;
		line-height: 2;
		margin-bottom: 35px;
}
/*==================================================
親子で相談
==================================================*/
.priority-family {
		display: flex;
		gap: 20px;
		background: rgba(255, 255, 255, .15);
		padding: 25px;
		border-radius: 20px;
}
.family-icon {
		width: 70px;
		height: 70px;
		border-radius: 50%;
		background: rgba(255, 255, 255, .25);
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 30px;
		flex-shrink: 0;
}
.priority-family strong {
		display: block;
		font-size: 20px;
		margin-bottom: 10px;
}
.priority-family p {
		line-height: 1.9;
		font-size: 15px;
}
/*==================================================
右
==================================================*/
.priority-right {
		padding: 45px;
}
.priority-right h4 {
		font-size: 28px;
		color: #4d8fdd;
		margin-bottom: 30px;
}
.priority-right h4 i {
		margin-right: 10px;
}
/*==================================================
4項目
==================================================*/
.priority-grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
		margin-bottom: 35px;
}
.priority-item {
		display: flex;
		align-items: center;
		gap: 20px;
		padding: 22px;
		border-radius: 20px;
		background: #fff;
}
.priority-icon {
		width: 65px;
		height: 65px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		font-size: 28px;
		flex-shrink: 0;
}
.priority-item h5 {
		font-size: 22px;
		margin-bottom: 8px;
}
.priority-item p {
		font-size: 15px;
		color: #666;
		line-height: 1.7;
}
/*==================================================
色
==================================================*/
.priority-icon.blue {
		background: #4d8fdd;
}
.priority-icon.green {
		background: #67c26f;
}
.priority-icon.yellow {
		background: #f3b63f;
}
.priority-icon.pink {
		background: #df7c8c;
}
/*==================================================
条件
==================================================*/


.check-title {
		font-size: 22px;
		font-weight: 700;
		margin-bottom: 18px;
}
.check-title i {
		margin-right: 8px;
}
.priority-check ul {
		margin: 0;
		padding-left: 22px;
}
.priority-check li {
		margin-bottom: 12px;
		line-height: 1.8;
}
/*==================================================
ポイント
==================================================*/
.priority-note {
		display: flex;
		gap: 20px;
		background: #f8fafc;
		border-left: 6px solid #67c26f;
		padding: 25px;
		border-radius: 20px;
}
.priority-note i {
		font-size: 28px;
		color: #67c26f;
		margin-top: 3px;
		flex-shrink: 0;
}
.priority-note strong {
		display: block;
		font-size: 22px;
}
.priority-note p {
		line-height: 2;
}
/*==================================================
レスポンシブ
==================================================*/
@media(max-width:1200px) {
		.priority-card {
				grid-template-columns: 1fr;
		}
}
@media(max-width:768px) {
		.priority-section {
				padding: 20px 20px;
		}
		.priority-left, .priority-right {
				padding: 28px;
		}
		.priority-number strong {
				font-size: 56px;
		}
		.priority-left h3 {
				font-size: 26px;
		}
		.priority-right h4 {
				font-size: 22px;
		}
		.priority-grid {
				grid-template-columns: 1fr;
		}
		.priority-check-wrap {
				grid-template-columns: 1fr;
		}
		.priority-family {
				flex-direction: column;
				text-align: center;
				align-items: center;
		}
		.priority-note {
				flex-direction: column;
		}
		.priority-item {
				padding: 18px;
		}
		.priority-icon {
				width: 52px;
				height: 52px;
				font-size: 22px;
		}
		.priority-item h5 {
				font-size: 18px;
		}
		.check-title {
				font-size: 18px;
		}
		.priority-note strong {
				font-size: 18px;
		}
}