@charset "utf-8";
/*====================
common
====================*/
html {
    font-size: 62.5%;
}

body {
    font-family: "M PLUS 1p", sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 1.9rem;
    color: #2F2F2F;
    background-color: #86BE79;
    line-height: 1.5;
}

img {
    width: 100%;
    height: auto;
}

.brSp {
    display: inline;
}

.brPc {
    display: none;
}

.btn__basic {
    display: block;
        font-family: "Mplus 1p", sans-serif;
        font-size: 2rem;
        font-weight: 500;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
        background-color: #F39938;
        color: #fff;
        border-radius: 7px;
        padding: 5px 0;
        width: 248px;
        text-align: center;
        cursor: pointer;
        transition: 0.2s;
    }

.btn__basic:hover {
    outline: 2px solid #F39938;
    background-color: #fff;
    color: #F39938;
}

.btn__basic a {
    display: block; 
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: inherit;
}


/* スクロールして要素が画面に入ったら表示（初期表示） */
.fade-in {
    opacity: 0;
    transform: translateY(50px);
    filter: blur(8px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

/* 表示時にアニメーション */
.fade-in.show {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}


/* 各セクション間の仕切り線 */
.greenLine {
    width: 100%;
    height: 20px;
    background-color: #7BBF4C;
}
.rightGreenLine {
    width: 100%;
    height: 15px;
    background-color: #BCD96C;
}
.grayLine {
    width: 100%;
    height: 10px;
    background-color: #C4CEDC;
}

/* セクション見出し文 */
.sectionTitle {
    display: inline-block;
    text-align: center;
    text-shadow: 2px 0 #FFF, -2px 0 #FFF, 0 2px #FFF, 0 -2px #FFF;
    background: linear-gradient(transparent 50%, #A8D86C 50%);
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: bold;
    margin-top: 30px;
    margin-bottom: 30px;
}

/* ↓ common pc ↓ */
@media screen and (min-width: 769px) {
.section__topic, 
.section__topic--white {
    padding: 50px 0;
}

.brSp {
    display: none;
}
.brPc {
    display: inline;
}

.sectionTitle {
    font-size: 3.2rem;
}

/* 各セクション間の仕切り線 */
.greenLine {
    height: 30px;
}
.rightGreenLine {
    height: 20px;
}
.grayLine {
    height: 10px;
}

}/* ↑ common pc ↑ */


/*====================
header
====================*/
.header {
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding: 13px 4.6%;
    /*header追尾*/
    position: sticky;
    width: 100%;
    top: 0;
    background-color: #86BE79;
    left: 0;
    z-index: 65;
}

.header__topic img {
    width: auto;
}

.header__topic img:hover {
    opacity: 0.9;
}


/* .nav初期表示 */
.nav {
    background: #86BE79;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    transform: translateX(-100%);
    transition: transform 0.4s;
}

.nav__header {
    display: flex;
    justify-content: end;
    margin-bottom: 25px;
    padding: 13px 4.6%;
}

.nav__headerIcon {
    display: none;
}

.nav__list {
    text-align: right;
    padding: 13px 4.6%;
    color: #fff;
    display: flex;
    flex-direction: column;
    font-size: 2.5rem;
    font-family: "M PLUS 1p", sans-serif;
    font-style: normal;
    font-weight: bold;
    gap: 25px;
}

.nav__btn {
    width: 45px;
    height: 45px;
    cursor: pointer;
    border: 2px solid #CDE9C3;
    border-radius: 3px;
    padding: 4px;
}

.nav__item--sp {
    display: inline;
}

.nav__icon--pc {
    display: none;
}

.nav__icon--sp {
    display: block;
}

.header .active {
    transform: translateX(0);
}

.header__btn {
    width: 45px;
    height: 45px;
    cursor: pointer;
    border: 2px solid #CDE9C3;
    border-radius: 3px;
    padding: 4px;
}




/* ↓ header pc ↓ */
@media screen and (min-width: 769px) {
    .header {
    max-width: 1100px;
    align-items: center;
    padding: 10px 4.6% 10px;
    /*header追尾解除*/
    position: static;
    }
    
    .header__topic img {
    width: auto;
    max-height: 68px;
    }
    
    .btn__blue {
        display: block;
        font-family: "Mplus 1p", sans-serif;
        font-size: 2rem;
        font-weight: 500;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
        background-color: #41C2CC;
        color: #fff;
        border-radius: 7px;
        padding: 5px 0;
        width: 155px;
        text-align: center;
        cursor: pointer;
        transition: 0.2s;
    }

    .btn__blue:hover {
        outline: 2px solid #41C2CC;
        background-color: #fff;
        color: #41C2CC;
    }

    .btn__orange {
        display: block;
        font-family: "Mplus 1p", sans-serif;
        font-size: 2rem;
        font-weight: 500;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25);
        background-color: #F39938;
        color: #fff;
        border-radius: 7px;
        padding: 5px 0;
        width: 155px;
        text-align: center;
        cursor: pointer;
        transition: 0.2s;
    }

    .btn__orange:hover {
        outline: 2px solid #F39938;
        background-color: #fff;
        color: #F39938;
    }
    
    .nav {
        display: flex;
        flex-direction: column;
        transform: translateX(0);
        position: static;
        color: #fff;
    }

    .nav__header {
        display: block;
        margin-bottom: 0;
        padding: 0;
    }

    .nav__item:hover {
        color: #F0FAD7;
    }
    
    .nav__headerIcon {
        display: flex;
        justify-content: end;
        gap: 15px;
    }
    
    .nav__list {
        flex-direction: row;
        font-size: 1.8rem;
        justify-content: end;
        gap: 15px;
        padding: 13px 0 0 4.6%;
        color: #fff;
    }

    .nav__headerIcon a img {
        width: auto;
        height: 20px;
    }

    .nav__item--sp {
        display: none;
    }

    .nav__icon--pc {
        display: block;
    }

    .nav__icon--sp {
        display: none;
    }
    
    .header__btn, .nav__btn {
        display: none;
    }


    
}/* ↑ header pc ↑ */

/*====================
main__heading
====================*/
.main__heading {
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url(../images/heading_background_sp.jpg);
    background-size: contain;
    height: 150px;
    background-position: bottom;
}

.main__heading h1 {
    color: #FFF;
    text-shadow:0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48,0 0 3px #544d48;
    font-family: "Mplus 1p", sans-serif;
    font-size: 3rem;
    font-weight: bold;
}

/* ↓ main__heading pc ↓ */
@media screen and (min-width: 769px) {
.main__heading {
    background-image: url(../images/heading_background_pc.jpg);
    background-size: cover;
    height: 250px;
}

.main__heading h1 {
    font-size: 4.5rem;
}
    
}/* ↑ main__heading pc ↑ */

/* ↓ main__heading pc2 ↓ */
@media screen and (min-width: 769px) and (max-width: 933px) {
    .nav__list {
        font-size: 1.5rem;
        word-break: keep-all;
    }
    
}/* ↑ main__heading pc2 ↑ */

/*====================
pankuzu
====================*/
.pznkuzu {
    background-color: #fff;
    padding: 5px 4.6%;
}

.pznkuzu p {
    color: #373836;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.4rem;
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
}

.pznkuzu p a {
    color: #31a6a7;
}

.pznkuzu p a:hover {
    color: #F39938;
}


/* ↓ pankuzu pc ↓ */
@media screen and (min-width: 769px) {
.pznkuzu p {
    font-size: 1.6rem;
    max-width: 976px;
}

}/* ↑ pankuzu pc ↑ */


/*====================
footer
====================*/
.footer {
    background-color: #86BE79;
    padding: 20px 4.6%;
    text-align: center;
}

.footer img {
    max-width: 313px;
    margin: 0 auto 30px;
}

.footer img:hover {
    opacity: 0.9;
}

.footer__flex {
    display: flex;
    justify-content: center;
    flex-direction: column;
    color: #fff;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 30px;
}

.footer__flex ul li {
    margin-bottom: 20px;
}

.footer__flex ul li:hover {
    color: #F0FAD7;
}

.copy {
    font-family: "Mplus 1p", sans-serif;
    font-weight: 500;
    text-align: center;
    color: #FFF;
    font-size: 1.8rem;
}

/* ↓ topに戻るボタン ↓ */
.btn__top {
    align-items: center;  
    width: 50px;
    z-index: 50;
    position: fixed;
    right: 2.5%;
    bottom: 2%;
}

.btn__top img {
    margin-bottom: 0;
}

.btn__top:hover {
    animation:rumble 0.1s linear infinite;
}

@keyframes rumble {
    0%   { transform:translate(0, 0); }
    25%  { transform:translate(0, 2px); }
    50%  { transform:translate(0, 0); }
    75%  { transform:translate(0, -2px); }
    100% { transform:translate(0, 0); }
}


/* ↓ footer pc ↓ */
@media screen and (min-width: 769px) {
    .footer {
        padding: 15px 4.6%;
    }

    .footer--flex {
        display: flex;
        justify-content: space-between;
        max-width: 1000px;
        margin: 0 auto;
        width: 100%;
        padding: 0 4.6%;
    }

    .footer__flex ul {
        display: flex;
        justify-content: center;
        gap: 50px;
    }
    
    .footer__flex ul li {
        margin-bottom: 0;
    }

    .footer__flex ul li:first-of-type {
        margin-bottom: 15px;
    }
    
}/* ↑ footer pc ↑ */








/*====================
トップページ
====================*/










/*====================
main__visual
====================*/

.main__visual{
  --h: clamp(466px, 45vw, 720px); 
  --ratio: 2; 
  --tile: calc(var(--h) * var(--ratio));
    position: relative;
    height: var(--h);
    overflow: hidden;
    background-image: url(../images/main_visual_bg2_pc.png), url(../images/main_visual_bg_pc.png);
    background-size: auto 100%, auto 100%;
    background-repeat: repeat-x, repeat-x;
    animation: bg-loop 20s linear infinite;
    will-change: background-position;
}

@keyframes bg-loop {
    from { background-position-x: 0, 0; }
    to { background-position-x: var(--tile), var(--tile); } 
}

.main__visual__car--bg img {
    z-index: 10;
    position: absolute;
    width: auto;
	height: 100%;
	animation: bg-car-slider 6s linear infinite;
}

@keyframes bg-car-slider {
	from { transform: translateX(-100%); } /* 画面外左から */
    to { transform: translateX(100%); }  /* 画面外右へ */
}

.main__visual__car img{
    z-index: 20;
    position: absolute;
    width: 212px;
    right: -6.4%;
    bottom: 2%;
    animation: car-grind 5s ease-in-out infinite;
}

@keyframes car-grind {
    0%{
    transform: translateY(-50px);
    }
    50%{
    transform: translateY(-70px);
    }
    100%{
    transform: translateY(-50px);
    }
}

.main__textarea {
    z-index: 30;
    position: absolute;
    padding: 0 4.6%;
    margin-top: 30px;
}

.main__title {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.4rem;
    font-weight: bold;
    margin-bottom: 20px;
}

.main__subTitle {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
    font-weight: 500;
    margin-bottom: 20px;
}

.main__news {
    z-index: 40;
    display: flex;
    left: 50%;
    transform: translateX(-50%);
    flex-direction: column;
    position: absolute;
    bottom: 0;
    white-space: nowrap;
    background: rgba(255,255,255,0.8);
    padding: 8px 16px;
    gap: 2px;
    align-items: flex-start;
    width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.main__news--flex {
    display: flex;
    gap: 10px;
    align-items: center;
}

.main__news__new {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.3rem;
    font-weight: 500;
    padding: 5px 23px;
    border: 1px solid #000;
    background-color: #fff;
}

.main__news__day {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
    font-weight: 500;
}

.main__news__title {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    max-width: calc(100% - 20px); 
    vertical-align: middle;
}

.main__news__title a:hover {
    text-decoration: underline;
    color: rgb(55, 104, 194);
}

/* ↓ main__visual tablet ↓ */
@media screen and (min-width: 600px) {
.main__visual__car img{
    z-index: 20;
    position: absolute;
    width: 250px;
    right: 3%;
    bottom: 2%;
    animation: car-grind 5s ease-in-out infinite;
}

.main__subTitle {
    font-size: 1.7rem;
}

}/* ↑ main__visual tablet ↑ */

/* ↓ main__visual pc ↓ */
@media screen and (min-width: 769px) {
.main__visual {
    width: 100%;
	height: 720px;
    overflow:hidden;
	position: relative;
    background-image: url(../images/main_visual_bg2_pc.png), url(../images/main_visual_bg_pc.png);
    background-size: auto 100%;
	animation: bg-slider 20s linear infinite;
	padding: 0;
}

@keyframes bg-slider {
	from { background-position: 0 0; }
    to { background-position: 1440px 0; }
}

.main__visual__car--bg img {
    width: 1440px;
}

.main__visual__car img{
    z-index: 20;
    width: 465px;
    right: 4.6%;
    bottom: 4.6%;
}

.main__textarea {
    position: relative;
    max-width: 1100px;
    padding: 0 4.6%;
    margin: 65px auto 0;
}

.main__title {
    font-family: "Mplus 1p", sans-serif;
    font-size: 4.5rem;
    font-weight: bold;
    margin-bottom: 20px;
}

.main__subTitle {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.7rem;
    font-weight: 500;
    margin-bottom: 40px;
}

.btn__basic--main {
    width: 400px;
    font-size: 2.6rem;
    padding: 10px 0;
}

.main__news {
    flex-direction: row;
    align-items: center;
    max-width: 768px;
    margin: 0 auto;
    box-sizing: border-box;
}

.main__news__new {
    font-size: 1.5rem;
    font-weight: 500;
    padding: 5px 23px;
}

.main__news__title {
    white-space: nowrap;
}

.main__news__title::before {
    content: "";
    border-left: #A4A4A4 1px solid;
    margin: 0 10px;
}

}/* ↑ main__visual pc ↑ */

/* ↓ main__visual tablet ↓ */
@media screen and  (min-width:500px) and ( max-width:768px) {
.main__title {
    font-size: 3rem;
    margin-bottom: 15px;
}

.main__subTitle {
    font-size: 2rem;
    margin-bottom: 18px;
}

.btn__basic--main {
    width: 300px;
    font-size: 2rem;
    padding: 10px 0;
}

}/* ↑ main__visual tablet ↑ */


/*====================
section__about
====================*/

.section__about {
    position: relative;
    background-image: url(../images/top_background_about2.png), url(../images/top_background_about.jpg);
    background-size: auto;
    background-position:center center;
    padding: 60px 0;
    overflow: hidden; 
}

.section__about__title {
    z-index: 30;
    position: relative;
    background-color: rgba(217, 240, 187, 0.85);
    border-radius: 20px;
    border: 4px solid #000;
    padding: 30px 20px;
    margin: 0 4.6%;
}

/* ↓ 20260716追加 ↓ */
.section__about__recommend-box{
    padding:0 20px 30px;
}

.section__about__recommend-title{
    margin-bottom:25px;
    text-align:center;
    font-size: 2.4rem;
    font-weight:bold;
    line-height:1.5;
    color:#333;
}

.section__about__recommend-list{
    margin:0;
    padding:0;
    list-style:none;
}

.section__about__recommend-list li{
    position:relative;
    margin-bottom:12px;
    padding:15px 15px 15px 55px;
    background:#f7fbf3;
    border-radius:12px;
    font-size: 1.8rem;
    font-weight:bold;
    line-height:1.6;
}

.section__about__recommend-list li:last-child{
    margin-bottom:0;
}

.section__about__recommend-list li::before{
    content:"✓";
    position:absolute;
    left:15px;
    top:50%;
    transform:translateY(-50%);

    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#7cb342;
    color:#fff;
    border-radius:50%;

    font-size:16px;
    font-weight:700;
}

@media screen and (min-width:769px){
    .section__about__recommend-box{
        max-width:900px;
        padding: 0 50px 45px;
    }

    .section__about__recommend-title{
        margin-bottom:35px;
        font-size:2.4rem;
    }

    .section__about__recommend-list li{
        margin-bottom:18px;
        padding:18px 20px 18px 65px;
        font-size:1.5rem;
    }

    .section__about__recommend-list li::before{
        left:20px;
        width:32px;
        height:32px;
        font-size:18px;
    }
}
/* ↑ 20260716追加 ↑ */



.section__about__car,
.section__about__car2 {
    transition: transform 0.8s ease;
}

.section__about__car {
    /* 覆いかぶせる画像をここに */
    position: absolute;
    z-index: 8;
    background: url(../images/top_background_about_car1_sp.png) ;
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateY(65%);
}

.section__about__car2 {
    /* 覆いかぶせる画像をここに */
    position: absolute;
    z-index: 8;
    background: url(../images/top_background_about_car2_sp.png) ;
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateY(-65%);
}

.section__about__car.show,
.section__about__car2.show {
  transform: translateY(0);     /* 元の位置へ移動 */
}

.section__about__titleTxt {
    border-bottom: #86BE79 3px dotted;
    margin-bottom: 25px;
}

.section__about__titleTxt p {
    font-family: "Mplus 1p", sans-serif;
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
    margin-bottom: 15px;
}

.section__about__titleTxt p:last-of-type {
    margin-bottom: 25px;
}

.section__about__titleSubTxt p {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.6rem;
    font-weight: 600;
    margin-bottom: 15px;
}

/* ↓ section__about pc ↓ */
@media screen and (min-width: 769px) {
.section__about__title {
    max-width: 769px;
    margin: 0 auto;
    padding-left: 50px;
    padding-right: 50px;
}

.section__about__titleTxt p {
    font-size: 2.4rem;
    margin-bottom: 5px;
}

.section__about__titleTxt {
    margin-bottom: 30px;
}

.section__about__titleTxt p:last-of-type {
    margin-bottom: 30px;
}

.section__about__titleSubTxt p {
    text-align: center;
    font-size: 1.5rem;
    margin-bottom: 15px;
}

.section__about__car {
    /* 覆いかぶせる画像をここに */
    position: absolute;
    z-index: 8;
    background: url(../images/top_background_about_car1.png) ;
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateY(65%);
}

.section__about__car2 {
    /* 覆いかぶせる画像をここに */
    position: absolute;
    z-index: 8;
    background: url(../images/top_background_about_car2.png) ;
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateY(-65%);
}


}/* ↑ section__about pc ↑ */

/*====================
problem
====================*/
.section__problem {
    text-align: center;
    background-image: url(../images/top_background_problem.jpg);
    background-size: cover;
    padding-bottom: 30px;
}

.section__problem__flex {
    display: grid;
    grid-template-columns: 1fr; 
    gap: 30px;
    align-items: stretch; 
    justify-items: center;  
}

.section__problem__card {
    width: 100%;
    max-width: 380px;
    padding: 0 4.6%;
    display: flex;
    flex-direction: column;
    height: 100%;   
}

.section__problem__card__top {
    border: #000 2px solid;
    border-radius: 10px 10px 0 0;
    background-color: #fff;
    width: 100%;
    padding: 10px 18px 14px;
    display: flex;
    flex-direction: column;
    min-height: unset;  
}

.section__problem__card__top h4 {
    color: #28551F;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.1rem;
    font-weight: bold;
    margin-bottom: 10px;
    line-height: 1.4;
    /* 2行ぶんの高さを常に確保（= 1em × 行間 × 2行） */
    min-height: calc(1em * 1.4 * 2);
    /* 2行を超える場合は省略（任意・端末依存あり） */
    display: -webkit-box;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.section__problem__card__text {
    color: #FFF;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.7rem;
    font-weight: bold;
    text-align: left;
    background-color: #7BBF4C;
    border: #000 2px solid;
    border-radius: 0 0 10px 10px;
    padding: 15px 10px;
    flex: 1;  
    display: flex;
    align-items: flex-start; 
}

.section__problem__card__top img{
    display: block;
    width: 100%;
    height: auto;
}

.section__problem__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: bold;
    margin-top: 30px;
    padding: 0 4.6%;
    text-shadow: 2px 0 #FFF, -2px 0 #FFF, 0 2px #FFF, 0 -2px #FFF;
}
    

/* ↓ problem pc ↓ */
@media screen and (min-width: 769px) {

.section__problem__flex {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 964px;
    margin: 0 auto;
    padding: 0 30px;
    gap: 10px;
    box-sizing: border-box;
}

.section__problem__card {
    max-width: 340px; 
}

.section__problem__card__top h4 {
    font-size: 1.9rem;
}

.section__problem__text {
    font-size: 2.2rem;
}

    
}/* ↑ problem pc ↑ */

/*====================
course
====================*/
.section__course {
    position: relative;
    background-image: url(../images/top_background_course2.png), url(../images/top_background_course.png);
    background-size: auto;
    background-position:center center;
    overflow: hidden; 
    text-align: center;
}

.section__course__flex {
    display: grid;
    grid-template-columns: 1fr; 
    gap: 30px;
    align-items: stretch; 
    justify-items: center;  
    text-align: left;
}

.section__course__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: bold;
    padding: 0 4.6%;
    margin-bottom: 30px;
    text-shadow: 2px 0 #FFF, -2px 0 #FFF, 0 2px #FFF, 0 -2px #FFF;
}

.section__course__card {
    width: 100%;
    max-width: 340px; 
    padding: 15px 4.6%;
    display: flex;
    flex-direction: column;
    height: 100%;   
    border: 2px solid #000;
    background-color: #E0F2B6;
    border-radius: 10px;
}

.section__course__card__subTitle {
    background-color: #6FAA60;
    color: #fff;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: 500;
    padding: 0 5px;
}

.section__course__card h4 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.1rem;
    font-weight: 500;
    margin: 5px 0;
}

.section__course__card__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.8rem;
    margin-top: 5px;
}

