@charset "UTF-8";
/*---------------------------------------------------------
下層ページ用CSS
---------------------------------------------------------*/
p{font-size: clamp(1.4rem, 4vw, 1.8rem);
margin:1.25vh 0;}

#coaching{
width: 100%;
    background-size: 16px 16px;
    background-position: 50% 50%;
    background-image: repeating-linear-gradient(90deg, rgba(239, 239, 239, 0.9), rgba(239, 239, 239, 0.9) 1px, transparent 1px, transparent 16px), repeating-linear-gradient(0deg, rgba(239, 239, 239, 0.9), rgba(239, 239, 239, 0.9) 1px, #fff 1px, #fff 16px);
    padding: 0 0 clamp(60px, 1.5vw, 120px);

.inner{
        width: 90%;
        margin: 0 auto;
        max-width: 1000px;
}
h2{
        background: #007440;
        color: #fff;
        text-align: center;
        padding: clamp(20px, 1.5vw, 40px) clamp(15px, 1.5vw, 30px);
        font-size: clamp(2.25rem, 3.5vw, 4rem);
        font-weight: 900;
}
h3{
        display: flex;
        align-items: center;
        text-align: center;
        font-size: clamp(1.8rem, 3.5vw, 3rem);
        margin: clamp(30px, 3.4vw + 19px, 60px) 0;
        line-height: 1.2;
        font-weight: 700;
        text-align: center;
        color: #007440;
}
h3::before,
h3::after {
        content: "";
        flex-grow: 1;
        height: 4px;
        background-color: #f9c34b;
        margin: 0 20px;
}
.coaching-box{

}
.coaching-box .coaching-pct{
    float: right;
    width: 50%;
    display: block;
    margin: 0 0 clamp(15px, 1.5vw, 30px) clamp(15px, 1.5vw, 30px);
    padding: 8px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #c2c2c2;
    border-right: 1px solid #c2c2c2;
    background: #fff;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}
.coaching-box p{
    margin: 0 0 2vh;
}
/***ステップバーデザイン3***/
.step-wrap3 {
 counter-reset: count;
 margin: 2em 0;
 position: relative;
}
.step-content3 {
 padding: 1.3em 0 .3em 1em;
 margin: 0 0 1em 1em;
 position: relative;
 border-top: solid 2px #ddd;
}
.step-content3::before {
 content: "";
 display: block;
 position: absolute;
 bottom: 0;
 left: -10px;
 border-style: solid;
 border-width: 17px 8px 0 8px;
 border-color: #ddd transparent transparent transparent;
}
.step-content3::after {
 content: "";
 display: block;
 height: calc(100% - 36px);
 border-left: dashed 4px #ddd;
 position: absolute;
 top: 16px;
 left: -4px;
}
.step-label3 {
 padding: 3px 20px 3px 15px;
 color: #fff;
 font-weight: bold;
 position: absolute;
 top: -18px;
 left: -20px;
 background: #01A56F;
 border-radius: 20px;
 z-index: 1;
}
.step-label3::after {
 counter-increment: count;
 content: counter(count);
 position: relative;
 left: .3em;
}
.step-title3 {
 font-weight: 700;
 font-size: clamp(1.6rem, 3.5vw, 2.25rem);
 color: #01A56F;
}
.step-body3 {
 margin-top: .5em;
 padding: 0 0 1em;
}
.step-wrap3 > :last-child {
 box-shadow: 5px 7px 0 -5px #ddd;
}
.step-wrap3 > :last-child::before, .step-wrap3 > :last-of-type::after {
 display: none;
}
.coaching-txt{
    font-size: clamp(1.4rem, 3.5vw, 2rem);
    text-align: center;
    font-weight: 700;
}
}

@media screen and (max-width: 640px) {
/* 640pxまでの幅の場合に適応される */
    #coaching{
    .coaching-box .coaching-pct {
        float: unset;
        width: 95%;
        margin: 0 0 clamp(15px, 1.5vw, 30px) 0;
    }
    h3::before,h3::after {
        margin: 0 5px;
}
    }
}