/* リセット */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body, h1, h2, h3, h4, h5, h6, p, ul, ol {
  margin: 0;
  padding: 0;
}

ul, ol {
  list-style: none;
}

body {
    max-width: 3000px;
    margin: 0 auto;
    width: 100%;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

.logo_text img {
  width: 180px;
  display: block;
}

.carousel-item img {
  width: 100%;
  height: 500px; 
  object-fit: cover;
}

.greeting_heading {
  text-align: center;
  margin-bottom: 40px;
}

.greeting_body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px; 
}

/* 画像側 */
.greeting_image {
  width: 50%;
}

.greeting_image img {
  width: 100%;
  height: auto;
  border-radius: 20px; 
}

.greeting_name {
  font-size: 30px;
  color: #3f5f70;
  margin-top: 10px;
}

/* テキスト側 */
.greeting_text {
  width: 50%;
  line-height: 1.8;
}

.greeting_inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 20px;
}

@media screen and (max-width: 768px) {
  .greeting_body {
    flex-direction: column;
  }

  .greeting_image,
  .greeting_text {
    width: 100%;
  }
}

/* =========================
 content-slide
========================= */
.content-slide {
  padding: 20px 20px;
}

.container {
  padding: 0 20px;
}

.content-slide .container {
  background: linear-gradient(135deg, #a8d8f0, #bfe6f7);
  padding: 40px 20px;
  border-radius: 20px;
}

.content-slide_title {
  text-align: center;
  font-size: 28px;
  margin-bottom: 20px;
}

.content-slide_text {
  line-height: 1.8;
}

/* =========================
 treatment-points
========================= */
.treatment-points {
  padding: 20px 0;
}

.treatment-points_list {
  display: flex;
  gap: 30px;
}

.treatment-points_item {
  flex: 1;
  background: linear-gradient(135deg, #a8d8f0, #bfe6f7);
  padding: 40px 20px;
  text-align: center;
  border-radius: 20px;
}

/* =========================
 feature
========================= */
.feature {
  padding: 40px 0;
}

.feature_title {
  text-align: center;
  margin-bottom: 40px;
  font-size: 28px;
  color: #3f5f70;
}

.feature_list {
  display: flex;
  gap: 30px;
}

.feature_item {
  flex: 1;
  background: linear-gradient(135deg, #a8d8f0, #bfe6f7);
  padding: 40px 20px;
  text-align: center;
  border-radius: 20px;
}

/* =========================
 スマホ
========================= */
@media screen and (max-width: 768px) {
  .treatment-points_list,
  .feature_list {
    flex-direction: column;
  }
}

@media screen and (max-width: 768px) {

  .container {
  padding: 0 16px;
}

.content-slide {
  padding: 60px 16px;
}

  .content-slide_title {
    font-size: 22px;
  }

  .content-slide_text {
    font-size: 14px;
  }
}

/* ヘッダー全体 */
.header {
  background:#f4f8fb;
  color: #000;
}

/* ナビ全体の文字色 */
.header a,
.header .nav-link {
  color:#000;
}

/* サブテキスト（下の日本語） */
.header .nav-link p {
  color: #000;
  margin: 5px 0 0; 
  font-size: 12px;
  line-height: 1.4;
}

/* ナビリンクの余白 */
.header .nav-link {
  padding: 25px 30px;
}

/* ホバー時 */
.header .nav-link:hover {
  opacity: 0.7;
  text-decoration: none;
}

/* ハンバーガーアイコン */
.toggle-menu {
  color: #000;
}

/* ロゴ周りの余白調整（任意） */
.logo_container img {
  max-height: 60px;
}

/* =====================
   セクション全体
===================== */
.home_title {
  text-align: center;
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 10px;
  color: #3f5f70;
}

.home_title_sub {
  text-align: center;
  font-size: 30px;
  margin-bottom: 60px;
  color: #3f5f70;
}

/* =====================
   2カラムレイアウト
===================== */
/* セクション全体 */
.services {
    width: 100%;
    padding: 100px 40px;
}

/* コンテナを全幅化 */
.services-container {
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
}

/* Bootstrapのrowを上書き */
.service_post_row {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    gap: 40px;
}

/* 2列表示 */
.course_col {
    width: calc(50% - 20px);
    max-width: calc(50% - 20px);
    flex: 0 0 calc(50% - 20px);
    padding: 0;
}

/* カード */
.service_item {
    width: 100%;
    height: 100%;
    position: relative;
}

/* 画像 */
.service_image img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    display: block;
}

/* 装飾UI */
.service_body {
    background: #fff;
}

/* =====================
   カードデザイン
===================== */
.service_item {
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 20px rgba(0,0,0,0.05);
  display: flex;
  flex-direction: column;
  width: 100%;
  text-align: center;
  transition: 0.3s;
}

.service_item:hover {
  transform: translateY(-5px);
}

/* =====================
   画像
===================== */
.service_image img {
  width: 100%;
  height: 500px;
  object-fit: cover;
}

/* タイトル */
.service_title {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 15px;
}

.service_title a {
  color: #3f5f70;
  text-decoration: none;
}

/* 本文 */
.service_text p {
  font-size: 15px;
  line-height: 1.8;
  color: #555;
}

/* =====================
   フッター（ボタン）
===================== */
.service_footer {
  margin-top: auto;
  padding: 20px;
}

.service_link {
  display: inline-block;
  border-radius: 20px;
  color: #007bff;
  text-decoration: none;
  transition: 0.3s;
}

.service_link:hover {
  color: #fff;
}

/* =====================
   レスポンシブ
===================== */

/* タブレット */
@media (max-width: 992px) {
  .course_col {
    width: 100%;
  }

  .service_image img {
  width: 550px;
  height: 300px;
  }
}

/* スマホ */
@media (max-width: 576px) {
  .home_title {
    font-size: 26px;
  }

  .service_title {
    font-size: 14px;
  }

  .service_text p {
    font-size: 10px;
  }

  .service_image img {
    height: 300px;
    width:auto;
  }
}

.blog-staff-container {
  margin: 0px 20px 0px 20px;
}

@media (max-width: 992px) {

  .blog-thumb {
    max-width: 100%;
    margin-bottom: 20px;
  }

  .blog_posts_small img {
  display: block;
  margin: 0 auto;
 }

}

@media (max-width: 767px) {

  .read_continue {
    text-align: center;
  }

  section.feature {
    padding-top: 0px;
  }

  section.content-slide {
    padding-bottom: 0px;
  }

  .greeting_inner {
    padding-bottom: 0px;
  }

  .access {
    padding-top: 0px;
  }

  .services.service {
    padding-top: 0px 20px 0px 20px;
  }

}

a {
  color: #3f5f70;
}

/* =========================
   全体
========================= */

.blog{
  background:#f4f8fb;
}

.content-body{
  align-items:flex-start;
}

/* =========================
   記事カード
========================= */

.col-lg-8{
  background:#fff;
  border-radius:20px;
  padding:45px;
  box-shadow:0 5px 25px rgba(0,0,0,0.08);
}

/* =========================
   タイトル
========================= */

.single_title{
  font-size:42px;
  line-height:1.5;
  color:#3f5f70;
  font-weight:700;
  margin-bottom:25px;
  padding-bottom:15px;
  position:relative;
}

.single_title::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width: 100%;
  height:4px;
  background:#3f5f70;
  border-radius:20px;
}

/* =========================
   投稿日
========================= */

.blog_post_meta{
  margin-bottom:35px;
}

.blog_post_meta ul{
  display:flex;
  flex-wrap:wrap;
  gap:15px;
  padding:0;
  margin:0;
}

.blog_post_meta li{
  list-style:none;
  background:#eef6fa;
  padding:8px 16px;
  border-radius:20px;
  font-size:14px;
  color:#3f5f70;
}

/* =========================
   アイキャッチ
========================= */

.mb-4{
  margin-bottom:40px!important;
}

.mb-4 img{
  width:100%;
  height:600px;
  object-fit:cover;
  border-radius:20px;
  display:block;
}

/* =========================
   本文
========================= */

.blog_content{
  font-size:14px;
  line-height:2.2;
  color:#444;
}

.blog_content p{
  margin-bottom:30px;
}

.blog_content h2{
  font-size:30px;
  color:#3f5f70;
  margin-top:60px;
  margin-bottom:25px;
  border-left:6px solid #bfe6f7;
  padding-left:15px;
}

.blog_content h3{
  font-size:24px;
  color:#4d6b7a;
  margin-top:40px;
  margin-bottom:20px;
}

.blog_content img{
  width:100%;
  height:auto;
  border-radius:20px;
  margin:30px auto;
}

/* =========================
   前後記事
========================= */

.post_nav{
  display:flex;
  justify-content:space-between;
  margin-top:60px;
  padding-top:30px;
  border-top:1px solid #eee;
}

.post_nav a{
  display:inline-block;
  background:#3f5f70;
  color:#fff;
  padding:12px 25px;
  border-radius:20px;
  text-decoration:none;
  transition:.3s;
}

.post_nav a:hover{
  background:#5a7a8a;
  transform:translateY(-3px);
}

/* =========================
   サイドバー
========================= */

.col-lg-4 .sidebar{
  background:#fff;
  border-radius:20px;
  padding:30px;
  box-shadow:0 5px 25px rgba(0,0,0,.08);
  position:sticky;
  top:100px;
}

/* =========================
   スマホ
========================= */

@media(max-width:991px){

.col-lg-8{
   padding:25px;
   margin-bottom:30px;
}

.single_title{
   font-size:24px;
}

.mb-4 img{
   height:auto;
}

.post_nav {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.post_nav .prev {
    text-align: left;
}

.post_nav .next {
    text-align: right;
    margin-left: auto;
}

.col-lg-4 .sidebar{
   position:static;
}

}

@media (max-width: 515px) {

    .post_nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    }

    .post_nav .prev,
    .post_nav .next {
        width: 30%;
        text-align: center;
        margin-left: 0;
    }

    .post_nav a {
        display: block;
        width: 100%;
        font-size: 10px;
    }

}

@media(max-width:576px){

.single_title{
   font-size:14px;
}

.blog_content{
   font-size:10px;
   line-height:2;
}

.blog_content h2{
   font-size:14px;
}

.blog_content h3{
   font-size:12px;
 }

 .mb-4 img {
        height: 300px;
        object-fit: cover;
        object-position: top;
  }
}
/* =========================
   サイドバー修正版
========================= */

/* colの余計な余白調整 */
.col-lg-4{
    margin-top: 20px;
    border-radius: 20px;
}

/* サイドバー本体 */
.sidebar{
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;

    background:#ffffff;
    padding:30px;
    border-radius:20px;

    box-shadow:
      0 5px 20px rgba(0,0,0,.08);

    position:sticky;
    top:100px;
}

/* ウィジェットごと */
.sidebar .widget{
    margin-bottom:35px;
    padding-bottom:30px;
    border-bottom:1px solid #edf2f5;
}

.sidebar .widget:last-child{
    border:none;
    margin-bottom:0;
    padding-bottom:0;
}

/* タイトル */
.sidebar .widget-title{
    font-size:14px;
    color:#3f5f70;

    margin-bottom:20px;
    padding-bottom:10px;

    border-bottom:
      3px solid #3f5f70;

    line-height:1.6;
}

/* リスト */
.sidebar ul{
    padding:0;
    margin:0;
}

.sidebar li{
    list-style:none;
    margin-bottom:14px;
}

/* リンク */
.sidebar a{
    display:block;
    color:#3f5f70 !important;

    text-decoration:none;

    line-height:1.9;
    letter-spacing:.03em;

    transition:.3s;

    padding:10px 0;
}

.sidebar a:hover{
    color:#3f5f70 !important;
    padding-left:8px;
}

/* 検索 */
.sidebar input[type="search"],
.sidebar input[type="text"]{

    width:100%;

    height:48px;

    border:1px solid #ddd;

    border-radius:8px;

    padding:0 15px;

    font-size:14px;
}

/* ボタン */
.sidebar button,
.sidebar input[type="submit"]{

    width:100%;

    margin-top:10px;

    border:none;

    background:#3f5f70;

    color:#fff;

    height:48px;

    border-radius:20px;

    transition:.3s;
}

.sidebar button:hover,
.sidebar input[type="submit"]:hover{
    opacity:.85;
}

/* スマホ */
@media(max-width:991px){

.sidebar{
    position:static;
    margin-top:30px!important;
    padding:25px;
}

.sidebar_block {
    text-align: center;
}

.sidebar .widget-title{
    font-size:18px;
 }

}

/* ==========================
   記事全体（高さ圧縮）
========================== */
.blog_posts_small{
    margin-bottom:20px;
    padding:10px 0;
}

.blog_posts_small .row{
    display:flex;
    align-items:center;
}

/* 画像エリア */
.col-lg-4{
    display:flex;
    justify-content:center;
    align-items:center;
}

.col-lg-4 a{
    width:100%;
    max-width:400px;
    display:block;
}

/* 画像 */
.blog-thumb{
    width:100%;
    aspect-ratio:1 / 1;

    object-fit:cover;
    object-position:center;

    display:block;
    border-radius: 20px;
}

/* 本文エリア */
.col-lg-8{
    display:flex;
    flex-direction:column;
    justify-content:center;
    margin-top: 20px;
}

/* タイトル縮小 */
.blog_post_small_title{
    margin-bottom:5px;
}

.blog_post_small_title a{
    font-size:18px; /* 24→18 */
    font-weight:700;
    line-height:1.3;
}

/* メタ情報 */
.blog_post_meta{
    margin-bottom:5px;
}

.blog_post_meta ul{
    margin:0;
    padding:0;
    font-size:12px;
}

/* 抜粋 */
.blog_post_excerpt{
    font-size:14px;
    line-height:1.5;
    margin-bottom:8px;
}

/* ボタン縮小 */
.read_continue .btn{
    padding:5px 12px;
    font-size:13px;
}

/* 区切り線 */
.blog_posts_small hr{
    margin:15px 0;
}


/* ==========================
   スマホ
========================== */
@media (max-width: 992px){

    .blog_posts_small .row{
        display:flex;
        flex-direction:column;

        justify-content:center;
        align-items:center;

        text-align:center;
    }

    .blog-thumb{
    height: 300px;
   
    }

    .col-lg-4{
        margin-bottom:10px;
    }

    .blog_post_small_title{
        text-align:center;
        font-size: 18px;
    }

    .blog_post_meta{
        text-align:center;
    }

    .blog_post_excerpt{
        font-size:13px;
    }
}

@media (max-width:767px){

    .blog-thumb{
        display:block;
        margin:0 auto;

        width:100%;
        max-width:300px;

        object-fit:cover;
        object-position:center;
    }

    .col-lg-4{
        display:flex;
        justify-content:center;
        align-items:center;
    }

}
    