.btn__basic--course {
    margin: 30px auto 60px;
    padding-top: 10px;
    padding-bottom: 10px;
}

/*
.section__course__car {
    position: absolute;
    z-index: 0;
    background: url("../images/top_background_course_car1_sp.png'); ?>") ;
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateX(-100%);
}

.section__course__car2 {
    position: absolute;
    z-index: 0;
    background: url("../images/top_background_course_car2_sp.png'); ?>") ;
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateX(100%);
}

.section__course__car,
.section__course__car2 {
    transition: transform 2s ease;
}
*/

/* 発火後：元の位置へ */
.section__course__car.show { 
    transform: translateX(100%); 
}

.section__course__car2.show { 
    transform: translateX(-100%); 
}


/* ↓ course pc ↓ */
@media screen and (min-width: 769px) {
.section__course__flex {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 964px;
    margin: 0 auto;
    padding: 0 30px;
    gap: 20px;
    box-sizing: border-box;
}

.section__course__card {
    padding: 25px 15px;
}

.section__course__text {
    font-size: 2.2rem;
}

.section__course__car {
    /* 覆いかぶせる画像をここに */
    position: absolute;
    z-index: 8;
    background: url(../images/top_background_course_car1.png);
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateX(-100%);
}

.section__course__car2 {
    /* 覆いかぶせる画像をここに */
    position: absolute;
    z-index: 8;
    background: url(../images/top_background_course_car2.png);
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateX(100%);
}

.section__course__car,
.section__course__car2 {
    transition: transform 1.5s ease;
}
    
}/* ↑ course pc ↑ */

