@charset "utf-8";

/* =========================
   学校リスト（共通）
   ========================= */
#school-list{width:100%;margin:auto;}
#school-list .inner{max-width:1000px;margin:0 auto;padding:30px 0;}
#school-list .list ul{margin:0;padding:0;list-style:none;}

#school-list .list ul li{
  box-sizing:border-box;
  background:#fff;
  border:1px solid #dbe1e8;
  height:70px;                       /* PC/Tab 高さ固定 */
  font-size:16px;
}

/* 画像 */
#school-list .list ul li .img{width:70px;float:left;margin:4px;} /* PC: 左右4px */
#school-list .list ul li .img img{width:100%;height:auto;display:block;}

/* タイトル・本文（共通） */
#school-list .list ul li .p-title{overflow:hidden;text-align:left;}
#school-list .list ul li .p-title h3{
  float:left;                        /* 画像の直右に寄せる（PC/Tab） */
  margin:10px 0 0 5px;
  font-size:16px;font-weight:bold;line-height:1.3;
}
#school-list .list ul li p{
  margin:0 10px 10px 83px;           /* PC既定：70 + 4(左M) + 4(右M) + 5 */
  font-size:11px;line-height:1.2;
}

/* 改行制御 */
@media (min-width:760px){ #school-list .list ul li p .br-pc{display:block;} }
@media (max-width:759px){ #school-list .list ul li p .br-pc{display:inline;} }

/* =========================
   スマホ（～759px）：元CSS方式＋中央寄せの完全解除
   ========================= */
@media (max-width:759px){
  #school-list .inner{width:95%;padding:0;}

  /* 親で center を確実に無効化 */
  #school-list .list ul{display:block;}
  #school-list .list ul li{
    display:block; width:100%; height:50px;
    margin:0 0 5px 0; border:1px solid #999;
    text-align:left !important;                 /* ← ここが肝 */
  }

  /* 画像40px＋左右5px */
  #school-list .list ul li .img{width:50px;margin:5px;}

  #school-list .list ul li .p-title{overflow:hidden; text-align:left !important;}
  #school-list .list ul li .p-title h3{
    float:none !important;                      /* ← float混入を排除 */
    display:block !important;
    margin:6px 0 2px 2px !important;            
    font-size:15px; line-height:1.3;
  }
  #school-list .list ul li p{
    margin:0 5px 5px 6px !important;           /* 左位置55px／h3との間隔 */
    font-size:12px; line-height:1.2;
  }
}

/* =========================
   タブレット（760–999px）：PCと同じ箱300px×2列
   ========================= */
@media (min-width:760px) and (max-width:999px){
  #school-list .inner{width:760px;margin:0 auto;padding:15px 0;}
  #school-list .list ul{display:flex;flex-wrap:wrap;column-gap:10px;row-gap:10px;}
  #school-list .list ul li{width:300px;height:60px;margin:0;}

  #school-list .list ul li .img{width:50px;margin:5px;}     /* 左右5px */
  #school-list .list ul li .p-title h3{margin:7px 0 0 5px;font-size:14px;}
  #school-list .list ul li p{margin:2px 8px 10px 65px;}     /* 50 + 5(左M) + 5(右M) + 5 */
}

/* =========================
   PC（>=1000px）：3列（flexで均一な間隔）
   ========================= */
@media (min-width:1000px){
  #school-list .inner{max-width:1000px;}
  #school-list .list ul{display:flex;flex-wrap:wrap;column-gap:10px;row-gap:15px;}
  #school-list .list ul li{width:300px;height:70px;margin:0;}
  #school-list .list ul li .p-title h3{margin:8px 0 0 5px;font-size:14px;}
  #school-list .list ul li p{margin:6px 10px 10px 83px;}
  #school-list .list ul li .p-title h3 a{text-decoration:underline;}
}

/* =========================
   contents_link（PC/Tabは横1行で全文表示、SPは縦）
   ========================= */
.contents_link ul{margin:0;padding:0;list-style:none;}
.contents_link ul li{display:inline-block;margin-right:24px;}
.contents_link ul li a{
  display:inline-block;
  padding:3px 34px 0 36px;line-height:27px;text-decoration:none;color:#666;
  background-repeat:no-repeat,no-repeat;background-position:left center,right center;
  white-space:nowrap;overflow:visible;text-overflow:clip;max-width:none;
}
.contents_link ul li a:hover{color:#999;}
.contents_link ul li#nav-school-info a{
  background-image:url('/assets/images/school/icon_school_info.png'),url('/assets/images/school/icon_naviarrow.png');
}
.contents_link ul li#nav-school-course a{
  background-image:url('/assets/images/school/icon_school_course.png'),url('/assets/images/school/icon_naviarrow.png');
}
.contents_link ul li#nav-school-cost a{
  background-image:url('/assets/images/school/icon_school_cost.png'),url('/assets/images/school/icon_naviarrow.png');
}
.contents_link ul li#nav-school-message a{
  background-image:url('/assets/images/school/icon_school_message.png'),url('/assets/images/school/icon_naviarrow.png');
}
.contents_link ul li#nav-school-ob a{
  background-image:url('/assets/images/school/icon_school_ob.png'),url('/assets/images/school/icon_naviarrow.png');
}
@media (max-width:759px){
  .contents_link ul li{display:block;margin:0 0 10px 0;}
  .contents_link ul li a{display:block;padding:8px 34px 8px 36px;white-space:nowrap;}
}

/* =========================
   「※アルファベット順」を表の右端に合わせる
   ========================= */
/* 表が1000/760中央寄せなので、pに左右パディングを足して端を合わせる */
@media (min-width:1000px){
  p.p1{margin:0 0 10px 0;padding:0 calc((100% - 1000px)/2);text-align:right !important;}
}
@media (min-width:760px) and (max-width:999px){
  p.p1{margin:0 0 10px 0;padding:0 calc((100% - 760px)/2);text-align:right !important;}
}

/* =========================
   .lazy（既存維持）
   ========================= */
.lazy{width:100%;height:100%;object-fit:contain;padding:5px;box-sizing:border-box;}

/* =========================
   大学ページ（このページだけ幅固定）
   ========================= */
@media (min-width:1100px){
  .page.page--fullwidth.university .university__section{width:1000px;margin-left:auto;margin-right:auto;}
}
@media (min-width:760px) and (max-width:1099px){
  .page.page--fullwidth.university .university__section{width:760px;margin-left:auto;margin-right:auto;}
}
