.section-title {
    text-align: center;
    margin-bottom: 3vw; }

/* --- About セクション --- */
.about {
    padding: 5vw;
    padding-top:0;}
.about-header {
    margin-bottom: 5vw;}
.about-header h2 {
    color: #f0a040;
    font-size: 28px;}
.about-lead {
    font-size: 16px;
    line-height: 1.8;
    margin-top: 10px;}
.about-grid {
    display: flex;
    gap: 3vw;
    width: 100%;
    margin: 0 auto;}
.about-card {
    flex: 1;
    padding: 3vw;
    border-radius: 15px;}
.about-card.highlight {
    background: #fef4e8;
    border: 1px solid #f0a040;}
.about-card h3 {
    font-size: 18px;
    margin-bottom: 2vw;
    color: #c9a764;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 1vw;}
.about-card ul {
    list-style: "✔";
    padding-left: 1.5em;
    font-size: 15px;
    line-height: 2;}
.about-card li {
    padding-left: .5vw;}
.about-card__add {
    font-size: 1.3vw;
    font-weight: bold;
    text-align: center;
    display: inline-block;
    width: 100%;
    margin-bottom: 1vw;
    color: red;}

/* --- レッスンの流れ (.lesson-flow) --- */
.lesson-flow {
    padding: 3vw 5vw 8vw;}
.flow-container {
    display: block;
    width: 90%;
    margin: 0 auto 30px;}
.flow-item {
    background: #fff;
    padding: 3vw;
    border-radius: 10px;
    position: relative;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    overflow: hidden;
    transition: transform 0.3s ease;
    margin-bottom: 15px;}
.flow-item .num {
    position: absolute;
    top: -5px;
    left: 10px;
    font-size: 70px;
    font-family: 'Times New Roman', serif;
    font-weight: bold;
    font-style: italic;
    color: rgba(240, 160, 64, 0.15); 
    line-height: 1;
    z-index: 1;}
.flow-item p strong {
    display: block;
    font-size: 1.5vw;
    color: #3a3026;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 2px solid #f0a040;
    width: 15vw;
    text-align: center;}
.flow-item p {
    font-size: 14px;
    line-height: 1.6;
    position: relative;
    z-index: 2;
    display: flex;
    gap: 3vw;
    align-items: center;}

/* --- 初回体験 (.first-experience) --- */
.first-experience {
    text-align: center;
    padding: 5vw;
    display: flex;
    justify-content: center;}
.exp-card {
    width: 80%;
    background: #fff;
    border: 2px solid #c9a764;
    border-radius: 15px;
    position: relative;
    padding: 3vw 1vw;
    box-shadow: 0 15px 35px rgba(201, 167, 100, 0.15);
    text-align: center;}
.exp-card::before, .exp-card::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 30px;
    height: 30px;
    background: #fff;
    border-radius: 50%;
    transform: translateY(-50%);
    border: 2px solid #c9a764;}
.exp-card::before { left: -17px; }
.exp-card::after { right: -17px; }
.exp-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: #f0a040;
    color: #fff;
    padding: 5px 25px;
    border-radius: 50px;
    font-weight: bold;
    font-size: 14px;
    letter-spacing: 0.1em;
    box-shadow: 0 4px 10px rgba(240, 160, 64, 0.3);}
.exp-header h3 {
    font-size: 24px;
    margin-bottom: 5px;}
.exp-sub {
    font-size: 14px;
    color: #c9a764;
    margin-bottom: 15px;}
.exp-price-area {
    background: #fff;
    padding: 20px;
    display: flex; /* カラムレイアウト */
    align-items: center;
    justify-content: center;
    gap: 40px;
    text-align: center;
    padding: 20px 0;
    border-top: 1px dashed #c9a764;
    border-bottom: 1px dashed #c9a764;}
.exp-label {
    display: block;
    font-size: 16px;
    color: #f0a040;
    font-weight: bold;}
.exp-price {
    display: block;
    font-size: 48px;
    font-weight: bold;
    line-height: 1;
    margin: 5px 0;}
.exp-price small {
    font-size: 20px;
    margin-left: 2px;}
.exp-duration {
    font-size: 18px;
    color: #666;}
.exp-footer {
    margin-top: 20px;
    font-size: 14px;}


/* --- 持ち物 (.belongings) --- */
.belongings {
    padding: 3vw 5vw;}
.belongings-grid {
    display: flex;
    gap: 4vw;
    margin: 0 auto;}
.belongings-card {
    flex: 1;
    padding: 3vw;
    border: 1px solid #c9a764;}
.belongings-card.online {
    background: #fff;
    border-style: dashed;
    padding: 1vw;}
.belongings-card h3 {
    font-size: 22px;
    margin-bottom: 1.5vw;}
.belongings-card ul {
    list-style: disc;
    padding-left: 1.5vw;
    line-height: 1.8;
    margin-bottom: 3vw;}
.belongings-card.online ul{
    margin-bottom: 0;}

/* --- FAQ (.faq) --- */
.faq {
    padding: 5vw;}
.faq-list {
    width: 100%;
    margin: 0 auto;
    border-top: 1px solid #5a6e60;}
.faq-q {
    font-weight: bold;
    font-size: 16px;}


/* スマホ対応 */
@media screen and (max-width: 700px) {
.about-grid, .belongings-grid {
    flex-direction: column; }
.about{
    padding-bottom: 15vw;}
.about-header{
    margin-bottom: 10vw;}
.about-header h2 {
    font-size: 6vw;}
.about-lead{
    font-size: 3.5vw;}
.about-card{
    margin-bottom: 3vw;}
.about-card h3{
    font-size: 4.5vw;}
.about-card ul{
    font-size: 3.5vw;}
.about-card li{
    padding-left: 2vw;}
.about-card__add {
    font-size: 4vw;
    margin: 3vw auto;}
.section-title {
    margin-bottom: 7vw;}
.section-title h2 {
    font-size: 5vw;}
.flow-container {
    grid-template-columns: 1fr; }
.flow-item .num {
    font-size: 13vw;
    top: 50%;
    transform: translateY(-50%);}
.flow-item p {
    flex-direction: column;
    gap: 0;
    font-size: 3vw;
    margin-left: 12vw;
    align-items: baseline;}
.flow-item p strong {
    font-size: 4vw;
    width: 70%;
    margin-bottom: 3vw;
    padding-bottom: 1vw;
    text-align: left;}
.first-experience {
    margin: 10vw auto;}
.exp-card {
    padding: 10vw 5vw 5vw;
    width: 100%;}
.exp-sub {
    font-size: 3vw;
    margin-bottom: 3vw;}
.exp-header h3 {
    font-size: 5vw;
    margin-bottom: 1vw;}
.exp-price-area {
    width: 100%;
    flex-direction: column;
    gap: 1vw;}
.exp-card::before, .exp-card::after{
    display: none;}
.exp-points {
    text-align: left;
    display: inline-block;}
.belongings-card {
    padding: 5vw;}
.belongings-card h3 {
    font-size: 5vw;
    text-align: center;
    margin-bottom: 3vw;}
.belongings-card ul {
    padding-left: 3vw;
    margin-bottom: 6vw;}
.belongings-card.online h3 {
    margin-top: 3vw;}
.belongings-card.online ul {
    margin-bottom: 3vw;
    padding-left: 6vw;}
.faq {
    margin-top: 10vw;}

}