/*====================
instructor
====================*/
.section__instructor {
    text-align: center;
    background-image: url(../images/top_background_problem.jpg);
    background-size: cover;
    padding-bottom: 60px;
}

.section__instructor__flex {
    display: flex;
    flex-direction: column;
    background-color: rgba(217, 240, 187, 0.85);
    border-radius: 20px;
    border: 4px solid #000;
    padding: 10px 20px 30px;
    margin: 0 4.6%;
    gap: 15px;
}

.section__instructor__txtArea {
    text-align: left;
}

.section__instructor__img img {
    max-width: 80%;
}

.section__instructor__txtArea__title {
    background-color: #6FAA60;
    padding: 5px 10px;
    margin-bottom: 5px;
    color: #FFF;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.6rem;
    font-weight: 500;
    display: inline-block;
}

.section__instructor__txtArea h4 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 3rem;
    font-weight: bold;
    margin-bottom: 10px;
}

.section__instructor__txtArea__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 5px;
}

.section__instructor__txtArea__text:last-of-type {
    margin-bottom: 0;
}


/* ↓ instructor pc ↓ */
@media screen and (min-width: 769px) {
.section__instructor__flex {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-inline: auto;
    width: min(904px, 100% - 4.6%);
    padding: 30px 20px;
    box-sizing: border-box;
}

.section__instructor__txtArea__title {
    margin-bottom: 10px;
    font-size: 2rem;
}

.section__instructor__img img {
    min-width: 470px;
}

.section__instructor__txtArea h4 {
    font-size: 3.5rem;
    margin-bottom: 20px;
}

.section__instructor__txtArea__text {
    font-size: 2rem;
    margin-bottom: 10px;
}
    
}/* ↑ instructor pc ↑ */

