@charset "UTF-8";
/* =========================================
   余白調整用補助クラス
   ========================================= */
.u-mb20 { margin-bottom: 20px !important; }
.u-mt20 { margin-top: 20px !important; }
.u-mt40 { margin-top: 40px !important; }
.u-mt60 { margin-top: 60px !important; }

/* =========================================
   1. 挨拶文のスタイル
   ========================================= */
.greeting-box {
    display: flex;
    gap: 30px;
    align-items: flex-start;
    line-height: 1.8;
}
.greeting-text p {
    margin-bottom: 1em;
    text-align: justify;
}

/* =========================================
   2. 恩師からの教えスタイル
   ========================================= */
.mentor-box {
}
.quote-text {
    font-size: 1.25em;
    font-weight: bold;
    color: #333;
    margin-bottom: 20px;
    line-height: 1.6;
    position: relative;
}
.mentor-desc {
    line-height: 1.8;
    color: #555;
    text-align: justify;
}

/* =========================================
   3. 学んできたことスタイル
   ========================================= */
.learning-box {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.learning-item {
    background: #fff;
    transition: all 0.3s ease;
}
.learning-item:hover {
}
.learning-title {
    margin-bottom: 15px;
    font-weight: bold;
    padding-bottom: 10px;
}
.learning-text p {
    line-height: 1.8;
    color: #444;
    text-align: justify;
}
.name {
    text-align: right !important;
}

/* =========================================
   4. 運営方針のスタイル
   ========================================= */
.policy-list-box {
    margin-bottom: 20px;
}
.policy-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.policy-list li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 15px;
    font-weight: bold;
    display: flex;
    align-items: center;
}
.policy-list li:last-child { margin-bottom: 0; }
.policy-list li span {
    position: absolute;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* =========================================
   5. 哲学メッセージ（カード風）
   ========================================= */
.philosophy-card {
    padding: 40px 20px;
    background: #fff;
    position: relative;
}
.philosophy-tt {
    font-size: 1.4em;
    color: #333;
    margin-bottom: 30px;
    font-weight: bold;
}
.philosophy-text {
    line-height: 2;
}
.philosophy-text p {
    margin-bottom: 2em;
}
.philosophy-text p:last-child { margin-bottom: 0; }


/* =========================================
   2 & 3. 恩師からの教え・学んできたこと（2カラムレイアウト）
   ========================================= */
.mentor-learning-wrap {
    display: flex;
    gap: 40px; /* 左右の余白 */
    align-items: flex-start;
}
.content-col {
    flex: 1; /* 左側を可能な限り広くとる */
}
.image-col {
    width: 300px; /* 右側の画像の基準サイズ。必要に応じて調整してください */
    flex-shrink: 0;
}

/* リスト共通スタイル */
.mentor-list, .learning-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.mentor-list li {
    margin-bottom: 15px;
    line-height: 1.6;
    color: #333;
}
.learning-list li {
    margin-bottom: 25px;
    line-height: 1.6;
}
/* エクセル風の下線スタイル */
.learning-list .underline {
}

/* 右側の画像とキャプション */
.art-box img {
    width: 100%;
    height: auto;
    display: block;
}
.art-caption {
    margin-top: 10px;
    line-height: 1.6;
}

/* =========================================
   スマホ対応（メディアクエリ）
   ========================================= */
@media screen and (max-width: 767px) {
    /* 挨拶文 */
    .greeting-box {
        flex-direction: column;
    }
    
    /* 恩師からの教え */
    .mentor-box {
        padding: 20px 15px;
    }
    .quote-text {
        font-size: 1.1em;
        margin-bottom: 15px;
    }
    
    /* 学んできたこと */
    .learning-item {
        padding: 20px 15px;
    }
    
    /* 運営方針 */
    .policy-list-box {
    }
    .policy-list li {
        padding-left: 20px;
    }
    
    /* 哲学メッセージ */
    .philosophy-card {
        padding: 30px 15px;
    }
    .philosophy-text {
        text-align: left;
        font-size: 14px;
    }
.mentor-learning-wrap {
        flex-direction: column;
        gap: 30px;
    }
    .image-col {
        width: 100%;
        max-width: 400px;
        margin: 0 auto; /* スマホでは画像を中央寄せに */
    }
}




.mentor-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.mentor-list li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 15px;
    font-weight: bold;
    display: flex;
    align-items: center;
}
.mentor-list li:last-child { margin-bottom: 0; }
.mentor-list li span {
    position: absolute;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}


.learning-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.learning-list li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 15px;
    font-weight: bold;
    display: flex;
    align-items: center;
}
.learning-list li:last-child { margin-bottom: 0; }
.learning-list li span {
    position: absolute;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}