/*====================
news
====================*/
.section__news {
    position: relative;
    background-image: url(../images/top_background_news2_sp.png), url(../images/top_background_news.png);
    background-size: auto;
    background-position:center center;
    overflow: hidden; 
    text-align: center;
}

/*背景ぼかし処理*/
.section__news::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-image: inherit;
    background-size: cover;
    background-position: center;
    filter: blur(2px); 
    transform: scale(1.1);
    z-index: 0;
}

.section__news > * {
    position: relative;
    z-index: 1;
}
/*背景ぼかし処理ここまで*/

.section__news__car {
    position: absolute;
    z-index: 0;
    background: url(../images/top_background_news_car_sp.png);
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateX(100%);
}

.section__news__car {
    transition: transform 1.4s ease;
}

/* 発火後：元の位置へ */
.section__news__car.show { 
    transform: translateX(0); 
}

.section__news__flex,
.btn__basic--news {
    position: relative;
    z-index: 1;
}

.section__news__flex {
    display: grid;
    grid-template-columns: 1fr; 
    gap: 30px;
    align-items: stretch; 
    justify-items: center;  
    text-align: left;
}

.section__news__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: bold;
    padding: 0 4.6%;
    margin-bottom: 30px;
    text-shadow: 2px 0 #FFF, -2px 0 #FFF, 0 2px #FFF, 0 -2px #FFF;
}

.section__news__card {
    background-color: #CDE9C3;
    border-radius: 10px;
    box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, 0.25);
    transition: 0.2s;
    border: 2px solid #000;
    max-width: 320px;
}

.section__news__card:hover {
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.25);
	transform: translateY(-0.1875em);
}

.section__news__card img {
    border-radius: 10px 10px 0 0;
}

.section__news__card_text {
    padding: 10px 10px 20px;
}

.section__news__card_dayArea {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}

.section__news__card_day {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
}

.section__news__card_category {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
    color: #FFF;
    border-radius: 3px;
    background-color: #6BAE45;
    padding: 2px 10px;
}

.section__news__card_text h4 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
}

.btn__basic--news {
    margin: 30px auto 60px;
    padding-top: 10px;
    padding-bottom: 10px;
}




/* ↓ news pc ↓ */
@media screen and (min-width: 769px) {
.section__news {
    background-image: url(../images/top_background_news2.png), url(../images/top_background_news.png);
}

.section__news__car {
    position: absolute;
    z-index: 0;
    background: url(../images/top_background_news_car.png) ;
    pointer-events: none;
    inset: 0;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto; 
    transform: translateX(100%);
}

.section__news__flex {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: 964px;
    margin: 0 auto;
    padding: 0 30px;
    gap: 20px;
    box-sizing: border-box;
}

.btn__basic--news {
    margin: 30px auto 120px;
}
    
}/* ↑ news pc ↑ */

/*====================
businessTrip
====================*/
.section__businessTrip {
    text-align: center;
    background-image: url(../images/top_background_problem.jpg);
    background-size: cover;
    padding-bottom: 60px;
}

.section__businessTrip__flex {
    display: flex;
    flex-direction: column;
    background-color: rgba(217, 240, 187, 0.85);
    border-radius: 20px;
    border: 4px solid #000;
    padding: 30px 20px;
    margin: 0 4.6%;
    gap: 15px;
}

.section__businessTrip__txtArea {
    text-align: left;
}

.section__businessTrip__img img {
    max-width: 60%;
}


.section__businessTrip__txtArea h4 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 3rem;
    font-weight: bold;
    margin-bottom: 10px;
}

.section__businessTrip__txtArea__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 5px;
}

.section__businessTrip__txtArea__text:last-of-type {
    margin-bottom: 0;
}


/* ↓ businessTrip pc ↓ */
@media screen and (min-width: 769px) {
.section__businessTrip__flex {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-inline: auto;
    width: min(904px, 100% - 4.6%);
    padding: 30px;
    box-sizing: border-box;
}

.section__businessTrip__img img {
    min-width: 375px;
}

.section__businessTrip__txtArea h4 {
    font-size: 3.5rem;
    margin-bottom: 20px;
}

.section__businessTrip__txtArea__text {
    font-size: 1.8rem;
    margin-bottom: 10px;
}
    
}/* ↑ businessTrip pc ↑ */
/*====================
campaign
====================*/
.section__campaign {
    text-align: center;
    background-image: url(../images/top_background_campaign.jpg);
    background-size: cover;
    padding: 60px 0 60px;
}

.btn__basic--campaign {
    padding: 14px;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: bold;
    max-width: 385px;
    margin: 0 auto;
}

.section__campaignImg.brPc {
    max-width: 655px;
    margin-bottom: 30px;
}

.section__campaignImg.brSp {
    max-width: 251px;
    margin-bottom: 30px;
}


/* ↓ campaign pc ↓ */
@media screen and (min-width: 769px) {
.section__campaign {
    padding: 100px 0 100px;
}

.section__campaign__text {
    font-size: 4rem;
    margin-bottom: 30px;
}

.btn__basic--campaign {
    padding: 10px;
    font-size: 3rem;
    width: 485px;
}
    
}/* ↑ campaign pc ↑ */








/*====================
コース紹介
====================*/









/*====================
pankuzu
====================*/
.pznkuzu {
    background-color: #FBF7EC;
}

/*====================
campaign
====================*/
.section__campaign {
    text-align: center;
    background-image: url(../images/top_background_campaign.jpg);
    background-size: cover;
    padding: 60px 0 60px;
}

.btn__basic--campaign {
    width: 320px;
    padding: 14px;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: 500;
    margin: 0 auto 20px;
    border-radius: 50px;
}

.section__campaignImg.brPc {
    max-width: 541px;
    margin-bottom: 30px;
}

.section__campaignImg.brSp {
    max-width: 320px;
    margin-bottom: 20px;
}

.section__campaign__annotation {
    text-align: center;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
}


/* ↓ campaign pc ↓ */
@media screen and (min-width: 769px) {
.section__campaign {
    padding: 50px 0 50px;
}

.section__campaign__text {
    font-size: 3.8rem;
    margin-bottom: 30px;
}

.btn__basic--campaign {
    width: 520px;
    padding: 10px;
    font-size: 3rem;
    border-radius: 50px;
    margin: 0 auto 40px;
}

.section__campaign__annotation {
    font-size: 2rem;
}
    
}/* ↑ campaign pc ↑ */

/*====================
courseIntro
====================*/
.section__courseIntro {
    background-image: url(../images/courseIntro_background.jpg);
    padding: 85px 0;
    background-size: cover;
}

.section__courseIntro__card {
    position: relative;
    background-color: #fff;
    padding: 30px 15px 15px;
    border-radius: 15px;
    margin: 0 4.6% 60px;
    box-shadow: 2px 4px 4px 0 rgba(0, 0, 0, 0.25);
}

.section__courseIntro__card__courseNumber {
    position: absolute;
    top: -15px;
    display: inline-block;
    background-color: #6BAE45;
    border-radius: 50px;
    color: #FFF;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: 500;
    padding: 0 28px;
}

.section__courseIntro__card__flex {
    display: flex;
    flex-direction: column;
}

.section__courseIntro__card__flex h2 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 15px;
}

.section__courseIntro__card__fee {
    display: flex;
    border: 3px solid #6BAE45;
    align-items: center;
}

.section__courseIntro__card__feeTime {
    color: #FFF;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: 500;
    background-color: #6BAE45;
    padding: 4px 12px;
}


.section__courseIntro__card__feeNumber {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: 500;
    text-align: center;
    flex: 1;
}

.section__courseIntro__card__feeNumber span {
    font-size: 1.5rem;
}

.section__courseIntro__card__text::before {
    content: "";
    display: block;
    width: 95%; 
    border-bottom: 1px solid #000;
    margin: 25px auto 15px; 
}

.section__courseIntro__card__textTitle {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.3rem;
    font-weight: bold;
    margin-bottom: 15px;
}

.section__courseIntro__card__textExplanation {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.8rem;
    font-weight: 500;
}

.section__courseIntro__annotation {
    text-align: center;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0 4.6%;
}

/* ↓ courseIntro pc ↓ */
@media screen and (min-width: 769px) {
.section__courseIntro__card {
    padding: 35px;
    max-width: 966px;
    margin: 0 auto 85px;
    width: min(966px, 100% - 4.6%);
    box-sizing: border-box;
    
}

.section__courseIntro__card__courseNumber {
    top: -26px;
    font-size: 3rem;
    padding: 0 40px;
}

.section__courseIntro__card__flex {
    flex-direction: row;
    align-items: stretch;
}

.section__courseIntro__card__flex h2 {
    font-size: 3rem;
    margin-bottom: 30px;
}

.section__courseIntro__card__fee{
    align-items: stretch;
}

.section__courseIntro__card__feeTime {
    font-size: 3rem;
    padding: 7px 8px;
    height: 100%;
    display: flex;
    align-items: center;
    white-space: nowrap;
}


.section__courseIntro__card__feeNumber {
    font-size: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.2;
}

.section__courseIntro__card__feeNumber span {
    font-size: 2rem;
    display: inline-block;
    position: relative;
    top: 0.05em;  
    line-height: 1;
}

.section__courseIntro__card__text::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    border-bottom: 0px solid #000;
    border-left: 1px solid #000;
    margin: 0 30px 0; 
}

.section__courseIntro__card__textTitle {
    font-size: 3rem;
    margin-bottom: 20px;
}

.section__courseIntro__card__textExplanation {
    font-size: 2rem;
}

.section__courseIntro__card__feeFlex {
    width: 40%;
    display:flex; 
    flex-direction:column; 
    justify-content:center;
}

.section__courseIntro__card__text {
    width: 60%;
    position: relative;
    padding-left: 60px;
    box-sizing: border-box;
}

.section__courseIntro__annotation {
    font-size: 2rem;
}

}/* ↑ courseIntro pc ↑ */

/*====================
lineup
====================*/
.section__lineup {
    background-image: url(../images/lineup_background.jpg);
    background-size: contain;
}

.section__lineup__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: bold;
    padding: 60px 4.6% 30px;
    text-align: center;
    text-shadow: 2px 0 #FFF, -2px 0 #FFF, 0 2px #FFF, 0 -2px #FFF;
}

.section__lineup__flex {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 30px;
}


.section__lineup__flex__ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 30px;
    margin: 0 auto;
}

.section__lineup__flex__ul:last-of-type {
    margin-bottom: 60px;
}

.section__lineup__card {
    margin: 0 4.6%;
}

.section__lineup__card p {
    color: #FFF;
    text-align: center;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    border-radius: 0 0 30px 30px;
    background-color: #6BAE45;
    padding: 20px 0;
    max-width: 350px;
}

.section__lineup__card img {
    max-width: 350px;
    border-radius: 30px 30px 0 0;
}

.section__lineup__annotation {
    text-align: center;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0 4.6%;
    padding-bottom: 60px;
}


/* ↓ lineup pc ↓ */
@media screen and (min-width: 769px) {

.section__lineup__text {
    font-size: 2.8rem;
    padding: 60px 0;
}

.section__lineup__flex {
    gap: 45px;
}

.section__lineup__card {
    margin: 0;
}

.section__lineup__flex__ul {
    flex-direction: row;
    gap: 45px;
    width: min(966px, 100% - 4.6%);
}

.section__lineup__card p {
    font-size: 2rem;
    padding: 15px 0;
}

.section__lineup__card img {
    max-width: 257px;
}

.section__lineup__annotation {
    font-size: 2rem;
    margin: 0 auto;
    padding-bottom: 60px;
}

}/* ↑ lineup pc ↑ */

/*====================
flow
====================*/
.section__flow {
    text-align: center;
    background-image: url(../images/flow_background.jpg);
    background-size: contain;
    padding-bottom: 90px;
}

.section__flow__card {
    width: min(318px, 100% - 4.6%);
    padding: 25px 15px;
    margin: 0 auto;
    background-color: #E9F9D5;
    border: 3px dashed #FFA94D;
    border-radius: 23px;
    display: flex;
    flex-direction: column;
    text-align: left;
}

.section__problem__card__stepText {
    display: inline-block;
    border-radius: 10px;
    background-color: #FFA94D;
    color: #fff;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: 500;
    padding: 5px 30px;
    margin-top: 20px;
    margin-bottom: 12px;
}

.section__flow__card__textArea h3 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: 500;
    margin-bottom: 12px;
}

.section__problem__card__text2 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
}

.section__flow__arrow {
    max-width: 40px;
    height: auto;
    margin-top: 30px;
    margin-bottom: 30px;
}



/* ↓ flow pc ↓ */
@media screen and (min-width: 769px) {
.sectionTitle--flow {
    margin-bottom: 60px;
}

.section__flow__card {
    width: min(823px, 100% - 4.6%);
    padding: 25px 40px;
    flex-direction: row;
    align-items: center;
}

.section__problem__card__img.brPc {
    max-width: 197px;
    margin-right: 46px;
}

.section__problem__card__stepText {
    font-size: 3rem;
    padding: 2px 30px;
    margin-top: 0;
    margin-bottom: 18px;
}

.section__flow__card__textArea h3 {
    font-size: 3rem;
    margin-bottom: 18px;
}

.section__problem__card__text2 {
    font-size: 2rem;
}

}/* ↑ flow pc ↑ */

/*====================
supplement
====================*/
.section__supplement {
    background-color: #fff;
    margin: 0 auto;
    padding: 30px 4.6% 60px;
}

.section__supplement h3 {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: 500;
    margin-bottom: 20px;
}

.section__supplement__star {
    color: #EDED28;
}

.section__supplement p {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
    margin-bottom: 25px;
}

.section__supplement p:last-of-type {
    margin-bottom: 0;
}


/* ↓ supplement pc ↓ */
@media screen and (min-width: 769px) {
.section__supplement {
    padding: 60px 4.6% 90px;
}

.section__supplement__text {
    width: min(966px, 100% - 4.6%);
    margin: 0 auto;
    text-align: left;
}

.section__supplement h3 {
    font-size: 2rem;
}

.section__supplement p {
    font-size: 1.5rem;
    margin-bottom: 30px;
}

.section__supplement p:last-of-type {
    margin-bottom: 0;
}

}/* ↑ supplement pc ↑ */








/*====================
インストラクター紹介
====================*/










/*====================
instructor
====================*/
.section__instructor2 {
    background-image: url(../images/flow_background.jpg);
    padding: 30px 4.6% 60px;
}

.section__instructor2__contentsArea {
    background-color: #fff;
    padding: 30px 4.6%;
    border-radius: 10px;
}

.section__instructor2__flex {
    display: flex;
    flex-direction: column;
}

.section__instructor2__prf img.brSp {
    width: 100%;
    margin: 0 auto;
    max-width: 400px;
    display: block;
}

.section__instructor2__prf__name {
    font-family: "Mplus 1p", sans-serif;
    font-size: 3rem;
    font-weight: bold;
    padding: 10px 0;
    border-bottom: 4px dotted #FFA94D;
    margin-bottom: 10px;
}

.section__instructor2__prf__text {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    margin-bottom: 30px;
}

.section__instructor2__msg h2 {
    display: inline-block;
    color: #FFF;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: 500;
    padding: 2px 15px;
    border-radius: 5px;
    background-color: #6BAE45;
    margin-bottom: 10px;
}

.section__instructor2__msg__text {
    margin-bottom: 15px;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
}

.section__instructor2__msg__text:last-of-type {
    margin-bottom: 30px;
}

.section__instructor2__imgArea {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.section__instructor2__imgArea img {
    border-radius: 25px;
    width: 100%;
}



/* ↓ instructor pc ↓ */
@media screen and (min-width: 769px) {
.section__instructor2__flex {
    display: flex;
    flex-direction: row;
    gap: 50px;
    margin-bottom: 30px;
}

.section__instructor2__contentsArea {
    max-width: 976px;
    margin: 0 auto;
}

.section__instructor2__prf {
    min-width: 240px;
}

.section__instructor2__prf__text {
    font-size: 1.6rem;
    margin-bottom: 30px;
}

.section__instructor2__imgArea {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 30px;
}

.section__instructor2__imgArea img {
    width: 30%;
}

.section__instructor2__prf img.brSp {
    display: none;
}

}/* ↑ instructor pc ↑ */










/*====================
お知らせ
====================*/











/*====================
news
====================*/
.section__news2 {
    background-image: url(../images/flow_background.jpg);
    padding: 60px 4.6% 90px;
}

.section__news2__contentsArea {
    margin-bottom: 60px;
}

.section__news__categoryArea {
    margin-bottom: 40px;
}

.news2__cardArea {
    display: grid;
    grid-template-columns: 1fr; 
    gap: 30px;
    align-items: stretch; 
    justify-items: center;  
    text-align: left;
    align-content: start;
}

/* ニュースカード内のサムネイル（外部画像なども含めて見た目を固定） */
.section__news__card img.news-card__img{
    width: 100%;
    max-width: 320px;
    aspect-ratio: 288 / 170; /* 比率固定 */
    object-fit: cover; 
    display: block;
    border-radius: 10px 10px 0 0; 
}

.section__news__card--border {
    border: none;
}

.section__news__card_text--size h4 {
    font-size: 1.8rem;
}

/* ページネーション */

.Pagination {
    display: flex; 
    justify-content: center;
    align-items: center;
    margin: 60px auto 0;
    border: solid 2px #6BAE45;
    border-radius: 9999px;
    width: fit-content;
    overflow: hidden;
}
.Pagination > * + * {
    border-left: solid 2px #6BAE45;
}
.Pagination-Item-Link {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 40px;
    height: 40px;
    background: #fff;
    font-size: 14px;
    color: #6BAE45;
    font-weight: bold;
    transition: all 0.15s linear;
}
.Pagination-Item-Link-Icon {
    width: 20px;
}
.Pagination-Item-Link.isActive {
    background: #6BAE45;
    color: #fff;
    pointer-events: none;
}
.Pagination-Item-Link:not(.isActive):hover {
    background: #6BAE45;
    color: #fff;
}


/* ワードカテゴリ */
.news__category__title {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFF;
    font-size: 2rem;
    font-weight: 500;
    background-color: #6BAE45;
    border-radius: 5px 5px 0 0;
    max-width: 360px;
    margin: 0 auto;
    text-align: center;
    height: 50px;
}

.news__category__text {
    text-align: right;
    font-size: 2rem;
    padding: 8px 30px 8px 0;
    background-color: #fff;
    max-width: 360px;
    margin: 0 auto;
}

.news__category__text:last-of-type {
    border-radius: 0 0 5px 5px;
}

.news__category__text.isActive{
    background-color:#CDE9C3;
}

.news__category__text:hover {
    background-color:#CDE9C3;
    cursor:pointer;
}


/* 0件メッセージ */
.nohit{
    text-align: center;
    color:#666;
    margin-top: 20px;
}


/* ↓ news pc ↓ */
@media screen and (min-width: 769px) {
.news2__cardArea {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 616px;
    margin: 0 auto;
    padding: 0 30px;
    gap: 20px;
    box-sizing: border-box;
}

.section__news2 {
    display: flex;
    justify-content: center;
    flex-direction: row-reverse;
}

.section__news__categoryArea {
    min-width: 235px;
    margin-bottom: 0;
}

.section__news2__contentsArea {
    margin-bottom: 0;
}


}/* ↑ news pc ↑ */

/*====================
single
====================*/
.section__single {
    background-image: url(../images/flow_background.jpg);
    padding: 60px 4.6% 90px;
}

.section__single__contents {
    background-color: #fff;
    border-radius: 20px;
    padding: 30px 15px;
}

.section__single__day {
    font-size: 2rem;
    margin-bottom: 20px;
}

.section__single__category {
    background-color: #6BAE45;
    border-radius: 3px;
    color: #FFF;
    font-size: 1.5rem;
    padding: 2px 5px;
    margin-left: 5px;
}

.section__single__contents h3 {
    font-size: 2.8rem;
    font-weight: bold;
    position: relative;
}

.section__single__contents h3::after {
    content: "";
    display: block;  
    border-bottom: 3px dotted #FFA94D;
    width: 100%; 
    margin-top: 10px;
    margin-bottom: 20px;
}

.section__single__contents img {
    width: 100%;
    margin-bottom: 30px;
}

.section__single__contents h4 {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 15px;
}

.section__single__contents h4::before {
    content: "■";
    color: #FFA94D;
    margin-right: 5px;
}

.section__single__contents p {
    font-size: 1.6rem;
    margin-bottom: 30px;
}

.newsBack {
    text-align: right;
    font-size: 1.5rem;
    font-weight: bold;
    display: block;
}

.newsBack:hover {
    color: #6BAE45;
}


/* ↓ single pc ↓ */
@media screen and (min-width: 769px) {
.section__single__contents {
    max-width: 976px;
    margin: 0 auto;
    padding: 30px 60px;
}

.section__single__contents h3 {
    font-size: 3.5rem;
}

.section__single__contents img {
    width: 90%;
    margin: 0 auto 30px;
    display: block;
}

.section__single__contents h4 {
    font-size: 2.5rem;
}

.section__single__contents p {
    font-size: 2rem;
    margin-bottom: 40px;
}

.newsBack {
    margin-top: 90px;
    font-size: 2rem;
}


}/* ↑ single pc ↑ */










/*====================
よくある質問
====================*/











/*====================
faq
====================*/
.section__faq {
    background-image: url(../images/flow_background.jpg);
    padding: 60px 4.6% 90px;
}

.section__faq__flex {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 30px;
}

.section__faq__flex:last-of-type {
    margin-bottom: 0;
}

.section__faq__q img,
.section__faq__a img {
    max-width: 30px;
    max-height: 30px;
    margin-right: 10px;
}

.section__faq__q,
.section__faq__a {
    margin-right: 10px;
    display: flex;
    justify-content: left;
    flex-direction: row;
    padding: 15px;
}

.section__faq__q {
    background-color: #6BAE45;
    border-radius: 15px 15px 0 0;
    color: #fff;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.7rem;
    font-weight: 500;
}

.section__faq__a {
    background-color: #fff;
    border-radius: 0 0 15px 15px;
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.7rem;
    font-weight: 500;
}


/* ↓ faq pc ↓ */
@media screen and (min-width: 769px) {
.section__faq__flex {
    max-width: 860px;
    margin: 0 auto 40px;
}

}/* ↑ faq pc ↑ */











/*====================
予約状況
====================*/










/*====================
calendar
====================*/
.section__calendar {
    background-image: url(../images/flow_background.jpg);
    padding: 60px 4.6% 90px;
}

.section__calendar h2 {
    text-align: center;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2.5rem;
    font-weight: bold;
    margin-bottom: 30px;
}

.section__calendar__about {
    padding: 20px;
    border-radius: 20px;
    border: 3px solid #CDE9C3;
    background-color: #FFFDF8;
    margin-bottom: 40px;
}

.section__calendar__about p {
    font-family: "Mplus 1p", sans-serif;
    font-size: 1.5rem;
}

.section__calendar__about h3 {
    margin-bottom: 10px;
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: 500;
}

.googleCalendar iframe {
    width: 100%;
    height: 500px;
}

.btn__basic--calendar {
    margin: 40px auto 0;
    padding-top: 10px;
    padding-bottom: 10px;
}


/* ↓ calendar pc ↓ */
@media screen and (min-width: 769px) {
.section__calendar h2 {
    font-size: 3rem;
    margin-bottom: 60px;
}

.section__calendar__about {
    max-width: 860px;
    margin: 0 auto 60px;
}

.section__calendar__about p {
    font-size: 2rem;
}

.section__calendar__about h3 {
    margin-bottom: 15px;
    font-size: 2.5rem;
}


.googleCalendar iframe {
    display: block;
    max-width: 830px;
    height: 700px;
    margin: 0 auto;
}

.btn__basic--calendar {
    margin: 60px auto 0;
    padding: 15px 0;
    width: 300px;
}

}/* ↑ calendar pc ↑ */












/*====================
お問い合わせ
====================*/











/*====================
contact
====================*/
.section__contact {
    background-image: url(../images/flow_background.jpg);
    padding: 60px 4.6% 90px;
}

.section__contact__about {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}

.section__contact__about:last-of-type {
    margin-bottom: 60px;
}

/* ↓ 20260716追加 ↓ */
.googleForm iframe {
    width: 100%;
    height: 2150px;
}
/* ↑ 20260716追加 ↑ */

.contactForm{
    max-width: 100%;
    margin: 0 auto;
    font-family: "Mplus 1p", "Noto Sans JP", sans-serif;
}

.formLabel,
label {
    font-family: "Mplus 1p", sans-serif;
    font-size: 2rem;
    font-weight: 500;
}

.formRow{
    display: flex;
    flex-direction: column; 
    gap: 6px;
    margin-bottom: 30px;
}
.formRow label,
.formLabel{
    text-align: left;
    color:#333;
    line-height: 1.4;
}
.contactForm input[type="text"],
.contactForm input[type="email"],
.contactForm input[type="tel"],
.contactForm select,
.contactForm textarea{
    width: 100%;
    padding: 8px 10px;
    border: 2px solid #bbb;
    border-radius: 5px;
    background: #fff;
    box-sizing: border-box;
}

/* 電話番号の3分割 */
.formField--tel{
    display:flex; 
    align-items:center; 
    gap:8px;
}
.formField--tel .dash { 
    color:#888; 
}

/* ラジオ横並び */
.formField--inline{
    display:flex; 
    align-items:center; 
    gap:18px;
}
.radio { 
    display:inline-flex; 
    align-items:center; 
    gap:6px; 
}

.contactForm input[type="radio"] {
    appearance: auto; 
    -webkit-appearance: auto;
    -moz-appearance: auto;
    background-color: #fff; 
    border: 1px solid #666; 
    width: 16px;
    height: 16px;
    margin: 0 4px 0 0; 
    vertical-align: middle; 
}

.formRow .formLabel,
.formRow label {
    display: inline-flex; 
    align-items: center; 
    gap: 6px; 
}

.formRow .formLabel img,
.formRow label img {
    display: block;
    height: 1em;   
    width: auto;
}

.requiredText {
    background-color: palevioletred;
    color: #fff;
    font-size: 1.1rem;
    display: inline-block;
    padding: 2px 5px;
    border-radius: 2px;
}

/* 注意書き */
.note{
    font-size: 1.4rem;
    color:#666;
    margin: -6px 0 16px 0;
}

/* 送信ボタン */
.submitRow{ 
    justify-content:center; 
    margin-top: 8px; 
}
.submitBtn{
    appearance:none; 
    border:none; 
    cursor:pointer;
    background-color:#6BAE45; 
    color:#fff; 
    font-weight:700;
    padding:10px 80px; 
    border-radius:24px;
    text-align: center;
    margin: 30px auto 0;
}

.submitBtn:hover {
    background-color:#fff; 
    border: 1px solid #6BAE45;
    color: #6BAE45;
}

.checkboxRow label {
    display: flex;
    align-items: center;
    gap: 6px; 
    white-space: nowrap; 
}

.checkboxRow input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #4CAF50; 
    background: #fff; 
}


.sendMessage {
    font-size: 1.6rem;
    font-weight: bold;
    text-align: center;
    margin-bottom: 30px;
}

.tos {
    background-color: #fff;
    padding: 30px 30px 60px;
}

.tos h2 {
    color: #FFF;
    font-size: 2rem;
    font-weight: 500;
    background-color: #6BAE45;
    margin-bottom: 20px;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 5px;
}

.tos__block h3 {
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 20px;
}

.tos__block ol,
.tos__block p {
    font-size: 1.4rem;
    margin-bottom: 20px;
}

.tos__block ol {
    list-style-type: decimal;
    margin-left: 1.4rem;
}

.checkboxRow {
    margin: 30px auto 0;
    display: flex;
    align-items: center;
    gap: 8px; 
    max-width: 80%;
    flex-direction: row;
}

/* チェックボックス自体 */
.checkboxRow input[type="checkbox"] {
    width: 18px;
    height: 18px;
    border: 2px solid #bbb;
    border-radius: 3px;
    background: #fff;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
}

/* チェックが入ったときの色付け */
.checkboxRow input[type="checkbox"]:checked {
    background-color: #4CAF50;
    border-color: #4CAF50;
}

/* チェックマークを擬似要素で */
.checkboxRow input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 0px;
    width: 5px;
    height: 10px;
    border: 2px solid #bbb;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.checkboxRow label {
    white-space: normal;  
    line-height: 1.4;
    font-size: 1.6rem;
    font-weight: 500;
}

/* チェックボックス行の基本レイアウト */
.formRow.checkboxRow{
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
}

.formRow,
.checkboxRow{
    position: relative;
}

.formRow.checkboxRow > input[type="checkbox"]{
    flex: 0 0 auto;  
    width: 18px;
    height: 18px;
    accent-color: #4CAF50; 
    background: #fff;
    margin-top: 2px;  
}
.formRow.checkboxRow > label{
    white-space: normal;
    line-height: 1.6;
    margin: 0;  
}

/* エラー表示 */
.error-msg {
    position: absolute;
    right: 0;
    top: auto;  
    bottom: -43px;
    transform: translateY(-100%);
    color: #c00;
    font-size: 1.3rem;
    margin: 0; 
    pointer-events: none;
    line-height: 1.4;
    z-index: 5; 
}

.is-error{ 
    border-color:#c00 !important; 
    background:#fff0f0;
}

/* 送信不可時の見た目 */
.submitBtn:disabled{
    opacity:.5;
    cursor:not-allowed;
}


/* ↓ contact pc ↓ */
@media screen and (min-width: 769px) {

/* ↓ 20260716追加 ↓ */
.googleForm iframe {
    display: block;
    max-width: 830px;
    height: 2130px;
    margin: 0 auto;
}
/* ↑ 20260716追加 ↑ */

.contactForm{
    max-width: 780px;
}

.formRow{
    flex-direction: row; 
    align-items: center;
    gap: 20px;
}

.formRow .formLabel,
.formRow label {
    display: inline-block;
}

.formRow label,
.formLabel{
    flex: 0 0 193px;   
    /*text-align: right;      右揃え */
    padding-right: 8px;
}

.radio {
    display: inline-flex;
    align-items: center;
    gap: 4px;    
    margin-right: -120px; 
}

.formRow > input,
.formRow > select,
.formRow > textarea,
.formRow > .formField{
    flex: 1;  
}
.note{ 
    margin-left: 215px; 
}

.formRow--datetime {
    margin-bottom: 15px;
}

.sendMessage {
    font-size: 2rem;
}

.checkboxRow {
    gap: 10px; 
    max-width: 100%;
    justify-content: center;
}

.checkboxRow label {
    font-size: 2rem;
}

.formRow.checkboxRow > input[type="checkbox"]{
    flex: 0 0 auto !important; 
}


.formRow.checkboxRow > label{
    flex: 0 1 auto;  
    text-align: left;  
    padding-right: 0;   
    white-space: nowrap;  
}

.formRow.checkboxRow{
    align-items: center; 
}
    
/* エラー表示 */
.error-msg {
    right: 0;
    top: 0;  
    bottom: auto;
    font-size: 1.4rem;
}

}/* ↑ contact pc ↑ */

@media screen and (max-width: 619px) {

/* ↓ 20260716追加 ↓ */
.googleForm iframe {
    height: 2275px;
}
/* ↑ 20260716追加 ↑ */
}

@media screen and (max-width: 399px) {

/* ↓ 20260716追加 ↓ */
.googleForm iframe {
    height: 2320px;
}
/* ↑ 20260716追加 ↑ */
}

/*====================
complete
====================*/
.section__complete {
    background-image: url(../images/flow_background.jpg);
    padding: 60px 4.6%;
}

.complete__title {
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 29px;
    margin: 0 auto 60px;
    text-align: center;
}

.complete__text {
    list-style-type: "※";
    margin-left: 1.5rem;
}

.complete__text li {
    font-size: 1.5rem;
    margin-bottom: 10px;
}

.complete__text li:last-of-type {
    margin-bottom: 0;
}

/* ↓ complete pc ↓ */
@media screen and (min-width: 769px) {
.section__complete {
    padding: 90px auto 120px;
}

.section__complete__textArea {
    width: min(960px, 100% - 4.6%);
    margin: 0 auto;
}

.complete__title {
    font-size: 3rem;
    line-height: 60px;
    margin: 0 auto 60px;
}

.complete__text {
    margin-left: 2rem;
}

.complete__text li {
    font-size: 2rem;
}

}/* ↑ complete pc ↑ */